/* ============================================================
   SENZING DESIGN TOKENS — OBSIDIAN & EMBER SYSTEM
   senzing-tokens.css  |  v1.0  |  May 2026

   Import this file first in all pages and templates.
   Never hard-code hex values — always reference tokens.
   ============================================================ */

:root {

  /* ── Core Dark Surfaces ─────────────────────────────────── */
  --obsidian:       #0F0D0C;   /* Primary dark background / hero */
  --deep:           #1A1614;   /* Secondary dark surface / nav */
  --card:           #251E1A;   /* Card / elevated dark surface */
  --border:         #2E2520;   /* Borders on dark surfaces */

  /* ── Ember Gradient ─────────────────────────────────────── */
  --ember-hot:      #FF4E1F;   /* Gradient start — hot orange-red */
  --ember-mid:      #E8640A;   /* Gradient midpoint */
  --ember-warm:     #F0920A;   /* Gradient end — warm amber */
  --ember-core:     #C03A10;   /* Solid ember — use on light backgrounds */
  --grad:           linear-gradient(90deg, #FF4E1F 0%, #E8640A 45%, #F0920A 100%);
  --grad-diag:      linear-gradient(135deg, #FF4E1F 0%, #F0920A 100%);

  /* ── Signal Green — RESTRICTED USE ONLY ────────────────── */
  /* Reserved exclusively for: live / resolved / match state  */
  /* indicators. Never use as body text, large fills, or      */
  /* decorative color. Max one usage per screen.              */
  --signal:         #00FC88;

  /* ── Dark Theme Typography ──────────────────────────────── */
  --text:           #E8E2DC;   /* Primary body text on dark */
  --muted:          #B0A49E;   /* Supporting / secondary text on dark */
  --white:          #FFFFFF;   /* Headlines and emphasis on dark */

  /* ── Light Theme ────────────────────────────────────────── */
  --light-bg:       #FFFFFF;         /* Page background */
  --light-surface:  #F7F5F2;         /* Warm off-white — alternating sections */
  --light-border:   #DDD8D3;         /* Borders on light surfaces */
  --light-border-strong: #E0DBD6;    /* Slightly stronger border */
  --light-text:     #1A1614;         /* Primary text on light */
  --light-body:     #555555;         /* Body copy on light */
  --light-meta:     #9E8E80;         /* Captions, meta, timestamps */

  /* ── Spacing Scale ──────────────────────────────────────── */
  --space-xs:   8px;
  --space-sm:   16px;
  --space-md:   24px;
  --space-lg:   40px;
  --space-xl:   64px;
  --space-2xl:  96px;

  /* ── Border Radius ──────────────────────────────────────── */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   10px;
  --radius-xl:   12px;
  --radius-pill: 100px;

  /* ── Shadows ────────────────────────────────────────────── */
  --shadow-nav:   0 2px 12px rgba(0,0,0,0.4);
  --shadow-card:  0 4px 24px rgba(0,0,0,0.2);
  --shadow-hero:  0 8px 32px rgba(0,0,0,0.18);
  --shadow-light: 0 2px 16px rgba(0,0,0,0.06);

  /* ── Typography ─────────────────────────────────────────── */
  --font-sans:     'Helvetica Neue', Helvetica, Arial, sans-serif;  /* body baseline */
  --font-heading:  'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;  /* all headings/titles */
  --font-mono:     'SF Mono', 'Fira Code', monospace;

  /* ── Max Widths ─────────────────────────────────────────── */
  --max-content: 1200px;
  --max-wide:    1280px;
  --max-narrow:  860px;
  --max-text:    680px;
}
