/* TEEBOX — les couleurs de l'appli, à un seul endroit.
   Pour changer une couleur partout : modifier sa valeur dans le premier bloc, rien d'autre.
   (L'atelier des couleurs produit exactement ce bloc, prêt à coller.) Chargée tout à la fin de index.html. */
:root{
  /* mode clair */
  --pal-fond:#E6E0D6;          /* le fond des pages */
  --pal-carte:#F4F0E9;         /* les cartes posées sur le fond */
  --pal-texte:#121212;         /* le texte */
  --pal-doux:#6B665D;          /* le texte secondaire */
  --pal-trait:#D5CDBF;         /* les traits et bordures */
  --pal-golf:#1C2430;          /* boutons, menu du bas, onglet actif */
  --pal-golf-fonce:#161D26;
  --pal-une:#6B6F4E;           /* la carte « Ma prochaine compétition » de l'accueil */
  --pal-une-txt:#FFFFFF;       /* le texte de cette carte (foncé si la carte est pastel) */
  --pal-barre:#1C2430;         /* la barre du haut et la bande de l'heure */
  --pal-date:#8A5A2B;          /* dates, compte à rebours, abonnement */
  --pal-alerte:#4B1E23;        /* pastilles « non lu » */
  /* mode sombre */
  --pal-s-fond:#121212;
  --pal-s-carte:#1C2430;
  --pal-s-doux-fond:#232D3C;
  --pal-s-texte:#E6E0D6;
  --pal-s-doux:#A39D91;
  --pal-s-trait:#2B3546;
  --pal-s-golf:#9fb0c8;
}

/* ---------- à partir d'ici, rien à changer : les couleurs ci-dessus sont distribuées dans l'appli ---------- */
html:root[data-style]:not(.is-dark),html:root:not(.is-dark){
  --bg:var(--pal-fond);--card:var(--pal-carte);--soft:color-mix(in srgb,var(--pal-carte) 70%,var(--pal-trait));--fg:var(--pal-texte);--muted:var(--pal-doux);--line:var(--pal-trait);
  --mint:color-mix(in srgb,var(--pal-golf) 14%,var(--pal-carte));--g:var(--pal-golf);--g2:var(--pal-golf);--blue:var(--pal-golf);--ink:var(--pal-golf-fonce);
  --glass:color-mix(in srgb,var(--pal-fond) 96%,transparent);--tb:var(--pal-golf);--tb-d:var(--pal-golf-fonce);--tb-gold:var(--pal-date);--gold:var(--pal-date);--flag:var(--pal-date);--sbar:var(--pal-barre)}
html.is-dark:root,html.is-dark:root[data-style]{
  --bg:var(--pal-s-fond);--card:var(--pal-s-carte);--soft:var(--pal-s-doux-fond);--fg:var(--pal-s-texte);--muted:var(--pal-s-doux);--line:var(--pal-s-trait);
  --mint:var(--pal-s-doux-fond);--g:var(--pal-s-golf);--g2:var(--pal-s-golf);--tb:var(--pal-golf);--tb-d:var(--pal-golf-fonce);--glass:color-mix(in srgb,var(--pal-s-fond) 94%,transparent);
  --tb-gold:var(--pal-date);--gold:#d6a265;--sbar:var(--pal-barre)}
html:root :is(.mx,.cv){--tx:var(--fg);--tx2:var(--muted);--ln:var(--line);--gold:var(--pal-date)}

/* fonds des pages qui avaient leur blanc à elles */
html:root:not(.is-dark) :is(body,.shell>main.main,.nh,.nh-sheet,.mx,.pub){background:var(--pal-fond)!important}
html:root:not(.is-dark) :is(.nh-row,.mc-card,.post,.mx-find,.mx-chip:not(.on),.mx-rb,.nh-sheet>.nh-search,.bottombar,.card,.sp-row,.career-card,.gr-card,.cv-h,.cv-f,.pub-top){background-color:var(--pal-carte)!important}
html:root:not(.is-dark) .bottombar{border-color:var(--pal-trait)!important;box-shadow:0 -1px 0 var(--pal-trait)!important}
html.is-dark .cv-card{background:linear-gradient(var(--bg),color-mix(in srgb,var(--bg) 92%,transparent) 85%,transparent)!important}

/* barre du haut */
html:root[data-style] .topbar,html:root .topbar{background:var(--pal-barre)!important}
html:root .bottombar .fab>svg{background:var(--pal-golf)!important}

/* accueil : raccourcis, carte à la une */
html:root .nh-tile:is(.t-vert,.t-or,.t-ciel){background:var(--card)!important;color:var(--fg)!important}
html:root .nh-tile.t-vert .nh-ti{background:var(--pal-golf)!important}
html:root .nh-tile.t-or .nh-ti{background:var(--pal-date)!important}
html:root .nh-tile.t-ciel .nh-ti{background:var(--pal-barre)!important}
html:root .nh-nb,html:root .nh-bell .notif-dot{background:var(--pal-alerte)!important}
html:root .nh-big{background:var(--pal-une)!important;box-shadow:0 12px 26px -14px color-mix(in srgb,var(--pal-une) 80%,transparent)}
html:root .nh-big-ph::after{background:linear-gradient(180deg,transparent,var(--pal-une))!important}
html:root .nh-tag{background:var(--pal-date)!important;color:#fff!important}
html:root .nh-go{color:var(--pal-une)!important}
html:root .nh-km{background:color-mix(in srgb,var(--pal-golf) 16%,transparent)!important;color:var(--g)!important}

/* compétitions : la bande du haut en bleu nuit, les comptes à rebours en tabac */
html:root .mc-hero::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,color-mix(in srgb,var(--pal-barre) 35%,transparent),color-mix(in srgb,var(--pal-barre) 88%,transparent))}
html:root .mc-hero>*{position:relative;z-index:1}
html:root .mc-rk.soon{background:color-mix(in srgb,var(--pal-date) 16%,transparent)!important;color:var(--pal-date)!important}
html.is-dark .mc-rk.soon{color:#d6a265!important}
html:root .mc-tabs button.on{background:var(--pal-barre)!important;color:#fff!important;box-shadow:none!important}
html:root .mc-tabs button i{background:var(--pal-date)!important}
html:root .mc-h h2::after{background:var(--pal-date)!important}

/* messages : non lus en merlot */
html:root :is(.mx .unread-dot,.mx-dot,.mx-un,.bottombar .unread-dot,.msg-ic i){background:var(--pal-alerte)!important}

/* mode sombre : ce qui prend la couleur golf passe à sa version claire (sinon bleu nuit sur bleu nuit) */
html.is-dark:root .bottombar.is-player .fab>svg,html.is-dark .bottombar .fab>svg{background:var(--pal-s-golf)!important;color:var(--pal-s-fond)!important}
html.is-dark .nh-tile.t-vert .nh-ti{background:var(--pal-s-golf)!important;color:var(--pal-s-fond)!important}
html.is-dark .nh-tile.t-ciel .nh-ti{background:color-mix(in srgb,var(--pal-barre) 60%,#fff 25%)!important}
html.is-dark :is(.btn:not(.ghost):not(.soft),.mc-tabs button.on,.mx-chip.on,.mx-add,.nh-sub){background:var(--pal-s-golf)!important;color:var(--pal-s-fond)!important;border-color:var(--pal-s-golf)!important}

/* ---------- réglages par élément (facultatifs) ----------
   Chaque élément suit la palette ci-dessus, sauf si une variable --el-… est ajoutée dans le bloc :root du haut
   (l'atelier des couleurs les écrit pour vous). Exemple : --el-une:#0F4E77; colore seulement la carte de l'accueil. */
/* toutes les pages */
html:root .topbar{background:var(--el-barre,var(--pal-barre))!important}
#sbar{background:var(--el-barre,var(--pal-barre))}
html:root .bottombar{background:var(--el-nav,var(--card))!important}
html:root .bottombar .fab>svg,html:root .bottombar.is-player .fab>svg{background:var(--el-fab,var(--pal-golf))!important}
html.is-dark:root .bottombar.is-player .fab>svg{background:var(--el-fab,var(--pal-s-golf))!important}
html:root .bottombar a.on:not(.fab),html:root .bottombar a.on:not(.fab)>span{color:var(--el-nav-on,var(--g))!important}
/* accueil */
html:root .nh-sheet>.nh-search{background:var(--el-recherche,var(--card))!important}
html:root .nh-tile:is(.t-vert,.t-or,.t-ciel){background:var(--el-raccourci,var(--card))!important}
html:root .nh-tile.t-vert .nh-ti{background:var(--el-ic-amis,var(--pal-golf))!important}
html.is-dark .nh-tile.t-vert .nh-ti{background:var(--el-ic-amis,var(--pal-s-golf))!important}
html:root .nh-tile.t-or .nh-ti{background:var(--el-ic-duel,var(--pal-date))!important}
html:root .nh-tile.t-ciel .nh-ti{background:var(--el-ic-pub,var(--pal-barre))!important}
html:root .nh-friends{background:var(--el-amis,var(--card))}
html:root .nh-big{background:var(--el-une,var(--pal-une))!important}
html:root .nh-big-ph::after{background:linear-gradient(180deg,transparent,var(--el-une,var(--pal-une)))!important}
html:root .nh-go{background:var(--el-une-btn,var(--pal-une-txt,#fff))!important;color:var(--el-une,var(--pal-une))!important}
html:root .nh-tag{background:var(--el-une-tag,var(--pal-date))!important}
html:root .nh-km{background:color-mix(in srgb,var(--el-km,var(--g)) 18%,transparent)!important;color:var(--el-km,var(--g))!important}
html:root .nh-row{background-color:var(--el-ligne,var(--card))!important}
/* compétitions */
html:root .mc-hero::after{background:linear-gradient(180deg,color-mix(in srgb,var(--el-comp-haut,var(--pal-barre)) 35%,transparent),color-mix(in srgb,var(--el-comp-haut,var(--pal-barre)) 88%,transparent))}
html:root .mc-tabs button.on{background:var(--el-comp-onglet,var(--pal-date))!important}
html:root .mc-rk.soon{background:color-mix(in srgb,var(--el-comp-date,var(--pal-date)) 16%,transparent)!important;color:var(--el-comp-date,var(--pal-date))!important}
html:root .mc-h h2::after,html:root .mc-tabs button i{background:var(--el-comp-date,var(--pal-date))!important}
html:root .mc-card{background-color:var(--el-comp-carte,var(--card))!important}
/* messages */
html:root :is(.mx-addf,.mx-add){background:var(--el-msg-ajout,var(--pal-golf))!important;color:#fff!important}
html:root .mx-chip.on{background:var(--el-msg-puce,var(--pal-golf))!important;color:#fff!important;border-color:transparent!important}
html:root .mx-ic:not(.flag){background:var(--el-msg-groupe,var(--pal-golf))!important}
html:root .mx-ic.flag{background:var(--el-msg-equipe,var(--pal-barre))!important}
html:root .mx-find{background:var(--el-msg-recherche,var(--card))!important}
/* profil */
html:root .xpbar i{background:var(--el-progression,var(--pal-date))!important}
html:root :is(.career-card .cc-ic,.sp-row .sp-ic){color:var(--el-lien-ic,var(--g))!important}
/* mode sombre : les éléments « couleur golf » prennent sa version claire, sauf réglage de l'élément */
html.is-dark :is(.mx-addf,.mx-add){background:var(--el-msg-ajout,var(--pal-s-golf))!important}
html.is-dark .mx-chip.on{background:var(--el-msg-puce,var(--pal-s-golf))!important}
html.is-dark .mx-ic:not(.flag){background:var(--el-msg-groupe,var(--pal-s-golf))!important}
html.is-dark .mc-tabs button.on{background:var(--el-comp-onglet,var(--pal-s-golf))!important}
html:root .nh-big,html:root .nh-big :is(b,small,.nh-meta,.nh-meta span,.nh-meta i){color:var(--pal-une-txt,#fff)!important}

/* ---------- le texte de chaque élément (variables --el-…-tx), et les éléments ajoutés ---------- */
html:root .topbar,html:root .topbar :is(.wordmark,.ic-btn){color:var(--el-barre-tx,#fff)!important}
html:root .topbar .wordmark{-webkit-text-fill-color:var(--el-barre-tx,#fff)}
html:root .bottombar a:not(.on):not(.fab),html:root .bottombar a:not(.on):not(.fab)>span{color:var(--el-nav-tx,var(--muted))!important}
html:root .bottombar .fab>svg{color:var(--el-fab-tx,#fff)!important}
html.is-dark:root .bottombar.is-player .fab>svg{color:var(--el-fab-tx,var(--pal-s-fond))!important}
html:root .nh-sheet>.nh-search :is(span,svg){color:var(--el-recherche-tx,var(--muted))!important}
html:root .nh-tile:is(.t-vert,.t-or,.t-ciel){color:var(--el-raccourci-tx,var(--fg))!important}
html:root .nh-tile.t-vert .nh-ti{color:var(--el-ic-amis-tx,#fff)!important}
html:root .nh-tile.t-or .nh-ti{color:var(--el-ic-duel-tx,#fff)!important}
html:root .nh-tile.t-ciel .nh-ti{color:var(--el-ic-pub-tx,#fff)!important}
html:root .nh-fr.add{color:var(--el-amis-tx,var(--fg))!important}
html:root .nh-big,html:root .nh-big :is(b,small,.nh-meta,.nh-meta span,.nh-meta i){color:var(--el-une-tx,var(--pal-une-txt,#fff))!important}
html:root .nh-tag{color:var(--el-une-tag-tx,#fff)!important}
html:root .nh-go{color:var(--el-une-btn-tx,var(--el-une,var(--pal-une)))!important}
html:root .nh-row b{color:var(--el-ligne-tx,var(--fg))!important}
html:root .nh-h h2{color:var(--el-acc-titres-tx,var(--fg))!important}
html:root .mc-hero,html:root .mc-hero :is(h1,small,p){color:var(--el-comp-haut-tx,#fff)!important}
html:root .mc-tabs button.on{color:var(--el-comp-onglet-tx,#fff)!important}
html:root .mc-rk.soon{color:var(--el-comp-date-tx,var(--el-comp-date,var(--pal-date)))!important}
html:root .mc-card .mc-i b{color:var(--el-comp-carte-tx,var(--fg))!important}
html:root .mc-i .prt-f{background:var(--el-comp-format,transparent);color:var(--el-comp-format-tx,inherit);border-radius:8px;padding:0 6px}
html:root .nh-pill.on{background:var(--el-comp-ok,var(--pal-golf))!important;color:var(--el-comp-ok-tx,#fff)!important}
html:root .teaser{background:var(--el-comp-abo,var(--card))!important;color:var(--el-comp-abo-tx,var(--fg))!important}
html:root .mx-find,html:root .mx-find :is(input,svg){color:var(--el-msg-recherche-tx,var(--muted))!important}
html:root :is(.mx-addf,.mx-add){color:var(--el-msg-ajout-tx,#fff)!important}
html:root .mx-chip.on{color:var(--el-msg-puce-tx,#fff)!important}
html:root .mx-ic:not(.flag){color:var(--el-msg-groupe-tx,#fff)!important}
html:root .mx-ic.flag{color:var(--el-msg-equipe-tx,#fff)!important}
html:root .mx :is(h1,.mx-tx b){color:var(--el-msg-titre-tx,var(--fg))!important}
html.is-dark :is(.mx-addf,.mx-add){color:var(--el-msg-ajout-tx,var(--pal-s-fond))!important}
html.is-dark .mx-chip.on{color:var(--el-msg-puce-tx,var(--pal-s-fond))!important}
html.is-dark .mx-ic:not(.flag){color:var(--el-msg-groupe-tx,var(--pal-s-fond))!important}
html.is-dark .mc-tabs button.on{color:var(--el-comp-onglet-tx,var(--pal-s-fond))!important}
/* petits chiffres (pastilles « 1 », non lus) et couronne de l'abonnement */
html:root :is(.nh-nb,.nh-bell .notif-dot,.nh-fr.add .nh-nb,.mx .unread-dot,.mx-dot,.mx-un,.bottombar .unread-dot,.msg-ic i,.notif-dot){background:var(--el-badge,var(--pal-alerte))!important;color:var(--el-badge-tx,#fff)!important}
html:root :is(.teaser .lock-ic,.teaser .lock-ic svg,.nh-sub svg,.tb-plus .tp-ic){color:var(--el-comp-couronne-tx,var(--pal-date))!important}