/* ============================================================
   VEGA Brand Design Tokens
   Brand: Haitham Ramzy | Accent: #CEFD82 | Font: Cairo
   Modes: dark (default) + light
   ============================================================ */

:root,
[data-theme="dark"] {
  /* Brand */
  --brand-accent: #CEFD82;
  --brand-accent-2: #A8E665;
  --brand-accent-deep: #B8E566;
  --brand-on-accent: #0F0F11;

  /* Backgrounds */
  --bg-primary: #0F0F11;
  --bg-card: #1A1A1F;
  --bg-card-2: #25252C;
  --bg-card-3: #2F2F38;
  --bg-overlay: rgba(15, 15, 17, 0.85);
  --bg-glass: rgba(26, 26, 31, 0.7);

  /* Borders */
  --border: #2A2A33;
  --border-hover: #3A3A45;
  --border-active: #CEFD82;

  /* Text */
  --text-primary: #FFFFFF;
  --text-secondary: #D1D1D8;
  --text-muted: #8A8A93;
  --text-faint: #5A5A63;
  --text-inverse: #0F0F11;

  /* Accent states */
  --accent: #CEFD82;
  --accent-dim: rgba(206, 253, 130, 0.12);
  --accent-2: rgba(206, 253, 130, 0.25);
  --accent-glow: 0 0 24px rgba(206, 253, 130, 0.3);

  /* Status */
  --success: #4ADE80;
  --success-dim: rgba(74, 222, 128, 0.15);
  --warning: #FBBF24;
  --warning-dim: rgba(251, 191, 36, 0.15);
  --danger: #F87171;
  --danger-dim: rgba(248, 113, 113, 0.15);
  --info: #60A5FA;
  --info-dim: rgba(96, 165, 250, 0.15);
  --purple: #6D4AFF;
  --purple-dim: rgba(109, 74, 255, 0.15);
  --pink: #EC4899;
  --pink-dim: rgba(236, 72, 153, 0.15);

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.5);
  --shadow-accent: 0 4px 16px rgba(206, 253, 130, 0.3);

  /* Typography */
  --font-arabic: 'Cairo', 'Tajawal', system-ui, sans-serif;
  --font-latin: 'Inter', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;
  --font-base: var(--font-arabic), var(--font-latin);

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

  /* Radii */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 20px;
  --radius-pill: 999px;

  /* Layout */
  --sidebar-width: 248px;
  --sidebar-collapsed: 64px;
  --topbar-height: 60px;
  --content-max: 1600px;

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast: 150ms;
  --duration-base: 250ms;
  --duration-slow: 400ms;

  /* Z-index */
  --z-base: 1;
  --z-sticky: 50;
  --z-drawer: 80;
  --z-modal: 100;
  --z-toast: 150;
  --z-tooltip: 200;

  color-scheme: dark;
}

[data-theme="light"] {
  /* Brand */
  --brand-accent: #65A30D;
  --brand-accent-2: #84CC16;
  --brand-accent-deep: #4D7C0F;
  --brand-on-accent: #FFFFFF;

  /* Backgrounds */
  --bg-primary: #F8F9FB;
  --bg-card: #FFFFFF;
  --bg-card-2: #F1F3F7;
  --bg-card-3: #E8EBF0;
  --bg-overlay: rgba(15, 15, 17, 0.4);
  --bg-glass: rgba(255, 255, 255, 0.8);

  /* Borders */
  --border: #E5E8ED;
  --border-hover: #C9CED6;
  --border-active: #65A30D;

  /* Text */
  --text-primary: #0F0F11;
  --text-secondary: #2A2A33;
  --text-muted: #5A5A63;
  --text-faint: #8A8A93;
  --text-inverse: #FFFFFF;

  /* Accent states */
  --accent: #65A30D;
  --accent-dim: rgba(101, 163, 13, 0.1);
  --accent-2: rgba(101, 163, 13, 0.2);
  --accent-glow: 0 0 24px rgba(101, 163, 13, 0.2);

  /* Status (slightly darker for light bg) */
  --success: #16A34A;
  --success-dim: rgba(22, 163, 74, 0.12);
  --warning: #D97706;
  --warning-dim: rgba(217, 119, 6, 0.12);
  --danger: #DC2626;
  --danger-dim: rgba(220, 38, 38, 0.12);
  --info: #2563EB;
  --info-dim: rgba(37, 99, 235, 0.12);
  --purple: #7C3AED;
  --purple-dim: rgba(124, 58, 237, 0.12);
  --pink: #DB2777;
  --pink-dim: rgba(219, 39, 119, 0.12);

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.12);
  --shadow-accent: 0 4px 16px rgba(101, 163, 13, 0.2);

  color-scheme: light;
}

/* RTL adjustments */
[dir="rtl"] {
  --font-base: var(--font-arabic);
}
[dir="ltr"] {
  --font-base: var(--font-latin);
}

/* SCENARIO 5: re-test modify */

/* ============================================================
   M2 ADDITIONS — VEGA v3.0 design system
   Added 2026-06-17. Do NOT remove or rename — M3-M6 depend on these.
   ============================================================ */

:root,
[data-theme="dark"] {
  /* Category accent palette (matches M1.6 CATEGORY_ACCENT) */
  --accent-ops: #CEFD82;
  --accent-sales: #60A5FA;
  --accent-content: #A78BFA;
  --accent-finance: #FB923C;
  --accent-comms: #EC4899;
  --accent-hr: #2DD4BF;
  --accent-legal: #818CF8;
  --accent-personal: #FBBF24;
  --accent-creative: #F472B6;

  /* Status (refined for v3.0) */
  --status-active: #4ADE80;
  --status-idle: #8A8A93;
  --status-error: #F87171;
  --status-thinking: #A78BFA;
  --status-streaming: #60A5FA;

  /* Avatar sizes */
  --avatar-xs: 24px;
  --avatar-sm: 32px;
  --avatar-md: 48px;
  --avatar-lg: 64px;
  --avatar-xl: 96px;
  --avatar-2xl: 128px;

  /* Hero dimensions */
  --hero-height-sm: 180px;
  --hero-height-md: 240px;
  --hero-height-lg: 320px;

  /* Spacing additions */
  --space-20: 80px;
  --space-24: 96px;

  /* Z-index additions (consolidated; existing tokens had z-drawer/modal/toast/tooltip) */
  --z-toast: 150;
  --z-tooltip: 200;

  /* Glassmorphism */
  --glass-bg: rgba(26, 26, 31, 0.7);
  --glass-bg-light: rgba(255, 255, 255, 0.85);
  --glass-border: rgba(206, 253, 130, 0.15);
  --glass-border-light: rgba(15, 15, 17, 0.08);
  --glass-blur: blur(20px) saturate(180%);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  --glass-shadow-light: 0 8px 32px rgba(0, 0, 0, 0.08);

  /* Glow variants (per category) */
  --glow-ops: 0 0 24px rgba(206, 253, 130, 0.3);
  --glow-sales: 0 0 24px rgba(96, 165, 250, 0.3);
  --glow-content: 0 0 24px rgba(167, 139, 250, 0.3);
  --glow-finance: 0 0 24px rgba(251, 146, 60, 0.3);
  --glow-comms: 0 0 24px rgba(236, 72, 153, 0.3);
  --glow-hr: 0 0 24px rgba(45, 212, 191, 0.3);
  --glow-legal: 0 0 24px rgba(129, 140, 248, 0.3);
  --glow-personal: 0 0 24px rgba(251, 191, 36, 0.3);
  --glow-creative: 0 0 24px rgba(244, 114, 182, 0.3);

  /* Motion timings */
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --duration-quick: 100ms;
  --duration-slow: 600ms;
  --duration-slower: 1000ms;

  /* Component sizes */
  --drawer-width: 420px;
  --modal-max-width: 640px;
  --chat-bubble-max-width: 320px;

  /* Border radius additions */
  --radius-card-lg: 16px;
  --radius-card-xl: 20px;
  --radius-pill: 9999px;  /* re-affirm (some legacy code uses 999) */
}

[data-theme="light"] {
  /* Light-mode category accents (slightly darker for AA contrast on light bg) */
  --accent-ops: #65A30D;
  --accent-sales: #2563EB;
  --accent-content: #7C3AED;
  --accent-finance: #EA580C;
  --accent-comms: #DB2777;
  --accent-hr: #0D9488;
  --accent-legal: #4F46E5;
  --accent-personal: #D97706;
  --accent-creative: #DB2777;

  --status-active: #16A34A;
  --status-idle: #5A5A63;
  --status-error: #DC2626;
  --status-thinking: #7C3AED;
  --status-streaming: #2563EB;
}