/* Custom styles layered on top of Tailwind. */

:root {
  font-feature-settings: "cv11", "ss01", "ss03", "cv02";
}

html {
  scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-variant-numeric: tabular-nums;
}

/* Inter tabular numerals on by default for dates/counts */
.tabular-nums, code, .font-mono {
  font-variant-numeric: tabular-nums;
}

/* Line-clamp helpers (Tailwind has .line-clamp-N but we want them in case the CDN JIT skips them) */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* HTMX loading indicator */
.htmx-indicator { opacity: 0; transition: opacity 0.2s; }
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator { opacity: 1; }

/* Flash highlight for jump-to-match */
@keyframes flash-highlight {
  0%   { background-color: rgba(251, 191, 36, 0.55); }
  100% { background-color: transparent; }
}
.flash-highlight {
  animation: flash-highlight 1.5s ease-out 1;
  border-radius: 2px;
}
@media (prefers-reduced-motion: reduce) {
  .flash-highlight { animation: none; outline: 2px solid rgb(251 191 36 / 0.6); outline-offset: 2px; }
}

/* mark styling (falls back when prose-mark-* doesn't apply) */
mark {
  background-color: rgb(254 240 138 / 0.8);
  color: inherit;
  padding: 0 0.125em;
  border-radius: 2px;
}
.dark mark {
  background-color: rgb(251 191 36 / 0.35);
  color: rgb(248 250 252);
}

/* Remove default browser focus ring in favor of our focus-visible: outline-brand-500 */
:focus { outline: none; }

/* Autocomplete list items */
[data-autocomplete-list] > li {
  cursor: pointer;
}
[data-autocomplete-list] > li[aria-selected="true"] {
  background-color: rgb(241 245 249);
}
.dark [data-autocomplete-list] > li[aria-selected="true"] {
  background-color: rgb(30 41 59);
}

/* Print CSS ----------------------------------------------------- */
@media print {
  header, footer,
  .no-print, [data-share-popover], [data-cite-popover],
  [data-filter-drawer], [data-filter-drawer-open],
  .htmx-indicator {
    display: none !important;
  }

  body {
    background: white !important;
    color: black !important;
  }

  article, .prose {
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 11pt !important;
    line-height: 1.6 !important;
    max-width: 100% !important;
  }

  article p {
    orphans: 3;
    widows: 3;
    page-break-inside: avoid;
  }

  mark {
    background: transparent !important;
    border-bottom: 1px solid #999 !important;
    color: black !important;
  }

  a[href]::after {
    content: " (" attr(href) ")";
    font-size: 0.85em;
    color: #555;
  }

  .print-citation {
    display: block !important;
  }
}