/* Club colors decorate the interface; shared success, warning and error colors
   remain semantic. Action shades keep white labels readable in both modes. */
:root {
    --team-primary: #0071e3;
    --team-secondary: #d7eaff;
}

:root[data-team-theme="galatasaray"] {
    --team-primary: #a90432;
    --team-secondary: #fdb912;
    --app-brand-highlight: inset 0 -3px 0 var(--team-secondary);
    --app-accent: #a4062d;
    --app-action: #a4062d;
    --app-action-hover: #820523;
    --app-accent-soft: #fff0df;
    --app-surface-secondary: #fff7ed;
    --app-canvas: #faf6f2;
    --app-focus-ring: rgb(164 6 45 / 25%);
}

:root[data-team-theme="bayern"] {
    --team-primary: #dc052d;
    --team-secondary: #0066b2;
    --app-brand-highlight: inset 0 -3px 0 var(--team-secondary);
    --app-accent: #005fa8;
    --app-action: #ac0829;
    --app-action-hover: #900621;
    --app-accent-soft: #fff0f3;
    --app-surface-secondary: #fff3f5;
    --app-canvas: #faf5f6;
    --app-focus-ring: rgb(0 95 168 / 25%);
}

:root[data-team-theme="barcelona"] {
    --team-primary: #8d1846;
    --team-secondary: #1656a5;
    --app-brand-highlight: inset 0 -3px 0 var(--team-secondary);
    --app-accent: #14549c;
    --app-action: #97103f;
    --app-action-hover: #780d32;
    --app-accent-soft: #fdf0f5;
    --app-surface-secondary: #f4f0f8;
    --app-canvas: #f8f5fa;
    --app-focus-ring: rgb(20 84 156 / 25%);
}

@media (prefers-color-scheme: dark) {
    :root[data-team-theme="galatasaray"] {
        --app-accent: #ffae92;
        --app-accent-soft: #3d2420;
        --app-surface-secondary: #292123;
        --app-canvas: #151112;
        --app-focus-ring: rgb(255 174 146 / 32%);
    }

    :root[data-team-theme="bayern"] {
        --app-accent: #80bcff;
        --app-accent-soft: #3e2029;
        --app-surface-secondary: #2b2226;
        --app-canvas: #151113;
        --app-focus-ring: rgb(128 188 255 / 32%);
    }

    :root[data-team-theme="barcelona"] {
        --app-accent: #8cbdff;
        --app-accent-soft: #382331;
        --app-surface-secondary: #28232f;
        --app-canvas: #15121a;
        --app-focus-ring: rgb(140 189 255 / 32%);
    }
}