/* ============================================================
   Command Center — Design Tokens (extracted 2026-09-01)
   Source: cc-dev.afnai.com dashboard screenshot (Matt-provided).
   NOTE: cc-dev.afnai.com is Entra-SSO auth-walled; no stylesheet
   was reachable anonymously. All values below are visually
   extracted from the screenshot and must be VERIFIED against the
   real CC stylesheet by Forge before implementation.
   ============================================================ */

:root {
  /* ---- Background layers ---- */
  --cc-bg-page:        #0d1117;  /* main content background */
  --cc-bg-sidebar:     #000000;  /* left nav, pure black */
  --cc-bg-topbar:      #0d1117;  /* header bar */
  --cc-bg-card:        #161b22;  /* primary card surface */
  --cc-bg-card-alt:    #1a1f2a;  /* nested / secondary surface */
  --cc-bg-input:       #1c2128;  /* inputs, secondary buttons */
  --cc-bg-hover:       #262c36;  /* button / row hover */
  --cc-bg-nav-hover:   #12161d;
  --cc-bg-nav-active:  #161b22;

  /* ---- Borders ---- */
  --cc-border:         #21262d;  /* card border */
  --cc-border-strong:  #30363d;  /* button / input border */

  /* ---- Text ---- */
  --cc-text-heading:   #ffffff;
  --cc-text-primary:   #e6edf3;
  --cc-text-secondary: #8b949e;
  --cc-text-tertiary:  #6e7681;
  --cc-text-disabled:  #4d545c;

  /* ---- Brand / accent ---- */
  --cc-accent:         #e8b04b;  /* AFN yellow (logo badge) */
  --cc-accent-strong:  #d99a2b;  /* active nav text, calendar today */
  --cc-focus-ring:     #4a90e2;

  /* ---- Stat tiles (dashboard pattern) ---- */
  --cc-tile-blue-bg:    #1c3a52;
  --cc-tile-blue-fg:    #4fa3e3;
  --cc-tile-green-bg:   #1a3d33;
  --cc-tile-green-fg:   #3fb883;
  --cc-tile-amber-bg:   #3d2f14;
  --cc-tile-amber-fg:   #d99a2b;
  --cc-tile-dark-bg:    #1a1f2a;
  --cc-tile-dark-fg:    #e6edf3;
  --cc-tile-red-bg:     #3d1d1d;  /* DERIVED for over-budget/declined */
  --cc-tile-red-fg:     #ea4335;  /* from chart red */

  /* ---- Chart / status colors ---- */
  --cc-chart-blue:     #4285f4;   /* In Progress */
  --cc-chart-amber:    #f5a623;   /* Pending Review */
  --cc-chart-green:    #34a853;   /* Approved */
  --cc-chart-red:      #ea4335;   /* Declined */
  --cc-chart-pink:     #ec4b7a;
  --cc-chart-orange:   #e8622c;

  /* ---- Semantic status (mapped to CC chart palette) ---- */
  --cc-status-draft:     var(--cc-text-secondary);
  --cc-status-submitted: var(--cc-chart-blue);
  --cc-status-pending:   var(--cc-chart-amber);
  --cc-status-approved:  var(--cc-chart-green);
  --cc-status-declined:  var(--cc-chart-red);
  --cc-status-fulfilled: var(--cc-tile-green-fg);

  /* ---- Radii ---- */
  --cc-radius-card:    12px;
  --cc-radius-tile:    10px;
  --cc-radius-control: 8px;   /* buttons, inputs */
  --cc-radius-pill:    9999px;

  /* ---- Spacing (8px-ish grid, 4px sub-steps) ---- */
  --cc-space-1: 4px;
  --cc-space-2: 8px;
  --cc-space-3: 12px;
  --cc-space-4: 16px;   /* tile gap */
  --cc-space-5: 20px;   /* card grid gap */
  --cc-space-6: 24px;   /* card padding */
  --cc-space-7: 28px;   /* section gap */
  --cc-space-8: 32px;   /* page horizontal padding */

  /* ---- Typography ---- */
  --cc-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter",
             "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --cc-fs-page-title: 26px;
  --cc-fs-card-title: 18px;
  --cc-fs-stat-value: 22px;
  --cc-fs-stat-label: 11px;
  --cc-fs-body:       14px;
  --cc-fs-caption:    12px;
  --cc-fw-regular: 400;
  --cc-fw-medium:  500;
  --cc-fw-semibold:600;
  --cc-fw-bold:    700;
  --cc-lh-tight:  1.2;
  --cc-lh-normal: 1.5;
  --cc-ls-label:  0.05em;

  /* ---- Shell geometry ---- */
  --cc-sidebar-w:  205px;
  --cc-topbar-h:   64px;
  --cc-content-max: 1075px;
}
