/* alsoreported — small layer over vanilla Tabler 1.5. Keep it short.
 *
 * Look: "newsprint". Warm paper background, ink text, Newsreader (a serif drawn for news text) for
 * headings, Inter for everything else, one ink-navy accent, thin rules instead of shadows.
 * Fonts are self-hosted in /assets/fonts (OFL, licences alongside). Colours use light-dark() so
 * Tabler's own dark mode (it follows the OS setting) gets a matching dark paper.
 */
@font-face { font-family: "Newsreader"; font-style: normal; font-weight: 500; font-display: swap; src: url(fonts/newsreader-latin-500-normal.woff2) format("woff2"); }
@font-face { font-family: "Newsreader"; font-style: normal; font-weight: 600; font-display: swap; src: url(fonts/newsreader-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "Newsreader"; font-style: italic; font-weight: 500; font-display: swap; src: url(fonts/newsreader-latin-500-italic.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url(fonts/inter-latin-400-normal.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url(fonts/inter-latin-500-normal.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url(fonts/inter-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url(fonts/inter-latin-700-normal.woff2) format("woff2"); }

/* Same specificity as Tabler's own theme selectors; app.css loads later, so these win in both modes. */
:root, [data-bs-theme=light], [data-bs-theme=dark] {
  --ar-paper:   light-dark(#f6f2e9, #14130f);
  --ar-sheet:   light-dark(#fffdf8, #1d1b16);
  --ar-sheet-2: light-dark(#f1ebdf, #24211b);
  --ar-rule:    light-dark(#ddd4c3, #383328);
  --ar-ink:     light-dark(#1d1b17, #ece6d9);
  --ar-ink-2:   light-dark(#655e51, #a9a192);
  --ar-accent:  light-dark(#1f3b57, #9dbbdb);
  --ar-green:  light-dark(#2e6b40, #86c497);
  --ar-marker: light-dark(#f3dc84, #6d5b1c);
  --ar-serif: "Newsreader", Georgia, "Times New Roman", serif;

  --tblr-font-sans-serif: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --tblr-body-bg: var(--ar-paper);
  --tblr-body-color: var(--ar-ink);
  --tblr-bg-surface: var(--ar-sheet);
  --tblr-bg-surface-secondary: var(--ar-sheet-2);
  --tblr-bg-surface-tertiary: var(--ar-sheet-2);
  --tblr-bg-forms: var(--ar-sheet);
  --tblr-border-color: var(--ar-rule);
  --tblr-border-color-translucent: var(--ar-rule);
  --tblr-secondary: var(--ar-ink-2);
  --tblr-primary: var(--ar-accent);
  --tblr-primary-rgb: 31,59,87;
  --tblr-primary-fg: light-dark(#fff, #10161d);
  --tblr-primary-darken: light-dark(#16304a, #b7cde6);
  --tblr-primary-lt: light-dark(#e6ebf0, #1e2833);
  --tblr-link-color: var(--ar-accent);
  --tblr-link-hover-color: var(--ar-accent);
  --tblr-green: var(--ar-green);
  --tblr-success: var(--ar-green);
  --tblr-green-lt: light-dark(#e8f0e6, #1b2a1f);
  --tblr-success-lt: light-dark(#e8f0e6, #1b2a1f);
  --tblr-border-radius: 4px;
  --tblr-border-radius-lg: 6px;
  --tblr-box-shadow-card: none;
}

/* Type */
h1, h2, .h1, .h2, .page-title, .ar-hero-title, .ar-serif {
  font-family: var(--ar-serif); font-weight: 600; letter-spacing: -.005em; color: var(--ar-ink);
}
h1, .h1, .page-title { font-size: clamp(1.75rem, 3.6vw, 2.35rem); line-height: 1.15; }
h2, .h2 { font-size: 1.5rem; line-height: 1.25; }
.ar-h1, .ar-hero-title { text-wrap: balance; }
.ar-lede { font-size: 1.0625rem; max-width: 62ch; }
.ar-eyebrow, .page-pretitle {
  font-family: var(--tblr-font-sans-serif); font-size: .72rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: .12em; color: var(--ar-accent); margin-bottom: .4rem;
}
.ar-dateline { font-size: .8rem; color: var(--ar-ink-2); letter-spacing: .02em; }
.ar-dateline .sep { margin: 0 .45rem; opacity: .6; }

/* Masthead */
.navbar { background: var(--ar-paper); border-bottom: 3px double var(--ar-rule); }
.ar-brand { gap: 0; font-family: var(--ar-serif); font-weight: 600; font-size: 1.6rem; letter-spacing: -.01em;
  color: var(--ar-ink); text-decoration: none; line-height: 1; }
.ar-brand span { color: var(--ar-accent); font-style: italic; font-weight: 500; }
.navbar .nav-link { font-size: .875rem; }

/* Page header and sections: rules, not boxes */
.page-header .breadcrumb { margin-bottom: .9rem; }
.page-header { padding-bottom: 1.25rem; border-bottom: 1px solid var(--ar-rule); margin-bottom: .5rem; }
.ar-section-head { border-top: 1px solid var(--ar-ink); padding-top: .75rem; }
.card { box-shadow: none; }
.card-link:hover { border-color: var(--ar-accent); box-shadow: none; }
.footer { background: transparent; border-top: 3px double var(--ar-rule); }
.badge.bg-secondary-lt { background: var(--ar-sheet-2) !important; color: var(--ar-ink-2) !important; }

/* Home */
.ar-hero { padding-top: 1rem; }
.ar-hero-title { font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.08; margin-bottom: .85rem; max-width: 20ch; }
.ar-hero-title em { font-style: italic; font-weight: 500; color: var(--ar-accent); }
.ar-hero-art { color: var(--ar-ink); max-width: 340px; margin-left: auto; }
.ar-hero-art svg { width: 100%; height: auto; display: block; }
.ar-finder-card { margin-top: 1.25rem; max-width: 860px; border-color: var(--ar-ink); }
.ar-outlet-name { font-family: var(--ar-serif); font-weight: 600; font-size: 1.08rem; line-height: 1.25; }
.ar-rule-card { border: 0; border-top: 2px solid var(--ar-ink); border-radius: 0; background: transparent; }
.ar-rule-card .card-body { padding-left: 0; padding-right: 0; }
.ar-rule-card h3 { font-size: 1.25rem; }
.ar-pledge { background: var(--ar-sheet); border: 1px solid var(--ar-rule); border-left: 4px solid var(--ar-accent); }

/* Finder form */
.ar-finder .btn svg { margin-right: .35rem; }
@media (max-width: 575.98px) {
  .ar-finder .input-group { flex-wrap: wrap; }
  .ar-finder .input-group > .input-group-text { display: none; }
  .ar-finder .input-group > .form-control { width: 100%; flex: 1 1 100%; border-radius: var(--tblr-border-radius) !important; }
  .ar-finder .input-group > .btn { width: 100%; margin-top: .5rem; border-radius: var(--tblr-border-radius) !important; justify-content: center; }
}
.ar-finder-compact .form-control-lg, .ar-finder-compact .btn-lg { font-size: .9375rem; padding-top: .45rem; padding-bottom: .45rem; }
/* In narrow columns (sidebar) the compact finder stacks: input, then a full-width button. */
.col-lg-4 .ar-finder-compact .input-group { flex-wrap: wrap; }
.col-lg-4 .ar-finder-compact .input-group > .input-group-text { display: none; }
.col-lg-4 .ar-finder-compact .input-group > .form-control { width: 100%; flex: 1 1 100%; border-radius: var(--tblr-border-radius) !important; }
.col-lg-4 .ar-finder-compact .input-group > .btn { width: 100%; margin-top: .5rem; border-radius: var(--tblr-border-radius) !important; justify-content: center; }

/* Results and guides */
.ar-step-icon .icon { width: 2rem; height: 2rem; stroke-width: 1.5; }
.ar-clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ar-result-title { font-family: var(--ar-serif); font-weight: 600; font-size: 1.08rem; line-height: 1.3; color: var(--ar-ink); }
.ar-result:hover .ar-result-title { text-decoration: underline; }
.ar-route h3 { font-family: var(--ar-serif); font-weight: 600; font-size: 1.15rem; }
.ar-route-cost { font-variant-numeric: tabular-nums; }
.ar-prose h2 { margin-top: 1.5rem; }
.ar-prose h3 { margin-top: 1rem; }
.ar-ad { min-height: 90px; }