/* ==========================================================================
   OOT Tracker design tokens — single source of truth for BOTH themes.
   Theme-independent tokens live on :root; palettes on html[data-theme].
   components.css consumes ONLY these variables.
   ========================================================================== */

:root {
  --font-sans: "Inter", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;

  --radius-s: 6px;
  --radius-m: 10px;
  --radius-l: 14px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;

  /* Perceptual click-heat ramp — theme-independent (5 stops, interpolated in JS) */
  --heat-1: #2563eb;
  --heat-2: #06b6d4;
  --heat-3: #10b981;
  --heat-4: #f59e0b;
  --heat-5: #ef4444;

  /* Fixed layout metrics */
  --chart-h-trend: 220px;
  --chart-h-category: 260px;
  --nav-h: 56px;
}

/* --------------------------------------------------------------------------
   CLIENT — light, professional, print-perfect. Client-facing reports + PDF.
   Palette inherits the onlyoptiontoday.com brand: #3d8bff accent, navy text
   tones, brand warn/bad. Light surfaces for clean printing.
   -------------------------------------------------------------------------- */
html[data-theme="client"] {
  --bg: #f2f6fc;
  --surface: #ffffff;
  --surface-2: #eaf1fb;
  --border: #cdd9ec;
  --border-strong: #9db4d6;

  --text: #0b1220;
  --text-2: #20304a;
  --text-3: #6f819c;

  --accent: #1a6fe8;
  --accent-2: #0f4cb8;
  --accent-soft: #eaf1fb;
  --accent-contrast: #ffffff;

  --ok: #1e5c4f;
  --ok-soft: #e7f4f0;
  --warn: #9a6b00;
  --warn-soft: #fff7e3;
  --bad: #c23737;
  --bad-soft: #ffecec;
  --info: #0e5f8a;

  --chart-1: #3d8bff;
  --chart-2: #1e5c4f;
  --chart-3: #0b1220;
  --chart-4: #ffca67;
  --chart-5: #1a6fe8;
  --chart-6: #ff7a7a;
  --chart-7: #6f819c;
  --chart-8: #9db4d6;

  --shadow: 0 1px 2px rgba(11, 18, 32, 0.06), 0 1px 3px rgba(11, 18, 32, 0.05);
  --shadow-lift: 0 4px 12px -2px rgba(11, 18, 32, 0.1), 0 2px 4px -2px rgba(11, 18, 32, 0.06);
  --grid: rgba(32, 48, 74, 0.1);

  --nav-bg: #ffffff;
  --nav-border: var(--border);

  /* heat blob blend — screen washes out on white; use normal + lower alpha */
  --heat-blend: normal;
  --heat-opacity: 0.82;
  color-scheme: light;
}

/* --------------------------------------------------------------------------
   OPS — internal cockpit. EXACT onlyoptiontoday.com palette: same navy bg,
   panel, line, accent and semantic colors as the marketing site, so the app
   reads as the same product family.
   -------------------------------------------------------------------------- */
html[data-theme="ops"] {
  --bg: #0b1220;
  --surface: #111c30;
  --surface-2: #16233c;
  --border: #20304a;
  --border-strong: #31456a;

  --text: #eaf1fb;
  --text-2: #93a6c2;
  --text-3: #6f819c;

  --accent: #3d8bff;
  --accent-2: #7fb2ff;
  --accent-soft: #122744;
  --accent-contrast: #04101f;

  --ok: #4fc6a4;
  --ok-soft: #0d2620;
  --warn: #ffca67;
  --warn-soft: #2b2415;
  --bad: #ff7a7a;
  --bad-soft: #331b1b;
  --info: #7fb2ff;

  --chart-1: #3d8bff;
  --chart-2: #4fc6a4;
  --chart-3: #93a6c2;
  --chart-4: #ffca67;
  --chart-5: #7fb2ff;
  --chart-6: #ff7a7a;
  --chart-7: #cdd9ec;
  --chart-8: #04101f;

  --shadow: 0 10px 28px -14px rgba(0, 0, 0, 0.6);
  --shadow-lift: 0 14px 34px -16px rgba(0, 0, 0, 0.7);
  --grid: rgba(147, 166, 194, 0.14);

  --nav-bg: #04101f;
  --nav-border: var(--border);

  /* screen blend makes heat glow beautifully on dark */
  --heat-blend: screen;
  --heat-opacity: 0.85;
  color-scheme: dark;
}

/* --------------------------------------------------------------------------
   Local Inter (variable font, latin subset) — self-hosted, no CDN.
   -------------------------------------------------------------------------- */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900; /* variable */
  font-display: swap;
  src: url("/fonts/inter-latin-var.woff2") format("woff2-variations");
}
