/* =========================================================================
   CRMTL — Le Carnet — mode sombre (le carnet à la veillée)
   Le site naît sur le papier (kaolin). En mode sombre, on n'écrit pas une
   seconde feuille : on échange les rôles des alias. --kaolin désigne alors
   la surface (une nuit d'ardoise) et --suie l'encre (le papier), si bien
   que chaque règle qui disait « papier, encre suie » s'inverse d'elle-même
   — filets, sommaires, fiches, menus, listes de lecture. Les blocs encre
   et lettre, qui faisaient tache sombre sur le papier, deviennent des
   feuillets clairs dans la nuit : le rythme de la page est conservé.
   Le rouge vielle s'éclaire en corail (#E8545C, déjà celui de la charte sur
   fond sombre) pour rester lisible ; les vraies couleurs, quand il les faut,
   sont --noir, --papier et --vielle.
   L'attribut data-mode est posé sur <html> avant le premier rendu
   (inc/setup.php, mode_init) ; il survit à la navigation ajax du lecteur.
   ========================================================================= */

:root{--noir:#0E0D0C;--papier:#F6F3EE;--vielle:#B2161F}

/* sur html et body : selon la version, WordPress écrit ses jetons sur l'un ou l'autre */
html[data-mode="sombre"],html[data-mode="sombre"] body{
  --kaolin:#1E252C;
  --kaolin-2:#26303A;
  --aubier:#2E3842;
  --suie:var(--papier);
  --suie-2:#C9C4BC;
  --rouge:#E8545C;
  /* les tons d'accompagnement, éclaircis pour se lire sur l'ardoise */
  --bruyere:#D59BBB;
  --mousse:#AEBB7E;
  --chataigne:#D1A27A;

  /* section par défaut (le corps de page) */
  --fond:var(--kaolin);--encre:var(--suie);--discret:var(--suie-2);--accent:var(--rouge);--filet:var(--suie);

  /* jetons lus par theme.json et par les extensions */
  --wp--custom--fond:#1E252C;
  --wp--custom--encre:#F6F3EE;
  --wp--custom--discret:#C9C4BC;
  --wp--custom--accent:#E8545C;
  --wp--custom--filet:#F6F3EE;
}
html[data-mode="sombre"] body{background-color:var(--kaolin);color:var(--suie)}

/* le grain du papier : multiplier ne marque plus rien dans la nuit */
html[data-mode="sombre"] body::after{mix-blend-mode:screen;opacity:.25}

/* boutons : réglés dans theme.json avec les couleurs vraies, on les retourne */
html[data-mode="sombre"] .wp-element-button,html[data-mode="sombre"] .wp-block-button__link{background-color:var(--suie);color:var(--kaolin);border-color:var(--suie)}
html[data-mode="sombre"] .wp-block-button__link:hover{color:var(--noir)!important}

/* ---------- tons de section ---------- */
html[data-mode="sombre"] .is-style-t-aubier{--discret:#D8CDB8}
/* le bloc encre devient le feuillet clair : son accent repasse au rouge vielle */
html[data-mode="sombre"] .is-style-t-encre{--accent:var(--vielle)}
html[data-mode="sombre"] .is-style-t-encre a:hover,html[data-mode="sombre"] .is-style-lettre a:hover{color:var(--vielle);text-decoration-color:var(--vielle)}
html[data-mode="sombre"] .is-style-t-ardoise{--encre:var(--papier);--discret:color-mix(in srgb,var(--papier) 75%,transparent);--filet:color-mix(in srgb,var(--papier) 30%,transparent)}
/* braise et mousse gardent leurs vraies couleurs, avec un texte papier */
html[data-mode="sombre"] .is-style-t-braise{--fond:var(--vielle);--encre:var(--papier);--discret:#f5d2cf;--filet:var(--papier);--accent:var(--papier)}
html[data-mode="sombre"] .is-style-t-mousse{--fond:#4E5A2C;--encre:var(--papier);--discret:#dfe2cf;--filet:var(--papier);--accent:var(--papier)}

/* ---------- pied de page : une ardoise plus profonde que la page ---------- */
html[data-mode="sombre"] .pied{background:#141A1F;color:var(--papier);--encre:var(--papier);--discret:color-mix(in srgb,var(--papier) 75%,transparent)}
html[data-mode="sombre"] .pied__logo,html[data-mode="sombre"] .pied__col a:hover{color:var(--papier)}
html[data-mode="sombre"] .pied__bas{border-top-color:color-mix(in srgb,var(--papier) 30%,transparent)}
html[data-mode="sombre"] .pied .encre-kaolin{color:var(--papier)}

/* ---------- contenus ---------- */
/* l'image « encre » ne se multiplie plus sur le papier : on l'adoucit */
html[data-mode="sombre"] .contenu .is-style-encre img{mix-blend-mode:normal;filter:grayscale(1) contrast(1.1) brightness(.88)}
/* le lecteur [audio] reste noir : ses icônes sont blanches */
html[data-mode="sombre"] .contenu .mejs-container,html[data-mode="sombre"] .contenu .mejs-container .mejs-controls,html[data-mode="sombre"] .contenu .mejs-embed,html[data-mode="sombre"] .contenu .mejs-embed body{background:var(--noir)!important}

/* ---------- bascule douce, sauf demande contraire ---------- */
html.mode-bascule body,html.mode-bascule body *,html.mode-bascule body *::before{transition:background-color var(--t-moyen) ease,color var(--t-moyen) ease,border-color var(--t-moyen) ease!important}
@media (prefers-reduced-motion:reduce){html.mode-bascule body,html.mode-bascule body *,html.mode-bascule body *::before{transition:none!important}}