/* ============================================
   Nush.ai HR — Design Tokens / CSS Variables
   Dark theme default, light theme override
   ============================================ */

:root {
    /* ---- Background ---- */
    --bg-primary: #0B0A10;
    --bg-secondary: #12111A;
    --bg-tertiary: #1A1825;
    --bg-elevated: #221F30;
    --bg-input: #16141F;

    /* ---- Borders ---- */
    --border-subtle: #2A2739;
    --border-default: #36334A;
    --border-focus: #8B5CF6;

    /* ---- Text ---- */
    --text-primary: #F1F0F5;
    --text-secondary: #9B97B0;
    --text-tertiary: #6B6780;
    --text-inverse: #0B0A10;

    /* ---- Brand ---- */
    --brand-cyan: #06B6D4;
    --brand-purple: #8B5CF6;
    --brand-magenta: #D946EF;
    --brand-gradient: linear-gradient(135deg, #06B6D4, #8B5CF6, #D946EF);

    /* ---- Status ---- */
    --status-active: #10B981;
    --status-on-leave: #F59E0B;
    --status-terminated: #EF4444;
    --status-pending: #8B5CF6;
    --status-approved: #10B981;
    --status-denied: #EF4444;

    /* ---- Spacing ---- */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
    --space-2xl: 48px;

    /* ---- Typography ---- */
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.5rem;
    --text-3xl: 2rem;
    --line-height-tight: 1.25;
    --line-height-normal: 1.5;
    --line-height-relaxed: 1.75;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    /* ---- Border Radius ---- */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-full: 9999px;

    /* ---- Shadows ---- */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.5);
    --shadow-glow-purple: 0 0 20px rgba(139, 92, 246, 0.25);
    --shadow-glow-green: 0 0 20px rgba(16, 185, 129, 0.25);

    /* ---- Layout ---- */
    --sidebar-width: 260px;
    --header-height: 64px;

    /* ---- Transitions ---- */
    --transition-fast: 150ms ease;
    --transition-base: 250ms ease;
    --transition-slow: 400ms ease;
}

/* ============================================
   Light Theme Override
   ============================================ */

[data-theme="light"] {
    /* ---- Background ---- */
    --bg-primary: #FAFAFA;
    --bg-secondary: #FFFFFF;
    --bg-tertiary: #F3F2F7;
    --bg-elevated: #FFFFFF;
    --bg-input: #F3F2F7;

    /* ---- Borders ---- */
    --border-subtle: #E8E6F0;
    --border-default: #D4D1E0;
    --border-focus: #8B5CF6;

    /* ---- Text ---- */
    --text-primary: #1A1825;
    --text-secondary: #6B6780;
    --text-tertiary: #9B97B0;
    --text-inverse: #F1F0F5;

    /* ---- 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 8px 32px rgba(0, 0, 0, 0.1);
    --shadow-glow-purple: 0 0 20px rgba(139, 92, 246, 0.15);
    --shadow-glow-green: 0 0 20px rgba(16, 185, 129, 0.15);
}