/* ════════════════════════════════════════════════════════
   LIGHT THEME (default — set in variables.css :root)
   This file exists for explicit opt-in via class/attr.
   ════════════════════════════════════════════════════════ */
:root,
[data-theme="light"] {
    --color-bg-base:    #F7F8FA;
    --color-bg-surface: #FFFFFF;
    --color-bg-raised:  #FFFFFF;
    --color-bg-sunken:  #F0F1F3;
    --color-bg-overlay: rgba(0, 0, 0, 0.45);
    --color-bg-hover:   rgba(0, 0, 0, 0.03);

    --color-text-primary:   #111827;
    --color-text-secondary: #6B7280;
    --color-text-tertiary:  #9CA3AF;
    --color-text-disabled:  #D1D5DB;
    --color-text-inverse:   #FFFFFF;

    --color-border:       #E5E7EB;
    --color-border-light: #F3F4F6;
    --color-border-dark:  #D1D5DB;

    --glass-bg:     rgba(255, 255, 255, 0.72);
    --glass-border: rgba(255, 255, 255, 0.20);

    --shadow-xs:  0 1px 2px rgba(0,0,0,0.04);
    --shadow-sm:  0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
    --shadow-md:  0 4px 6px -1px rgba(0,0,0,0.07), 0 2px 4px -2px rgba(0,0,0,0.05);
    --shadow-lg:  0 10px 15px -3px rgba(0,0,0,0.08), 0 4px 6px -4px rgba(0,0,0,0.04);
    --shadow-xl:  0 20px 25px -5px rgba(0,0,0,0.08), 0 8px 10px -6px rgba(0,0,0,0.04);

    /* Glow shadows for light theme (subtle) */
    --glow-primary: 0 0 16px rgba(43, 143, 202, 0.10);
    --glow-success: 0 0 16px rgba(34, 197, 94, 0.10);
    --glow-error:   0 0 16px rgba(239, 68, 68, 0.10);
    --glow-warning: 0 0 16px rgba(245, 158, 11, 0.10);

    /* Elevation overrides for light */
    --elevation-1: 0 1px 3px rgba(0,0,0,0.06);
    --elevation-2: 0 4px 12px rgba(0,0,0,0.08);
    --elevation-3: 0 8px 24px rgba(0,0,0,0.10);
    --elevation-4: 0 16px 48px rgba(0,0,0,0.14);

    /* Legacy */
    --color-bg-primary:  var(--color-bg-base);
    --color-bg-secondary: var(--color-bg-sunken);
    --color-bg-tertiary: var(--color-bg-sunken);
    --color-bg-elevated: var(--color-bg-surface);
    --color-text-on-primary: #FFFFFF;
}