/* VeloFlow AI Theme Variables */

:root {
  /* Brand Colors */
  --p: #533afd;
  --ph: #4434d4;
  --pl: #b9b9f9;
  --pp: rgba(83, 58, 253, 0.08);
  
  /* Accent Colors */
  --mag: #f96bee;
  --ruby: #ea2261;
  --g: #15be53;
  --gt: #108c3d;
  --gb: rgba(21, 190, 83, 0.1);
  --gbo: rgba(21, 190, 83, 0.3);

  /* Light Palette */
  --bg: #fafbff;
  --bc: #ffffff;
  --bs: #f4f3ff;
  --b2: #ede9fe;
  
  --t1: #0f0a2e;
  --t2: #4a4a6a;
  --tm: #9590ae;
  
  --border: rgba(83, 58, 253, 0.12);
  --border2: #e2e0f0;

  /* Shadows - Purple tint */
  --sh0: 0 1px 3px rgba(83, 58, 253, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
  --sh1: 0 4px 16px rgba(83, 58, 253, 0.1), 0 2px 8px rgba(0, 0, 0, 0.05);
  --sh2: 0 8px 32px rgba(83, 58, 253, 0.15), 0 4px 16px rgba(0, 0, 0, 0.06);
  --sh3: 0 20px 64px rgba(83, 58, 253, 0.22), 0 8px 24px rgba(139, 92, 246, 0.12);
  --shg: 0 0 40px rgba(83, 58, 253, 0.35), 0 0 80px rgba(83, 58, 253, 0.15);

  /* Section Backgrounds */
  --pain-bg: #0f0a2e;
  --res-bg: #0f0a2e;
  --foot-bg: #0f0a2e;
  
  --nav-bg: rgba(250, 249, 255, 0.92);
  --nav-border: rgba(83, 58, 253, 0.1);
  
  --inp-bg: #f8f7ff;
  --inp-border: rgba(83, 58, 253, 0.15);
  --inp-focus: rgba(83, 58, 253, 0.12);
  
  --modal-bg: #ffffff;
  --modal-overlay: rgba(15, 10, 46, 0.6);

  /* Typography */
  --fd: 'Space Grotesk', system-ui, sans-serif;
  --fb: 'Inter', system-ui, sans-serif;

  /* Spacing */
  --radius: 14px;
  --radius-lg: 20px;
  --radius-full: 100px;
}

/* Dark Mode */
[data-theme="dark"] {
  --p: #7c6bff;
  --ph: #9a8eff;
  --pl: #4a3fd9;
  --pp: rgba(124, 107, 255, 0.12);
  
  --bg: #020611;
  --bc: #0d0b1e;
  --bs: #110e24;
  --b2: #1a1630;
  
  --t1: #f0edff;
  --t2: #a09bc0;
  --tm: #5c5880;
  
  --border: rgba(124, 107, 255, 0.15);
  --border2: #1e1a35;
  
  --sh0: 0 1px 3px rgba(0, 0, 0, 0.3);
  --sh1: 0 4px 16px rgba(0, 0, 0, 0.4);
  --sh2: 0 8px 32px rgba(0, 0, 0, 0.5);
  --sh3: 0 20px 64px rgba(0, 0, 0, 0.6);
  --shg: 0 0 40px rgba(124, 107, 255, 0.4), 0 0 80px rgba(124, 107, 255, 0.2);
  
  --pain-bg: #080615;
  --res-bg: #080615;
  --foot-bg: #020611;
  
  --nav-bg: rgba(2, 6, 17, 0.92);
  --nav-border: rgba(124, 107, 255, 0.12);
  
  --inp-bg: #110e24;
  --inp-border: rgba(124, 107, 255, 0.2);
  --inp-focus: rgba(124, 107, 255, 0.15);
  
  --modal-bg: #110e24;
  --modal-overlay: rgba(0, 0, 0, 0.8);
  
  --g: #4ade80;
  --gt: #86efac;
  --gb: rgba(74, 222, 128, 0.15);
  --gbo: rgba(74, 222, 128, 0.35);
  
  --mag: #f0abfc;
}