/* ============================================
   6E Virtual - Design Tokens v3.0
   IndiGo Navy + White + Grays
   ============================================ */

:root {
    /* Brand — IndiGo Navy */
    --color-primary: #2B2D6E;
    --color-primary-bright: #3A3D8F;
    --color-primary-dark: #1C1E4A;
    --color-primary-light: rgba(43, 45, 110, 0.08);

    /* Neutrals */
    --white: #FFFFFF;
    --gray-50: #F8F9FA;
    --gray-100: #F1F3F5;
    --gray-200: #E9ECEF;
    --gray-300: #DEE2E6;
    --gray-400: #ADB5BD;
    --gray-500: #868E96;
    --gray-600: #495057;
    --gray-700: #343A40;
    --gray-800: #212529;
    --gray-900: #0D0F12;

    /* Backgrounds */
    --bg-dark: #0A0B14;
    --bg-surface: #10111E;
    --bg-card: rgba(255, 255, 255, 0.03);

    /* Borders */
    --border-color: rgba(255, 255, 255, 0.07);

    /* Text */
    --text-primary: #FFFFFF;
    --text-secondary: rgba(255, 255, 255, 0.6);
    --text-muted: rgba(255, 255, 255, 0.35);

    /* Status */
    --color-success: #22C55E;
    --color-info: #3B82F6;
    --color-warning: #F59E0B;

    /* Typography — Bauhaus Medium (official IndiGo font) */
    --font-primary: 'Bauhaus Medium', 'Outfit', sans-serif;
    --font-body: 'Bauhaus Medium', 'Outfit', sans-serif;
    --font-mono: 'Space Mono', monospace;

    /* Spacing */
    --spacing-xs: 0.5rem;
    --spacing-sm: 1rem;
    --spacing-md: 1.5rem;
    --spacing-lg: 2rem;
    --spacing-xl: 3rem;
    --spacing-2xl: 5rem;
    --spacing-3xl: 7rem;

    /* Radius */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --radius-xl: 20px;
    --radius-full: 50px;

    /* Shadows */
    --shadow-sm: 0 1px 8px rgba(0, 0, 0, 0.15);
    --shadow-md: 0 8px 30px rgba(0, 0, 0, 0.2);
    --shadow-lg: 0 20px 50px rgba(0, 0, 0, 0.3);
    --shadow-primary: 0 4px 20px rgba(43, 45, 110, 0.3);

    /* Transitions */
    --transition-fast: 0.15s ease;
    --transition-base: 0.3s ease;
    --transition-slow: 0.5s cubic-bezier(0.22, 1, 0.36, 1);

    /* Layout */
    --max-width: 1200px;
    --max-width-sm: 1000px;
}