.documents {
  @apply flex flex-col py-5 px-2 gap-3 h-full mx-5 relative;
  &:has(.drawer) {
    @apply pr-10;
  }
  header {
    @apply grid gap-2;
    grid-template-columns: 1fr auto;
    div.new-document {
      @apply flex gap-4 items-baseline;
    }
  }
  & > .analysis {
    .classification {
      @apply flex flex-row-reverse gap-3;;
    }
  }
  & > section.document {
    @apply grid gap-3 overflow-hidden;
    grid-template-areas: "document data";
    grid-template-columns: 50% 1fr;
    .data-area {
      @apply flex flex-col gap-3 overflow-scroll;
      grid-area: data;
      header h3 {
        @apply flex-1;
      }
      .finding-list {
        @apply flex flex-col gap-3;
      }
      .analysis-section {
        @apply grid gap-y-0;
        grid-template-areas:
          "counter title arrow"
          ". risk-level ."
          ". finding ."
          ". aside . "
          ". footer . ";
        grid-template-columns: auto 1fr auto;
        .counter {
          grid-area: counter;
        }
        .title {
          grid-area: title;
        }
        .risk-level {
          @apply flex py-0 gap-4 items-center text-text-secondary text-sm font-semibold;
          grid-area: risk-level;
        }
        .arrow {
          grid-area: arrow;
        }
        div.section-text {
          grid-area: finding;
          .section-text-content {
            @apply whitespace-pre-wrap;
            overflow: hidden;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: var(--read-more-line-clamp, 2);
            line-clamp: var(--read-more-line-clamp, 2);
          }
        }
        aside {
          @apply overflow-hidden;
          grid-area: aside;
          ul {
            @apply flex flex-col gap-2;
            li {
              @apply text-sm text-nowrap overflow-hidden text-ellipsis cursor-pointer;
            }
          }
        }
      }
    }
    .document-area {
      @apply overflow-hidden flex flex-col;
      grid-area: document;
    }
  }
}