/* ── Brand palette: "Ledger" (deep teal + amber, warm paper surface) ────
   Distinct from both source sites: not economicsguru.com's dark-navy/gold
   dashboard, not georgiaeconomics.com's charcoal/amber-on-white "Modern
   Editorial". Overrides Bootswatch Litera's default blue, same technique
   as zdm5/css/zdm5.css and pm6/css/pm6.css — CSS variables on top of the
   CDN build, no local Bootstrap recompile. ── */
:root {
  --bs-primary: #0E6E5C;
  --bs-primary-rgb: 14, 110, 92;
  --bs-primary-text-emphasis: #0A4E41;
  --bs-primary-bg-subtle: #DEEEE9;
  --bs-primary-border-subtle: #A9CFC4;

  --bs-secondary: #6B7280;
  --bs-secondary-rgb: 107, 114, 128;

  --bs-success: #0E6E5C;
  --bs-success-rgb: 14, 110, 92;
  --bs-info: #2E6F9E;
  --bs-info-rgb: 46, 111, 158;
  --bs-warning: #C6812B;
  --bs-warning-rgb: 198, 129, 43;
  --bs-danger: #B23A2E;
  --bs-danger-rgb: 178, 58, 46;

  --bs-link-color: #0E6E5C;
  --bs-link-color-rgb: 14, 110, 92;
  --bs-link-hover-color: #0A4E41;
  --bs-link-hover-color-rgb: 10, 78, 65;
  --bs-focus-ring-color: rgba(14, 110, 92, .25);

  --bs-body-bg: #FBF9F4;
  --bs-light: #F3EFE4;
  --bs-light-rgb: 243, 239, 228;

  /* Custom brand tokens */
  --ehq-ink: #1B2430;
  --ehq-accent: #C6812B;
  --ehq-accent-soft: #F4E6CE;
  /* #C6812B on the teal navbar measures 1.93:1 (WCAG AA needs 3:1 even for
     large bold text) — this lighter variant is scoped to dark/teal
     backgrounds only (3.66:1) and must not be reused as accent-on-white,
     where it goes the other way (1.69:1). */
  --ehq-accent-on-dark: #F0C06B;
  --ehq-surface: #FBF9F4;
  --ehq-card-bg: #FFFFFF;
  --ehq-border: #E4DFD2;
  --ehq-up: #0E6E5C;
  --ehq-down: #B23A2E;
  --ehq-flat: #6B7280;

  --bs-font-sans-serif: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --ehq-font-serif: 'IBM Plex Serif', Georgia, serif;
}

body { color: var(--ehq-ink); }
h1, h2, h3, .ehq-display { font-family: var(--ehq-font-serif); font-weight: 600; letter-spacing: -0.01em; }

.btn-primary {
  --bs-btn-bg: #0E6E5C;
  --bs-btn-border-color: #0E6E5C;
  --bs-btn-hover-bg: #0A4E41;
  --bs-btn-hover-border-color: #084237;
  --bs-btn-active-bg: #084237;
  --bs-btn-active-border-color: #06362D;
  --bs-btn-focus-shadow-rgb: 14, 110, 92;
  --bs-btn-disabled-bg: #0E6E5C;
  --bs-btn-disabled-border-color: #0E6E5C;
}
.dropdown-menu { --bs-dropdown-link-active-bg: #0E6E5C; }

.bg-ehq-accent { background-color: var(--ehq-accent) !important; }
.text-ehq-accent { color: var(--ehq-accent) !important; }

/* ── Layout: fixed navbar spacer ─────────────────────────────────── */
body { padding-top: 66px; }

.navbar-brand .brand-tag { font-weight: 800; }
.navbar-brand .brand-accent { color: var(--ehq-accent-on-dark); }

/* ── KPI cards ────────────────────────────────────────────────────── */
.kpi-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.kpi-card {
  background: var(--ehq-card-bg); border: 1px solid var(--ehq-border); border-radius: 10px;
  padding: 14px 16px;
}
.kpi-card .kpi-label { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--bs-secondary); font-weight: 600; }
.kpi-card .kpi-value { font-family: var(--ehq-font-serif); font-size: 1.65rem; font-weight: 700; line-height: 1.15; margin-top: 2px; }
.kpi-card .kpi-delta { font-size: .82rem; margin-top: 3px; font-weight: 600; }
.kpi-card .kpi-delta.up { color: var(--ehq-up); }
.kpi-card .kpi-delta.down { color: var(--ehq-down); }
.kpi-card .kpi-delta.flat { color: var(--ehq-flat); }
.kpi-card .kpi-asof { font-size: .74rem; color: var(--bs-secondary); margin-top: 4px; }

/* ── Chart panels ─────────────────────────────────────────────────── */
.chart-panel {
  background: var(--ehq-card-bg); border: 1px solid var(--ehq-border); border-radius: 10px;
  padding: 18px 20px; margin-bottom: 18px;
}
.chart-panel h2, .chart-panel h3 { font-size: 1.05rem; margin-bottom: 2px; }
.chart-panel .panel-sub { font-size: .85rem; color: var(--bs-secondary); margin-bottom: 10px; }
.chart-canvas-wrap { position: relative; height: 300px; }
.chart-canvas-wrap.short { height: 220px; }
.chart-canvas-wrap.tall { height: 460px; }
.source-note { font-size: .78rem; color: var(--bs-secondary); margin-top: 8px; border-top: 1px dashed var(--ehq-border); padding-top: 8px; }
.source-note a { color: inherit; text-decoration: underline; }

/* ── Topic / hub cards on landing pages ──────────────────────────── */
.topic-card {
  display: block; border-radius: 10px; padding: 18px 20px; text-decoration: none;
  background: var(--ehq-card-bg); border: 1px solid var(--ehq-border); border-top: 4px solid var(--accent, var(--bs-primary));
  transition: transform .12s ease, box-shadow .12s ease; color: var(--ehq-ink);
}
.topic-card:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(27,36,48,.08); color: var(--ehq-ink); }
.topic-card h3 { font-size: 1.1rem; margin-bottom: 4px; }
.topic-card p { font-size: .88rem; color: var(--bs-secondary); margin-bottom: 0; }

/* ── Hero ─────────────────────────────────────────────────────────── */
.ehq-hero { padding: 52px 0 36px; }
.ehq-hero h1 { font-size: 2.4rem; }
.ehq-hero .lede { font-size: 1.1rem; color: var(--bs-secondary); max-width: 60ch; }

/* ── Data table ───────────────────────────────────────────────────── */
.ehq-table td, .ehq-table th { font-size: .9rem; }
.ehq-table td.numeric, .ehq-table th.numeric { text-align: right; font-variant-numeric: tabular-nums; }

/* ── Breadcrumb ───────────────────────────────────────────────────── */
.ehq-crumb { font-size: .84rem; color: var(--bs-secondary); margin-bottom: 10px; }
.ehq-crumb a { color: inherit; }

/* ── Search ───────────────────────────────────────────────────────── */
.ehq-search-wrap { position: relative; }
.ehq-search-results {
  position: absolute; top: calc(100% + 4px); left: 0; right: 0; background: #fff;
  border: 1px solid var(--ehq-border); border-radius: 8px; box-shadow: 0 10px 24px rgba(27,36,48,.14);
  max-height: 360px; overflow-y: auto; z-index: 1050;
}
.ehq-search-results .result-item { display: block; padding: 8px 12px; text-decoration: none; color: var(--ehq-ink); border-bottom: 1px solid var(--ehq-border); }
.ehq-search-results .result-item:last-child { border-bottom: none; }
.ehq-search-results .result-item:hover, .ehq-search-results .result-item.active { background: var(--bs-primary-bg-subtle); }
.ehq-search-results .result-label { font-weight: 600; font-size: .9rem; }
.ehq-search-results .result-meta { font-size: .76rem; color: var(--bs-secondary); }

/* ── Choropleth maps (js/econhq-map.js + includes/render-map.php) ───── */
.ehq-map-wrap { position: relative; }
.ehq-map-svg { width: 100%; height: auto; display: block; }
.ehq-map-svg path { stroke: var(--ehq-card-bg); stroke-width: .5; fill-rule: evenodd; transition: opacity .1s ease; }
.ehq-map-svg path[data-geo-id]:hover { opacity: .78; stroke: var(--ehq-ink); stroke-width: 1; }
.ehq-map-legend { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 10px; font-size: .8rem; color: var(--bs-secondary); }
.ehq-map-legend-label { font-weight: 600; }
.ehq-map-legend-steps { display: inline-flex; align-items: flex-start; }
.ehq-map-legend-step { display: flex; flex-direction: column; align-items: flex-start; }
.ehq-map-legend-step .ehq-map-legend-swatch { width: 34px; height: 10px; border-radius: 0; margin: 0; }
.ehq-map-legend-step:first-child .ehq-map-legend-swatch { border-radius: 2px 0 0 2px; }
.ehq-map-legend-step:last-child .ehq-map-legend-swatch { border-radius: 0 2px 2px 0; }
.ehq-map-legend-tick { font-size: .7rem; line-height: 1.4; margin-left: -1px; font-variant-numeric: tabular-nums; }
.ehq-map-legend-nodata { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; }
.ehq-map-legend-swatch { display: inline-block; width: 10px; height: 10px; border-radius: 2px; background: var(--ehq-border); border: 1px solid var(--ehq-card-bg); }

.ehq-map-tabs .btn { --bs-btn-padding-y: .25rem; --bs-btn-padding-x: .65rem; --bs-btn-font-size: .82rem; }

/* ── Ad slot (CLS-safe) ───────────────────────────────────────────── */
.ad-slot { min-height: 90px; }

@media (max-width: 576px) {
  .ehq-hero h1 { font-size: 1.9rem; }
}

/* ── Long-form content (explainers, FAQ, narrative summaries) ────── */
.ehq-prose { max-width: 78ch; margin-top: 28px; }
.ehq-prose h2 { font-size: 1.35rem; margin-bottom: .6rem; }
.ehq-prose h3 { font-size: 1.05rem; margin-top: 1.1rem; margin-bottom: .35rem; }
.ehq-prose p, .ehq-prose li { line-height: 1.65; }
.ehq-prose ul { padding-left: 1.2rem; }
.ehq-summary li { margin-bottom: .35rem; line-height: 1.55; }
.ehq-summary h2 { margin-bottom: .6rem; }
.lede { font-size: 1.05rem; line-height: 1.6; }
.ehq-county-links { columns: 4 180px; column-gap: 24px; font-size: .9rem; }
.ehq-county-links a { display: block; padding: 2px 0; }
.navbar .nav-link { font-size: .92rem; }
@media (min-width: 992px) and (max-width: 1199px) {
  .navbar .nav-link { padding-left: .4rem; padding-right: .4rem; font-size: .85rem; }
  .ehq-search-wrap { max-width: 170px; }
}