[data-theme="light"], :root {
    --bg-primary: var(--color-white);
    --bg-secondary: var(--color-gray-50);
    --bg-tertiary: var(--color-gray-100);
    --bg-elevated: var(--color-white);

    --text-primary: var(--color-gray-900);
    --text-secondary: var(--color-gray-500);
    --text-tertiary: var(--color-gray-500); /* Was gray-400 (#9CA3AF, 2.43:1) — gray-500 (#6B7280) = 4.63:1 on #F9FAFB ✓ WCAG AA */
    --text-inverse: var(--color-white);

    --accent: var(--color-accent-600);
    --accent-hover: var(--color-accent-700);
    --accent-light: var(--color-accent-100);
    --accent-bg: var(--color-accent-50);
    --accent-text: var(--color-accent-700);
    --accent-text-on-white: var(--color-accent-600); /* #7C3AED = 5.70:1 on white ✓ — use instead of accent-500 (#8B5CF6 = 4.23:1 ✗) for text */

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

    --shadow-accent: 0 4px 20px rgba(124, 58, 237, 0.2);

    --success: var(--color-success-600);
    --success-bg: #ECFDF5;
    --warning: var(--color-warning-600);
    --warning-bg: #FFFBEB;
    --error: var(--color-error-600);
    --error-bg: #FEF2F2;
    --info: var(--color-info-600);
    --info-bg: #EFF6FF;
}
