.pdf-toolbar {
  @apply bg-surface p-2 text-sm grid gap-2.5 items-start mb-2;
  grid-template-areas:
  "filename toolbar"
  "search search";
  grid-template-columns: 1fr auto;
  .file {
    @apply flex-1 truncate;
    grid-area: filename;
    .info {
      @apply text-text-secondary text-xs lowercase;
    }
  }
  .tools {
    @apply flex gap-2.5;
    grid-area: toolbar;
    .btn {
      @apply p-2;
    }
    nav {
      @apply flex gap-1.5;
      .pages {
        @apply flex gap-1 items-center shadow-2xs rounded-md border border-border px-4;
      }
    }
    .current-page {
      @apply font-semibold;
    }
    .separator {
      @apply border-l border-l-border h-8 w-[1px];
    }
    .zoom-controls {
      @apply flex gap-2;
    }
  }
  search:not(.hidden) {
    @apply flex gap-3;
    grid-area: search;
    input {
      @apply flex-1;
    }
    .results {
      @apply flex gap-2.5 items-center text-sm;
      .btn {
        @apply p-2;
      }
    }
  }
}
.textLayer span {
  /*font-size: calc(var(--font-height) * var(--scale-factor));*/
  font-size: calc(var(--font-height) * var(--scale-x) * var(--scale-factor));
}
.pdf-scroll-container {
  @apply overflow-y-auto max-h-full text-center py-4 px-0 bg-document-background border border-document-background;
}

/* 1. If using standard DOM Fallback */
.pdf-highlight-mark {
  @apply bg-highlight rounded-xs animate-pdf-pulse;
  box-shadow: 0 0 0 2px rgba(255, 235, 59, 0.4);
}

/* 2. If using CSS Custom Highlight API */
::highlight(pdf-search-highlight) {
  @apply bg-highlight;
}