.snapshot-comments-panel {
  width: 100%;
  background: var(--bg);
  display: flex;
  flex-direction: row; }
  .snapshot-comments-panel .snapshot-comment-list-container {
    flex: 1;
    width: 30%;
    display: flex;
    flex-direction: column;
    border-right: none;
    background-color: #e9f3fc; }
    .snapshot-comments-panel .snapshot-comment-list-container .snapshot-comment-list-options {
      align-self: flex-end;
      width: 100%; }
      .snapshot-comments-panel .snapshot-comment-list-container .snapshot-comment-list-options .snapshot-add-comment-button {
        width: 100%;
        border-radius: 0;
        color: var(--content-bg);
        background-color: var(--highlight);
        padding: 4px;
        transition: opacity 300ms ease-in-out;
        line-height: inherit; }
        .snapshot-comments-panel .snapshot-comment-list-container .snapshot-comment-list-options .snapshot-add-comment-button:hover {
          background-color: var(--highlight-dark);
          color: var(--content-bg);
          border: none; }
        .snapshot-comments-panel .snapshot-comment-list-container .snapshot-comment-list-options .snapshot-add-comment-button:active {
          color: var(--highlight);
          background: var(--highlight-darker);
          border: 1px solid var(--highlight-darker); }
    .snapshot-comments-panel .snapshot-comment-list-container .snapshot-comment-list {
      flex: 1;
      overflow: auto;
      background-color: #e9f3fc; }
      .snapshot-comments-panel .snapshot-comment-list-container .snapshot-comment-list .snapshot-comment-list-item {
        padding: 2px;
        border-bottom: 3px solid var(--line); }
        .snapshot-comments-panel .snapshot-comment-list-container .snapshot-comment-list .snapshot-comment-list-item:hover {
          background-color: var(--bg); }
        .snapshot-comments-panel .snapshot-comment-list-container .snapshot-comment-list .snapshot-comment-list-item.active-true {
          background-color: var(--content-bg);
          box-shadow: 2px 0 0 0 var(--content-bg); }
        .snapshot-comments-panel .snapshot-comment-list-container .snapshot-comment-list .snapshot-comment-list-item button {
          text-align: left;
          width: 100%; }
        .snapshot-comments-panel .snapshot-comment-list-container .snapshot-comment-list .snapshot-comment-list-item .snapshot-comment-list-metadata .snapshot-comment-list-author {
          font-size: 12px; }
        .snapshot-comments-panel .snapshot-comment-list-container .snapshot-comment-list .snapshot-comment-list-item .snapshot-comment-list-metadata .snapshot-comment-list-time {
          font-size: 12px; }
  .snapshot-comments-panel .snapshot-comment-focused-view-container {
    display: flex;
    flex: 3;
    background: var(--content-bg); }
    .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused-view-expand-button {
      border-radius: 0;
      line-height: 28px;
      padding: 0 6px; }
      .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused-view-expand-button:hover {
        color: var(--highlight); }
    .snapshot-comments-panel .snapshot-comment-focused-view-container .no-comments {
      margin-left: auto;
      margin-right: auto;
      align-self: center; }
    .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused {
      overflow: hidden; }
      .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused input {
        outline: none;
        border: none;
        border-bottom: 1px solid var(--highlight); }
      .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused .snapshot-comment-focused-body {
        height: 100%;
        overflow: auto;
        /* .RichTextEditor__root___2QXK- {
          border: none;
          height: 100%;
          overflow: scroll;
        } */ }
        .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused .snapshot-comment-focused-body table {
          border-collapse: collapse; }
          .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused .snapshot-comment-focused-body table tr, .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused .snapshot-comment-focused-body table td {
            border: 1px solid lightgray; }
        .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused .snapshot-comment-focused-body h1, .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused .snapshot-comment-focused-body h2, .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused .snapshot-comment-focused-body h3, .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused .snapshot-comment-focused-body h4, .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused .snapshot-comment-focused-body h5, .snapshot-comments-panel .snapshot-comment-focused-view-container .snapshot-comment-focused .snapshot-comment-focused-body h6 {
          margin: 0;
          color: var(--highlight);
          font-size: var(--text-size-large); }
  .snapshot-comments-panel .RichTextEditor__editor___1QqIU {
    height: 100%; }
  .snapshot-comments-panel .snapshot-comments-input {
    display: flex;
    flex: row;
    padding: 10px; }
    .snapshot-comments-panel .snapshot-comments-input input {
      margin-right: 10px;
      padding: 5px; }
    .snapshot-comments-panel .snapshot-comments-input .snapshot-comments-input-title {
      flex: 1; }
    .snapshot-comments-panel .snapshot-comments-input .snapshot-comments-input-body {
      flex: 2; }
  .snapshot-comments-panel .panel-heading {
    padding: 5px 10px 5px 25px; }
    .snapshot-comments-panel .panel-heading .snapshot-comment-panel-header {
      display: flex;
      flex-direction: row;
      align-items: center;
      align-content: center;
      /* While editing......... */ }
      .snapshot-comments-panel .panel-heading .snapshot-comment-panel-header a {
        flex: 1;
        width: 100%;
        display: flex;
        flex-direction: row;
        text-decoration: none;
        align-self: center; }
      .snapshot-comments-panel .panel-heading .snapshot-comment-panel-header .snapshot-comment-info {
        flex: 1;
        align-self: center; }
      .snapshot-comments-panel .panel-heading .snapshot-comment-panel-header .snapshot-comment-title {
        margin-left: 10px; }
      .snapshot-comments-panel .panel-heading .snapshot-comment-panel-header .snapshot-comment-author {
        color: var(--text-light);
        margin-left: 5px; }
      .snapshot-comments-panel .panel-heading .snapshot-comment-panel-header .snapshot-comment-time {
        color: var(--text-light); }
      .snapshot-comments-panel .panel-heading .snapshot-comment-panel-header:hover .comment-icon {
        color: var(--highlight) !important; }
      .snapshot-comments-panel .panel-heading .snapshot-comment-panel-header:hover .snapshot-comment-title {
        color: var(--highlight); }
      .snapshot-comments-panel .panel-heading .snapshot-comment-panel-header:hover .snapshot-comment-author {
        color: var(--highlight); }
      .snapshot-comments-panel .panel-heading .snapshot-comment-panel-header:hover .snapshot-comment-time {
        color: var(--highlight); }
      .snapshot-comments-panel .panel-heading .snapshot-comment-panel-header:hover .snapshot-comment-button {
        opacity: 1;
        transition: opacity 300ms ease-in-out; }
      .snapshot-comments-panel .panel-heading .snapshot-comment-panel-header .comment-icon {
        color: var(--text-light); }
      .snapshot-comments-panel .panel-heading .snapshot-comment-panel-header .comment-title-edit-input {
        flex: 1;
        resize: none;
        border: 2px solid #e9f3fc;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        outline: 0; }
  .snapshot-comments-panel .panel {
    margin-bottom: 0px;
    border: none; }
    .snapshot-comments-panel .panel .panel-body {
      padding: 10px 20px 10px 20px;
      display: flex;
      flex: row; }
    .snapshot-comments-panel .panel .comment-body-edit-input {
      flex: 1;
      resize: none;
      border: 2px solid #e9f3fc;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      border-radius: 5px;
      outline: 0; }