/* AURANOM Design Tokens
   Source of Truth for all CSS custom properties used by the Brand Design Concept.
*/

:root {
  /* Core colors (dark theme default) */
  --bg: #0d0f14;
  --surface: #131720;
  --surface-1: #151a26;
  --surface-2: #181d2a;
  --surface-3: #1e2436;
  --border: rgba(255,255,255,0.12);
  --text: #e8eaf0;
  --muted: #8892a4;
  --faint: #4a5568;

  /* Brand + semantic */
  --brand-blue: #162272;
  --brand-teal: #17b5a3;
  --primary: #5268d0;
  --primary-hover: #6074db;
  --primary-text: #93afff;
  --success: #10b981;
  --warning: #f59e0b;
  --error: #ef4444;

  /* Standard complementary palette (Tool Library + Sales Kanban) */
  --accent-complement-orange: #ea580c;
  --accent-complement-blue: #2563eb;
  --accent-complement-purple: #7c3aed;
  --accent-complement-contracting: #16a34a;
  --accent-complement-won: #0d9488;
  --accent-complement-onhold: #d97706;
  --accent-complement-risk: #dc2626;
  --accent-complement-backlog: #475569;

  --accent-complement-orange-dim: rgba(234,88,12,0.12);
  --accent-complement-blue-dim: rgba(37,99,235,0.12);
  --accent-complement-purple-dim: rgba(124,58,237,0.12);
  --accent-complement-contracting-dim: rgba(22,163,74,0.12);
  --accent-complement-won-dim: rgba(13,148,136,0.12);
  --accent-complement-onhold-dim: rgba(217,119,6,0.12);
  --accent-complement-risk-dim: rgba(220,38,38,0.12);
  --accent-complement-backlog-dim: rgba(71,85,105,0.12);

  /* Backward-compatibility aliases */
  --accent-complement-green: var(--accent-complement-contracting);
  --accent-complement-green-dim: var(--accent-complement-contracting-dim);

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

  /* Spacing scale */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;

  /* Radius */
  --radius-xs: 2px;
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-1: 0 2px 8px rgba(0,0,0,0.2);
  --shadow-2: 0 8px 24px rgba(0,0,0,0.28);
  --shadow-3: 0 20px 60px rgba(0,0,0,0.5), 0 8px 24px rgba(0,0,0,0.3);

  /* Z-index scale */
  --z-base: 0;
  --z-sticky: 100;
  --z-dropdown: 200;
  --z-tooltip: 300;
  --z-modal: 400;
  --z-toast: 500;
  --z-spotlight: 600;

  /* Interaction states */
  --focus-ring-color: #93afff;
  --focus-ring-width: 2px;
  --focus-ring-offset: 2px;
  --disabled-opacity: 0.4;
  --disabled-cursor: not-allowed;
  --skeleton-bg: #1e2436;
  --skeleton-shine: #252d40;
  --selected-bg: rgba(82,104,208,0.18);
  --hover-bg: rgba(255,255,255,0.04);

  /* Motion */
  --transition-fast: 100ms;
  --transition-base: 200ms;
  --transition-slow: 350ms;
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-decelerate: cubic-bezier(0, 0, 0.2, 1);

  /* Gradients */
  --gradient-bg:
    radial-gradient(1200px 700px at 10% -10%, rgba(23,181,163,0.08), transparent 50%),
    radial-gradient(1000px 700px at 90% -20%, rgba(22,34,114,0.15), transparent 50%),
    var(--bg);
  --gradient-card-subtle: linear-gradient(180deg, rgba(255,255,255,0.025), transparent);
  --gradient-hero: linear-gradient(135deg, rgba(82,104,208,0.15) 0%, rgba(23,181,163,0.1) 100%);

  /* DataViz categorical */
  --dv-cat-1: #5268d0;
  --dv-cat-2: #17b5a3;
  --dv-cat-3: #f59e0b;
  --dv-cat-4: #a78bfa;
  --dv-cat-5: #fb7185;
  --dv-cat-6: #34d399;
  --dv-cat-7: #f97316;
  --dv-cat-8: #38bdf8;

  /* DataViz diverging */
  --dv-div-neg: #ef4444;
  --dv-div-neutral: #8892a4;
  --dv-div-pos: #10b981;

  /* Breakpoints */
  --bp-sm: 640px;
  --bp-md: 768px;
  --bp-lg: 1024px;
  --bp-xl: 1280px;
  --bp-2xl: 1536px;

  /* Semantic elevation */
  --elevation-0: none;
  --elevation-1: var(--shadow-1);
  --elevation-2: var(--shadow-2);
  --elevation-3: var(--shadow-3);
}

[data-theme="light"] {
  --bg: #f0f2f7;
  --surface: #ffffff;
  --surface-1: #fafbff;
  --surface-2: #f7f8fb;
  --surface-3: #eef0f5;
  --border: #d0d5e0;
  --text: #1a202c;
  --muted: #4a5568;
  --faint: #9aa3b2;
  --primary-text: #162272;
}