/**
 * MeJanix IT Solutions — Multi-Theme Variable System
 * Unified Typography: 'Plus Jakarta Sans' across all themes
 */

:root, [data-theme="light"] {
    --theme-mode: light;
    --font-primary: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --app-font-scale: 1;

    /* Corporate Daylight Palette */
    --color-primary: #0284C7;        /* Clean Corporate Cobalt */
    --color-primary-dark: #0369A1;
    --color-primary-light: #38BDF8;
    --color-accent: #E11D48;         /* High-Impact Crimson */
    --color-navy: #0A1128;
    --color-success: #10B981;
    --color-warning: #F59E0B;

    /* Surfaces & Backgrounds */
    --bg-base: #F8FAFC;
    --bg-canvas: #FFFFFF;
    --bg-surface: #FFFFFF;
    --bg-surface-subtle: #F1F5F9;
    --bg-glass: rgba(255, 255, 255, 0.92);

    /* Borders & Outlines */
    --border-color: #E2E8F0;
    --border-glass: rgba(226, 232, 240, 0.85);

    /* Typography */
    --text-primary: #0F172A;
    --text-secondary: #334155;
    --text-muted: #64748B;
    --text-light: #94A3B8;

    /* Shadows & Elevations */
    --shadow-sm: 0 2px 4px rgba(15, 23, 42, 0.04);
    --shadow-md: 0 8px 20px -3px rgba(15, 23, 42, 0.06);
    --shadow-lg: 0 16px 36px -4px rgba(15, 23, 42, 0.08);
    --shadow-glow: 0 10px 25px -4px rgba(2, 132, 199, 0.25);

    /* Gradients */
    --gradient-brand: linear-gradient(135deg, #0284C7 0%, #0369A1 100%);
    --gradient-accent: linear-gradient(135deg, #E11D48 0%, #BE123C 100%);
    --grid-line-color: rgba(2, 132, 199, 0.06);
}

[data-theme="dark"], body.theme-dark {
    --theme-mode: dark;

    /* Tactical Midnight Aerospace Dark (standbyss.site.je Standard) */
    --color-primary: #38BDF8;        /* Glowing Cyan */
    --color-primary-dark: #0284C7;
    --color-primary-light: #7DD3FC;
    --color-accent: #FB7185;
    --color-navy: #0F172A;
    --color-success: #34D399;
    --color-warning: #FBBF24;

    /* Surfaces & Backgrounds */
    --bg-base: #070B14;
    --bg-canvas: #0B1120;
    --bg-surface: #111928;
    --bg-surface-subtle: #162032;
    --bg-glass: rgba(17, 25, 40, 0.90);

    /* Borders & Outlines */
    --border-color: #1F2A3E;
    --border-glass: rgba(31, 42, 62, 0.85);

    /* Typography */
    --text-primary: #F8FAFC;
    --text-secondary: #CBD5E1;
    --text-muted: #8292A6;
    --text-light: #475569;

    /* Shadows & Glow */
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 10px 24px -2px rgba(0, 0, 0, 0.55);
    --shadow-lg: 0 20px 45px -4px rgba(0, 0, 0, 0.7);
    --shadow-glow: 0 10px 30px -4px rgba(56, 189, 248, 0.35);

    /* Gradients */
    --gradient-brand: linear-gradient(135deg, #0284C7 0%, #38BDF8 100%);
    --gradient-accent: linear-gradient(135deg, #FB7185 0%, #E11D48 100%);
    --grid-line-color: rgba(56, 189, 248, 0.08);
}

[data-theme="emerald"] {
    --theme-mode: emerald;

    /* Emerald Enterprise Theme */
    --color-primary: #059669;
    --color-primary-dark: #047857;
    --color-primary-light: #34D399;
    --color-accent: #0284C7;
    --color-navy: #064E3B;
    --color-success: #10B981;

    --bg-base: #F7FBF9;
    --bg-canvas: #FFFFFF;
    --bg-surface: #FFFFFF;
    --bg-surface-subtle: #EDF7F2;
    --bg-glass: rgba(255, 255, 255, 0.92);

    --border-color: #D1E7DD;
    --border-glass: rgba(209, 231, 221, 0.85);

    --text-primary: #064E3B;
    --text-secondary: #1F4E3D;
    --text-muted: #5C7D70;
    --text-light: #8BA89C;

    --shadow-sm: 0 2px 4px rgba(6, 78, 59, 0.04);
    --shadow-md: 0 8px 20px -3px rgba(6, 78, 59, 0.07);
    --shadow-lg: 0 16px 36px -4px rgba(6, 78, 59, 0.09);
    --shadow-glow: 0 10px 25px -4px rgba(5, 150, 105, 0.25);

    --gradient-brand: linear-gradient(135deg, #059669 0%, #047857 100%);
    --grid-line-color: rgba(5, 150, 105, 0.06);
}