/* ==================== Tokens ====================
   Ce fichier est la SEULE source des couleurs : les autres feuilles ne contiennent aucune couleur en dur
   (hors palette de l'analyse adversaire). Pour un autre thème, remplacer ce fichier.
   Nommage : --md-*  = rôles Material (surfaces, textes, états) ;
             --status-{success,warning,danger,info,neutral}-{bg,fg,border} = états des badges, alertes, cellules ;
             --inv-* = "surfaces inversees" (en-tête, pied, cartes de formulaire, hero) :
                       claires en thème clair, sombres en thème sombre ;
             --team / --team-ink = couleur d'équipe (aplat avec texte blanc / texte et traits sur surface).
   Contrastes vérifiés (WCAG AA) : texte >= 4.5:1, traits et pictos >= 3:1, dans les deux thèmes. */
/* Police de l'application, servie par l'application (la même que la présentation) : le rendu ne dépend
   plus des polices installées sur l'appareil. */
@font-face {
    font-family: "Archivo";
    font-style: normal;
    font-weight: 400 900;
    font-stretch: 62% 125%;
    font-display: swap;
    src: url(/fonts/archivo-latin-de2f1fe81758075f50ed6ce1e8e238ed.woff2) format("woff2");
}

/* Échelles communes : toute nouvelle règle en tire ses valeurs.
   Tailles de texte : 4 tailles, pas une de plus.
     --fs-sm  texte secondaire et étiquettes (méta, aides, en-têtes de tableau, badges) ;
     --fs-md  texte courant ; --fs-lg titres de panneau (h2) ; --fs-xl titres de page et chiffres clés.
   Graisses : 400 texte, 600 libellés et mise en valeur, 700 titres forts, chiffres et étiquettes.
   Capitales réservées au nom de famille des joueurs et au surtitre (.eyebrow) ; pas d'italique :
   le texte secondaire se distingue par sa couleur (--md-on-surface-variant).
   Espacements : multiples de 4 px (--sp-1 = 4 px … --sp-8 = 32 px) ; 1 à 3 px réservés aux traits.
   Points de rupture (une variable ne peut pas servir dans @media) : 600 px (téléphone),
   860 px (tablette, menu replié), 1000 px (petit portable), 1100 px (barre de menu compacte),
   1460 px (barre de menu complète, avec icônes). */
:root {
    font-family: "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

    --fs-sm: 0.875rem;
    --fs-md: 1rem;
    --fs-lg: 1.25rem;
    --fs-xl: 2rem;

    --sp-1: 4px;
    --sp-2: 8px;
    --sp-3: 12px;
    --sp-4: 16px;
    --sp-5: 20px;
    --sp-6: 24px;
    --sp-7: 28px;
    --sp-8: 32px;

    color-scheme: light dark;   /* suit le système ; [data-theme] force un thème (voir le bouton du menu) */

    --md-primary: light-dark(#1B6E93, #5BB8DC);
    --md-primary-hover: light-dark(#15586F, #7CC8E5);
    --md-on-primary: light-dark(#FFFFFF, #06222E);
    --md-primary-container: light-dark(#D6ECF5, #16384A);
    --md-on-primary-container: light-dark(#063242, #CDEBF7);

    --md-surface: light-dark(#FFFFFF, #171D25);
    --md-surface-dim: light-dark(#F3F5F7, #0E1217);
    --md-surface-container: light-dark(#F5F7FA, #1E2630);
    --md-surface-container-high: light-dark(#EBEFF3, #28323E);
    --md-on-surface: light-dark(#1B2126, #E6EAED);
    --md-on-surface-variant: light-dark(#4C5A65, #A4B0BA);

    --md-outline: light-dark(#7F8D98, #6B7785);
    --md-outline-variant: light-dark(#DEE4E8, #263039);

    --md-error: light-dark(#B3261E, #F2B8B5);
    --md-error-hover: light-dark(#932019, #F7CFCD);
    --md-on-error: light-dark(#FFFFFF, #410E0B);
    --md-error-container: light-dark(#F9DEDC, #4A1F1C);

    --md-success: light-dark(#1BAF7A, #3DD6A0);
    --md-success-text: light-dark(#0F7A54, #6EE7B7);
    --md-warning: light-dark(#8F5F00, #F0B84A);

    --inv-surface: light-dark(#FFFFFF, #12161D);
    --inv-surface-high: light-dark(#FFFFFF, #1C222C);
    --inv-hero-end: light-dark(#EAF4F9, #173243);
    --inv-outline: light-dark(#C7D0D6, #2D5B70);
    --inv-border: light-dark(#E3E8EC, #1F3E4D);
    --inv-on-surface: light-dark(#1B2126, #ECEFF1);
    --inv-strong: light-dark(#0E1A22, #FFFFFF);
    --inv-input-bg: light-dark(#F5F7FA, #232B36);
    --inv-input-border: light-dark(#7F8D98, #6B7785);
    --inv-placeholder: light-dark(#5C6A75, #9AA5AE);
    --inv-hover: light-dark(#EEF3F6, #22303B);
    --inv-overlay: light-dark(rgba(15, 23, 30, 0.04), rgba(255, 255, 255, 0.06));
    --inv-overlay-2: light-dark(rgba(15, 23, 30, 0.09), rgba(255, 255, 255, 0.12));
    --inv-ok: light-dark(#0F7A54, #6EE7B7);
    --inv-bad: light-dark(#B3261E, #F2B8B5);
    --inv-warn: light-dark(#8F5F00, #FFC24D);
    --md-accent: light-dark(#1B6E93, #4FC3E8);

    /* ---- États sémantiques (badges, pastilles, cellules, alertes) ---- */
    --status-success-bg: light-dark(rgba(27, 175, 122, 0.15), rgba(61, 214, 160, 0.16));
    --status-success-fg: var(--md-success-text);
    --status-success-border: light-dark(#1BAF7A, #3DD6A0);
    --status-warning-bg: light-dark(rgba(237, 161, 0, 0.16), rgba(240, 184, 74, 0.16));
    --status-warning-fg: var(--md-warning);
    --status-warning-border: light-dark(#EDA100, #F0B84A);
    --status-danger-bg: var(--md-error-container);
    --status-danger-fg: var(--md-error);
    --status-danger-border: var(--md-error);
    --status-info-bg: var(--md-primary-container);
    --status-info-fg: var(--md-on-primary-container);
    --status-info-border: var(--md-primary);
    --status-neutral-bg: var(--md-surface-container-high);
    --status-neutral-fg: var(--md-on-surface-variant);
    --status-neutral-border: var(--md-outline);
    --team-on: #FFFFFF;
    --team-on-soft: rgba(255, 255, 255, 0.92);
    --team-on-overlay: rgba(255, 255, 255, 0.22);
    --team-on-line: rgba(255, 255, 255, 0.28);

    --md-focus-ring: color-mix(in srgb, var(--md-accent) 25%, transparent);
    --md-tonal-hover: light-dark(#C3E2EF, #1F4A60);
    --md-surface-alt: light-dark(#E4EDF3, #1F2D38);

    --md-elevation-1: light-dark(0 1px 2px rgba(15, 23, 30, 0.06), 0 1px 2px rgba(0, 0, 0, 0.4));
    --md-elevation-2: light-dark(0 2px 8px rgba(15, 23, 30, 0.07), 0 2px 8px rgba(0, 0, 0, 0.4));
    --md-elevation-table: light-dark(0 1px 3px rgba(15, 23, 30, 0.06), 0 6px 20px rgba(15, 23, 30, 0.05), 0 4px 14px rgba(0, 0, 0, 0.4));
    --md-elevation-3: light-dark(0 4px 12px rgba(15, 23, 30, 0.08), 0 10px 28px rgba(15, 23, 30, 0.06), 0 6px 16px rgba(0, 0, 0, 0.5));

    --md-radius-sm: 8px;
    --md-radius-md: 12px;
    --md-radius-lg: 16px;
    --md-radius-full: 999px;

    --md-motion: 0.18s cubic-bezier(0.2, 0, 0, 1);

    --nav-link-color: var(--inv-on-surface);
    --nav-link-hover-color: var(--md-accent);

    --footer-height: 56px;
}
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }
@media print { :root { color-scheme: light; } }

/* --team : aplat (texte blanc par-dessus, >= 4.5:1) ; --team-ink : texte et traits sur la surface de la page. */
.team-color-0 { --team: #1F5FBF; --team-ink: light-dark(#1F5FBF, #7CAAF2); }
.team-color-1 { --team: #C2410C; --team-ink: light-dark(#C2410C, #F28F5C); }
.team-color-2 { --team: #15803D; --team-ink: light-dark(#15803D, #4FC47D); }
.team-color-3 { --team: #7E22CE; --team-ink: light-dark(#7E22CE, #BE92F2); }
.team-color-4 { --team: #B91C1C; --team-ink: light-dark(#B91C1C, #F47D7D); }
.team-color-5 { --team: #0E7490; --team-ink: light-dark(#0E7490, #3FC2E3); }
.team-color-6 { --team: #A16207; --team-ink: light-dark(#A16207, #E3B440); }
.team-color-7 { --team: #BE185D; --team-ink: light-dark(#BE185D, #F274AC); }

/* ---- Analyse des adversaires : palette fixe (encre sombre sur aplats clairs, lisible dans les deux thèmes) ---- */
:root {
    --scout-pos-strong: #9EC5F4;
    --scout-pos: #CDE2FB;
    --scout-even: #ECEBE7;
    --scout-neg: #F8D3D1;
    --scout-neg-strong: #F0A9A6;
    --scout-ink: #0B0B0B;
    --scout-bar-win: #3987E5;
    --scout-bar-draw: #9A9890;
    --scout-bar-loss: #E66767;
}