/* ============================================
   COMMAND CENTER — Design Tokens
   Theme: Enterprise SaaS (light + dark)
   Solid surfaces, 1px borders, single accent.
   ============================================ */

/* --- Theme-independent tokens --- */
:root {
  /* Spacing */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;
  --space-xl: 20px;
  --space-2xl: 24px;
  --space-3xl: 32px;
  --space-4xl: 40px;

  /* Radius */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 10px;

  /* Typography */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'Cascadia Code', 'Fira Code', 'JetBrains Mono', monospace;

  --text-xs: 11px;
  --text-sm: 12px;
  --text-base: 13px;
  --text-md: 14px;
  --text-lg: 16px;
  --text-xl: 18px;
  --text-2xl: 20px;

  /* Transitions */
  --transition-fast: 0.1s ease;
  --transition-base: 0.15s ease;
  --transition-slow: 0.25s ease;

  /* Terminal — fixed console look in both themes */
  --term-bg: #0d1117;
  --term-border: #21262d;
  --term-text: #c9d1d9;
  --term-muted: #8b949e;
  --term-prompt: #7396ff;
  --term-success: #3ecf8e;
  --term-error: #f0647a;
}

/* --- Light Theme (default) --- */
[data-theme="light"], :root:not([data-theme]) {
  --bg-base: #f3f4f6;
  --bg-surface: #ffffff;
  --bg-elevated: #ffffff;
  --bg-card: #ffffff;
  --bg-hover: #f9fafb;
  --bg-input: #ffffff;
  --bg-solid: #ffffff;
  --bg-sunken: #e9eaee;

  --border-subtle: #eceef1;
  --border-default: #d8dbe0;
  --border-strong: #b6bbc4;

  --text-primary: #1f2329;
  --text-secondary: #5e6470;
  --text-muted: #8a909c;
  --text-inverse: #ffffff;

  --accent: #3056d3;
  --accent-dim: #4f70dd;
  --accent-bright: #2647b8;
  --accent-bg: #eef2fc;

  --cyan: #0e7490;
  --cyan-dim: #155e75;
  --cyan-bg: #e6f4f8;

  --emerald: #1a7f4e;
  --emerald-dim: #14693f;
  --emerald-bg: #e7f5ee;

  --amber: #b45309;
  --amber-dim: #92400e;
  --amber-bg: #fdf3e3;

  --rose: #c92a3c;
  --rose-dim: #a82231;
  --rose-bg: #fcebed;

  --shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.05);
  --shadow-md: 0 2px 6px rgba(16, 24, 40, 0.08);
  --shadow-lg: 0 8px 24px rgba(16, 24, 40, 0.12);
  --shadow-card: 0 1px 2px rgba(16, 24, 40, 0.05);

  --nav-hover-bg: #f3f4f6;
  --section-hover-bg: #f3f4f6;
  --count-bg: #e9eaee;
  --column-bg: #e9eaee;
  --stat-pill-bg: #ffffff;
  --xp-bar-bg: #e9eaee;
  --ticket-hover-bg: #f9fafb;
  --call-card-bg: #ffffff;
  --call-card-hover-bg: #f9fafb;
  --modal-overlay-bg: rgba(16, 24, 40, 0.4);
  --btn-bg: #ffffff;
  --btn-hover-bg: #f3f4f6;
  --scrollbar-thumb: #ccd0d6;
  --scrollbar-thumb-hover: #b6bbc4;
}

/* --- Dark Theme (neutral slate) --- */
[data-theme="dark"] {
  --bg-base: #16181d;
  --bg-surface: #1d2026;
  --bg-elevated: #23262e;
  --bg-card: #23262e;
  --bg-hover: #2a2e37;
  --bg-input: #191c21;
  --bg-solid: #1d2026;
  --bg-sunken: #121419;

  --border-subtle: #272b33;
  --border-default: #343943;
  --border-strong: #4a5160;

  --text-primary: #e6e8eb;
  --text-secondary: #9aa1ac;
  --text-muted: #6b7280;
  --text-inverse: #16181d;

  --accent: #7396ff;
  --accent-dim: #8fabff;
  --accent-bright: #5c82f0;
  --accent-bg: rgba(115, 150, 255, 0.12);

  --cyan: #4cc3e0;
  --cyan-dim: #76d2e8;
  --cyan-bg: rgba(76, 195, 224, 0.12);

  --emerald: #3ecf8e;
  --emerald-dim: #6adfa9;
  --emerald-bg: rgba(62, 207, 142, 0.12);

  --amber: #f5b04d;
  --amber-dim: #f8c376;
  --amber-bg: rgba(245, 176, 77, 0.12);

  --rose: #f0647a;
  --rose-dim: #f48a9b;
  --rose-bg: rgba(240, 100, 122, 0.12);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 2px 6px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.45);
  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.3);

  --nav-hover-bg: #23262e;
  --section-hover-bg: #20242b;
  --count-bg: #2a2e37;
  --column-bg: #121419;
  --stat-pill-bg: #1d2026;
  --xp-bar-bg: #2a2e37;
  --ticket-hover-bg: #2a2e37;
  --call-card-bg: #23262e;
  --call-card-hover-bg: #2a2e37;
  --modal-overlay-bg: rgba(0, 0, 0, 0.6);
  --btn-bg: #23262e;
  --btn-hover-bg: #2a2e37;
  --scrollbar-thumb: #343943;
  --scrollbar-thumb-hover: #4a5160;
}