/* src/assets/css/variables.css */
:root {
    /* Color Palette - Premium Cyber Dark Mode */
    --color-bg-primary: #030303;      /* Deep obsidian black */
    --color-bg-secondary: #08080c;    /* Rich, deep navy-tinted black */
    --color-bg-tertiary: #12121e;     /* Glassmorphism card foundation */
    
    --color-text-primary: #ffffff;
    --color-text-secondary: #94a3b8;   /* Cool slate grey for high-readability */
    --color-text-muted: #64748b;       /* Muted text for labels */
    
    /* Accent gradients (Option A: Blue-Violet) */
    --color-accent: #2563eb;          /* Electric Blue (matches logo) */
    --color-accent-hover: #1d4ed8;    /* Deep Blue hover */
    --color-accent-purple: #7c3aed;   /* Royal Purple for dynamic energy */
    
    /* Gradients */
    --gradient-primary: linear-gradient(135deg, var(--color-accent) 0%, var(--color-accent-purple) 100%);
    --gradient-glow: radial-gradient(circle, rgba(37, 99, 235, 0.15) 0%, rgba(124, 58, 237, 0.05) 50%, transparent 100%);
    --gradient-text: linear-gradient(135deg, #ffffff 30%, #94a3b8 100%);
    --gradient-accent-text: linear-gradient(135deg, #60a5fa 0%, #a78bfa 100%);
    
    /* Borders & Glassmorphic variables */
    --color-border: rgba(255, 255, 255, 0.07);
    --color-border-glow: rgba(37, 99, 235, 0.3);
    --glass-bg: rgba(18, 18, 30, 0.65);
    --glass-border: rgba(255, 255, 255, 0.08);
    --glass-glow: rgba(124, 58, 237, 0.15);

    /* Typography */
    --font-primary: 'Inter', sans-serif;
    
    /* Spacing */
    --space-xs: 0.5rem;
    --space-sm: 1rem;
    --space-md: 2rem;
    --space-lg: 4rem;
    --space-xl: 6rem;
    
    /* Border Radius */
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-full: 9999px;

    /* Shadows & Glows */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.5);
    --shadow-md: 0 8px 30px rgba(0, 0, 0, 0.7);
    --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.8);
    --glow-blue: 0 0 20px rgba(37, 99, 235, 0.25);
    --glow-purple: 0 0 20px rgba(124, 58, 237, 0.25);
    --glow-accent: 0 0 30px rgba(37, 99, 235, 0.4);

    /* Transitions - Senior standard fluid transitions */
    --transition-fast: 0.2s cubic-bezier(0.25, 0.8, 0.25, 1);
    --transition-normal: 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    --transition-slow: 0.8s cubic-bezier(0.25, 0.8, 0.25, 1);
}