/*
Theme Name: Balanced Blog Enfant
Theme URI: https://blog.mlebret.fr/
Description: Thème enfant de Balanced Blog pour le blog de Mickaël Lebret. Piste de design « Carnet » : toile crème, grille de cartes postales, sentier pointillé rose, titres en Young Serif et texte en Mulish auto-hébergés, mode nuit habillé. Il porte aussi les ajouts publicitaires (chargeur AdSense et bloc sous l'image à la une) pour que la mise à jour du thème parent ne les efface plus.
Author: Mickaël Lebret
Author URI: https://mlebret.fr/
Template: balanced-blog
Version: 1.0.0
License: GNU General Public License v3
License URI: http://www.gnu.org/licenses/gpl.html
Text Domain: balanced-blog-enfant
*/

/* Les chemins (assets/) sont relatifs à cette feuille. Polices auto-hébergées sous licence SIL OFL 1.1
   (Young Serif et Mulish, licences dans assets/polices/), sous-ensembles latin et latin-ext. */
@font-face {
  font-family: "Young Serif"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("assets/polices/young-serif-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Young Serif"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("assets/polices/young-serif-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Mulish est une police variable : un seul fichier par sous-ensemble couvre 400, 600 et 700 */
@font-face {
  font-family: "Mulish"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("assets/polices/mulish-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Mulish"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("assets/polices/mulish-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Mulish"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("assets/polices/mulish-italique-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Mulish"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("assets/polices/mulish-italique-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ================= socle commun (hors composant carte, qui appartient à l'extension mlebret-carte-escapades) ================= */
/* Règles communes de la piste (spec 4.1 à 4.3) : aucune couleur en dur, tout passe par les jetons définis plus bas.

   Mode nuit (spec 4.6) : les jetons --toile, --surface, ... sont REDÉFINIS sous `body.wp-night-mode-on`.
   Toute règle écrite avec var(--jeton) et une spécificité d'au moins 2 classes (ou `body#blog`) suit donc la nuit
   sans règle jumelle, et bat l'extension (0,1,1) comme la remise à zéro ci-dessous (0,1,2). Une règle à UNE seule
   classe perdrait : préfixer par `body#blog`. Les variables --carte-* ne sont JAMAIS redéfinies la nuit. */

/* ---- 4.3 echelle d'espacement (base 4), rayons et ombres sont propres a chaque piste ---- */
:root {
  --esp-1: 4px; --esp-2: 8px; --esp-3: 12px; --esp-4: 16px; --esp-5: 20px;
  --esp-6: 24px; --esp-8: 32px; --esp-10: 40px; --esp-12: 48px; --esp-16: 64px;
  --conteneur: 1140px;
}
/* Points de rupture : 600px (telephone), 767px et 991px (ceux du theme, ne pas les contredire). */

[hidden] { display: none !important; }

/* ---- 4.2 focus visible partout ---- */
/* body#blog (1,1,1) bat `.dropdown-toggle:focus { outline: 0 }` de Bootstrap (0,2,0), que `html body` (0,1,2) perdait sur le menu « Catégories ». */
body#blog :focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
:where(:focus-visible) { border-radius: inherit; }
body#blog :focus:not(:focus-visible) { outline: none; }
.lien-evitement {
  position: absolute; top: var(--esp-2); left: var(--esp-2); z-index: 100000;
  padding: var(--esp-3) var(--esp-4); transform: translateY(-300%);
  background-color: var(--texte); color: var(--surface); font-weight: 700; border-radius: var(--esp-2);
}
body#blog a.lien-evitement { background-color: var(--texte); color: var(--surface); }
body#blog a.lien-evitement:focus { transform: none; color: var(--surface); }

/* ---- 4.2 mouvement reduit ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0ms !important; transition-delay: 0ms !important; animation-duration: 0ms !important; animation-delay: 0ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}

/* ---- 4.3 mesure de lecture de l'article (environ 80 caracteres a 17px) ---- */
.single-entry-summary { max-width: 768px; margin-inline: auto; }

/* ---- 4.1 emplacement publicitaire au-dessus du titre : place réservée, jamais de décalage de mise en page ----
   L'enveloppe reste un bloc (pas un flex) : le bloc d'annonce mesure la largeur de son parent. */
.pub-haut { display: block; min-height: 100px; margin: var(--esp-4) 0; clear: both; text-align: center; }
@media (min-width: 768px) { .pub-haut { min-height: 280px; } }
/* AdSense pose data-ad-status="unfilled" sur un bloc qu'il ne remplit pas : la place réservée se referme alors.
   (Un bloqueur de publicité, lui, n'est pas détectable en CSS : la place reste réservée, voir le README.) */
.pub-haut:has(> ins.adsbygoogle[data-ad-status="unfilled"]) { min-height: 0; margin: 0; }
/* Gabarit de la copie locale (aucune annonce) : le même emplacement, vide, avec le mot « Publicité ». */
.maquette-pub {
  display: flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: inherit;
  border: 2px dotted var(--pub-bord, var(--puce-fond)); background-color: var(--surface-teintee); color: var(--texte-2);
  font-size: 11px; line-height: 16px; letter-spacing: 0.14em; text-transform: uppercase;
}
body#blog .maquette-pub { background-color: var(--surface-teintee); color: var(--texte-2); }

/* ---- 4.6 nuit : remise a zero des fonds de l'extension, puis la toile ---- */
html body.wp-night-mode-on * { background-color: transparent; }
html body.wp-night-mode-on { background-color: var(--toile); }

/* ---- 6.2 puce de lieu simulee dans l'extrait (P2 et P3) : base neutre, la piste la dessine ---- */
.escapade-lieu { display: inline-block; }

/* ================= piste « Carnet » (P2) ================= */
/* Piste 2 « Carnet » (spec 5.2) : une grille de cartes postales, un sentier pointillé, des empattements doux.
   Toile crème comme du papier, titres en Young Serif, texte en Mulish, un seul ornement : le sentier pointillé
   (titre de catégorie, carte, séparateur de l'article, collines de l'en-tête, pagination, menu) et nulle part ailleurs.

   Méthode (voir le socle plus haut) : toutes les couleurs passent par des jetons, redéfinis la nuit sur `body.wp-night-mode-on`.
   Chaque règle commence par `body#blog` : elle bat le thème, le CSS additionnel de la base et l'extension de nuit. */

/* ================= jetons du jour ================= */
:root {
  --police: "Mulish", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --police-titre: "Young Serif", Georgia, "Times New Roman", serif;
  --toile: #FFF8F0;
  --surface: #FFFFFF;
  --surface-teintee: #F8EBED;
  --texte: #2F2528;
  --texte-2: #6B6166;
  --extrait: #4D4448;
  --accent: #8F455C;
  --lien: #2F2528;
  --decor: #C7788B;
  --marque: #B05F74;
  --mousse: #3F5B3C;
  --bordure: #F3D9DE;
  --champ-bord: #8E8388;
  --focus: #2F2528;
  --puce-fond: #F3D9DE;
  --puce-texte: #2F2528;
  --puce-survol: #EBC2CA;
  --pub-bord: #F3D9DE;
  --bouton-fond: #2F2528;
  --bouton-texte: #FFFFFF;
  --bouton-survol: #451E2D;
  --pagination-bord: #EBC2CA;
  --ciel: #F8EBED;
  --slogan-texte: #6B3045;
  --menu-fond: #FFFFFF;
  --carte-cadre-fond: #FFFFFF;
  --bulle-fond: #FFF8F0;
  --lieu-fond: #E4EBE0;
  --lieu-bord: #B5C8AE;
  --lieu-texte: #2F2528;
  --encadre-fond: #E4EBE0;
  --encadre-bord: #B5C8AE;
  --encadre-intertitre: #3F5B3C;
  --encadre-puce: #B05F74;
  --pied-fond: #2F2528;
  --pied-bord: #2F2528;
  --pied-texte: #F3D9DE;
  --pied-lien: #EBC2CA;
  --commut-fond: #F3D9DE;
  --commut-bord: #DEA1AE;
  --commut-astre: #DEA1AE;
  --commut-astre-bord: #B05F74;
  --commut-nuage: #FFFFFF;
  --commut-nuage-avant: #F8EBED;
  --commut-etoiles: #EBC2CA;
  --ombre-survol: 0 4px 12px rgba(47, 37, 40, 0.08);
  --ombre-bulle: 0 4px 12px rgba(47, 37, 40, 0.12);

  /* contrat de la carte (jamais redéfini la nuit : la carte garde son style pastel) */
  --carte-point: #8F455C;
  --carte-point-bord: #FFF8F0;
  --carte-groupe-fond: #F3D9DE;
  --carte-groupe-bord: #C7788B;
  --carte-groupe-texte: #2F2528;
  --carte-ctrl-fond: #FFFFFF;
  --carte-ctrl-texte: #2F2528;
  --carte-point-rayon: 6;
  --carte-point-rayon-survol: 8;
  --carte-point-bord-largeur: 2;
  --carte-anneau-rayon: 11;
  --carte-anneau-couleur: #C7788B;
  --carte-anneau-largeur: 1.5;
}

/* ================= jetons de la nuit (spec 4.6) ================= */
body.wp-night-mode-on {
  --toile: #1E1A1C;
  --surface: #2A2327;
  --surface-teintee: #332C2F;
  --texte: #F6F4F4;
  --texte-2: #B9B0B3;
  --extrait: #B9B0B3;
  --accent: #EBC2CA;
  --lien: #EBC2CA;
  --decor: #DEA1AE;
  --marque: #DEA1AE;
  --mousse: #EBC2CA;
  --bordure: #4D4448;
  --focus: #EBC2CA;
  --puce-fond: #6B3045;
  --puce-texte: #F8EBED;
  --puce-survol: #8F455C;
  --pub-bord: #6B3045;
  --bouton-fond: #EBC2CA;
  --bouton-texte: #2F2528;
  --bouton-survol: #F3D9DE;
  --pagination-bord: #4D4448;
  --ciel: #2A2327;
  --slogan-texte: #EBC2CA;
  --menu-fond: #1E1A1C;
  --carte-cadre-fond: #2A2327;
  --bulle-fond: #2A2327;
  --lieu-fond: #2E3D2C;
  --lieu-bord: #3F5B3C;
  --lieu-texte: #F6F4F4;
  --encadre-fond: #2E3D2C;
  --encadre-bord: #3F5B3C;
  --encadre-intertitre: #EBC2CA;
  --encadre-puce: #DEA1AE;
  --pied-fond: #1E1A1C;
  --pied-bord: #4D4448;
  --pied-texte: #B9B0B3;
  --pied-lien: #EBC2CA;
  --commut-fond: #332C2F;
  --commut-bord: #6B3045;
  --commut-astre: #F6F4F4;
  --commut-astre-bord: #B9B0B3;
  --commut-nuage: #FFFFFF;
  --commut-nuage-avant: #FFFFFF;
  --commut-etoiles: #EBC2CA;
  --ombre-survol: 0 4px 12px rgba(0, 0, 0, 0.4);
  --ombre-bulle: 0 4px 12px rgba(0, 0, 0, 0.4);
}

/* ================= base ================= */
body#blog {
  font-family: var(--police);
  font-weight: 400;
  background-color: var(--toile);
  color: var(--texte);
}
body#blog .main-container, body#blog .page-area { background-color: transparent; }
body#blog a { color: var(--lien); text-decoration: none; }
body#blog a:hover, body#blog a:focus, body#blog a:active { color: var(--lien); }
body#blog h1, body#blog h2, body#blog h3 { color: var(--texte); font-family: var(--police-titre); font-weight: 400; }

/* ================= en-tête dessiné : collines, soleil, sentier pointillé ================= */
body#blog .site-header.container-fluid {
  --fond-controle: #F8EBED;
  background-image: url("assets/p2-collines-rose.svg") !important; /* le thème écrit l'image d'en-tête en style en ligne */
  background-color: var(--ciel);
  background-size: cover; background-position: center bottom; background-repeat: no-repeat;
  min-height: 200px;
}
body.wp-night-mode-on#blog .site-header.container-fluid { --fond-controle: #2A2327; background-image: url("assets/p2-collines-nuit.svg") !important; }
body#blog .site-heading { padding: 44px 15px 0; color: var(--texte); }
body#blog .site-title, body#blog .site-title a {
  margin: 0; padding: 0; font-family: var(--police-titre); font-size: 34px; line-height: 40px; font-weight: 400;
  letter-spacing: 0; text-transform: none; color: var(--texte);
}
body#blog p.site-description {
  display: block; margin: 4px 0 0; padding: 0; font-size: 15px; line-height: 22px; font-weight: 600;
  letter-spacing: 0; color: var(--slogan-texte); background: none;
}
@media (max-width: 767px) {
  body#blog .site-header.container-fluid { min-height: 150px; }
  body#blog .site-heading { padding: 28px 15px 0; }
  body#blog .site-title, body#blog .site-title a { font-size: 26px; line-height: 32px; }
  body#blog p.site-description { font-size: 14px; line-height: 20px; }
}

/* ================= menu et commutateur ================= */
body#blog #site-navigation { background-color: var(--menu-fond); border-bottom: 1px solid var(--bordure); }
body#blog .navbar-nav > li > a {
  color: var(--texte); background-color: transparent; padding: 20px 16px; min-height: 48px;
  font-family: var(--police); font-size: 15px; line-height: 22px; font-weight: 600; text-transform: none; letter-spacing: 0;
}
body#blog .navbar-default .navbar-nav > .active > a, body#blog .navbar-default .navbar-nav > .open > a { color: var(--texte); background-color: transparent; }
body#blog .navbar-nav > li > a:hover, body#blog .navbar-nav > li > a:focus { color: var(--accent); background-color: transparent; }
body#blog .navbar-nav > .current-menu-item > a, body#blog .navbar-nav > .current-menu-parent > a { color: var(--accent); }
/* le soulignement du thème devient un sentier pointillé */
body#blog .nav > li > a:before, body#blog .nav > li.active > a:after {
  top: auto; bottom: 8px; height: 0; background: none; background-color: transparent; border-top: 2px dotted var(--decor);
}
body#blog .dropdown-menu {
  background-color: var(--surface); border: 1px solid var(--bordure); border-top: 1px solid var(--bordure);
  border-radius: 12px; box-shadow: var(--ombre-survol);
}
body#blog .navbar-nav li:hover .dropdown-menu { border-top: 1px solid var(--bordure); border-radius: 12px; }
body#blog .dropdown-menu > li > a { color: var(--texte); background-color: transparent; padding: 10px 20px; line-height: 24px; font-weight: 600; text-transform: none; letter-spacing: 0; }
body#blog .dropdown-menu > li > a:hover, body#blog .dropdown-menu > li > a:focus { color: var(--texte); background-color: var(--surface-teintee); }
body#blog .dropdown-menu > .active > a, body#blog .dropdown-menu > .active > a:hover, body#blog .dropdown-menu > .active > a:focus { color: var(--puce-texte); background-color: var(--puce-fond); }
body#blog #main-menu-panel span { background-color: var(--texte); }
@media (max-width: 767px) {
  body#blog .navbar-nav a { background-color: var(--surface); color: var(--texte); min-height: 44px; font-size: 16px; line-height: 22px; }
  body#blog .navbar-nav a:focus, body#blog .navbar-nav a:hover { color: var(--texte) !important; background-color: var(--surface-teintee) !important; }
  body#blog .menu-item > a { display: block; }
  body#blog .navbar-nav > li > a { padding: 15px 10px; }
  body#blog .nav > li > a:before, body#blog .nav > li.active > a:after { display: none; }
  /* Les liens du menu sont flottants dans le panneau du theme (leurs li font 0 px de haut) : sans ce clear, l'element
     du mode nuit, positionne et dernier de la liste, s'etend sur tout le panneau et recouvre Accueil, Blog,
     Categories, A propos et Contact (passage utilisateur reel du 08/10, 0 toucher sur 200 recu par ces liens). */
  body#blog .navbar-nav > li.wp-night-mode { clear: both; }
}

/* commutateur de nuit : piste de 42 x 24, zone cliquable de 62 x 44 (la bordure transparente en fait partie) */
body#blog li.wp-night-mode .wpnm-button.style-3 {
  font-size: 16px; width: calc(2.625em + 20px); height: calc(1.5em + 20px); margin-top: 8px;
  border: calc(0.125em + 10px) solid transparent; border-radius: 24px;
  background-clip: padding-box; background-color: var(--commut-fond);
  outline: 2px solid var(--commut-bord); outline-offset: calc(-0.125em - 10px);
}
body#blog li.wp-night-mode .wpnm-button.style-3.active { background-color: var(--commut-fond); }
body#blog li.wp-night-mode .wpnm-button.style-3:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; } /* plus specifique que :focus-visible general (revue du 08/10) */
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-circle { background-color: var(--commut-astre); border-color: var(--commut-astre-bord); }
body#blog li.wp-night-mode .wpnm-button.style-3.active .wpnm-button-circle { background-color: var(--commut-astre); border-color: var(--commut-astre-bord); }
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-moon-spots,
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-moon-spots:before,
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-moon-spots:after { background-color: var(--commut-astre-bord) !important; border-color: var(--commut-astre-bord); }
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-cloud div,
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-cloud div:before,
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-cloud div:after { background-color: var(--commut-nuage); }
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-cloud div + div,
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-cloud div + div:before,
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-cloud div + div:after { background-color: var(--commut-nuage-avant); }
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-stars,
body#blog li.wp-night-mode .wpnm-button.style-3.active .wpnm-button-stars { background-color: transparent; }
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-stars div,
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-stars div:before,
body#blog li.wp-night-mode .wpnm-button.style-3 .wpnm-button-stars div:after { background-color: var(--commut-etoiles) !important; }

/* ================= titre de catégorie et sentier ================= */
body#blog h1.page-title { margin: 28px 0 20px; font-size: 32px; line-height: 38px; }
body#blog h1.page-title span { color: inherit; background-color: transparent; font-family: inherit; }
body#blog h1.page-title::after { content: ""; display: block; width: 48px; margin: 12px auto 0; border-top: 2px dotted var(--decor); }
body#blog header.archive-page-header { padding-bottom: 8px; }
@media (max-width: 600px) { body#blog h1.page-title { font-size: 26px; line-height: 32px; margin-top: 20px; } }
/* titre des résultats de recherche : même traitement que le titre de catégorie */
body#blog h1.search-head { margin: 28px 0 20px; font-size: 32px; line-height: 38px; }
@media (max-width: 600px) { body#blog h1.search-head { font-size: 26px; line-height: 32px; margin-top: 20px; } }

/* ================= carte des escapades : le pointillé encadre la carte comme un tracé ================= */
body#blog .carte-escapades { margin: 0 0 32px; text-align: left; }
body#blog .carte-escapades__titre { margin: 0 0 4px; font-size: 22px; line-height: 28px; }
body#blog .carte-escapades__intro { margin: 0 0 12px; font-size: 14px; line-height: 20px; color: var(--texte-2); }
body#blog .carte-escapades .carte-escapades__carte {
  border: 2px dotted var(--decor); border-radius: 12px; background-color: var(--carte-cadre-fond); padding: 4px;
}
body#blog .carte-escapades .carte-escapades__carte .maplibregl-canvas-container, body#blog .carte-escapades .carte-escapades__carte .maplibregl-canvas { border-radius: 8px; }
@media (max-width: 600px) { body#blog .carte-escapades__titre { font-size: 20px; line-height: 26px; } }

/* bulle « carte postale » */
body#blog .carte-escapades__bulle .maplibregl-popup-content {
  background-color: var(--bulle-fond); border: 1px solid var(--bordure); border-radius: 12px; box-shadow: var(--ombre-bulle);
  font-family: var(--police); overflow: hidden;
}
body#blog .carte-escapades__bulle .maplibregl-popup-close-button { background-color: var(--bulle-fond); }
body#blog .carte-escapades__bulle.maplibregl-popup-anchor-top .maplibregl-popup-tip,
body#blog .carte-escapades__bulle.maplibregl-popup-anchor-top-left .maplibregl-popup-tip,
body#blog .carte-escapades__bulle.maplibregl-popup-anchor-top-right .maplibregl-popup-tip { border-bottom-color: var(--bulle-fond); }
body#blog .carte-escapades__bulle.maplibregl-popup-anchor-bottom .maplibregl-popup-tip,
body#blog .carte-escapades__bulle.maplibregl-popup-anchor-bottom-left .maplibregl-popup-tip,
body#blog .carte-escapades__bulle.maplibregl-popup-anchor-bottom-right .maplibregl-popup-tip { border-top-color: var(--bulle-fond); }
body#blog .carte-escapades__bulle.maplibregl-popup-anchor-left .maplibregl-popup-tip { border-right-color: var(--bulle-fond); }
body#blog .carte-escapades__bulle.maplibregl-popup-anchor-right .maplibregl-popup-tip { border-left-color: var(--bulle-fond); }
body#blog .carte-escapades__bulle .carte-bulle__img { border-radius: 0; }
body#blog .carte-escapades__bulle .carte-bulle__titre { font-family: var(--police); font-size: 16px; line-height: 21px; font-weight: 700; }
body#blog .carte-escapades__bulle .carte-bulle__titre a { text-decoration: none; }
body#blog .carte-escapades__bulle .carte-bulle__titre::after { content: ""; display: block; width: 32px; margin-top: 8px; border-top: 2px dotted var(--decor); }
body#blog .carte-escapades__bulle .carte-bulle__lieu { font-size: 13px; line-height: 20px; margin-top: 8px; }
body#blog .carte-escapades__bulle .carte-bulle__entete { font-family: var(--police); }
body#blog .carte-escapades__bulle .carte-bulle__ligne { color: var(--texte); }
body#blog .carte-escapades__bulle .carte-bulle__ligne:hover { background-color: var(--surface-teintee); }

/* liste de repli : puces blanches bordées, survol rose */
body#blog .carte-escapades__liste li a { background-color: var(--surface); border: 1px solid var(--bordure); color: var(--texte); font-size: 15px; font-weight: 700; }
body#blog .carte-escapades__liste li a:hover, body#blog .carte-escapades__liste li a:focus { background-color: var(--puce-fond); color: var(--puce-texte); }
body#blog .carte-escapades__liste li a:not([data-slug]) { background-color: var(--surface); color: var(--texte-2); }

/* ================= liste des articles : une grille de cartes postales ================= */
/* Catégories, accueil et recherche : même grille (l'accueil et la recherche ont le même gabarit de liste) */
body#blog:is(.archive, .blog, .search-results) .page-area > .row > .col-md-12 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: start; }
body#blog:is(.archive, .blog, .search-results) .page-area > .row > .col-md-12 > :not(article) { grid-column: 1 / -1; }
@media (max-width: 767px) {
  body#blog:is(.archive, .blog, .search-results) .page-area > .row > .col-md-12 { grid-template-columns: minmax(0, 1fr); }
}
/* sans pagination, la grille ne doit pas toucher le pied de page */
body#blog:is(.archive, .blog, .search-results) .page-area > .row > .col-md-12:not(:has(> nav.navigation)) { padding-bottom: 40px; }
body#blog article.news-item-content {
  float: none; width: auto; height: 100%; margin: 0; padding: 0; overflow: hidden;
  background-color: var(--surface); border: 1px solid var(--bordure); border-radius: 12px; box-shadow: none;
  transition: box-shadow 0.2s, transform 0.2s;
}
body#blog article.news-item-content:hover { box-shadow: var(--ombre-survol); transform: translateY(-2px); }
body#blog article.news-item-content .news-text-wrap.row { display: flex; flex-direction: column; margin: 0; }
body#blog article.news-item-content .news-thumb.col-md-6,
body#blog article.news-item-content .news-item .col-md-6,
body#blog article.news-item-content .news-item .col-md-12 { width: 100%; float: none; padding: 0; }
body#blog article.news-item-content:nth-child(2n) .news-thumb { float: none; padding: 0; }
body#blog .news-item-content .news-thumb:before { display: none; } /* le triangle blanc du thème */
body#blog .news-thumb { line-height: 0; }
body#blog .news-thumb img { display: block; width: 100%; height: auto; aspect-ratio: 540 / 304; object-fit: cover; border-radius: 0; }
body#blog .news-item { text-align: left; }
/* colonne de texte : lieu, titre, date, extrait (le lieu est DANS .post-excerpt, d'où display: contents) */
body#blog article.news-item-content .news-item .col-md-6:not(.news-thumb), body#blog article.news-item-content .news-item .col-md-12 {
  display: flex; flex-wrap: wrap; align-items: center; column-gap: 14px; padding: 16px 20px 20px;
}
body#blog .news-item .post-excerpt { display: contents; }
body#blog .news-item .escapade-lieu {
  order: -1; flex: none; margin: 0 100% 10px 0; padding: 3px 12px; border: 1px solid var(--lieu-bord); border-radius: 999px;
  background-color: var(--lieu-fond); color: var(--lieu-texte); font-size: 13px; line-height: 20px; font-weight: 700; font-style: normal;
}
body#blog .news-item h2 { order: 0; flex: 0 0 100%; margin: 0 0 8px; font-size: 22px; line-height: 28px; }
body#blog .news-item h2 a { color: var(--texte); font-family: var(--police-titre); font-size: 22px; line-height: 28px; font-weight: 400; }
body#blog .news-item h2:after { display: none; }
body#blog .news-item h2 a:hover, body#blog .news-item h2 a:focus { color: var(--accent); }
body#blog .news-item .cat-links, body#blog.category .news-item .cat-links { display: none; } /* redondant sur la catégorie */
body#blog .news-item .author-meta { display: none; }                                         /* un seul auteur */
body#blog .news-item .posted-date { order: 1; }
body#blog .news-item .comments-meta { order: 2; }
body#blog .posted-date, body#blog .comments-meta, body#blog .comments-meta a, body#blog .author-meta-by, body#blog .tags-links a, body#blog .tags-links span {
  opacity: 1; font-style: normal; font-size: 13px; line-height: 20px; font-weight: 600; color: var(--texte-2);
}
body#blog .cat-links a { opacity: 1; font-style: normal; font-size: 13px; line-height: 20px; font-weight: 600; }
body#blog .entry-footer .cat-links a, body#blog .entry-footer .tags-links a {
  display: inline-block; padding: 4px 12px; border-radius: 999px; background-color: var(--puce-fond); color: var(--puce-texte);
}
body#blog .entry-footer .cat-links a:hover, body#blog .entry-footer .tags-links a:hover { color: var(--puce-texte); background-color: var(--puce-survol); }
body#blog i.fa-comments-o { color: var(--marque); }
body#blog .news-item .post-excerpt p {
  order: 3; flex: 0 0 100%; margin: 10px 0 0; font-style: normal; font-weight: 400; font-size: 15px; line-height: 24px; color: var(--extrait);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;
}
@media (max-width: 600px) {
  body#blog .news-item h2, body#blog .news-item h2 a { font-size: 20px; line-height: 26px; }
  body#blog article.news-item-content .news-item .col-md-6:not(.news-thumb), body#blog article.news-item-content .news-item .col-md-12 { padding: 14px 16px 18px; }
}

/* ================= pagination ================= */
body#blog nav.navigation.pagination { margin-top: 8px; }
body#blog nav.navigation.pagination .nav-links {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px;
  border-top: 2px dotted var(--decor); padding-top: 16px;
}
body#blog nav.navigation.pagination .nav-links a, body#blog nav.navigation.pagination .current {
  display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 14px;
  border: 0; border-radius: 999px; color: var(--texte); font-size: 15px; line-height: 22px; font-weight: 700;
}
body#blog nav.navigation.pagination .nav-links a:before, body#blog nav.navigation.pagination .current:before { border-color: var(--pagination-bord); border-radius: 999px; }
body#blog nav.navigation.pagination .current { color: var(--bouton-texte); }
body#blog nav.navigation.pagination .current:before { background-color: var(--bouton-fond); border-color: var(--bouton-fond); }
body#blog nav.navigation.pagination a.next, body#blog nav.navigation.pagination a.prev { margin-inline: 12px; }

/* ================= page article ================= */
body#blog .single-wrap .news-thumb img { border-radius: 12px; }
body#blog h1.single-title { max-width: 768px; margin: 16px auto 8px; font-size: 38px; line-height: 46px; }
body#blog .single-meta { color: var(--texte-2); text-align: center; }
body#blog .single-meta .posted-date, body#blog .single-meta .comments-meta { opacity: 1; font-style: normal; }
body#blog .single-entry-summary .single-meta { font-size: 13px; }
body#blog .single-meta + br { display: none; }
body#blog .single-entry-summary > .single-meta::after { content: ""; display: block; width: 48px; margin: 16px auto 8px; border-top: 2px dotted var(--decor); }
body#blog .single-entry-summary { font-family: var(--police); font-size: 17px; line-height: 28px; font-weight: 400; color: var(--texte); }
body#blog .single-entry-summary a:not(.wp-block-button__link) {
  color: var(--lien); text-decoration: underline; text-decoration-color: var(--decor); text-underline-offset: 3px;
}
body#blog .single-entry-summary a:not(.wp-block-button__link):hover { text-decoration-color: var(--lien); }
body#blog h2.wp-block-heading { margin-top: 40px; font-size: 26px; line-height: 32px; }
body#blog h2.wp-block-heading::before { content: ""; display: block; width: 32px; margin-bottom: 8px; border-top: 2px dotted var(--decor); }
body#blog figure.wp-block-image.is-style-editorskit-rounded img { box-shadow: none; }
/* légendes du format classique (articles de 2019) : le parent les écrit en noir (0,2,1), il faut battre cette règle */
body#blog .wp-caption { background-color: transparent; border-color: var(--bordure); }
body#blog .wp-caption p.wp-caption-text { color: var(--texte-2); }
body#blog figcaption.wp-element-caption { margin-top: 8px; font-size: 14px; line-height: 20px; font-weight: 400; font-style: italic; text-align: center; color: var(--texte-2); }
/* encadré « En pratique » : sauge, bordé sauge (limite connue : tout h2 suivi d'une liste, une classe `en-pratique` est demandée à RedacteurBlog) */
body#blog h2.wp-block-heading:has(+ ul.wp-block-list) {
  background-color: var(--encadre-fond); border: 1px solid var(--encadre-bord); border-bottom: 0; border-radius: 12px 12px 0 0; padding: 20px 24px 0; margin: 40px 0 0;
}
body#blog h2.wp-block-heading + ul.wp-block-list {
  background-color: var(--encadre-fond); border: 1px solid var(--encadre-bord); border-top: 0; border-radius: 0 0 12px 12px; padding: 12px 24px 20px 44px; margin: 0 0 32px;
}
body#blog h2.wp-block-heading + ul.wp-block-list li::marker { color: var(--encadre-puce); }
body#blog h2.wp-block-heading + ul.wp-block-list li strong { color: var(--encadre-intertitre); }
/* bouton Visorando : ses couleurs sont imposées en ligne, on n'ajoute que de l'air et une transition */
body#blog .wp-block-button__link { padding: 12px 22px; font-weight: 700; transition: transform 0.2s, box-shadow 0.2s; }
body#blog .wp-block-button__link:hover { transform: translateY(-1px); box-shadow: var(--ombre-survol); }
body#blog .entry-footer .space-right, body#blog .entry-footer .cat-links, body#blog .entry-footer .tags-links { opacity: 1; color: var(--texte-2); }
body#blog .yasr-auto-insert-visitor { margin-block: 16px; }

@media (max-width: 600px) {
  body#blog h1.single-title { font-size: 28px; line-height: 34px; }
  body#blog .single-entry-summary { font-size: 16px; line-height: 26px; }
  body#blog h2.wp-block-heading { font-size: 22px; line-height: 28px; }
  body#blog h2.wp-block-heading:has(+ ul.wp-block-list) { padding: 16px 16px 0; }
  body#blog h2.wp-block-heading + ul.wp-block-list { padding: 12px 16px 16px 36px; }
}

/* ================= commentaires ================= */
body#blog h3.comment-reply-title { font-size: 22px; line-height: 28px; }
body#blog p.comment-notes { font-size: 14px; line-height: 20px; color: var(--texte-2); }
body#blog #respond label { color: var(--texte); font-weight: 600; }
body#blog #respond input:not([type=submit]):not([type=hidden]), body#blog #respond textarea {
  background-color: var(--toile); color: var(--texte); border: 1px solid var(--champ-bord); border-radius: 6px; padding: 10px 12px; font-family: var(--police);
}
body#blog #respond #submit {
  width: auto; min-height: 44px; padding: 0 24px; border: 0; border-radius: 999px; cursor: pointer;
  background-color: var(--bouton-fond); color: var(--bouton-texte); font-family: var(--police); font-size: 15px; font-weight: 700;
}
body#blog #respond #submit:hover { opacity: 1; background-color: var(--bouton-survol); }

/* ================= pied ================= */
body#blog footer#colophon.footer-credits { background-color: var(--pied-fond); border-top: 1px solid var(--pied-bord); }
body#blog .footer-credits-text { color: var(--pied-texte); font-size: 14px; line-height: 20px; font-weight: 400; }
body#blog .footer-credits-text a { color: var(--pied-lien); text-decoration: underline; text-decoration-color: var(--decor); text-underline-offset: 3px; }

/* seconde ligne de meta (derniere modification) : un peu d'air avant le texte */
body#blog .single-entry-summary > .single-meta:last-of-type { margin-bottom: 16px; }

/* ================= apports de RedacteurBlog ================= */
/* Coins arrondis des photos, repris d'EditorsKit (même règle) : ils restent si l'extension est désactivée un jour. */
.is-style-editorskit-rounded.wp-block-image img, .is-style-editorskit-rounded:not(.wp-block-image) { border-radius: 0.5em; overflow: hidden; }

/* Texte posé sur un bloc « Couverture » d'ancien format (p.wp-block-cover-text, page « À propos de ») : le cœur 5.9 le laisse
   hériter la couleur du corps, soit de l'encre sur une photo assombrie. On rend le blanc voulu par le bloc. */
body#blog .wp-block-cover .wp-block-cover-text, body#blog .wp-block-cover-image .wp-block-cover-image-text { color: #FFFFFF; }

/* ================= formulaire de recherche (page introuvable) ================= */
body#blog form#searchform input#s {
  box-sizing: border-box; min-height: 44px; padding: 10px 150px 10px 14px; border: 1px solid var(--champ-bord); border-radius: 6px;
  background-color: var(--surface); color: var(--texte); font-family: var(--police); font-size: 16px;
}
body#blog form#searchform #searchsubmit {
  max-width: none; min-width: 44px; padding: 0 20px; border: 0; border-radius: 0 6px 6px 0; cursor: pointer;
  background-color: var(--bouton-fond); color: var(--bouton-texte); font-family: var(--police); font-size: 15px; font-weight: 700;
}
body#blog form#searchform #searchsubmit:hover { background-color: var(--bouton-survol); }

/* ================= visionneuse 360 (Pannellum 2.5.6) la nuit =================
   L'extension de nuit applique `background: #1e1e1e` à chaque élément : les icônes en sprite et les boîtes de la visionneuse
   disparaissent. On les restitue (même sprite que la feuille de Pannellum). */
body#blog.wp-night-mode-on .pnlm-controls { background-color: #FFFFFF; }
body#blog.wp-night-mode-on .pnlm-controls .pnlm-control:hover { background-color: #F8F8F8; }
body#blog.wp-night-mode-on .pnlm-sprite { background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2226%22%20height%3D%22208%22%3E%0A%3Ccircle%20fill-opacity%3D%22.78%22%20cy%3D%22117%22%20cx%3D%2213%22%20r%3D%2211%22%20fill%3D%22%23fff%22%2F%3E%0A%3Ccircle%20fill-opacity%3D%22.78%22%20cy%3D%22143%22%20cx%3D%2213%22%20r%3D%2211%22%20fill%3D%22%23fff%22%2F%3E%0A%3Ccircle%20cy%3D%22169%22%20cx%3D%2213%22%20r%3D%227%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%2F%3E%0A%3Ccircle%20cy%3D%22195%22%20cx%3D%2213%22%20r%3D%227%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%2F%3E%0A%3Ccircle%20cx%3D%2213%22%20cy%3D%22195%22%20r%3D%222.5%22%2F%3E%0A%3Cpath%20d%3D%22m5%2083v6h2v-4h4v-2zm10%200v2h4v4h2v-6zm-5%205v6h6v-6zm-5%205v6h6v-2h-4v-4zm14%200v4h-4v2h6v-6z%22%2F%3E%0A%3Cpath%20d%3D%22m13%20110a7%207%200%200%200%20-7%207%207%207%200%200%200%207%207%207%207%200%200%200%207%20-7%207%207%200%200%200%20-7%20-7zm-1%203h2v2h-2zm0%203h2v5h-2z%22%2F%3E%0A%3Cpath%20d%3D%22m5%2057v6h2v-4h4v-2zm10%200v2h4v4h2v-6zm-10%2010v6h6v-2h-4v-4zm14%200v4h-4v2h6v-6z%22%2F%3E%0A%3Cpath%20d%3D%22m17%2038v2h-8v-2z%22%2F%3E%0A%3Cpath%20d%3D%22m12%209v3h-3v2h3v3h2v-3h3v-2h-3v-3z%22%2F%3E%0A%3Cpath%20d%3D%22m13%20136-6.125%206.125h4.375v7.875h3.5v-7.875h4.375z%22%2F%3E%0A%3Cpath%20d%3D%22m10.428%20173.33v-5.77l5-2.89v5.77zm1-1.73%203-1.73-3.001-1.74z%22%2F%3E%0A%3C%2Fsvg%3E%0A'); background-repeat: no-repeat; }
body#blog.wp-night-mode-on .pnlm-zoom-in { background-position: 0 0; }
body#blog.wp-night-mode-on .pnlm-zoom-out { background-position: 0 -26px; }
body#blog.wp-night-mode-on .pnlm-fullscreen-toggle-button-inactive { background-position: 0 -52px; }
body#blog.wp-night-mode-on .pnlm-fullscreen-toggle-button-active { background-position: 0 -78px; }
body#blog.wp-night-mode-on .pnlm-orientation-button-inactive { background-position: 0 -156px; }
body#blog.wp-night-mode-on .pnlm-orientation-button-active { background-position: 0 -182px; }
body#blog.wp-night-mode-on .pnlm-load-button, body#blog.wp-night-mode-on .pnlm-load-box,
body#blog.wp-night-mode-on .pnlm-panorama-info, body#blog.wp-night-mode-on .pnlm-about-msg { background-color: rgba(0, 0, 0, 0.7); }
body#blog.wp-night-mode-on .pnlm-info-box { background-color: #000000; }

/* pages (gabarit sans colonne de lecture) : de l'air entre le titre, l'éventuelle image et le texte */
body#blog .main-content-page .entry-content { margin-top: 16px; padding-bottom: 8px; }