/* ==========================================================================
   Styles personnalises — Seche AE
   Correctifs pour correspondre aux maquettes Figma
   ========================================================================== */

/* --------------------------------------------------------------------------
   Override couleur black (WP core impose #000000, maquette = #202020)
   -------------------------------------------------------------------------- */

:root {
    --wp--preset--color--black: #202020;
    --seche-container-padding: 40px;
}

@media (max-width: 640px) {
    :root {
        --seche-container-padding: 20px;
    }
}

/* --------------------------------------------------------------------------
   Zone de contenu = référence de largeur des blocs (@container seche-contenu)
   Au front elle fait toute la fenêtre : rendu identique aux anciennes media
   queries. Dans l'éditeur, elle suit la « feuille » réduite du canevas.
   -------------------------------------------------------------------------- */

main.leb-main,
.editor-styles-wrapper .is-root-container {
    container: seche-contenu / inline-size;
}

/* --------------------------------------------------------------------------
   Blocs natifs dans le contenu — layout constrained
   -------------------------------------------------------------------------- */

body:not(.single-post) .entry-content > .wp-block-heading,
body:not(.single-post) .entry-content > .wp-block-paragraph,
body:not(.single-post) .entry-content > .wp-block-list,
body:not(.single-post) .entry-content > .wp-block-image,
body:not(.single-post) .entry-content > .wp-block-quote,
body:not(.single-post) .entry-content > .wp-block-separator,
body:not(.single-post) .entry-content > h2,
body:not(.single-post) .entry-content > h3,
body:not(.single-post) .entry-content > p,
body:not(.single-post) .entry-content > ul,
body:not(.single-post) .entry-content > ol {
    max-width: var(--wp--style--global--content-size);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--seche-container-padding);
    padding-right: var(--seche-container-padding);
}

/* --------------------------------------------------------------------------
   Typographie globale — h2 avec barre accent (maquette)
   -------------------------------------------------------------------------- */

/* Scopé au contenu du site (front + iframe éditeur) pour ne pas
   impacter la sidebar admin, les panneaux WP, etc. */
/* NB : la variante éditeur utilise :where() pour abaisser sa spécificité à
   (0,1,0) — sinon `.editor-styles-wrapper h2` (0,1,1) est à égalité avec les
   règles de titre des blocs (.seche-x__header h2) et le vainqueur dépend de
   l'ordre de chargement, qui diffère entre le front et l'iframe éditeur (titre
   à 4-xl dans l'éditeur mais 5-xl en front). Avec :where, les titres de blocs
   l'emportent dans l'éditeur exactement comme sur le front. Le front
   (.leb-main h2) reste à pleine spécificité, donc inchangé. */
.leb-main h2,
.editor-styles-wrapper :where(h2) {
    font-size: var(--wp--preset--font-size--4-xl);
    font-weight: 400;
    line-height: 1.1;
}

.leb-main h2:empty::after,
.editor-styles-wrapper :where(h2):empty::after {
    display: none;
}

.leb-main h2::after,
.editor-styles-wrapper :where(h2)::after {
    content: '';
    display: block;
    width: 60px;
    height: 4px;
    background: var(--wp--preset--color--green-accent);
    border-radius: 2px;
    margin-top: 16px;
}

/* La barre suit l'alignement du titre (centré, à droite) */
.leb-main h2.has-text-align-center::after,
.editor-styles-wrapper :where(h2.has-text-align-center)::after {
    margin-inline: auto;
}

.leb-main h2.has-text-align-right::after,
.editor-styles-wrapper :where(h2.has-text-align-right)::after {
    margin-inline-start: auto;
}

/* Modèle 404 (parent) : la racine n'a pas de marge latérale sur ce site,
   on rend la gouttière du conteneur pour que rien ne colle aux bords. */
.leb-main.leb-404 {
    padding-inline: var(--seche-container-padding);
}

/* Pas de barre dans les zones CTA, footer, hero, témoignage */
.seche-cta-section h2::after,
.seche-footer h2::after,
.seche-hero h2::after,
.seche-temoignage h2::after {
    display: none;
}

/* Accent italic dans les titres */
h2 em, h3 em {
    font-family: var(--wp--preset--font-family--accent);
    font-style: italic;
    font-weight: 400;
    color: var(--wp--preset--color--green-accent);
}

/* --------------------------------------------------------------------------
   Hero home — ajustements maquette
   -------------------------------------------------------------------------- */

/* Forcer la bonne taille du titre hero (specificite elevee sans !important) */
.seche-hero--home.seche-hero--home .seche-hero__content h1,
.seche-hero--home.seche-hero--home .seche-hero__content .wp-block-heading {
    font-size: var(--wp--preset--font-size--6-xl);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: 0.82px;
}

/* Accent dans le hero */
.seche-hero--home .seche-hero__content h1 em {
    font-family: var(--wp--preset--font-family--accent);
    font-style: italic;
    font-weight: 400;
    color: var(--wp--preset--color--green-accent);
    font-size: var(--wp--preset--font-size--6-xl);
}

/* Paragraphe hero */
.seche-hero--home .seche-hero__content p {
    font-size: var(--wp--preset--font-size--lg);
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.7);
}

/* CTA bouton hero — géré dans blocks/hero/style.css */

/* --------------------------------------------------------------------------
   CTA Section — maquette : border-radius 13px, padding genereux
   -------------------------------------------------------------------------- */

.seche-cta-section {
    border-radius: 13px;
    overflow: hidden;
    position: relative;
}

/* Variante accent — texte teal fonce sur fond vert */
.seche-cta-section--accent {
    background-color: var(--wp--preset--color--green-accent);
}

.seche-cta-section--accent.seche-cta-section--accent h2,
.seche-cta-section--accent.seche-cta-section--accent h3,
.seche-cta-section--accent.seche-cta-section--accent p {
    color: var(--wp--preset--color--teal);
}

/* Titre CTA — 40px, pas de barre accent dessous */
.seche-cta-section h2 {
    font-size: var(--wp--preset--font-size--5-xl);
    font-weight: 400;
    line-height: 1.1;
}

.seche-cta-section.seche-cta-section h2::after {
    display: none;
}

/* Bouton CTA : style centralisé dans assets/css/buttons.css */

/* Sigil SVG — subtil */
.seche-cta-section__sigil {
    opacity: 0.08;
}

/* --------------------------------------------------------------------------
   Temoignage — styles consolides dans blocks/temoignage/style.css
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   Domaines liste — cards avec overlay et fleches
   -------------------------------------------------------------------------- */

/* Les blocs alignfull sont deja pleine largeur */

/* --------------------------------------------------------------------------
   Actualites en cours — titres avec accent italic
   (styles deplacés dans blocks/actu-en-cours/style.css)
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   Fond page — bg clair (maquette: #F6F5EF)
   -------------------------------------------------------------------------- */

/* background-color retiré — géré par le thème parent */

/* Sections qui doivent etre blanches */
.seche-temoignage {
    background-color: transparent;
}

/* --------------------------------------------------------------------------
   Footer CTA — masquer le bloc CTA de contenu sur la home
   (le CTA est desormais integre dans le footer)
   -------------------------------------------------------------------------- */

body.home .seche-cta-section {
    display: none;
}

/* --------------------------------------------------------------------------
   Listes à puces globe brand
   -------------------------------------------------------------------------- */

.leb-main ul,
.editor-styles-wrapper ul {
    list-style: none;
}

.leb-main ul li,
.editor-styles-wrapper ul li {
    padding: 4px 0;
}

.leb-main ul li::marker,
.editor-styles-wrapper ul li::marker {
    content: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 256 219%22 width=%2218%22 height=%2216%22 fill=%22none%22%3E%3Cpath d=%22M109.205 17.6089C159.711 17.6089 200.794 58.6983 200.794 109.21C200.794 159.71 159.711 200.793 109.205 200.793C58.6992 200.793 17.6099 159.71 17.6099 109.21C17.6099 58.6983 58.6992 17.6089 109.205 17.6089ZM109.205 218.402C156.311 218.402 196.449 188.574 211.77 146.782C221.643 120.628 255.055 109.21 255.055 109.21C255.055 109.21 221.66 97.7829 211.784 71.6537C196.466 29.8391 156.32 0 109.205 0C48.8966 0 0.000949264 48.8957 0.000949264 109.21C0.000949264 169.515 48.8966 218.402 109.205 218.402Z%22 fill=%22%23A6D71C%22/%3E%3C/svg%3E") " ";
}

.leb-main ul li:nth-child(even)::marker,
.editor-styles-wrapper ul li:nth-child(even)::marker {
    content: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 256 219%22 width=%2218%22 height=%2216%22 fill=%22none%22%3E%3Cpath d=%22M109.205 17.6089C159.711 17.6089 200.794 58.6983 200.794 109.21C200.794 159.71 159.711 200.793 109.205 200.793C58.6992 200.793 17.6099 159.71 17.6099 109.21C17.6099 58.6983 58.6992 17.6089 109.205 17.6089ZM109.205 218.402C156.311 218.402 196.449 188.574 211.77 146.782C221.643 120.628 255.055 109.21 255.055 109.21C255.055 109.21 221.66 97.7829 211.784 71.6537C196.466 29.8391 156.32 0 109.205 0C48.8966 0 0.000949264 48.8957 0.000949264 109.21C0.000949264 169.515 48.8966 218.402 109.205 218.402Z%22 fill=%22%23A6D71C%22/%3E%3Crect x=%2212.375%22 y=%2213.2305%22 width=%22194%22 height=%22192%22 rx=%2296%22 fill=%22%23A6D71C%22/%3E%3C/svg%3E") " ";
}

/* --------------------------------------------------------------------------
   Espacement vertical des blocs natifs WP dans le contenu
   -------------------------------------------------------------------------- */

body:not(.block-editor-page) .wp-block-post-content > *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull),
.leb-main > .wp-block-group > *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull),
body:not(.block-editor-page) .leb-page-de-liste > *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull) {
    padding-top: 8px;
    padding-bottom: 8px;
}

body:not(.block-editor-page) .wp-block-post-content > .wp-block-list,
.leb-main > .wp-block-group > .wp-block-list,
body:not(.block-editor-page) .leb-page-de-liste > .wp-block-list {
    padding-top: 18px;
    padding-bottom: 18px;
    padding-inline-start: calc(40px + 1.5em);
}

/* Headings dans le post content — marge supérieure pour initier les sections */
body:not(.block-editor-page) .wp-block-post-content > .wp-block-heading,
body:not(.block-editor-page) .wp-block-post-content > h2,
body:not(.block-editor-page) .wp-block-post-content > h3,
body:not(.block-editor-page) .wp-block-post-content > h4,
body:not(.block-editor-page) .leb-page-de-liste > .wp-block-heading,
body:not(.block-editor-page) .leb-page-de-liste > h2,
body:not(.block-editor-page) .leb-page-de-liste > h3,
body:not(.block-editor-page) .leb-page-de-liste > h4 {
    margin-top: var(--wp--preset--spacing--70);
}

/* Espacement entre blocs natifs et blocs custom (les deux sens) */
body:not(.block-editor-page) .wp-block-post-content > *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull) + [class*="seche-"],
body:not(.block-editor-page) .wp-block-post-content > *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull) + .alignfull,
body:not(.block-editor-page) .leb-page-de-liste > *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull) + [class*="seche-"],
body:not(.block-editor-page) .leb-page-de-liste > *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull) + .alignfull {
    margin-top: var(--wp--preset--spacing--80);
}

/* Après un bloc custom NON coloré (carrousel, etc.) → écart doux : le bloc a déjà
   son propre espace bas, inutile d'ajouter un grand écart. */
body:not(.block-editor-page) .wp-block-post-content > [class*="seche-"]:not(.leb-section--bg):not(.has-background) + *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull),
body:not(.block-editor-page) .wp-block-post-content > .alignfull:not(.leb-section--bg):not(.has-background) + *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull),
body:not(.block-editor-page) .leb-page-de-liste > [class*="seche-"]:not(.leb-section--bg):not(.has-background) + *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull),
body:not(.block-editor-page) .leb-page-de-liste > .alignfull:not(.leb-section--bg):not(.has-background) + *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull) {
    margin-top: var(--wp--preset--spacing--50);
}

/* Après un bloc à FOND coloré (marqueur générique leb-section--bg, ou has-background
   natif → couvre les blocs à support couleur : bandeau, témoignage…) → grand écart,
   pour que le bloc natif suivant ne se colle pas à la couleur. */
body:not(.block-editor-page) .wp-block-post-content > .leb-section--bg + *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull),
body:not(.block-editor-page) .wp-block-post-content > .has-background + *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull),
body:not(.block-editor-page) .leb-page-de-liste > .leb-section--bg + *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull),
body:not(.block-editor-page) .leb-page-de-liste > .has-background + *:not([class*="seche-"]):not([class*="leb-"]):not(.alignfull) {
    margin-top: var(--wp--preset--spacing--80);
}

/* --------------------------------------------------------------------------
   Liens dans le texte des contenus : visibles (avant : couleur du texte,
   sans soulignement). Spécificité basse (:where) pour que les sections
   sombres (hero, etc.) gardent leur propre couleur de lien. Boutons, cartes
   et menus ont une classe : non concernés.
   -------------------------------------------------------------------------- */

:where(.leb-main) :where(p, li) a:not([class]) {
    color: var(--wp--preset--color--green);
    text-decoration: underline;
    text-decoration-color: var(--wp--preset--color--green-accent);
    text-decoration-thickness: 2px;
    text-underline-offset: 0.2em;
    transition: text-decoration-color 0.3s ease, color 0.3s ease;
}

:where(.leb-main) :where(p, li) a:not([class]):hover,
:where(.leb-main) :where(p, li) a:not([class]):focus-visible {
    text-decoration-color: currentColor;
}
