@charset "utf-8";
/* ============================================================
   DESIGN V5 — PONT ET BASE (STATION, iso 1 UNIQUEMENT)
   ------------------------------------------------------------
   Ce que v5-tokens.css ne peut pas porter, parce que ça CHANGE l'apparence :
   la redéfinition des variables historiques, la typographie Poppins imposée à
   tout le document, le fond de page et les halos.

   Les jetons, eux, sont chargés pour tous les espaces — ils sont devenus le
   vocabulaire des feuilles partagées. Voir l'en-tête de v5-tokens.css.
   ============================================================ */

/* ---------- 1. Le pont vers les variables historiques ---------- */

:root {
    --color--principal: var(--accent);
    --color--principal--hover: var(--accent);
    /* DU BLANC FRANC, ET PAS `--on-accent`. Le nom promet « l'encre sur la
       couleur principale », mais dans ce dépôt la variable sert AUSSI sur des
       fonds de rail, toujours sombres : l'en-tête de semaine du planning v1, par
       exemple. `--on-accent` bascule sur une encre sombre en thème sombre, et
       ces trois cas-là devenaient noir sur navy — illisibles, constaté sur
       /planning.
       Le blanc, lui, est juste sur un rail dans les deux thèmes, et acceptable
       sur l'accent clair. Les deux règles qui le posent VRAIMENT sur un fond
       d'accent (common.css .td_button, planning.css .selector_date .current)
       utilisent `--on-accent` directement. */
    --color--principal--text: #FFFFFF;
    --color--accent: var(--accent);

    --color--inactive: var(--text-dim);
    --color--text: var(--text);
    --color--blue--dark: var(--text);

    --color--background--principal: var(--bg);
    --color--background--second: var(--surface);
    --color--background--third: var(--surface2);

    --color--background--block--left: var(--rail);
    --color--block--left--text: var(--on-rail);
    --color--block--left--text--80: var(--on-rail-mid);
    --color--background--block--left--hover: rgba(255, 255, 255, .07);

    --color--border--bottom--block--top--menu: var(--line);
    --color--principal--block--top: var(--text);
    --color--principal--block--top--hover: var(--accent);
    --color--background--block--top--menu--bottom: var(--surface2);

    --dimen--border--radius--input: var(--radius-field);
    --color--background--input: var(--surface2);
    --color--input--text: var(--text);
    --color--input--text--second: var(--text-mid);
    --dimen--min--height--input: 38px;
}

/* `--color--blue--dark` servait à la fois de couleur de texte foncée ET de
   fond de bandeau sombre. En sombre, le texte doit s'éclaircir mais le
   bandeau doit rester sombre : le pont ci-dessus couvre le cas « texte »,
   qui est l'écrasante majorité des 39 usages. Les quelques bandeaux sont
   repris à la main dans leur feuille (phase 5). */

/* ---------- 2. Base ---------- */

body {
    background: var(--bg);
    color: var(--text);
    font-family: var(--font);
    -webkit-font-smoothing: antialiased;
}

/* LA POLICE NE S'HÉRITE PAS ICI. common.css pose `* { font-family: "Open
   Sans" }` : le sélecteur universel touche chaque élément, donc poser Poppins
   sur `body` ne descend nulle part. Il faut un sélecteur qui le batte.

   LA FORME COMPTE AUTANT QUE LA LISTE. Enchaîner les `:not()` les ADDITIONNE :
   `*:not(i):not(code):not(pre):not(.fa):not(.fas):not(.fal):not(.far):not(.fab)`
   pèse (0,5,3) — il écrase alors toute règle de page qui pose sa propre police
   avec moins de six classes, y compris les chasses fixes voulues. La forme en
   LISTE ne prend que la spécificité de son argument le plus fort, ici une
   classe : (0,1,0). Juste ce qu'il faut pour battre `*`, et pas plus.

   Les <i> et les classes Font Awesome sont exclus : leur famille EST le jeu
   d'icônes. `code` et `pre` aussi — common.css leur donne une chasse fixe,
   et c'est voulu. */
*:not(i, code, pre, .fa, .fas, .fal, .far, .fab, .fad) {
    font-family: var(--font);
}

/* Tout chiffre aligné en colonne (charte). */
td, th, .tabular, [data-tabular] {
    font-variant-numeric: tabular-nums;
}

a { color: var(--accent); text-decoration: none; }

/* ---------- 3. Halos de haut de page ---------- */
/* La charte pose trois halos flous derrière le contenu. Le calque DOIT être
   distinct du conteneur de contenu : posé dessus, son `overflow:hidden` tue
   le `position:sticky` de l'en-tête. */

.v5_glow {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}
.v5_glow::before,
.v5_glow::after {
    content: "";
    position: absolute;
    border-radius: 50%;
}
.v5_glow::before {
    top: -210px; left: 260px;
    width: 840px; height: 490px;
    background: var(--glow);
    filter: blur(130px);
}
.v5_glow::after {
    top: -180px; right: -120px;
    width: 620px; height: 420px;
    background: var(--glow2);
    filter: blur(150px);
}