/* ============================================================
   BOMForge brand layer for BOMAtlas.
   One file re-skins every legacy token vocabulary (atlas ink/paper,
   design-tokens gold, homepage sand/rust/coal, admin inline vars)
   onto the BOMForge system: velvet-rope neutrals, Geist type,
   monochrome ink interactive primary (black on light, white on dark),
   Old Glory forge red reserved for the wordmark. Map segment hues are
   DATA colors, not chrome, and stay chromatic.

   Loaded via @import at the TOP of each token-source stylesheet.
   Imported rules cascade BEFORE the host file's own rules, so every
   override here uses :root:root (0,2,0) to beat the legacy :root
   definitions (0,1,0) regardless of source order. Do not "simplify"
   the doubled selector.

   Theme behavior matches the site: light/dark follows the OS, and
   the manual toggle pins it via html[data-theme] (theme-init reads
   localStorage 'ba-theme'). Admin pages set data-theme="dark".
   ============================================================ */

/* ---- Geist (BOMForge type; Inter stays as fallback) ---- */
@font-face {
  font-family: 'Geist';
  src: url('/assets/fonts/geist-sans/Geist-Regular.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Geist';
  src: url('/assets/fonts/geist-sans/Geist-Medium.woff2') format('woff2');
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: 'Geist';
  src: url('/assets/fonts/geist-sans/Geist-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'Geist';
  src: url('/assets/fonts/geist-sans/Geist-Bold.woff2') format('woff2');
  font-weight: 700 800;
  font-display: swap;
}
@font-face {
  font-family: 'Geist Mono';
  src: url('/assets/fonts/geist-mono/GeistMono-Regular.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Geist Mono';
  src: url('/assets/fonts/geist-mono/GeistMono-Medium.woff2') format('woff2');
  font-weight: 500 700;
  font-display: swap;
}

:root:root {
  /* ---- BOMForge canon ---- */
  --bf-black: #0a0a0a;
  --bf-surface: #141414;
  --bf-elevated: #1a1a1a;
  --bf-border: #242424;
  --bf-text: #f5f5f5;
  --bf-text-2: #a3a3a3;
  --bf-text-3: #8a8a8a;
  --bf-blue: #3b82f6;
  --bf-blue-bright: #60a5fa;
  --bf-blue-soft: #93c5fd;
  --forge-navy: #002868;
  --forge-red: #bf0a30;
  --forge-red-hover: #d4213f;
  --forge-red-deep: #8a0722;
  --forge-gold: #ffd700;
  --bf-red-gradient: linear-gradient(135deg, #bf0a30 0%, #d4213f 55%, #8a0722 100%);

  /* ---- Type: every legacy font token -> Geist ---- */
  --font-sans: 'Geist', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-family: var(--font-sans);
  --font-display: var(--font-sans);
  --font-mono: 'Geist Mono', 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-data: var(--font-mono);

  /* ---- design-tokens vocabulary (dark product surfaces; these pages
     ship dark in both OS modes, BOMForge is dark-first) ---- */
  --color-primary: #f5f5f5;
  --color-primary-hover: #ffffff;
  --color-primary-dark: #d4d4d4;
  --color-primary-light: #ffffff;
  --color-primary-alpha-10: rgba(245, 245, 245, 0.1);
  --color-primary-alpha-15: rgba(245, 245, 245, 0.15);
  --color-primary-alpha-20: rgba(245, 245, 245, 0.2);
  --color-primary-alpha-40: rgba(245, 245, 245, 0.4);
  --color-primary-subtle: rgba(245, 245, 245, 0.08);
  --color-primary-muted: rgba(245, 245, 245, 0.15);
  --color-primary-glow: rgba(245, 245, 245, 0.35);
  --color-elite: var(--forge-gold);
  --color-elite-hover: #eac400;
  --color-elite-light: #ffe23d;
  --gradient-primary: var(--bf-red-gradient);
  --gradient-secondary: linear-gradient(135deg, #a3a3a3 0%, #d4d4d4 50%, #f5f5f5 100%);
  --gradient-dark: linear-gradient(135deg, #0a0a0a 0%, #161616 100%);

  --bg-void: var(--bf-black);
  --bg-base: var(--bf-black);
  --bg-surface: var(--bf-surface);
  --bg-elevated: var(--bf-elevated);
  --bg-overlay-subtle: #1f1f1f;
  --bg-primary: var(--bf-black);
  --bg-secondary: var(--bf-surface);
  --bg-tertiary: var(--bf-elevated);
  --bg-card: var(--bf-surface);
  --bg-hover: #1f1f1f;
  --bg-modal: rgba(10, 10, 10, 0.95);

  --text-primary: var(--bf-text);
  --text-secondary: var(--bf-text-2);
  --text-muted: var(--bf-text-3);
  --text-disabled: #6b6b6b;

  --border-subtle: rgba(255, 255, 255, 0.06);
  --border-default: rgba(255, 255, 255, 0.1);
  --border-strong: rgba(255, 255, 255, 0.16);
  --border-gold: rgba(191, 10, 48, 0.35);
  --border-gold-strong: rgba(191, 10, 48, 0.55);
  --border-color: var(--bf-border);
  --border-focus: #f5f5f5;

  /* ---- admin inline vocabulary (same names, pinned dark) ---- */
  --accent-hover: #262626;

  /* ---- homepage / warm vocabulary, LIGHT values (default) ---- */
  --white: #ffffff;
  --gray-50: #f7f8fa;
  --gray-100: #eff1f4;
  --gray-200: #e2e5ea;
  --gray-300: #cfd4db;
  --gray-400: #9aa1ab;
  --gray-500: #6b7280;
  --gray-600: #4b5563;
  --gray-700: #333a45;
  --gray-800: #22262e;
  --gray-900: #16181d;
  --sand-50: #f5f6f8;
  --sand-100: #edeef1;
  --sand-200: #dcdfe4;
  --coal-900: #101318;
  --coal-800: #181c23;
  --coal-700: #242a33;
  --rust-500: var(--forge-red);
  --rust-600: var(--forge-red-deep);
  --gold-500: #a97e08;
  --blue-500: #0a0a0a;
  --blue-600: #262626;
  --blue-700: #404040;
  --blue-50: #f0f0f2;
  --warm-rust-500: var(--forge-red);
  --warm-rust-600: var(--forge-red-deep);
  --warm-rust-400: var(--forge-red-hover);

  /* ---- Map segment hues (validated: lightness band, chroma, CVD,
     contrast — vs white AND #141414). Must match map-globe.js. ---- */
  --seg-trade: #bf0a30;
  --seg-cc: #0d9488;
  --seg-pub: #2563eb;
  --seg-priv: #a16207;
  --seg-research: #7c3aed;

  /* ---- Status, LIGHT values. Namespaced --status-* rather than --success,
     which industrial-theme.css already declares at a plain :root and would
     race. All six values clear AA against the paper they sit on. ---- */
  --status-ok: #15803d;
  --status-warn: #a16207;
  --status-bad: var(--forge-red);

  /* ---- atlas ink/paper vocabulary, LIGHT values (default) ---- */
  --ink: #1a2029;
  --ink-2: #4b5563;
  --ink-3: #5c6570;
  --ink-meta: #5a6472;
  --line: rgba(16, 20, 26, 0.09);
  --line-strong: rgba(16, 20, 26, 0.17);
  --paper: #ffffff;
  --paper-2: #f5f6f8;
  --accent: #0a0a0a;
  --accent-2: #262626;
  --glass: 255, 255, 255;
  --paper-rgb: 255, 255, 255;
}

/* ---- Dark values: OS preference ---- */
@media (prefers-color-scheme: dark) {
  :root:root {
    --ink: var(--bf-text);
    --ink-2: var(--bf-text-2);
    --ink-3: var(--bf-text-3);
    --ink-meta: #9a9a9a;
    --seg-trade: #d4213f;
    --seg-cc: #0d9488;
    --seg-pub: #2563eb;
    --seg-priv: #a16207;
    --seg-research: #8b5cf6;

    --status-ok: #4ade80;
    --status-warn: #fbbf24;
    --status-bad: #f26a86;

    --line: rgba(255, 255, 255, 0.09);
    --line-strong: rgba(255, 255, 255, 0.17);
    --paper: var(--bf-black);
    --paper-2: var(--bf-surface);
    --accent: #f5f5f5;
    --accent-2: #d4d4d4;
    --accent-hover: #d4d4d4;
    --glass: 10, 10, 10;
    --paper-rgb: 10, 10, 10;

    --white: #0a0a0a;
    --gray-50: #141414;
    --gray-100: #1a1a1a;
    --gray-200: #242424;
    --gray-300: #2e2e2e;
    --gray-400: #8a8a8a;
    --gray-500: #a3a3a3;
    --gray-600: #c7c7c7;
    --gray-700: #dcdcdc;
    --gray-800: #ededed;
    --gray-900: #f5f5f5;
    --sand-50: #141414;
    --sand-100: #1a1a1a;
    --sand-200: #242424;
    --coal-900: #f5f5f5;
    --coal-800: #ededed;
    --coal-700: #dcdcdc;
    --rust-500: #e8365b;
    --rust-600: #f26a86;
    --gold-500: #d9b23a;
    --blue-50: rgba(255, 255, 255, 0.08);
    --blue-500: #f5f5f5;
    --blue-600: #d4d4d4;
    --blue-700: #bfbfbf;
  }
}

/* ---- Manual toggle pins (beats the media query) ---- */
:root:root[data-theme='light'] {
  --ink: #1a2029;
  --ink-2: #4b5563;
  --ink-3: #5c6570;
  --ink-meta: #5a6472;
  --seg-trade: #bf0a30;
  --seg-cc: #0d9488;
  --seg-pub: #2563eb;
  --seg-priv: #a16207;
  --seg-research: #7c3aed;
  --line: rgba(16, 20, 26, 0.09);
  --line-strong: rgba(16, 20, 26, 0.17);
  --paper: #ffffff;
  --paper-2: #f5f6f8;
  --accent: #0a0a0a;
  --accent-2: #262626;
  --accent-hover: #262626;
  --glass: 255, 255, 255;
  --paper-rgb: 255, 255, 255;

  --white: #ffffff;
  --gray-50: #f7f8fa;
  --gray-100: #eff1f4;
  --gray-200: #e2e5ea;
  --gray-300: #cfd4db;
  --gray-400: #9aa1ab;
  --gray-500: #6b7280;
  --gray-600: #4b5563;
  --gray-700: #333a45;
  --gray-800: #22262e;
  --gray-900: #16181d;
  --sand-50: #f5f6f8;
  --sand-100: #edeef1;
  --sand-200: #dcdfe4;
  --coal-900: #101318;
  --coal-800: #181c23;
  --coal-700: #242a33;
  --rust-500: var(--forge-red);
  --rust-600: var(--forge-red-deep);
  --gold-500: #a97e08;
  --blue-50: #f0f0f2;
  --blue-500: #0a0a0a;
  --blue-600: #262626;
  --blue-700: #404040;
}

:root:root[data-theme='dark'] {
  --ink: var(--bf-text);
  --ink-2: var(--bf-text-2);
  --ink-3: var(--bf-text-3);
  --ink-meta: #9a9a9a;
  --seg-trade: #d4213f;
  --seg-cc: #0d9488;
  --seg-pub: #2563eb;
  --seg-priv: #a16207;
  --seg-research: #8b5cf6;
  --status-ok: #4ade80;
  --status-warn: #fbbf24;
  --status-bad: #f26a86;
  --line: rgba(255, 255, 255, 0.09);
  --line-strong: rgba(255, 255, 255, 0.17);
  --paper: var(--bf-black);
  --paper-2: var(--bf-surface);
  --accent: #f5f5f5;
  --accent-2: #d4d4d4;
  --accent-hover: #d4d4d4;
  --glass: 10, 10, 10;
  --paper-rgb: 10, 10, 10;

  --white: #0a0a0a;
  --gray-50: #141414;
  --gray-100: #1a1a1a;
  --gray-200: #242424;
  --gray-300: #2e2e2e;
  --gray-400: #8a8a8a;
  --gray-500: #a3a3a3;
  --gray-600: #c7c7c7;
  --gray-700: #dcdcdc;
  --gray-800: #ededed;
  --gray-900: #f5f5f5;
  --sand-50: #141414;
  --sand-100: #1a1a1a;
  --sand-200: #242424;
  --coal-900: #f5f5f5;
  --coal-800: #ededed;
  --coal-700: #dcdcdc;
  --rust-500: #e8365b;
  --rust-600: #f26a86;
  --gold-500: #d9b23a;
  --blue-50: rgba(255, 255, 255, 0.08);
  --blue-500: #f5f5f5;
  --blue-600: #d4d4d4;
  --blue-700: #bfbfbf;
}

/* ---- Behavior polish (BOMForge feel) ---- */
html body {
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
}
:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 2px;
}
::selection {
  background: var(--ink);
  color: var(--paper);
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ---- Wordmark: "BOM" foreground + second word in the forge red
   gradient, matching the BOMForge lockup on every header. ---- */
.hp-logo span,
.hp-footer-logo span,
.bomatlas-logo-accent {
  background: var(--bf-red-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #d4213f;
}