ChatAI/app/components/message-selector.module.scss

.message-selector {
  .message-filter {
    display: flex;

    .search-bar {
      max-width: unset;
      flex-grow: 1;
    }

    .filter-item:not(:last-child) {
      margin-right: 10px;
    }
  }

  .messages {
    margin-top: 20px;
    border-radius: 10px;
    border: var(--border-in-light);
    overflow: hidden;

    .message {
      display: flex;
      align-items: center;
      padding: 8px 10px;
      cursor: pointer;

      &-selected {
        background-color: var(--second);
      }

      &:not(:last-child) {
        border-bottom: var(--border-in-light);
      }

      .avatar {
        margin-right: 10px;
      }

      .body {
        flex-grow: 1;
        max-width: calc(100% - 40px);

        .date {
          font-size: 12px;
          line-height: 1.2;
          opacity: 0.5;
        }

        .content {
          font-size: 12px;
        }
      }
    }
  }
}