/* Semantic theme tokens — dark is default; light overrides via data-theme on html */

html {
    color-scheme: light dark;
}

html[data-theme="dark"] {
    color-scheme: dark;
}

html[data-theme="light"] {
    color-scheme: light;
}

:root,
html[data-theme="dark"] {
    --bg-canvas: #0a0a0a;
    --bg-surface: #1a1a1a;
    --bg-surface-elevated: #222222;
    --bg-surface-medium: #333333;
    --bg-gradient-mid: #1c1c1c;
    --text-primary: #ffffff;
    --text-secondary: rgba(255, 255, 255, 0.88);
    --text-muted: rgba(255, 255, 255, 0.78);
    --border-subtle: rgba(255, 255, 255, 0.15);
    --nav-text: #ffffff;
    --nav-overlay: #000000;
    --nav-surface: rgba(0, 0, 0, 0.85);
    --input-bg: #ffffff;
    --input-text: #000000;
    --shadow-color: rgba(0, 0, 0, 0.4);
    --skeleton-base: #2a2a2a;
    --skeleton-highlight: #3a3a3a;
    --card-contrast-bg: #ffffff;
    --card-contrast-text: #333333;
    --error-text: #ffb4b4;
    --error-bg: rgba(220, 53, 69, 0.18);
    --error-border: #dc3545;
    --error-solid-bg: #dc3545;
    --error-solid-text: #ffffff;
    --warning-text: #ffe0b2;
    --warning-bg: rgba(255, 140, 0, 0.15);
    --warning-border: #ff8c00;
    --success-text: #b9f6ca;
    --success-bg: rgba(46, 125, 50, 0.2);
    --success-border: #66bb6a;

    /* Legacy aliases used across the app */
    --background-canvas: var(--bg-canvas);
    --background-dark: var(--bg-surface-elevated);
    --background-medium: var(--bg-surface-medium);
}

html[data-theme="light"] {
    --bg-canvas: #ffffff;
    --bg-surface: #f5f5f5;
    --bg-surface-elevated: #eeeeee;
    --bg-surface-medium: #e0e0e0;
    --bg-gradient-mid: #f0f0f0;
    --text-primary: #000000;
    --text-secondary: #333333;
    --text-muted: #666666;
    --border-subtle: rgba(0, 0, 0, 0.12);
    --nav-text: #000000;
    --nav-overlay: #ffffff;
    --nav-surface: rgba(255, 255, 255, 0.92);
    --input-bg: #ffffff;
    --input-text: #000000;
    --shadow-color: rgba(0, 0, 0, 0.12);
    --skeleton-base: #e8e8e8;
    --skeleton-highlight: #f5f5f5;
    --card-contrast-bg: var(--bg-surface);
    --card-contrast-text: var(--text-primary);
    --error-text: #b91c1c;
    --error-bg: #fef2f2;
    --error-border: #dc3545;
    --error-solid-bg: #dc3545;
    --error-solid-text: #ffffff;
    --warning-text: #92400e;
    --warning-bg: #fffbeb;
    --warning-border: #d97706;
    --success-text: #166534;
    --success-bg: #f0fdf4;
    --success-border: #16a34a;

    --background-canvas: var(--bg-canvas);
    --background-dark: var(--bg-surface-elevated);
    --background-medium: var(--bg-surface-medium);
}