/**
 * BuzzersFit Light Theme 2025
 *
 * Explicit light theme — mirrors :root defaults from design-system.css
 * Apply with: document.documentElement.setAttribute('data-theme', 'light')
 */

[data-theme="light"] {
    /* Colors */
    --color-text: var(--color-gray-900);
    --color-text-secondary: var(--color-gray-600);
    --color-text-muted: var(--color-gray-400);

    --color-background: #ffffff;
    --color-background-alt: var(--color-gray-50);
    --color-background-elevated: #ffffff;

    --color-border: var(--color-gray-200);
    --color-border-light: var(--color-gray-100);

    /* Inverse text */
    --color-text-inverse: #ffffff;

    /* Semantic alert text colors */
    --color-info-text: var(--color-info);
    --color-success-text: var(--color-success);
    --color-warning-text: var(--color-warning);
    --color-danger-text: var(--color-danger);
    --color-warning-badge: var(--color-warning);

    /* Alert backgrounds & borders */
    --color-info-bg: rgba(59, 130, 246, 0.15);
    --color-info-border: rgba(59, 130, 246, 0.3);
    --color-success-bg: rgba(16, 185, 129, 0.15);
    --color-success-border: rgba(16, 185, 129, 0.3);
    --color-warning-bg: rgba(245, 158, 11, 0.15);
    --color-warning-border: rgba(245, 158, 11, 0.3);
    --color-warning-highlight: rgba(245, 158, 11, 0.3);
    --color-danger-bg: rgba(239, 68, 68, 0.15);
    --color-danger-border: rgba(239, 68, 68, 0.3);

    /* Focus & interactive */
    --color-focus-ring: var(--color-primary-light);
    --color-primary-hover-bg: var(--color-primary-light);
    --color-striped-row: rgba(0, 0, 0, 0.03);
    --color-loading-overlay: rgba(255, 255, 255, 0.8);

    /* Glass */
    --color-glass-border: rgba(0, 0, 0, 0.08);

    /* Surfaces */
    --surface-base: #ffffff;
    --surface-elevated: rgba(255, 255, 255, 0.9);
    --surface-overlay: rgba(255, 255, 255, 0.95);
    --surface-glass: rgba(255, 255, 255, 0.7);
    --surface-backdrop: rgba(0, 0, 0, 0.5);

    /* Shadows */
    --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
}

/* ============================================
   LIGHT MODE — Component adjustments
   ============================================ */

/* (Light is the default, so most components need no overrides.
   Add any light-specific fixes here.) */
