/**
 * Maternité Blocs — Override chromatique (sélecteurs .maternite-*)
 *
 * Charte : Maternité CHRU Nancy (rose blush + bleu foncé + vert-bleu).
 * Cible  : remappe la palette --chru-* + les couleurs hardcodées des blocs
 *          du plugin maternite-blocks vers la palette Maternité.
 * Source : _artifacts/2026-05-28-maternite-blocks-integration/mapping-couleurs.md
 *
 * Stratégie en 3 couches :
 *   1. Variables Maternité globales (:root)
 *   2. Override des --chru-* du plugin (couvre ~80% des cas via fallback chain)
 *   3. Override hex hardcodés bloc par bloc (cas restants)
 */

/* =========================================================================
   1. Palette Maternité (référence)
   ========================================================================= */
:root {
	--mat-blue-dark:      #14446B; /* texte, titres timeline */
	--mat-rose-blush:     #9E5B5C; /* titres sections, accents */
	--mat-rose-principal: #D4838A;
	--mat-rose-light:     #E8C4C0;
	--mat-rose-pale:      #F5E6E0;
	--mat-rose-outline:   #FFD6CF; /* bordures fines */
	--mat-nouveau-rose:   #FFF5F3; /* fond cards clair */
	--mat-cream:          #FAF0EB;
	--mat-vert-bleu:      #99C8CF; /* CTA primaire */
	--mat-gray-meta:      #6C6C6C; /* texte méta (URLs, sous-titres) */
	--mat-white:          #FFFFFF;
}

/* =========================================================================
   2. Override des variables --chru-* du plugin maternite-blocks
   ----------------------------------------------------------------------
   La quasi-totalité des couleurs du plugin est consommée via
   var(--chru-*, fallback). Redéfinir les variables ici suffit pour 80%
   des cas — le fallback hardcodé devient inactif.
   ========================================================================= */
:root {
	/* Variables réellement utilisées dans le build maternite-blocks */
	--chru-primary:      #14446B; /* texte courant (était #2D4356) */
	--chru-secondary:    #14446B; /* titres */
	--chru-accent:       #9E5B5C; /* accents canard → rose blush */
	--chru-blue-service: #14446B;
	--chru-blue-text:    #14446B;
	--chru-blue-light:   #9E5B5C; /* light blue accents → rose blush */
	--chru-light-blue:   #FFF5F3; /* fonds clairs */
	--chru-blue-light-bg: #FFF5F3; /* fond light-blue (equipe-liste) → rose pâle */
	--chru-teal:         #99C8CF; /* teal → vert-bleu maternité */
	--chru-grey:         #FFF5F3; /* fond cards → nouveau-rose */
	--chru-gray-border:  #FFD6CF; /* bordures → rose outline */
	--chru-white:        #FFFFFF;
	--chru-tl-progress:  #9E5B5C; /* timeline progress */

	/* Pôles médicaux neutralisés (sans objet sur maternité) */
	--chru-etp:        #9E5B5C;
	--chru-formation:  #9E5B5C;
	--chru-sante:      #9E5B5C;
	--chru-urgences:   #9E5B5C;

	/* Variables historiques (CLAUDE.md) — fallback pour blocs futurs */
	--chru-blue-accent:  #9E5B5C;
	--chru-blue-canard:  #99C8CF;
	--chru-blue-pastel:  #99C8CF;
	--chru-yellow:       #9E5B5C;
	--chru-green:        #9E5B5C;
	--chru-pink:         #9E5B5C;
	--chru-red:          #9E5B5C;
	--chru-orange:       #9E5B5C;
	--chru-dark-red:     #9E5B5C;
	--chru-dark-green:   #9E5B5C;
	--chru-dark-pink:    #9E5B5C;
	--chru-dark-orange:  #9E5B5C;
	--chru-gray:         #FFF5F3;
	--chru-gray-alt:     #FFF5F3;
	--chru-gray-light:   #FFF5F3;
	--chru-gray-medium:  #FFD6CF;
	--chru-gray-text:    #6C6C6C;
}

/* =========================================================================
   3. Overrides ciblés — couleurs hardcodées sans var() wrapper
   ----------------------------------------------------------------------
   Identifiées par inventaire CSS du build maternite-blocks (cf. mapping).
   Spécificité maintenue minimale (sélecteur bloc + élément).
   ========================================================================= */

/* --- Texte de base : tous les #14446b/#14436a/#2d4356 hardcodés ---
   Les classes .maternite-* utilisent souvent color:#14446b directement.
   La couleur cible est identique (#14446B = mat-blue-dark) → pas d'override
   nécessaire pour ces valeurs ; elles sont déjà conformes. */

/* --- Accordéon : bordure et icônes en #197caa --- */
.maternite-accordeon__item,
.maternite-accordeon__title,
.maternite-accordeon-section__header {
	border-color: var(--mat-rose-outline);
}
/* Chevron du picto d'entête : le SVG (accordeon-section/index.js) a un fill="#14446B"
   FIGÉ dans le markup (pas currentColor) — déclarer ici une couleur rose n'avait
   donc AUCUN effet visuel, tout en laissant le picto « dire » une couleur que
   l'écran ne montrait jamais (0,3,1). Le titre juste à côté (.maternite-accordeon__title,
   ligne 95 et 111) est lui bien réellement rendu en bleu foncé (var(--mat-blue-dark),
   décision déjà actée : « couleur cible identique, pas d'override nécessaire »).
   On aligne la déclaration sur ce qui est effectivement peint, pour que picto et
   libellé restent visuellement cohérents (retour client 05/08/2026 : « couleur
   incohérente, mélange de bleu CHRU et de rose Maté » sur les entêtes d'onglets). */
.maternite-accordeon__icon {
	color: var(--mat-blue-dark);
}

/* --- Chapo : bordure latérale #197caa --- */
.maternite-chapo,
.maternite-chapo__lead {
	border-left-color: var(--mat-rose-blush);
}

/* --- Examens : accents #009fe3 / #197caa / urgences #da1500 --- */
.maternite-examens__item,
.maternite-examen-section,
.maternite-examen-detail {
	border-color: var(--mat-rose-outline);
}
.maternite-examen-section__urgent,
.maternite-examen-section__badge--urgent {
	background-color: var(--mat-rose-blush);
	color: var(--mat-white);
}

/* --- Documents list : #14436a sur titres et liens --- */
.maternite-documents-list__title,
.maternite-documents-list__link {
	color: var(--mat-blue-dark);
}

/* --- Organigramme : #0096d6 sur cartes/branches --- */
.maternite-organigramme__node,
.maternite-organigramme__line,
.maternite-organigramme__connector {
	border-color: var(--mat-rose-outline);
	color: var(--mat-rose-blush);
}

/* --- Pages-cards : #009fe3 sur cartes --- */
.maternite-pages-cards__item,
.maternite-pages-cards__card {
	border-color: var(--mat-rose-outline);
}
.maternite-pages-cards__title {
	color: var(--mat-rose-blush);
}

/* --- Bloc important : #b40a29 (rouge attention) ---
   Sélecteurs réels : .maternite-important__* (pas .maternite-bloc-important__*).
   `!important` requis car le CSS du bloc est enqueué après l'override
   (block-style on-render → spécificité égale, ordre de chargement défavorable). */
.wp-block-maternite-bloc-important,
.maternite-bloc-important {
	background-color: var(--mat-nouveau-rose) !important;
}
.maternite-important__text {
	color: var(--mat-rose-blush) !important;
	border-color: var(--mat-rose-outline) !important;
	background-color: var(--mat-nouveau-rose) !important;
}
.maternite-important__title,
.maternite-important__heading {
	color: var(--mat-rose-blush) !important;
	fill: var(--mat-rose-blush) !important;
}
/* Picto de la pastille « Important » : vit DANS `.maternite-important__tag`
   (fond #f9516f, libellé blanc), pas dans la zone de contenu rose pâle — il ne
   doit donc pas suivre `--mat-rose-blush` comme les titres ci-dessus. Le SVG
   utilise fill="currentColor" sur ses <path> (bloc-important/index.js), donc
   la propriété `color` posée ici pilote réellement le rendu (contrairement au
   picto de l'accordéon plus haut, qui a un fill figé dans le markup).
   Retour client 05/08/2026 : le picto rendait en rose-blush terne au lieu de
   blanc, illisible sur le fond rose vif de la pastille. */
/* ⚠️ Règle retirée le 10/08/2026 : l'icône native de la pastille est désormais
   MASQUÉE et remplacée par la vraie icône Figma (blanche) — voir §5 « PICTOS »
   en fin de fichier. La colorier ici n'avait plus d'effet et prêtait à confusion. */

/* --- Bloc travaux : #a06108 / #d57c00 (orange) --- */
.maternite-bloc-travaux,
.wp-block-maternite-blocks-bloc-travaux {
	background-color: var(--mat-cream);
	border-color: var(--mat-rose-blush);
	color: var(--mat-blue-dark);
}
.maternite-bloc-travaux__icon,
.maternite-bloc-travaux__title {
	color: var(--mat-rose-blush);
}

/* =========================================================================
   4. Styles signature Maternité — patterns Figma
   ----------------------------------------------------------------------
   Adaptations visuelles spécifiques au design Maternité (cards arrondies
   30px avec outline rose, CTA pilule vert-bleu).
   ========================================================================= */

/* Cards génériques : outline rose + radius 30px */
.maternite-card,
.maternite-bloc-important,
/* ⚠️ La classe REELLE du bloc travaux est `maternite-travaux` (pas
   `maternite-bloc-travaux`, qui ne matche rien) : releve sur le rendu, il etait
   reste seul a 30px apres le passage a 20. */
.maternite-travaux, .wp-block-maternite-bloc-travaux,
.maternite-saviez-vous,
.maternite-a-retenir,
.maternite-info-utile,
.maternite-points-forts__item,
.maternite-temoignage,
.maternite-ressource-card,
.maternite-fiche-ecole {
	border-radius: var(--mat-card-radius, 20px);
	outline: 1px solid var(--mat-rose-outline);
	outline-offset: -1px;
}

/* Titres de sections (style Figma : 20px, 700, rose blush) */
.maternite-block-title,
.maternite-liens-utiles__title,
.maternite-ressource-kit__title,
.maternite-articles-lies__title,
.maternite-praticiens-team__title,
.maternite-equipe__title,
.maternite-documents-list__heading,
.maternite-points-forts__heading,
.maternite-pages-cards__heading {
	color: var(--mat-rose-blush);
	font-size: 20px;
	font-weight: 700;
	border-bottom-color: var(--mat-rose-outline);
}

/* CTA pilule vert-bleu */
.maternite-cta,
.maternite-button,
.maternite-btn,
.maternite-link-button,
.wp-block-maternite-blocks-cta a.maternite-cta__link {
	background-color: var(--mat-vert-bleu);
	color: var(--mat-blue-dark);
	border-radius: 30px;
	padding: 11px 37px;
	font-weight: 700;
}
.maternite-cta:hover,
.maternite-button:hover,
.maternite-btn:hover {
	background-color: var(--mat-rose-light);
	color: var(--mat-blue-dark);
}

/* Items liens utiles : fond nouveau-rose */
.maternite-liens-utiles__link,
.maternite-liens-utiles__item {
	background-color: var(--mat-nouveau-rose) !important;
	border-radius: 14px;
}
.maternite-liens-utiles__link:hover,
.maternite-liens-utiles__link:focus-visible {
	background-color: var(--mat-rose-light) !important;
	box-shadow: inset 0 0 0 2px var(--mat-rose-blush);
}
.maternite-liens-utiles__label {
	color: var(--mat-rose-blush);
}
.maternite-liens-utiles__desc {
	color: var(--mat-gray-meta);
}
.maternite-liens-utiles__icon,
.maternite-liens-utiles__arrow {
	color: var(--mat-blue-dark);
}

/* ⚠️ Les règles de CARTE et de TITRE de la timeline ont été retirées le
   21/09/2026 : le déroulé est désormais un composant unique, écrit dans
   `maternite.css` et appliqué au bloc du plugin par `block-timeline-plugin.php`
   (§7 en fin de fichier). Les remettre ici les ferait gagner par ordre de
   chargement et on retrouverait deux apparences de déroulé sur le site.
   Restent ci-dessous les seuls éléments propres au fork : icône d'en-tête,
   accent de titre, connecteurs. */
.maternite-timeline__connector,
.maternite-timeline__dot,
.maternite-timeline-step__indicator {
	background-color: var(--mat-vert-bleu) !important;
}
.maternite-timeline__icon-wrap {
	color: var(--mat-rose-blush) !important;
	background-color: var(--mat-nouveau-rose) !important;
	border-color: var(--mat-rose-outline) !important;
}
.maternite-timeline__title-accent,
.maternite-timeline__accent {
	color: var(--mat-rose-blush) !important;
	background-color: var(--mat-rose-blush) !important;
}
.maternite-timeline__icon-wrap svg,
.maternite-timeline__icon-wrap path {
	fill: var(--mat-rose-blush) !important;
}

/* Hero service : bandeau bleu foncé conservé (#14446B), mais accents en rose */
.maternite-hero-service__breadcrumb a,
.maternite-hero-service__category {
	color: var(--mat-rose-light);
}

/* Saviez-vous / À retenir : fond rose pâle */
.maternite-saviez-vous,
.maternite-a-retenir {
	background-color: var(--mat-nouveau-rose);
}
.maternite-saviez-vous__title,
.maternite-a-retenir__title {
	color: var(--mat-rose-blush);
}

/* Chiffres clés : valeur en rose blush */
.maternite-chiffres-cles__value,
.maternite-chiffres-cles__number {
	color: var(--mat-rose-blush);
}
.maternite-chiffres-cles__label {
	color: var(--mat-blue-dark);
}

/* Témoignage : citation rose blush */
.maternite-temoignage__quote,
.maternite-temoignage__author {
	color: var(--mat-blue-dark);
}
.maternite-temoignage__mark,
.maternite-temoignage__author-role {
	color: var(--mat-rose-blush);
}

/* Titre picto : couleur picto */
.maternite-titre-picto__icon,
.maternite-titre-picto svg {
	color: var(--mat-rose-blush);
	fill: var(--mat-rose-blush);
}
.maternite-titre-picto__title {
	color: var(--mat-blue-dark);
}

/* Articles liés / praticiens / équipes : accents */
.maternite-articles-lies__category,
.maternite-praticiens-team__role,
.maternite-equipe__role,
.maternite-equipe-ecole__role {
	color: var(--mat-rose-blush);
}

/* Plan d'accès / Se rendre : couleurs accentuées */
.maternite-plan-acces__heading,
.maternite-se-rendre__heading,
.maternite-infos-pratiques__heading {
	color: var(--mat-rose-blush);
}

/* Liens externes : flèche + accent */
.maternite-liens-externes__arrow,
.maternite-liens-externes__item:hover .maternite-liens-externes__label {
	color: var(--mat-rose-blush);
}

/* Accordéon section : header — la classe réelle du titre (accordeon-section/index.js
   save()) est `.maternite-accordeon__title`, jamais `.maternite-accordeon-section__title`
   (sélecteur mort retiré le 05/08/2026, cf. la note sur `.maternite-accordeon__icon`
   plus haut dans ce fichier — même famille de bug : couleur déclarée pour un
   sélecteur qui ne matche rien). */
.maternite-accordeon__title {
	color: var(--mat-blue-dark);
}

/* Structures associées */
.maternite-structures-associees__title {
	color: var(--mat-rose-blush);
}
.maternite-structures-associees__item {
	border-color: var(--mat-rose-outline);
}

/* =========================================================================
   Info utile — APLAT ROSE BLUSH (rétabli le 10/08/2026, signalé par Marie KUSY)
   ----------------------------------------------------------------------
   Ce bloc est le SEUL du parc dont le fond échappe au remap de variables
   du §2 : son dégradé est `linear-gradient(262deg, var(--chru-secondary)
   .6%, #06487e 99.4%)`. Or `--chru-secondary` vaut légitimement #14446B
   (le bleu foncé EST une couleur Maternité, utilisée pour les titres), et
   le second stop #06487e est en dur → le bloc restait bleu CHRU alors que
   tout le reste du parc était passé au rose.

   ⚠️ HISTORIQUE À NE PAS REJOUER. Ces règles avaient déjà été posées le
   08/07/2026 (décision Thomas : « carte rose-blush », aplat solide et non
   dégradé), puis SUPPRIMÉES le 05/08/2026 au motif que le bloc « est
   TOUJOURS un dégradé bleu foncé institutionnel ». Ce motif lisait le
   SCSS du plugin CHRU comme une spécification, alors que le plugin n'est
   qu'un fork à recolorer : la charte de référence est celle de Maternité,
   pas celle du CHRU. Le défaut de contraste alors constaté était réel
   mais mal attribué — il venait du fond CLAIR (`--mat-nouveau-rose`
   #FFF5F3) posé sous du texte blanc, pas du principe d'un fond rose.
   La bonne réponse est un rose FONCÉ : #9E5B5C sous texte blanc =
   5,1:1, conforme WCAG AA pour tout corps de texte.

   Règle générale : sur ce site, un bloc qui rend en bleu CHRU est un
   défaut à corriger, jamais un état de référence.
   ========================================================================= */
.maternite-info-utile,
.wp-block-maternite-info-utile {
	background: var(--mat-rose-blush) !important; /* #9E5B5C — 5,1:1 avec #fff */
	outline: none; /* pas de liseré : aplat net (annule le §4 « cards ») */
}

/* Lien inline : #afdcff (bleu clair CHRU, en dur) illisible sur rose → blanc,
   déjà distingué par gras + soulignement. Hover/focus → rose très clair. */
.maternite-info-utile__content .maternite-lien-inline {
	color: var(--mat-white) !important;
}
.maternite-info-utile__content .maternite-lien-inline:hover,
.maternite-info-utile__content .maternite-lien-inline:focus,
.maternite-info-utile__content .maternite-lien-inline:focus-visible {
	color: var(--mat-rose-outline) !important; /* #FFD6CF */
}

/* Lien fléché de pied de bloc : hover var(--chru-light-blue) → rose très clair. */
.maternite-info-utile__link:hover,
.maternite-info-utile__link:focus-visible {
	color: var(--mat-rose-outline) !important;
}

/* Impression : le plugin retombe sur var(--chru-secondary) = bleu. */
@media print {
	.maternite-info-utile {
		border-color: var(--mat-rose-blush) !important;
	}
	.maternite-info-utile__title,
	.maternite-info-utile__content,
	.maternite-info-utile__link {
		color: var(--mat-rose-blush) !important;
	}
}

/* Materiel / Equipe ecole */
.maternite-materiel-ecole__title,
.maternite-equipe-ecole__title,
.maternite-encart-ecole__title {
	color: var(--mat-rose-blush);
}

/* =========================================================================
   3b. Fuites hex CHRU résiduelles — blocs ajoutés/modifiés depuis v3.11
   ----------------------------------------------------------------------
   Hexes bruts (hors var()) repérés à la régénération v3.39 (fork → parité).
   !important : les styles de bloc sont enqueués au rendu (ordre défavorable).
   ========================================================================= */

/* contacter-service : encart bleu clair → rose pâle */
.maternite-contacter { background: var(--mat-nouveau-rose) !important; }

/* mise-en-avant : fond highlight bleu clair → rose pâle */
.maternite-mise-en-avant { background: var(--mat-nouveau-rose) !important; }

/* examens : fond hover bleu clair → rose pâle */
.maternite-examens { --examens-hover-bg: var(--mat-nouveau-rose) !important; }

/* liens-utiles : fond focus bleu clair → rose pâle */
.maternite-liens-utiles__link:focus-visible { background: var(--mat-nouveau-rose) !important; }

/* bloc-travaux : ON CONSERVE L'ORANGE CHRU (#d57c00 pilule / #a06108 texte).
   ⚠️ NE PAS remettre d'override rose ici — décision Thomas du 08/07/2026
   (« conserve le orange du chru »). L'orange est la couleur d'alerte-travaux
   du groupe, elle ne suit pas la charte rose de Maternité. L'override rose
   avait été retiré le 08/07, puis REMIS par la réécriture du 05/08/2026 :
   on obtenait une pilule rose sur un fond beige-orange, incohérent.
   (Le bloc-important, lui, reste bien en rose-rouge #f9516f, conforme Figma.) */


/* ressource-kit : bouton « Kit de ressources » en rose blush.
   ⚠️ REPORT D'UN CORRECTIF QUI VIVAIT DANS LE BUILD DU FORK (10/07/2026,
   demande Thomas). Le bloc utilise `var(--chru-secondary)`, qui vaut #14446B
   côté Maternité (le bleu foncé y est aussi une couleur de charte) : sans cette
   règle, chaque régénération repasse le bouton en BLEU. En le posant ici, le
   correctif survit désormais aux régénérations au lieu d'être écrasé.
   Logique conservée : repos = rose plein, survol = transparent + rose. */
.maternite-kit__link {
    background: var(--mat-rose-blush) !important;
    border-color: var(--mat-rose-blush) !important;
    color: #fff !important;
}
.maternite-kit__link:hover,
.maternite-kit__link:focus-visible {
    background: transparent !important;
    border-color: var(--mat-rose-blush) !important;
    color: var(--mat-rose-blush) !important;
}
.maternite-kit__link:hover svg path,
.maternite-kit__link:focus-visible svg path {
    stroke: var(--mat-rose-blush) !important;
}

/* encart-ecole variante « teal » — CORRECTION DE CONTRASTE (Marie 04/08/2026,
   « je ne suis pas certaine que les couleurs soient accessibles » ; validé
   Thomas 05/08).
   Le bloc pose `color:#fff` sur un fond qui, côté CHRU, est un teal FONCÉ
   (#0B827D). L'override le remplace par le teal CLAIR maternité (#99C8CF)
   sans toucher au texte : blanc sur pastel = 1,82:1, illisible.
   Le texte passe donc en bleu foncé sur cette variante → 5,57:1 (AA).
   ⚠️ Les variantes `grey` (9,48:1) et `blue` (10,15:1) sont déjà conformes,
   elles ne sont pas touchées. */
.maternite-encart-ecole--teal,
.maternite-encart-ecole--teal .maternite-encart-ecole__content,
.maternite-encart-ecole--teal .maternite-encart-ecole__title {
    color: var(--mat-blue-dark) !important;
}

/* Le bouton posé automatiquement dans les encarts colorés est un « outline
   blanc » (liseré + libellé blancs) : sur ce fond clair il souffrait du MÊME
   1,82:1. On l'inverse ICI, dans le contexte de l'encart uniquement — la
   variante `--outline-white` elle-même n'est pas redéfinie (source unique).
   Même parade que le garde-fou « fond jaune » du CHRU. */
.maternite-encart-ecole--teal .maternite-btn--outline-white {
    color: var(--mat-blue-dark) !important;
    border-color: var(--mat-blue-dark) !important;
}
.maternite-encart-ecole--teal .maternite-btn--outline-white:hover,
.maternite-encart-ecole--teal .maternite-btn--outline-white:focus,
.maternite-encart-ecole--teal .maternite-btn--outline-white:focus-visible {
    background: var(--mat-blue-dark) !important;
    color: #fff !important;
    border-color: var(--mat-blue-dark) !important;
}

/* Boutons posés automatiquement dans les blocs colorés par le filtre
   `block-links-buttons.php` — arrivé dans le fork avec la régénération du
   05/08/2026 (il date du 21/07 côté CHRU).
   ⚠️ Ce filtre pose les classes `.maternite-btn*`, dont l'override ne
   définissait que la COULEUR et le padding. Sans `display:inline-flex` ni
   bordure, le « bouton » restait un texte inline : pas de liseré, et son
   padding vertical chevauchait la ligne précédente (7px mesurés sur
   « Niveau Orange » / « S'y rendre »). Côté CHRU ces propriétés viennent de
   components.css, qui n'existe pas dans ce thème — d'où ce complément.
   Volontairement limité à `.maternite-btn` : `.maternite-cta` et
   `.maternite-button` gardent leur rendu historique. */
.maternite-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1.5px solid transparent;
    line-height: 1.36;
    text-decoration: none;
    vertical-align: middle;
}
.maternite-btn--sm {
    padding: 8px 16px;
    font-size: 13px;
}
/* Le filtre pose ces boutons au fil du texte, séparés par un simple <br> : sans
   marge propre, il ne restait que 3px entre la dernière ligne et le bouton
   (mesuré sur l'encart « Se rendre dans le service »). On lui donne l'air d'un
   bloc à part entière. `inline-flex` ne collapse pas ses marges, donc la valeur
   est celle qu'on voit. */
.maternite-encart-ecole__content .maternite-btn,
.maternite-important__text .maternite-btn,
.maternite-info-utile__content .maternite-btn,
.maternite-kit__body .maternite-btn {
    margin-top: 10px;
}
/* Variantes « outline » : le liseré seul, pas d'aplat.
   Placées APRÈS la règle générique `.maternite-btn` (spécificité égale :
   c'est l'ordre source qui tranche). */
.maternite-btn--outline-white,
.maternite-btn--outline {
    background-color: transparent;
}

/* =========================================================================
   5. PICTOS — vraies icônes Figma + glyphes en contour
   ----------------------------------------------------------------------
   ⚠️ RESTAURÉ le 10/08/2026 (signalé par Thomas : « bugs sur les pictos »).
   Ces règles dataient du 08/07/2026 et ont été PERDUES dans la réécriture
   de ce fichier le 05/08 : plus une seule `data:image/svg` ne subsistait.
   Conséquences visibles : pastille « Important » SANS aucun picto, pastille
   « Travaux » avec le triangle plein sans « ! », glyphes d'encart pleins au
   lieu du contour, bouton texte+image avec la grosse flèche native.

   Les data-URI ci-dessous sont les VRAIS exports Figma (règle CLAUDE.md :
   jamais d'icône reconstituée à la main) — repris à l'identique du backup
   `chru-blocks-mat-override.css.bak-saviez-20260710`, tracés non retouchés.

   Référence de forme = CHRU ; seule la couleur suit la charte Maternité.
   Exceptions ASSUMÉES vs CHRU, validées par Thomas le 08/07 — ne pas les
   « corriger » en les réalignant sur le CHRU :
     · glyphes des encarts « À retenir » (pin) et « Le saviez-vous » (loupe)
       en CONTOUR, là où le CHRU les a pleins (Thomas l'a demandé 2 fois) ;
     · flèche du bouton texte+image = la flèche fine du bloc « examen ».
   ========================================================================= */

/* ---- Pastilles « Important » / « Travaux » : icônes Figma (cercle-! / triangle-!) ----
   L'icône NATIVE est masquée dans les deux cas, puis reposée en `::before`.
   Pourquoi masquer plutôt que compléter : le parc est MIXTE — au 10/08, 3 pages
   de contenu client portent l'icône native dans leur markup (62 listériose,
   76 tabacologie, 311 échographies) et 5 ne l'ont pas (33, 276, 282, 630, 647,
   contenus seedés à la main). Sans masquage, les 3 premières afficheraient
   DEUX pictos. Masquer + reposer garantit le même rendu sur les 8 pages. */
.maternite-important__icon,
.maternite-travaux__icon { display: none !important; }

.maternite-important__tag::before,
.maternite-travaux__tag::before{content:"";display:inline-block;flex-shrink:0;width:18px;height:18px;margin-right:6px;background:no-repeat center/contain;}
.maternite-important__tag::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20transform%3D%22translate(-39%20-27)%22%20fill%3D%22%23fff%22%3E%3Cpath%20d%3D%22M51%2027C48.6266%2027%2046.3066%2027.7038%2044.3332%2029.0224C42.3598%2030.3409%2040.8217%2032.2151%2039.9135%2034.4078C39.0052%2036.6005%2038.7676%2039.0133%2039.2306%2041.3411C39.6936%2043.6689%2040.8365%2045.807%2042.5147%2047.4853C44.193%2049.1635%2046.3311%2050.3064%2048.6589%2050.7694C50.9867%2051.2324%2053.3995%2050.9948%2055.5922%2050.0865C57.7849%2049.1783%2059.6591%2047.6402%2060.9776%2045.6668C62.2962%2043.6935%2063%2041.3734%2063%2039C62.9966%2035.8185%2061.7312%2032.7682%2059.4815%2030.5185C57.2318%2028.2688%2054.1815%2027.0034%2051%2027ZM51%2049C49.0222%2049%2047.0888%2048.4135%2045.4443%2047.3147C43.7998%2046.2159%2042.5181%2044.6541%2041.7612%2042.8268C41.0043%2040.9996%2040.8063%2038.9889%2041.1922%2037.0491C41.578%2035.1093%2042.5304%2033.3275%2043.9289%2031.9289C45.3275%2030.5304%2047.1093%2029.578%2049.0491%2029.1921C50.9889%2028.8063%2052.9996%2029.0043%2054.8268%2029.7612C56.6541%2030.5181%2058.2159%2031.7998%2059.3147%2033.4443C60.4135%2035.0888%2061%2037.0222%2061%2039C60.9971%2041.6513%2059.9426%2044.1931%2058.0679%2046.0678C56.1931%2047.9426%2053.6513%2048.9971%2051%2049Z%22%2F%3E%3Cpath%20d%3D%22M50.998%2032C50.7328%2032%2050.4785%2032.1054%2050.2909%2032.2929C50.1034%2032.4804%2049.998%2032.7348%2049.998%2033V41C49.998%2041.2652%2050.1034%2041.5196%2050.2909%2041.7071C50.4785%2041.8946%2050.7328%2042%2050.998%2042C51.2633%2042%2051.5176%2041.8946%2051.7052%2041.7071C51.8927%2041.5196%2051.998%2041.2652%2051.998%2041V33C51.998%2032.7348%2051.8927%2032.4804%2051.7052%2032.2929C51.5176%2032.1054%2051.2633%2032%2050.998%2032Z%22%2F%3E%3Cpath%20d%3D%22M51.998%2045C51.998%2044.4477%2051.5503%2044%2050.998%2044C50.4458%2044%2049.998%2044.4477%2049.998%2045C49.998%2045.5523%2050.4458%2046%2050.998%2046C51.5503%2046%2051.998%2045.5523%2051.998%2045Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");}
.maternite-travaux__tag::before{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20transform%3D%22translate(-14%20-5)%22%3E%3Crect%20x%3D%2214.8%22%20y%3D%225.8%22%20width%3D%2222.4%22%20height%3D%2222.4%22%20rx%3D%2211.2%22%20stroke%3D%22%23fff%22%20stroke-width%3D%221.6%22%20fill%3D%22none%22%2F%3E%3Cpath%20d%3D%22M25.5%2011.4004C26.1159%2011.4004%2026.6528%2011.7751%2026.8652%2012.3535L30.2109%2021.4814H30.542C30.8507%2021.4816%2031.0996%2021.7321%2031.0996%2022.041C31.0995%2022.3498%2030.8506%2022.5994%2030.542%2022.5996H20.458C20.1494%2022.5994%2019.9005%2022.3498%2019.9004%2022.041C19.9004%2021.7321%2020.1493%2021.4816%2020.458%2021.4814H20.7891L24.1348%2012.3545C24.3472%2011.7752%2024.8841%2011.4004%2025.5%2011.4004ZM21.9785%2021.4814H29.0215L28.4229%2019.8447H22.5771L21.9785%2021.4814ZM22.9883%2018.7266H28.0107L27.4121%2017.0898H23.5879L22.9883%2018.7266ZM25.5%2012.5186C25.44%2012.5186%2025.258%2012.5352%2025.1826%2012.7402L23.9971%2015.9717H27.002L25.8164%2012.7402C25.7417%2012.5364%2025.5607%2012.5186%2025.5%2012.5186Z%22%20fill%3D%22%23fff%22%20stroke%3D%22%23fff%22%20stroke-width%3D%220.2%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");}

/* ---- « À retenir » : VRAIE ampoule Figma (fournie par Thomas le 10/08/2026) ----
   Le glyphe livré par le fork n'était qu'une SILHOUETTE pleine (bulbe + culot
   fusionnés, un seul sous-chemin, aucun détail intérieur). Le forcer en
   `fill:none;stroke` — ce qui était fait depuis le 08/07 — n'en traçait que la
   découpe extérieure : ça lisait comme une goutte, pas comme une ampoule.
   Aucun réglage CSS ne pouvait le réparer, l'information manquait dans le SVG.

   Le tracé ci-dessous est le VRAI dessin Figma (CHRU-Brabois, node 656-8330) :
   7 sous-chemins = bulbe + culot + filament + 4 rayons.
   ⚠️ Il se rend **en `fill`**, PAS en `stroke` : c'est une icône de style trait
   dont les traits sont déjà dessinés comme des formes remplies (les contours
   intérieurs creusent la forme par fill-rule). Y remettre un `stroke` la
   doublerait et la rendrait illisible — c'est l'erreur à ne pas refaire.
   Couleur : `#9E5B5C` (rose blush). Le `#0096D6` du fichier Figma est la
   couleur du CHRU, à ignorer (consigne Thomas).

   Pose : le `<svg>` natif porte lui-même le rond blanc (`background:#fff`,
   `border-radius:50%`, 51px, padding 10px) — on ne peut donc pas le masquer
   sans perdre la pastille, ni lui accrocher un `::before` (les pseudo-éléments
   ne sont pas rendus sur les éléments SVG). On masque donc son `<path>` et on
   repose le glyphe en `background-image` du `<svg>` lui-même. */
/* ⚠️ `flex-shrink: 0` — le badge est un conteneur flex et son icône héritait
   de `flex-shrink: 1` : dès que le libellé est long (le titre du bloc est
   éditable), le rond se comprimait en OVALE et le glyphe posé en fond se
   trouvait rogné. Mesuré le 21/09/2026 : avec « À retenir avant votre arrivée
   à la maternité », l'icône sortait à 20x51 au lieu de 51x51. Le défaut ne se
   voyait sur aucune page publiée, tous les titres y sont courts. */
.maternite-a-retenir__badge-icon { flex-shrink: 0 !important; }
.maternite-a-retenir__badge-icon > path { display: none !important; }
.maternite-a-retenir__badge-icon {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2023%2023%22%20fill=%22none%22%3E%3Cpath%20d=%22M11.363%203.84502C7.35182%203.9111%203.97239%207.22221%203.82954%2011.2248C3.74517%2013.5504%204.70579%2015.7581%206.46597%2017.2839C7.22431%2017.9419%207.6586%2018.9533%207.6586%2020.1266C7.6586%2021.7108%208.94902%2023%2010.5347%2023H12.4521C14.0378%2023%2015.3282%2021.7108%2015.3282%2020.1266V19.7674C15.3282%2018.8422%2015.7644%2017.9495%2016.5573%2017.2523C18.2139%2015.7983%2019.163%2013.7046%2019.163%2011.5064C19.163%209.43664%2018.3491%207.49614%2016.8717%206.04412C15.3944%204.5921%2013.4367%203.79808%2011.363%203.84502ZM13.4108%2020.1266C13.4108%2020.6553%2012.9813%2021.0844%2012.4521%2021.0844H10.5347C10.0055%2021.0844%209.57601%2020.6553%209.57601%2020.0605C9.57601%2019.7579%209.54629%2019.4609%209.50219%2019.1688H13.4501C13.4262%2019.3661%2013.4108%2019.5663%2013.4108%2019.7674V20.1266ZM15.2918%2015.8136C14.8019%2016.2437%2014.4069%2016.7303%2014.103%2017.2532H12.4521V13.2458C13.5652%2012.8493%2014.3695%2011.7957%2014.3695%2010.5486C14.3695%2010.019%2013.941%209.59084%2013.4108%209.59084C12.8807%209.59084%2012.4521%2010.019%2012.4521%2010.5486C12.4521%2011.0783%2012.0226%2011.5064%2011.4934%2011.5064C10.9642%2011.5064%2010.5347%2011.0773%2010.5347%2010.5486C10.5347%2010.0199%2010.1062%209.59084%209.57601%209.59084C9.04585%209.59084%208.6173%2010.019%208.6173%2010.5486C8.6173%2011.7957%209.42166%2012.8493%2010.5347%2013.2458V17.2532H8.86082C8.56362%2016.7188%208.18301%2016.238%207.72188%2015.8376C6.4027%2014.693%205.68175%2013.037%205.74503%2011.2938C5.8524%208.29207%208.38722%205.80946%2011.3956%205.76061C11.4282%205.76061%2011.4599%205.76061%2011.4934%205.76061C13.0139%205.76061%2014.4433%206.34391%2015.5276%207.41089C16.6359%208.49991%2017.2466%209.9548%2017.2466%2011.5074C17.2466%2013.1548%2016.5343%2014.7237%2015.2928%2015.8146L15.2918%2015.8136ZM16.0808%202.38246L17.2648%200.457287C17.5409%200.00520627%2018.1315%20-0.13559%2018.583%200.143129C19.0346%200.419932%2019.1755%201.00898%2018.8975%201.4601L17.7135%203.38527C17.5332%203.68027%2017.2178%203.84214%2016.8957%203.84214C16.7241%203.84214%2016.5515%203.79617%2016.3953%203.70039C15.9437%203.42358%2015.8028%202.83358%2016.0808%202.38246ZM22.4351%206.3554L20.5819%207.1906C20.4544%207.24903%2020.3202%207.27585%2020.1889%207.27585C19.8226%207.27585%2019.4746%207.06609%2019.3145%206.7117C19.0959%206.22993%2019.3107%205.66196%2019.7939%205.44549L21.647%204.6103C22.1321%204.39096%2022.6978%204.60742%2022.9144%205.08919C23.133%205.57097%2022.9183%206.13894%2022.4351%206.3554ZM4.00978%201.45914C3.73271%201.00802%203.8746%200.418017%204.32615%200.142171C4.77961%20-0.133674%205.36826%200.00807969%205.64436%200.458244L6.82549%202.38437C7.10255%202.8355%206.96066%203.4255%206.50912%203.70135C6.35285%203.79713%206.17932%203.84214%206.00963%203.84214C5.68655%203.84214%205.37209%203.67932%205.1909%203.38431L4.00978%201.45818V1.45914ZM3.54672%206.77587C3.38278%207.11972%203.03957%207.3199%202.68197%207.3199C2.54296%207.3199%202.40203%207.29021%202.26877%207.22508L0.545021%206.40042C0.0675869%206.17246%20-0.134699%205.60066%200.0944306%205.12367C0.321643%204.64573%200.896865%204.44172%201.37238%204.67351L3.09613%205.49817C3.57357%205.72613%203.77585%206.29889%203.54672%206.77587Z%22%20fill=%22%239E5B5C%22/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: 31px 31px !important; /* = 51px - 2x10px de padding : la zone de contenu prévue par le bloc */
}

/* ---- « Le saviez-vous » : loupe en CONTOUR ---- */
body .maternite-saviez-vous__badge svg path{fill:none !important;stroke:var(--mat-bleu-fonce,#14446B) !important;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round;}

/* ---- Bouton texte+image : flèche fine du bloc « examen » (retour Thomas 08/07) ---- */
body .maternite-texte-image__button svg{display:none !important;}
body .maternite-texte-image__button::after{content:"";display:inline-block;flex-shrink:0;width:15px;height:12px;background:no-repeat center/contain;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2215%22%20height%3D%2212%22%20viewBox%3D%220%200%2015%2012%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M9%201l5%205-5%205M14%206H1%22%20stroke%3D%22%2314446B%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");}

/* =========================================================================
   6. RETOURS MARIE KUSY — 11/08/2026
   ----------------------------------------------------------------------
   Corrections de blocs demandees dans « Retours Maternité - 10082026.docx ».
   Elles vivent ICI et pas dans le plugin : le fork est regenere
   periodiquement (v3.41 → v3.54 le 05/08) et tout correctif pose dans
   `build/` ou `src/` disparait au rebuild suivant. Cf. Regle N°1.
   ========================================================================= */

/* --- Timeline : titres d'etape en rose, halo de puce en rose --------------
   « Peut-on passer les titres en rose ? Peut-on passer le halo bleu de la
   puce en rose ? »
   Les deux valeurs sont des hex ECRITS EN DUR dans le CSS du bloc, donc hors
   d'atteinte du remap de variables du §2 : `#14446b` pour le titre d'etape,
   et `rgba(0,150,214,…)` — le bleu vif CHRU — pour l'anneau et l'ombre de la
   puce active. */
/* ⚠️ Retiré le 21/09/2026 avec le passage au composant unique : titre d'étape
   en rose, et halo rose de la puce active. Ces trois règles recoloraient le
   fork (le bleu vif CHRU de l'anneau) ; la maquette met le titre en bleu foncé
   et signale l'étape lue par l'opacité et le fond de la carte. */

/* --- Accordeon : des bordures ---------------------------------------------
   « Peut-on ajouter les bordures ? » Le bloc pose `border: none` sur l'item
   ET sur le panneau : l'override du §3 declarait bien une `border-color`
   rose, mais sans largeur ni style elle ne peignait rien. Le contenu deplie
   flottait donc sans delimitation (c'est la zone entouree sur la capture).
   On cadre l'item entier — l'entete et le panneau sont a l'interieur, un
   seul liseré suffit et evite la double ligne. */
.maternite-accordeon__item {
	border: 1px solid var(--mat-rose-outline) !important;
}
/* Le panneau reprend le liseré en haut uniquement, pour separer la reponse
   de sa question quand l'item est ouvert. */
.maternite-accordeon__item--open .maternite-accordeon__panel {
	border-top: 1px solid var(--mat-rose-outline);
	border-radius: 0 0 13px 13px;
}

/* --- « A retenir » : la pastille reprend sa bosse au-dessus de la carte ---
   Retour Marie du 14/08/2026 : « On n'a plus la bosse au-dessus comme sur le
   site du CHRU ? »

   ⚠️ Cette regle ANNULE le correctif du 11/08, qui rentrait la pastille dans
   la carte (`top: 8px`). La raison d'alors etait bonne mais la solution
   mauvaise : le bloc pose son badge a `top:-10px`, a cheval sur le bord, et
   le §4 ajoute a la carte un `outline` rose que la pastille venait couper en
   son milieu. On avait supprime la bosse pour supprimer le trait coupe —
   c'est-a-dire supprime l'intention de design pour reparer un defaut de
   rendu. Cote CHRU la bosse existe bien, la carte n'y a simplement pas de
   liseré.

   🛑 **Deux garnitures posees le matin du 21/09 ont ete RETIREES le meme jour**
   (retour de Thomas sur un gros plan) : un liseré rose autour de la pastille,
   et un masque cense interrompre le trait de la carte dessous. Les deux
   partaient de l'idee qu'un badge a cheval couperait le liseré de la carte.
   La mesure dit le contraire :
     · le badge est OPAQUE et peint apres la carte, il couvre donc le trait
       tout seul — verifie au pixel, aucun `#FFD6CF` sous la pastille sur la
       ligne du liseré ;
     · le masque, lui, traversait le ROND BLANC de l'icone et le barrait
       d'une ligne rose de 2px (le rond commence 9px sous le haut du badge,
       le masque etait pose a 10px) ;
   ⚠️ **Le gros plan qui a servi a valider ces deux garnitures etait fausse** :
   il avait ete pris avec un `zoom: 3` en CSS, qui comprime le badge et
   deforme tout. Un detail de rendu se controle a TAILLE REELLE, en
   agrandissant l'IMAGE ensuite, jamais en zoomant la page.

   ✅ **Le liseré de la pastille, lui, est REVENU** (retour de Thomas, « manque
   la bordure »). Sans lui, la pastille se confond avec la carte : le trait du
   cadre s'arrete net de chaque cote et le rond blanc de l'icone parait
   flotter au-dessus du vide. Avec lui, le trace est continu — trait de la
   carte, contour de la pastille, trait de la carte. Le CHRU s'en passe parce
   que SA carte n'a pas de liseré du tout ; ici le §4 en pose un a toutes les
   cartes, la pastille doit donc le prolonger.
   🔑 C'est le MASQUE qui etait fautif, pas le liseré : la bonne combinaison
   est « liseré oui, masque non », celle qui n'avait pas ete essayee le matin.
   Mesure a l'appui : aucun `#FFD6CF` sous la pastille sur la ligne du liseré
   de la carte, et l'ampoule centree a 10px des quatre cotes de son rond. */
.maternite-a-retenir__badge {
	top: -10px !important;
	outline: 1px solid var(--mat-rose-outline);
	outline-offset: -1px;
}

/* --- Bloc texte + image : titre a la taille des H2 ------------------------
   « Peux-tu mettre la taille du titre a la meme taille que les H2 stp ? »
   Mesure : titre du bloc 32px, H2 editorial 24px. Le pendant mobile du bloc
   (24px sous 768px) devient donc 20px pour garder l'ecart de proportion.
   ⚠️ Marie demande la meme chose sur le site du CHRU : ce site est un AUTRE
   projet, la modification n'y est pas faite ici. */
.maternite-texte-image__title {
	font-size: 24px !important;
	line-height: 1.25 !important;
}
@media (max-width: 768px) {
	.maternite-texte-image__title { font-size: 20px !important; }
}

/* --- Border-radius : un seul arrondi de carte ----------------------------
   « Si les border-radius pouvaient etre les memes d'un bloc a l'autre. »
   Inventaire des arrondis REELLEMENT rendus sur la page de test (38 blocs) :
   30px pour 14 blocs-cartes, et trois exceptions —
     · ressource-kit    : `14px 0 0 14px` (asymetrique, coins droits carres)
     · contacter-service: 14px  ← la carte rose de la capture du retour
     · mise-en-avant    : 14px
   On aligne ces trois-la sur 30px, valeur largement majoritaire et celle de
   la maquette.
   ⚠️ On ne touche PAS aux 14px des elements INTERNES (item d'accordeon,
   section d'examen) : ce sont des lignes dans une liste, pas des cartes
   autonomes ; les arrondir a 30px les ferait ressembler a des boutons. */
:root {
	/* ⚠️ VALEUR UNIQUE des arrondis de cartes. C'est le seul endroit a changer.
	   30px au depart (maquette Figma) → 20px le 11/08/2026 : Marie trouvait le
	   rendu « trop arrondi » apres l'uniformisation. Sa consigne — « adapter
	   ceux du bloc des ecoles » — etait inapplicable telle quelle : `encart-ecole`
	   etait DEJA a 30px, comme le bloc qu'elle entourait. Arbitrage de Thomas
	   sur comparatif visuel 30/20/14 : 20px pour tout le monde. */
	--mat-card-radius: 20px;
}

/* Toutes les cartes-blocs partagent le meme arrondi. La liste est celle des
   blocs qui rendent VISUELLEMENT une carte (fond ou liseré), relevee sur la
   page de test — pas tous les blocs du plugin : `chapo`, `titre-picto`,
   `chiffres-cles`, `pages-cards`… n'ont pas de boite et resteraient a 0. */
.maternite-card,
.maternite-bloc-important, .wp-block-maternite-bloc-important,
.maternite-bloc-travaux,
.maternite-saviez-vous,
.maternite-a-retenir,
.maternite-info-utile, .wp-block-maternite-info-utile,
.maternite-points-forts__item,
.maternite-temoignage,
.maternite-ressource-card,
.maternite-fiche-ecole,
.maternite-encart-ecole,
.maternite-texte-image,
.maternite-liens-externes,
.maternite-plan-acces,
.maternite-organigramme,
.maternite-kit, .wp-block-maternite-ressource-kit,
.maternite-contacter, .wp-block-maternite-contacter-service,
.maternite-mise-en-avant, .wp-block-maternite-mise-en-avant {
	border-radius: var(--mat-card-radius) !important;
}
/* Sous-boites qui doivent suivre le meme arrondi pour ne pas depasser du
   cadre : l'entete de `texte-image` (arrondi haut seulement, l'image ferme le
   bas) et l'image du kit (a gauche en desktop, en haut en mobile). */
.maternite-texte-image__content {
	border-radius: var(--mat-card-radius) var(--mat-card-radius) 0 0 !important;
}
.maternite-texte-image--no-media .maternite-texte-image__content {
	border-radius: var(--mat-card-radius) !important;
}
.maternite-kit, .wp-block-maternite-ressource-kit { overflow: hidden; }
.maternite-kit__image {
	border-radius: var(--mat-card-radius) 0 0 var(--mat-card-radius) !important;
}
@media (max-width: 768px) {
	/* En colonne, l'image passe en haut : l'arrondi suit. */
	.maternite-kit__image {
		border-radius: var(--mat-card-radius) var(--mat-card-radius) 0 0 !important;
	}
}

/* Le kit garde son filet d'accent de 4px a droite, mais en ROSE : il consomme
   `var(--chru-secondary)`, qui vaut legitimement #14446B cote Maternité (le
   bleu foncé est une couleur de charte), donc le remap du §2 ne l'atteint pas.
   Tant que les coins droits etaient carres, ce filet se lisait comme une
   tranche ; avec l'arrondi a 30px il dessine un arc bleu franc sur une carte
   rose — vu en recette apres le passage a 30px. Regle N°1 : un bleu CHRU
   visible est un defaut, pas une reference. */
.maternite-kit,
.wp-block-maternite-ressource-kit {
	border-right-color: var(--mat-rose-blush) !important;
}

/* --- Liseré des cartes : le gris CHRU #e1e1e1 → le rose de la charte -------
   « Aller plus loin » (liens-externes), « Texte + image » et les etapes de
   timeline portent un `border: 1px solid #e1e1e1` ECRIT EN DUR, alors que
   toutes les autres cartes du site sont cerclees de `--mat-rose-outline`
   (#FFD6CF, pose par le §4). D'ou l'impression que « la mise en page n'est
   pas correcte selon les modeles » : ce n'est pas le gabarit qui change,
   c'est le liseré qui differe d'un bloc a l'autre sur une meme page.
   ⚠️ Mesure faite avant de conclure : la GEOMETRIE de « Aller plus loin »
   (largeur, marges, arrondi, taille de titre) est identique sur les trois
   gabarits qui portent ce bloc et en mobile — rien a corriger de ce cote. */
.maternite-liens-externes,
.maternite-texte-image__content {
	border-color: var(--mat-rose-outline) !important;
}
.maternite-examens { --examens-border: var(--mat-rose-outline); }


/* =========================================================================
   §7 — LE « DÉROULÉ » DU PLUGIN RENDU COMME CELUI DU THÈME (21/09/2026)
   -------------------------------------------------------------------------
   Demande de Thomas : « convertir toutes les timelines du site sur ta
   proposition ». Elles ne viennent pas du thème : 13 pages publiées utilisent
   `maternite/timeline` du PLUGIN, avec l'apparence du fork CHRU (pastilles
   numérotées bleu foncé de 38px, liseré gris, texte bleu ardoise).

   `inc/block-timeline-plugin.php` leur ajoute au vol les classes `mat-tl*` :
   l'essentiel du style vient donc du composant unique de `maternite.css`, et
   il ne reste ici que ce qui est PROPRE au markup du plugin, à savoir sa
   pastille en `position: absolute` (le composant maison la met en grille) et
   les règles du fork à neutraliser. Rien n'est écrit en base et rien n'est
   modifié dans le plugin (Règle N°1).
   ========================================================================= */

/*
 * ⚠️ SÉLECTEURS PRÉFIXÉS `body` — ce n'est pas de la coquetterie. Le CSS des
 * blocs du plugin est imprimé EN LIGNE, donc APRÈS cette feuille : à
 * spécificité égale, c'est lui qui gagne. Mesuré le 21/09 sur la pastille,
 * dont le chevron restait invisible parce que
 * `.maternite-timeline-step.is-active .maternite-timeline-step__number`
 * (0,3,0) écrasait la règle d'ici par un raccourci `background`, qui remet
 * l'image à `none` au passage. Le `body` en tête ajoute le point qu'il faut.
 *
 * ⚠️ Et ici l'étape EST la carte : les états du composant, écrits pour un
 * `__body` ENFANT de l'item, ne peuvent pas s'appliquer par descendance. Ils
 * sont donc réécrits sur l'élément unique.
 */

/* --- LA SECTION : un aplat qui traverse la page ---------------------------
   Demande de Thomas du 22/09/2026, capture à l'appui : « il faut cette
   version », « partout, c'est le rendu de référence ». Le déroulé ne vit plus
   sur le fond de la page ni dans une carte blanche : il est posé sur un aplat
   qui va d'un bord à l'autre de la fenêtre.

   Même formule que les blocs `alignfull` : `maternite.js` pose sur le
   conteneur de contenu sa distance réelle à chaque bord, la largeur s'écrit
   `100% + gauche + droite`, et le PADDING de la même valeur ramène le déroulé
   dans la colonne de lecture — sinon il passerait sur le sommaire `sticky`.
   Sans JavaScript, les deux valent 0 : la section retombe dans la colonne avec
   24px de gouttière, jamais un débordement.

   🎨 Le fond se change bloc par bloc, dans l'onglet « Avancé » du bloc, champ
   « Classe(s) CSS additionnelle(s) » : `mat-fond-rose`, `mat-fond-bleu`
   (défaut) ou `mat-fond-aucun`. */
.wp-block-maternite-timeline {
	background: var(--mat-aplat-bleu-vert, #EFF6F7);
	width: calc(100% + var(--mat-cl, 0px) + var(--mat-cr, 0px));
	max-width: none;
	margin-left: calc(-1 * var(--mat-cl, 0px));
	margin-right: calc(-1 * var(--mat-cr, 0px));
	/* 36px en bas et pas 64 : le titre ouvre l'aplat à 28px au-dessus de la
	   première carte (« attention au gap sous la timeline », 22/09/2026) — à 64,
	   la bande bleue sous la dernière carte se lisait comme un trou. */
	padding: 56px var(--mat-cr, 24px) 36px var(--mat-cl, 24px);
}
.wp-block-maternite-timeline.mat-fond-rose  { background: var(--mat-rose-clair, #FFF5F3); }
.wp-block-maternite-timeline.mat-fond-bleu  { background: var(--mat-aplat-bleu-vert, #EFF6F7); }
.wp-block-maternite-timeline.mat-fond-aucun {
	background: transparent;
	padding-top: 0;
	padding-bottom: 0;
}

/* --- Les motifs floraux autour du déroulé ---------------------------------
   Demande de Thomas du 22/09/2026 : « tu ne peux pas ajouter les petites
   fleurs comme ça sur toutes les timelines ? » — comme sur les pages
   Consultation spécialisée, où ils encadrent le déroulé.

   Deux pseudo-éléments sur la section. ⚠️ Positionnés par rapport à sa PADDING
   BOX, c'est-à-dire au bord de la colonne de lecture : un `left: -64px` tombe
   donc dans la gouttière, pas sous le sommaire. Les places ont été mesurées
   avant d'écrire : sur une page à sommaire il reste 106px à gauche (entre le
   sommaire et le rail) et 66px à droite ; sur une page sans sommaire, 275px de
   chaque côté. D'où des motifs de 90 et 70px, à cheval sur le déroulé comme la
   maquette, et jamais sur du texte (les cartes ont 36px de padding).
   Masqués sous 1200px, où la place disparaît. */
.wp-block-maternite-timeline { position: relative; }
.wp-block-maternite-timeline::before,
.wp-block-maternite-timeline::after {
	/* ⚠️ Motifs PETITS et calés sur la gouttière réellement disponible, mesurée
	   sur chaque gabarit : entre la fin du sommaire et la pastille du déroulé,
	   il reste 49px sur un article et 106px sur une page standard. Un motif de
	   90px y touchait la pastille — un contrôle qui ne mesure que les LIGNES DE
	   TEXTE ne le voit pas, la pastille n'est pas du texte.
	   🛑 Et surtout PAS `z-index: -1` pour « passer derrière » : le pseudo-élément
	   repasse alors derrière le FOND de la section, qui est opaque, et le motif
	   disparaît purement et simplement (essayé le 22/09). */
	content: "";
	position: absolute;
	pointer-events: none;
	background-repeat: no-repeat;
	background-size: contain;
}
/* ⚠️ `var(--mat-cl)` dans le calcul : un pseudo-élément absolu se cale sur la
   PADDING BOX de son conteneur, donc sur le bord de la SECTION (0) et pas sur
   celui de la colonne de lecture. Sans ce terme, mesure du 22/09 : le motif de
   gauche partait à -64px (hors écran) et celui de droite dépassait de 10px. */
.wp-block-maternite-timeline::before {
	left: calc(var(--mat-cl, 24px) - 48px);
	top: 16%;
	width: 44px;
	height: 48px;
	background-image: url("../img/feuille-rose-plume.svg");
}
.wp-block-maternite-timeline::after {
	/* `max()` : sur une page à sommaire la gouttière droite ne fait que 24px, le
	   motif se cale donc au bord de la fenêtre ; sur une page sans sommaire elle
	   fait 270px et il recule d'autant, sinon il mordait sur le TEXTE des cartes
	   (mesuré : 5 lignes touchées sur la page « Dépistage trisomie 21 »). */
	right: max(0px, calc(var(--mat-cr, 24px) - 70px));
	bottom: 14%;
	width: 56px;
	height: 60px;
	background-image: url("../img/fleur-jaune-tige.svg");
}
@media (max-width: 1200px) {
	.wp-block-maternite-timeline::before,
	.wp-block-maternite-timeline::after { display: none; }
}

/* --- L'aplat prend avec lui ce qui appartient au déroulé -------------------
   Retour de Thomas du 22/09/2026 : « attention à ne pas séparer les éléments ».
   L'aplat s'arrêtait au bloc, si bien que le TITRE qui l'introduit restait sur
   le blanc au-dessus et que l'encart « Important » qui le conclut tombait sur
   le blanc en dessous : trois morceaux d'une même idée, coupés en deux traits.

   ⚠️ TOUS les conteneurs de contenu, pas seulement celui des pages standard :
   le déroulé se pose aussi dans un ARTICLE (`.mat-single__content`) et dans une
   fiche événement (`.mat-evt__content`). Écrite pour le seul
   `.mat-page-std__content`, la règle laissait le titre sur le blanc dès qu'on
   sortait des pages — signalé par Marie le 22/09 sur l'article « Bien
   recueillir son lait » : « c'est possible d'intégrer le titre au fond ? ».

   Relevé sur les 13 pages : le déroulé est TOUJOURS précédé d'un `h2` éditorial,
   et parfois suivi d'un encart, séparé ou non par un `spacer`. Ces voisins-là,
   et eux seuls : `:has(+ …)` et `+` ne visent que l'élément IMMÉDIATEMENT
   adjacent, donc rien n'est regroupé au jugé. Un navigateur sans `:has()`
   retombe sur l'état d'avant — le titre hors de l'aplat — jamais sur un rendu
   cassé.

   ⚠️ Deux traitements DIFFÉRENTS, et c'est voulu : le titre n'a ni fond ni
   marges propres, il prend donc l'aplat directement ; l'encart, lui, EST une
   carte avec son fond et ses marges. Lui poser l'aplat a produit un
   débordement de 442px (mesuré : sa largeur passait à 1440 sans que ses marges
   négatives s'appliquent, une autre règle les tenant). L'aplat passe donc
   DERRIÈRE lui, par un pseudo-élément. */
:is(.mat-page-std__content, .mat-single__content, .mat-evt__content, .entry-content) > :is(h2, h3):has(+ .wp-block-maternite-timeline) {
	background: var(--mat-aplat-bleu-vert, #EFF6F7);
	width: calc(100% + var(--mat-cl, 0px) + var(--mat-cr, 0px));
	max-width: none;
	margin-left: calc(-1 * var(--mat-cl, 0px));
	margin-right: calc(-1 * var(--mat-cr, 0px));
	margin-bottom: 0;
	padding: 56px var(--mat-cr, 24px) 0 var(--mat-cl, 24px);
}
/* Le titre ouvre l'aplat : le déroulé n'a plus à le rouvrir. */
:is(.mat-page-std__content, .mat-single__content, .mat-evt__content, .entry-content) > :is(h2, h3):has(+ .wp-block-maternite-timeline) + .wp-block-maternite-timeline {
	margin-top: 0;
	padding-top: 28px;
}

/* L'encart qui conclut : l'aplat passe derrière lui (z-index négatif), sa
   carte reste au-dessus avec son propre fond. */
:is(.mat-page-std__content, .mat-single__content, .mat-evt__content, .entry-content) > .wp-block-maternite-timeline + :is([class*="wp-block-maternite-bloc-"], .wp-block-maternite-a-retenir, .wp-block-maternite-saviez-vous, .wp-block-maternite-info-utile),
:is(.mat-page-std__content, .mat-single__content, .mat-evt__content, .entry-content) > .wp-block-maternite-timeline + .wp-block-spacer + :is([class*="wp-block-maternite-bloc-"], .wp-block-maternite-a-retenir, .wp-block-maternite-saviez-vous, .wp-block-maternite-info-utile) {
	position: relative;
	margin-top: 0;
}
:is(.mat-page-std__content, .mat-single__content, .mat-evt__content, .entry-content) > .wp-block-maternite-timeline + :is([class*="wp-block-maternite-bloc-"], .wp-block-maternite-a-retenir, .wp-block-maternite-saviez-vous, .wp-block-maternite-info-utile)::before,
:is(.mat-page-std__content, .mat-single__content, .mat-evt__content, .entry-content) > .wp-block-maternite-timeline + .wp-block-spacer + :is([class*="wp-block-maternite-bloc-"], .wp-block-maternite-a-retenir, .wp-block-maternite-saviez-vous, .wp-block-maternite-info-utile)::before {
	content: "";
	position: absolute;
	z-index: -1;
	top: -32px;
	bottom: -64px;
	left: calc(-1 * var(--mat-cl, 24px));
	right: calc(-1 * var(--mat-cr, 24px));
	background: var(--mat-aplat-bleu-vert, #EFF6F7);
	pointer-events: none;
}
/* Le déroulé ne referme pas l'aplat quand un encart le suit. */
:is(.mat-page-std__content, .mat-single__content, .mat-evt__content, .entry-content) > .wp-block-maternite-timeline:has(+ :is([class*="wp-block-maternite-bloc-"], .wp-block-maternite-a-retenir, .wp-block-maternite-saviez-vous, .wp-block-maternite-info-utile)),
:is(.mat-page-std__content, .mat-single__content, .mat-evt__content, .entry-content) > .wp-block-maternite-timeline:has(+ .wp-block-spacer + :is([class*="wp-block-maternite-bloc-"], .wp-block-maternite-a-retenir, .wp-block-maternite-saviez-vous, .wp-block-maternite-info-utile)) {
	padding-bottom: 0;
	margin-bottom: 0;
}

/* Le conteneur : la place à gauche passe de 40 à 62px (pastille 44 + 18 de
   gouttière), l'écart entre étapes de 28 à 24, comme la maquette. */
body .maternite-timeline__steps.mat-tl {
	padding-left: 62px;
	gap: 24px;
	/* Même largeur utile que le modèle (890 = 828 de carte + 62 de rail), quelle
	   que soit la colonne qui l'accueille : sans ce plafond, une page à sommaire
	   donnait des cartes de 912 et une page sans sommaire 838. */
	max-width: 890px;
	margin-left: auto;
	margin-right: auto;
}
/* Les deux rails du plugin (fond + progression pilotée par SON script) sont
   remplacés par ceux du composant : même couleur, même départ, et la hauteur
   vient de `--mat-tl-fill`, posée par `maternite.js`. */
body .maternite-timeline__steps.mat-tl::before,
body .maternite-timeline__steps.mat-tl::after {
	left: 21px;
	top: var(--mat-tl-top, 82px);
	width: 2px;
	border-radius: 0;
	background: var(--mat-vert-bleu, #99C8CF);
}
body .maternite-timeline__steps.mat-tl::before { bottom: 0; opacity: 0.3; }
body .maternite-timeline__steps.mat-tl::after {
	height: var(--mat-tl-fill, 0px);
	opacity: 1;
	transition: none;
}

/* L'étape : c'est elle la carte. */
body .maternite-timeline-step.mat-tl__item {
	display: block;
	background: #fff;
	border: 1px solid rgba(255, 214, 207, 0.4);
	border-radius: 0;
	padding: 36px;
	box-shadow: 0 2px 86px rgba(233, 233, 233, 0.28);
	outline: none; /* le §4 en pose un sur les cartes ; ici la bordure suffit */
	transition: background-color 0.35s ease;
}
/* Étape mise en avant : la première sans JavaScript, celle que la lecture a
   atteinte ensuite — comme le composant. */
body .maternite-timeline__steps .maternite-timeline-step.mat-tl__item:first-child { background: var(--mat-rose-clair, #FFF5F3); }
body .maternite-timeline__steps.is-js .maternite-timeline-step.mat-tl__item:first-child { background: #fff; }
body .maternite-timeline__steps.is-js .maternite-timeline-step.mat-tl__item.is-active {
	background: var(--mat-rose-clair, #FFF5F3);
	border-color: rgba(255, 214, 207, 0.4);
	box-shadow: 0 2px 86px rgba(233, 233, 233, 0.28);
}

/* La pastille : un `<span>` vide numéroté par un compteur CSS. Le numéro est
   retiré et le chevron du site posé en fond (le vrai tracé, pas un caractère
   « v »). 44px, centrée sur la hauteur de sa carte. */
body .maternite-timeline-step__number.mat-tl__chevron,
body .maternite-timeline-step.is-active .maternite-timeline-step__number.mat-tl__chevron {
	/* `position: absolute` explicite : le composant met ses pastilles en
	   grille, donc en `relative`, et cette règle-là gagnait sur le plugin —
	   la pastille repartait dans le flux, en haut de la carte (mesuré). */
	position: absolute;
	left: -62px;
	/* Centrage vertical par `top/bottom: 0` + marges automatiques, et non par
	   `top: 50%` : mesuré le 21/09, le pourcentage ne se résolvait pas sur la
	   hauteur attendue (pastille à 37px du haut d'une carte de 409) parce que
	   le plugin la positionne dans un conteneur différent du nôtre. Les
	   marges automatiques, elles, centrent sans arithmétique. */
	top: 0;
	bottom: 0;
	margin-top: auto;
	margin-bottom: auto;
	transform: none;
	width: 44px;
	height: 44px;
	background-color: var(--mat-vert-bleu, #99C8CF);
	/* ⚠️ Espaces encodés en %20 : un data-URI qui en contient est refusé en
	   silence par le navigateur (piège déjà vécu sur l'ampoule « À retenir »,
	   10/08) — l'icône disparaît sans aucune erreur. */
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='44'%20height='44'%20viewBox='0%200%2044%2044'%20fill='none'%3E%3Cpath%20d='M14%2017L22%2025L30%2017'%20stroke='%2314446B'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 44px 44px;
	box-shadow: none;
	color: transparent;
	transition: opacity 0.35s ease;
}
body .maternite-timeline-step__number.mat-tl__chevron::before { content: none; }

/* Typo des étapes : le composant la porte, le plugin la ré-impose avec ses
   propres tailles et le bleu ardoise CHRU. */
body .maternite-timeline-step__title.mat-tl__title {
	color: var(--mat-bleu-fonce, #14446B);
	/* 20px (Figma : 16px), demande Marie KUSY du 22/09/2026. Même valeur
	   que .mat-tl__title dans maternite.css. */
	font-size: 20px;
	font-weight: 700;
	line-height: 1.3;
	margin: 0 0 24px;
}
body .maternite-timeline-step__content.mat-tl__desc {
	color: var(--mat-bleu-fonce, #14446B);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.36;
	gap: 8px;
}
/* Le `__body` interne n'est plus qu'un conteneur : sans gouttière, sinon elle
   s'ajoute aux 24px que le composant met déjà sous le titre. */
body .maternite-timeline-step__body { gap: 0; }

@media (max-width: 720px) {
	body .maternite-timeline__steps.mat-tl { padding-left: 48px; }
	body .maternite-timeline__steps.mat-tl::before,
	body .maternite-timeline__steps.mat-tl::after { left: 16px; }
	body .maternite-timeline-step.mat-tl__item { padding: 20px 18px; }
	body .maternite-timeline-step__number.mat-tl__chevron,
	body .maternite-timeline-step.is-active .maternite-timeline-step__number.mat-tl__chevron {
		left: -48px;
		width: 34px;
		height: 34px;
		background-size: 34px 34px;
	}
}

/* Bloc Information en mobile : le picto « i » est un grand cercle dessiné en
   partie HORS de son viewBox (jusqu'à x = -24), pour déborder du bord gauche du
   bloc en desktop. Sous 768px le plugin le ramène dans un carré de 48px et le
   SVG rognait le cercle (doc Marie KUSY du 31/08/2026). On le laisse dépasser
   de son carré : la marge intérieure du bloc a la place. */
@media (max-width: 768px) {
	.maternite-info-utile--large .maternite-info-utile__icon { overflow: visible; }
}

/* Bloc Examens : pas de soulignement des libellés (doc Marie KUSY du
   31/08/2026). La règle vient du CSS du bloc, imprimé EN LIGNE après cette
   feuille : d'où le préfixe `body` (même geste que la timeline, 21/09). */
body .maternite-examens__label { text-decoration: none; }

/* Kit de ressources : plusieurs boutons côte à côte, à la ligne s'ils ne
   tiennent pas (doc Marie KUSY du 31/08/2026). Le CSS du bloc les empile. */
body .maternite-kit__links { flex-direction: row; flex-wrap: wrap; gap: 10px 12px; }

/* ==========================================================================
   §8 : LIENS DANS UN BLOC À COULEUR DE FOND (05/10/2026, retours Marie du 31/08,
   page « Bâtiment des consultations néonatales »). Un paragraphe ou un groupe
   coloré dans l'éditeur garde la couleur de lien rose du fil éditorial : rose
   sur rose-blush, illisible. Le lien y prend la couleur du texte du bloc
   (blanc sur fond foncé, bleu foncé sur fond clair) et reste souligné, seul
   repère restant. Les boutons ne sont pas concernés.
   ========================================================================== */
.has-background a:not(.wp-block-button__link):not([class*="__btn"]):not([class*="__cta"]):not([class*="-button"]):not([class*="-btn"]) {
	color: inherit !important;
	text-decoration: underline !important;
	text-underline-offset: 3px;
}
.has-background a:not(.wp-block-button__link):not([class*="__btn"]):not([class*="__cta"]):not([class*="-button"]):not([class*="-btn"]):hover {
	text-decoration-thickness: 2px !important;
}