/* Velocity Enterprise — Bezohminds design tokens */

:root {
    /* Brand primitives */
    --color-navy: #1B2A5E;
    --color-navy-dark: #141F45;
    --color-navy-light: #2A3F7A;
    --color-maroon: #8E2344;
    --color-maroon-dark: #6E1B35;
    --color-maroon-light: #A82D54;

    /* Semantic — brand */
    --brand-primary: var(--color-navy);
    --brand-primary-hover: var(--color-navy-dark);
    --brand-primary-subtle: #E8ECF4;
    --brand-accent: var(--color-maroon);
    --brand-accent-hover: var(--color-maroon-dark);
    --brand-accent-subtle: #F5E8ED;

    /* Semantic — surfaces */
    --surface-background: #F4F6F9;
    --surface-elevated: #FFFFFF;
    --surface-sidebar: #141414;
    --surface-sidebar-hover: rgba(255, 255, 255, 0.06);
    --surface-sidebar-active: rgba(255, 255, 255, 0.08);
    --surface-sidebar-subactive: rgba(255, 255, 255, 0.05);
    --surface-hover: #F0F2F5;
    --surface-input: #F3F4F6;
    --surface-login-gradient-start: var(--color-navy-dark);
    --surface-login-gradient-mid: var(--color-navy);
    --surface-login-gradient-end: #0D1528;

    /* Semantic — text */
    --text-primary: #1A2332;
    --text-secondary: #5D6B7E;
    --text-muted: #637082;
    --text-on-brand: #FFFFFF;
    --text-on-sidebar: #D1D5DB;
    --text-on-sidebar-muted: #9CA3AF;

    /* Semantic — borders */
    --border-default: #E8ECF1;
    --border-subtle: #F3F4F6;
    --border-sidebar: #262626;

    /* Status */
    --status-success: #22C55E;
    --status-warning: #F59E0B;
    --status-danger: #EF4444;
    --status-info: #3B82F6;
    --status-planned: #3B82F6;
    --status-forecast: #A855F7;
    --status-invoiced: #F97316;
    --status-paid: #22C55E;
    --status-at-risk: var(--brand-accent);

    /* 8px spacing grid */
    --space-1: 8px;
    --space-2: 16px;
    --space-3: 24px;
    --space-4: 32px;
    --space-5: 40px;
    --space-6: 48px;
    --space-7: 56px;
    --space-8: 64px;

    /* Typography */
    --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'Monaco', 'Courier New', monospace;
    --font-display: 2.25rem;
    --font-headline: 1.5rem;
    --font-title: 1.25rem;
    --font-body: 1rem;
    --font-label: 0.875rem;
    --font-caption: 0.75rem;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    /* Component sizes */
    --control-height: 40px;
    --control-height-lg: 48px;
    --icon-size: 20px;
    --icon-size-lg: 24px;
    --touch-target-min: 44px;

    /* Layout */
    --grid-columns: 12;
    --grid-gutter: 24px;
    --sidebar-width: 240px;
    --sidebar-rail: 64px;
    --filter-panel-width: 260px;
    --radius-sm: 6px;
    --radius-md: 8px;
    --radius-lg: 10px;
    --radius-xl: 12px;
    --radius-pill: 999px;

    /* Shadows */
    --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.05);
    --shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 2px rgba(15, 23, 42, 0.04);
    --shadow-md: 0 4px 6px -1px rgba(15, 23, 42, 0.08);
    --shadow-focus: 0 0 0 3px rgba(27, 42, 94, 0.15);

    /* Transitions */
    --transition-fast: 150ms ease-in-out;
    --transition-base: 250ms ease-in-out;

    /* Z-index */
    --z-modal: 1000;
    --z-dropdown: 500;
    --z-sticky: 100;

    /* Breakpoints (reference — use in @media) */
    --bp-mobile: 480px;
    --bp-tablet: 768px;
    --bp-desktop: 1024px;
    --bp-wide: 1440px;
}

/* System dark theme — semantic token overrides */
@media (prefers-color-scheme: dark) {
    :root {
        color-scheme: dark;

        --brand-primary-subtle: rgba(42, 63, 122, 0.35);
        --brand-accent-subtle: rgba(142, 35, 68, 0.28);

        --surface-background: #0f1419;
        --surface-elevated: #1a2332;
        --surface-hover: rgba(255, 255, 255, 0.06);
        --surface-input: #243044;
        --surface-sidebar: #0d0d0d;
        --surface-sidebar-hover: rgba(255, 255, 255, 0.08);
        --surface-sidebar-active: rgba(255, 255, 255, 0.12);
        --surface-sidebar-subactive: rgba(255, 255, 255, 0.06);
        --surface-login-gradient-start: #060a14;
        --surface-login-gradient-mid: #0f1830;
        --surface-login-gradient-end: #030508;

        --text-primary: #f1f5f9;
        --text-secondary: #94a3b8;
        --text-muted: #8896A8;
        --text-on-brand: #ffffff;
        --text-on-sidebar: #e2e8f0;
        --text-on-sidebar-muted: #94a3b8;

        --border-default: #2d3a4f;
        --border-subtle: #243044;
        --border-sidebar: #1f1f1f;

        --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.35);
        --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4), 0 1px 2px rgba(0, 0, 0, 0.25);
        --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.45);
        --shadow-focus: 0 0 0 3px rgba(99, 130, 200, 0.4);
    }
}