/*
Theme Name: GeneratePress Child
Theme URI: https://preprod.neowood.fr/
Description: Thème enfant de GeneratePress — styles et scripts personnalisés (slider, etc.).
Author: Neowood
Template: generatepress
Version: 1.0.0
Text Domain: generatepress-child
*/
/* ===== Sliders : disposition COMMUNE (accueil + articles) ===== */
/* Mécanique partagée par les deux variantes .home-slider et .post-slider. */
/* Seules les DIMENSIONS diffèrent (voir « variantes » plus bas). */
.home-slider,
.post-slider {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    gap: 1rem;
    scrollbar-width: none;            /* Firefox : barre masquée */
}

.home-slider::-webkit-scrollbar,
.post-slider::-webkit-scrollbar { display: none; }   /* Chrome/Safari : barre masquée */

.home-slider figure,
.post-slider figure {
    flex: 0 0 100% !important;         /* largeur d'une slide */
    max-width: 100% !important;
    margin: 0 !important;
    scroll-snap-align: center;
    position: relative;               /* ancre le voile ::after + l'overlay */
    z-index: 0;                       /* contexte d'empilement local : l'overlay */
                                      /* passe au-dessus du voile MAIS reste sous */
                                      /* le header sticky (z-index élevé). */
}

/* Voile sombre sur chaque image pour la lisibilité des titres de l'overlay. */
/* Réservé à l'accueil : le post-slider n'a pas d'overlay, donc pas de voile. */
/* Dégradé repris du site neowood (.elementor-background-overlay) : */
/* linear-gradient(180deg, #020101, #000000) à opacity 0.2. */
.home-slider figure::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 8px;
    background-image: linear-gradient(180deg, #020101 0%, #000000 100%);
    opacity: 0.4;
    pointer-events: none;             /* n'entrave pas le swipe */
}

/* Image : règles communes (la HAUTEUR est propre à chaque variante). */
.home-slider figure img,
.post-slider figure img {
    width: 100% !important;
    object-fit: cover;        /* recadre pour remplir sans déformer */
    border-radius: 8px;
}

/* ===== Variantes : hauteur des slides ===== */
.home-slider figure img { height: 75vh; }    /* accueil : héro plein écran */
.post-slider figure img { height: 480px; }   /* articles : galerie inline (à ajuster) */

/* ===== Sliders : flèches de navigation ===== */
.slider-wrap { position: relative; }

/* Calque centré sur CHAQUE image (accueil uniquement) : le container qui suit */
/* une figure est déplacé dans cette figure par le JS et reçoit .slide-overlay. */
.home-slider figure .slide-overlay {
    position: absolute;
    inset: 0;                /* couvre toute l'image */
    z-index: 1;              /* au-dessus du voile ::after (contexte de la figure) */
    display: flex;
    flex-direction: column;
    align-items: center;     /* centrage horizontal du contenu */
    justify-content: center; /* centrage vertical du contenu */
    text-align: center;
    padding: 1rem;
    pointer-events: none;    /* laisse passer le swipe/scroll vers l'image */
}

/* Rétablit l'interactivité sur les éléments cliquables de l'overlay. */
.home-slider figure .slide-overlay a,
.home-slider figure .slide-overlay button {
    pointer-events: auto;
}

/* ===== Menu de la home : liens en blanc (desktop uniquement) ===== */
/* Limité au desktop : en mobile le burger ouvre un menu off-canvas sur fond */
/* clair (le blanc le rendrait illisible). Spécificité (0,3,1) laissée basse */
/* pour ne pas écraser la couleur de l'item courant (0,3,3). */
@media (min-width: 769px) {
    .home .main-navigation:not(.navigation-stick) a {
        color: #ffffff;
    }
}

/* ===== Icônes loupe + burger en blanc (mobile + tablette) ===== */
/* Menu principal NON sticky uniquement. Les SVG .gp-icon sont en */
/* fill: currentColor → la couleur suffit, fill forcé par sécurité. */
@media (max-width: 768px) {
    .home .main-navigation:not(.navigation-stick) .menu-toggle .gp-icon,
    .home .main-navigation:not(.navigation-stick) .menu-bar-item .gp-icon,
    .home .main-navigation:not(.navigation-stick) .menu-toggle .gp-icon svg,
    .home .main-navigation:not(.navigation-stick) .menu-bar-item .gp-icon svg {
        color: #ffffff;
        fill: #ffffff;
    }
}

/* ===== Sous-menus (dropdowns), menu NON sticky : fond blanc + texte vert ===== */
/* Sélecteur (0,4,1) pour battre la règle GeneratePress .main-nav ul ul (0,3,0). */
.main-navigation:not(.navigation-stick) .main-nav ul.sub-menu {
    background-color: #ffffff;
}
.main-navigation:not(.navigation-stick) .main-nav ul.sub-menu a {
    color: var(--accent-2);
}
/* Survol / item courant : on garde fond blanc + texte vert. */
.main-navigation:not(.navigation-stick) .main-nav ul.sub-menu a:hover,
.main-navigation:not(.navigation-stick) .main-nav ul.sub-menu li[class*="current-menu-"] > a {
    background-color: #ffffff;
    color: var(--accent);
}

/* ===== Menu off-canvas : pas de séparateur avant la flèche de sous-menu ===== */
/* GP pose une border-left (+ margin/padding) entre le libellé et le chevron */
/* des items à enfants. Ciblé via l'ID du panneau (#generate-slideout-menu) : */
/* spécificité ID (1,2,1) > règle GP par classes (0,3,1). */
#generate-slideout-menu .menu-item-has-children .dropdown-menu-toggle {
    border-left: 0;
    margin-left: 10px;
    padding-left: 0;
}

/* ===== Burger mobile : pas de fond (comme l'icône recherche) ===== */
.main-navigation .menu-toggle,
.main-navigation .menu-toggle:hover,
.main-navigation .menu-toggle:focus {
    background-color: transparent;
}

/* Burger + loupe : icônes un peu plus grandes (les SVG font 1em). */
.main-navigation .menu-toggle .gp-icon,
.main-navigation .menu-bar-item .gp-icon {
    font-size: 1.4em;
}

/* Burger + loupe : padding haut pour aligner les icônes sur le logo */
/* (menu NON sticky, toutes résolutions). */
.main-navigation:not(.navigation-stick) .menu-toggle .gp-icon,
.main-navigation:not(.navigation-stick) .menu-bar-item .gp-icon {
    padding-top: 10px;
}

/* ===== Menu sticky : padding latéral selon la résolution ===== */
/* Cible par ID (#sticky-navigation) : spécificité ID > toute règle de classe GP. */
/* Desktop : aucun padding latéral, 10px haut/bas. */
#sticky-navigation .inside-navigation.grid-container {
    padding-left: 0;
    padding-right: 0;
    padding-top: 10px;
    padding-bottom: 10px;
}

.slider-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    /* Pas de z-index positif (cf. .slide-overlay) : éviterait de passer */
    /* devant le header sticky ; l'ordre du DOM suffit à les garder visibles. */
    border: 0;
    cursor: pointer;
    width: 42px;
    height: 42px;
    padding: 0;
    border-radius: 50%;
    background: rgba(0, 0, 0, .55);
    color: #fff;
    font-size: 24px;
    line-height: 1;
    display: flex;                    /* centrage du chevron */
    align-items: center;
    justify-content: center;
}
.slider-btn:hover { background: #5AB8C0; }
.slider-prev { left: 8px; }
.slider-next { right: 8px; }

/* ===== Header : padding (menu non sticky) ===== */
/* Cible via #masthead (ID) pour battre les règles/inline GeneratePress (0,1,0). */
#masthead .inside-header {
    padding: 10px 10px 10px 10px;
}

/* ===== Suppression des lettrines (drop caps) ===== */
.has-drop-cap:not(:focus)::first-letter {
    color: inherit;
    float: none;
    font-size: inherit;
    line-height: inherit;
    font-weight: inherit;
    margin: 0;
    text-transform: none;
}

/* ===== Contact Form 7 : bords arrondis (style thème GenerateBlocks) ===== */
/* Champs simples : pilule, comme les champs/boutons du thème (9999px) */
.wpcf7-form input.wpcf7-form-control:not(.wpcf7-submit),
.wpcf7-form select.wpcf7-form-control {
    border-radius: 9999px;
    width: 100%;           /* pleine largeur, comme le textarea */
}

/* Zone de texte : rayon des cartes (1.5rem) — la pilule serait inadaptée */
.wpcf7-form textarea.wpcf7-form-control {
    border-radius: 1.5rem;
}

/* Bouton d'envoi : pilule comme les CTA du thème, légèrement agrandi */
.wpcf7-form input.wpcf7-submit {
    border-radius: 9999px;
    padding: 0.9em 2.5em;    /* plus d'air autour du label */
    font-size: 1.05rem;      /* texte un peu plus grand */
}

/* Message de réponse global : rendu identique aux messages d'erreur de champ */
/* (.wpcf7-not-valid-tip) → sans bordure ni padding, couleur + police des tips. */
.wpcf7 form .wpcf7-response-output {
    margin-left: 0;
    margin-right: 0;
    border: 0;               /* vire la bordure */
    padding: 0;              /* vire le padding */
    color: #dc3232;          /* = couleur des tips d'erreur CF7 */
    font: inherit;           /* même police que les tips (héritée) */
}

/* Temps de lecture dans l'en-tête d'article : calé sur la date (.gb-text-d1109e84) */
/* Classe doublée (0,2,0) pour battre le style global du plugin (0,1,0), sans dépendre de l'emplacement */
.bsf-rt-reading-time.bsf-rt-reading-time {
    display: inline-flex;
    align-items: center;
    column-gap: 0.25em;     /* rétablit l'espace entre "Reading Time" / "2" / "mins" (flex ignore les blancs) */
    width: auto;            /* annule le width:max-content du plugin */
    background: none;       /* annule la pastille grise */
    margin: 0;
    padding: 0;
    font-size: 0.75rem;     /* = date */
    line-height: 1rem;      /* = date */
    letter-spacing: 0.025em;/* = date */
    color: var(--contrast-2);/* = date */
    /* font-family non forcée par le plugin → héritée comme la date */
}

/* ===== Read Meter : barre de progression ===== */
/* --rt-bandeau = bas réel du bandeau collé, calculé par assets/js/reading-progress-offset.js. */
/* Il inclut déjà la barre d'admin (margin-top du menu sticky). 0px avant scroll = tout en haut. */
/* Le 1er sélecteur (0,3,0) bat la règle .admin-bar .progress-container-top {top:30px} du plugin (0,2,0). */
.admin-bar .progress-container-top.progress-container-top,
.progress-container-top.progress-container-top {
    top: var( --rt-bandeau, 0px );
    transition: top 120ms linear;
    visibility: hidden;   /* masquée tant que le bandeau n'est pas collé (tout en haut) */
}
/* Affichée seulement quand le bandeau est collé (classe posée par le JS). */
html.rt-bandeau-stuck .progress-container-top.progress-container-top {
    visibility: visible;
}

/* Hauteur réduite à 6px. Sélecteur .admin-bar … (0,3,0) pour battre la règle */
/* .admin-bar .progress-container-top {height:…px} injectée par le plugin (0,2,0). */
.admin-bar .progress-container-top.progress-container-top,
.progress-container-top.progress-container-top {
    height: 6px;
}

.progress-container-top .progress-bar {
    height: 6px;
}

/* Mobile : slider d'accueil en plein écran (le post-slider garde sa hauteur) */
@media (max-width: 768px) {
    .home-slider figure img {
        height: 100vh;
    }
}
/* 801px – 872px : 40px de padding latéral (10px haut/bas inchangés). */
@media (min-width: 801px) and (max-width: 872px) {
    #masthead .inside-header {
        padding: 10px 10px 10px 10px;
    }
}
/* Mobile : flèches masquées (navigation au swipe) */
@media (max-width: 768px) {
    .slider-btn { display: none; }
}
/* Téléphone + tablette (≤ 1024px) : padding latéral fluide (borné 1.2rem ↔ 3rem). */
@media (max-width: 1024px) {
    #sticky-navigation .inside-navigation.grid-container {
        padding-left: clamp(1.2rem, 4vw, 3rem);
        padding-right: clamp(1.2rem, 4vw, 3rem);
    }
}
/* 1025px – 1451px : même padding latéral fluide. */
@media (min-width: 1025px) and (max-width: 1451px) {
    #sticky-navigation .inside-navigation.grid-container {
        padding-left: clamp(1.2rem, 4vw, 3rem);
        padding-right: clamp(1.2rem, 4vw, 3rem);
    }
}