/* ══════════════════════════════════════════════════════
   CSA Intranet 2026 — Design Tokens v2 "Mission Control"
   ══════════════════════════════════════════════════════ */
:root {
  /* ── Brand ── */
  --orange:      #E85D20;
  --orange-h:    #D14E14;
  --orange-dim:  rgba(232,93,32,0.10);
  --orange-lt:   #F4874F;

  /* ── Structure ── */
  --steel:       #1E2530;
  --steel-mid:   #2C3545;
  --steel-lt:    #3D4F66;

  /* ── Page ── */
  --bg:          #F2F0EA;
  --surface:     #FFFFFF;
  --surface2:    #ECEAE3;
  --border:      rgba(30,37,48,0.10);
  --border-mid:  rgba(30,37,48,0.18);

  /* ── Text ── */
  --text:        #1A2030;
  --text2:       #5A6478;
  --text3:       #9299AB;

  /* ── Semantic ── */
  --green:       #1E9E62;
  --green-bg:    rgba(30,158,98,0.10);
  --amber:       #C97F08;
  --amber-bg:    rgba(201,127,8,0.10);
  --red:         #C42828;
  --red-bg:      rgba(196,40,40,0.10);
  --blue:        #1A5FBF;
  --blue-bg:     rgba(26,95,191,0.10);
  --purple:      #7048C8;
  --purple-bg:   rgba(112,72,200,0.10);

  /* ── Spacing ── */
  --gap-xs:  6px;
  --gap-sm:  10px;
  --gap-md:  14px;
  --gap-lg:  20px;
  --gap-xl:  28px;
  --gap-2xl: 36px;

  /* ── Radius ── */
  --r-sm:  6px;
  --r-md:  10px;
  --r-lg:  15px;
  --r-xl:  20px;
  --r-pill:9999px;

  /* ── Shadows ── */
  --shadow-xs: 0 1px 2px rgba(30,37,48,0.05);
  --shadow-sm: 0 1px 4px rgba(30,37,48,0.08);
  --shadow-md: 0 2px 10px rgba(30,37,48,0.10);
  --shadow-lg: 0 4px 20px rgba(30,37,48,0.14);
  --shadow-xl: 0 8px 36px rgba(30,37,48,0.18);

  /* ── Transitions ── */
  --t-fast: 120ms ease;
  --t-base: 180ms ease;
  --t-slow: 300ms ease;

  /* ── Z-index ── */
  --z-nav:     1000;
  --z-dropdown:1100;
  --z-modal:   2000;
  --z-toast:   3000;

  /* ── Font families ── */
  --font-sans: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'Space Mono', 'Fira Code', 'SF Mono', monospace;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg:       #14181F;
    --surface:  #1E2530;
    --surface2: #181D28;
    --border:   rgba(255,255,255,0.08);
    --border-mid:rgba(255,255,255,0.14);
    --text:     #E5E2D8;
    --text2:    #8A92A8;
    --text3:    #545D72;
  }
}