/* Paper & Ink · Blue — shell overlay (loaded after styles.css) */
@import url('https://fonts.googleapis.com/css2?family=Libre+Franklin:wght@400;500;600;700;800&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

body {
    font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background: var(--fd-bg);
    color: var(--fd-ink);
}

h1, h2, h3,
.header h1,
.tab-button,
.sidebar .nav-item,
.logo, .wordmark {
    font-family: 'Libre Franklin', 'IBM Plex Sans', sans-serif;
    letter-spacing: -.01em;
    font-weight: 700;
}

button.primary, .btn-primary, .submit-btn, .quote-btn {
    background: linear-gradient(180deg, var(--fd-accent), var(--fd-accent2)) !important;
    color: #fff !important;
}

::selection { background: rgba(var(--fd-accent-rgb), .25); }

/* scrollbars to paper */
::-webkit-scrollbar-track { background: var(--fd-bg2); }
::-webkit-scrollbar-thumb { background: var(--fd-border2); }
::-webkit-scrollbar-thumb:hover { background: var(--fd-dim); }


/* ═══════════════════ DE-AI STRUCTURAL PASS (2026-07-13) ═══════════════════ */
/* Patrick: current design reads AI — accent bars, floating shadow-cards, rounded
   gray callouts, blue mini-labels. Flatten the kit, keep the layout. CSS only. */

/* 1 · secondary light-blue accent (eyebrow labels) -> muted ink */
:root { --accent2: var(--fd-muted2) !important; }

/* 2 · content cards: no float, hairline on paper, crisper (not pill) corners */
.card, .panel, .limit-card, .trailer-card, .escort-type, .calc-box, .dim-diagram,
.hero-box, .cost-row, .calc-result, .region-chip {
  box-shadow: none !important;
  border-radius: 5px !important;
}
.card:hover, .panel:hover, .limit-card:hover, .trailer-card:hover, .escort-type:hover,
.cta-btn:hover, button.primary:hover, .btn-primary:hover, .submit-btn:hover, .quote-btn:hover {
  box-shadow: none !important;
  transform: none !important;
}

/* 3 · callouts: drop the fat accent rail + one-sided rounding -> quiet hairline */
.curveball, .accent-callout, .hero-box {
  border-left: 0 !important;
  border-radius: 5px !important;
}
.curveball, .accent-callout {
  border: 1px solid rgba(var(--fd-wash-rgb), .10) !important;
}

/* 4 · headings: no gradient-clip text, no accent bar */
.slide h2 {
  background: none !important;
  -webkit-text-fill-color: var(--fd-ink) !important;
  color: var(--fd-ink) !important;
  border-left: 0 !important;
  padding-left: 0 !important;
}

/* 5 · buttons: flat fill, no gradient, no glow */
button.primary, .btn-primary, .submit-btn, .quote-btn, .cta-btn {
  background: var(--fd-accent) !important;
  box-shadow: none !important;
}

/* 6 · kill the glowing progress/step markers */
.progress-bar-fill, .progress .dot.active { box-shadow: none !important; }

/* 7 · quiet the labeled callout chip -> bare ink label (no blue pill) */
.curveball .cb-label {
  background: none !important;
  border: 0 !important;
  padding: 0 8px 0 0 !important;
  color: var(--fd-muted2) !important;
}

/* 9 · callout family (alert-*, .callout): drop the blue accent rail -> quiet hairline */
.alert-amber, .alert-red, .alert-blue, .alert-green, .alert-info, .callout {
  border-left: 0 !important;
  border: 1px solid rgba(var(--fd-wash-rgb), .10) !important;
  border-radius: 5px !important;
}

/* 10 · masthead "Guide" chip -> quiet ink outline, no blue fill */
header h1 .pill, .header .pill, .guide-pill {
  background: none !important; background-image: none !important;
  color: var(--fd-muted) !important; border: 1px solid rgba(var(--fd-wash-rgb), .15) !important;
  box-shadow: none !important;
}

/* 11 · dashboard KPI cards: collapse the multi-color accent rails to one steel-blue
   (rail is sequential/decorative, not status — the up/down deltas carry meaning) */
.kpi::before { background: var(--fd-accent) !important; background-image: none !important; }

/* freight figures / data labels -> mono (opt-in) */
.mono, .tabular, [data-mono] { font-family: 'IBM Plex Mono', ui-monospace, monospace !important; font-variant-numeric: tabular-nums; }

/* ===== DURABLE THEME FIXES (survive every paper-refresh; sweep can't clobber these) ===== */
/* focus: ring only. The sweep maps the dark focus bg to var(--fd-ink2), darkening every focused
   input. Force a theme-appropriate input bg here (build-dark maps var(--fd-panel) -> dark for dark theme). */
body.sidebar-layout input:focus,
body.sidebar-layout select:focus,
body.sidebar-layout textarea:focus { background: var(--fd-panel) !important; }

/* Dropdown menu items UPPERCASE to match the nav (Patrick 7/24) — nav uses text-transform:uppercase, dropdowns didn't */
body.topnav-mode .tn-menu-item { text-transform: uppercase !important; letter-spacing: 0.06em; }

/* ===== TEXT PRESENCE PASS (Patrick 7/24: paper felt stark) — colors darkened in theme-tokens.css;
   this adds a half-step of weight to body copy so it reads with more ink. Light theme only via :root. ===== */
:root:not([data-theme="dark"]) body { font-weight: 450; }
:root:not([data-theme="dark"]) p,
:root:not([data-theme="dark"]) td,
:root:not([data-theme="dark"]) label,
:root:not([data-theme="dark"]) .tab-content li { font-weight: 450; }