/**
 * Sudoku Training - Themes
 * Jahreszeiten-Themes + Hoher Kontrast
 * ALLE farbenblind-sicher (kein Rot/Grün!)
 */

/* === WINTER THEME (Default) === */
[data-theme="winter"] {
    --color-primary: #1e3a8a;        /* Dunkelblau */
    --color-primary-light: #3b82f6;  /* Blau */
    --color-secondary: #fbbf24;       /* Gold */
    --color-warning: #f97316;         /* Orange */
    --color-success: #3b82f6;         /* Blau */
    --color-bg: #ffffff;
    --color-bg-secondary: #f0f9ff;    /* Hellblau-Nuance */
    --color-bg-tertiary: #dbeafe;
}

[data-theme="winter"] .welcome-card {
    background: linear-gradient(135deg, #1e3a8a, #3b82f6, #60a5fa);
}

[data-theme="winter"] .app-header {
    background: linear-gradient(135deg, #1e3a8a, #2563eb);
}

/* === FRÜHLING THEME === */
[data-theme="fruehling"] {
    --color-primary: #7c3aed;        /* Violett */
    --color-primary-light: #a78bfa;  /* Hellviolett */
    --color-secondary: #fbbf24;       /* Gold */
    --color-warning: #f97316;         /* Orange */
    --color-success: #8b5cf6;         /* Violett */
    --color-bg: #ffffff;
    --color-bg-secondary: #faf5ff;    /* Sehr helles Violett */
    --color-bg-tertiary: #ede9fe;
}

[data-theme="fruehling"] .welcome-card {
    background: linear-gradient(135deg, #7c3aed, #a78bfa, #c4b5fd);
}

[data-theme="fruehling"] .app-header {
    background: linear-gradient(135deg, #7c3aed, #8b5cf6);
}

/* === SOMMER THEME === */
[data-theme="sommer"] {
    --color-primary: #0891b2;        /* Türkis */
    --color-primary-light: #06b6d4;  /* Cyan */
    --color-secondary: #fbbf24;       /* Gold */
    --color-warning: #f97316;         /* Orange */
    --color-success: #06b6d4;         /* Cyan */
    --color-bg: #ffffff;
    --color-bg-secondary: #ecfeff;    /* Sehr helles Cyan */
    --color-bg-tertiary: #cffafe;
}

[data-theme="sommer"] .welcome-card {
    background: linear-gradient(135deg, #0891b2, #06b6d4, #67e8f9);
}

[data-theme="sommer"] .app-header {
    background: linear-gradient(135deg, #0891b2, #0e7490);
}

/* === HERBST THEME === */
[data-theme="herbst"] {
    --color-primary: #b45309;        /* Braun-Orange */
    --color-primary-light: #f59e0b;  /* Bernstein */
    --color-secondary: #fbbf24;       /* Gold */
    --color-warning: #f97316;         /* Orange */
    --color-success: #f59e0b;         /* Bernstein */
    --color-bg: #ffffff;
    --color-bg-secondary: #fffbeb;    /* Sehr helles Gelb */
    --color-bg-tertiary: #fef3c7;
}

[data-theme="herbst"] .welcome-card {
    background: linear-gradient(135deg, #b45309, #f59e0b, #fbbf24);
}

[data-theme="herbst"] .app-header {
    background: linear-gradient(135deg, #b45309, #d97706);
}

/* === HOHER KONTRAST THEME === */
[data-theme="hoher-kontrast"] {
    --color-primary: #000000;         /* Schwarz */
    --color-primary-light: #1f2937;   /* Dunkelgrau */
    --color-secondary: #fbbf24;       /* Gold (gut sichtbar) */
    --color-warning: #f97316;         /* Orange */
    --color-success: #3b82f6;         /* Blau */
    --color-bg: #ffffff;
    --color-bg-secondary: #f3f4f6;
    --color-bg-tertiary: #e5e7eb;
    --color-text: #000000;
    --color-border: #000000;
    --color-border-thick: #000000;
}

[data-theme="hoher-kontrast"] .welcome-card {
    background: linear-gradient(135deg, #000000, #1f2937);
    border: 3px solid #000000;
}

[data-theme="hoher-kontrast"] .app-header {
    background: #000000;
    border-bottom: 3px solid #000000;
}

[data-theme="hoher-kontrast"] .btn-primary {
    background: #000000;
    border: 3px solid #000000;
}

[data-theme="hoher-kontrast"] .btn-secondary {
    background: #ffffff;
    border: 3px solid #000000;
    color: #000000;
}

[data-theme="hoher-kontrast"] .sudoku-cell {
    border: 2px solid #000000;
}

[data-theme="hoher-kontrast"] .sudoku-grid {
    border: 4px solid #000000;
}

[data-theme="hoher-kontrast"] .stat-card,
[data-theme="hoher-kontrast"] .user-select-btn,
[data-theme="hoher-kontrast"] .size-btn,
[data-theme="hoher-kontrast"] .help-btn,
[data-theme="hoher-kontrast"] .number-btn {
    border: 3px solid #000000;
}

[data-theme="hoher-kontrast"] .instructions-box {
    border: 3px solid #000000;
}

/* Fokus noch stärker */
[data-theme="hoher-kontrast"] *:focus {
    outline: 4px solid #fbbf24;
    outline-offset: 3px;
}

/* === THEME TRANSITION === */
* {
    transition: background-color 0.3s ease,
                color 0.3s ease,
                border-color 0.3s ease;
}

/* Keine Transition für Layout-Properties */
*:not(.sudoku-cell):not(.btn):not(.help-btn) {
    transition-property: background-color, color, border-color;
}