/*
Theme Name:  Atelier P'tit Jeannot - Enfant Astra
Theme URI:   https://latelierduptitjeannot.fr
Description: Theme enfant Astra pour L'atelier du p'tit Jeannot - Version Gutenberg/Spectra
Author:      L'atelier du p'tit Jeannot
Template:    astra
Version:     2.0.0
*/

/* ============================
   TYPOGRAPHIE GLOBALE
   ============================ */
body {
    font-family: 'Inter', sans-serif;
    -webkit-font-smoothing: antialiased;
}

/* ============================
   PAGE ACCUEIL - FOND SOMBRE
   ============================ */
body.home,
body.page-id-1055 {
    background-color: #1F2024;
}

/* Supprimer les marges/padding autour du contenu en page accueil */
body.home .entry-content,
body.page-id-1055 .entry-content {
    padding: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
}

body.home .ast-container,
body.page-id-1055 .ast-container {
    max-width: 100% !important;
    padding: 0 !important;
}

body.home .site-content .ast-container,
body.page-id-1055 .site-content .ast-container {
    max-width: 100% !important;
    padding: 0 !important;
}

body.home #content,
body.page-id-1055 #content {
    padding: 0 !important;
    margin: 0 !important;
}

/* ============================
   BLOCS GUTENBERG FULL-WIDTH
   ============================ */
.wp-block-group.alignfull {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
}

/* Padding interne des sections Gutenberg */
.wp-block-group.alignfull > .wp-block-group__inner-container,
.wp-block-group.alignfull > * {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* Override Astra qui peut contraindre la largeur */
.wp-block-group.alignfull {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ============================
   TITRES
   ============================ */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Bricolage Grotesque', 'Inter', sans-serif;
}

.wp-block-heading em,
.wp-block-heading i {
    font-family: 'Instrument Serif', Georgia, serif;
    font-style: italic;
}

/* ============================
   BOUTONS
   ============================ */
.wp-block-button .wp-block-button__link {
    transition: opacity .2s, transform .15s;
}

.wp-block-button .wp-block-button__link:hover {
    opacity: .88;
    transform: translateY(-1px);
}

/* ============================
   HEADER ASTRA - ADAPTATION FOND SOMBRE
   ============================ */
body.home .site-header,
body.page-id-1055 .site-header {
    background-color: rgba(31, 32, 36, 0.95) !important;
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255,255,255,.07);
}

body.home .main-header-bar,
body.page-id-1055 .main-header-bar {
    background-color: transparent !important;
}

body.home .ast-header-break-point .main-header-bar,
body.page-id-1055 .ast-header-break-point .main-header-bar {
    background-color: rgba(31,32,36,.95) !important;
}

/* Nav links couleur claire sur fond sombre */
body.home .main-navigation .menu-link,
body.page-id-1055 .main-navigation .menu-link {
    color: rgba(255,255,255,.8) !important;
}

body.home .main-navigation .menu-item:hover > .menu-link,
body.page-id-1055 .main-navigation .menu-item:hover > .menu-link,
body.home .main-navigation .current-menu-item > .menu-link,
body.page-id-1055 .main-navigation .current-menu-item > .menu-link {
    color: #F5C518 !important;
}

/* Site title / logo dans header */
body.home .site-title a,
body.page-id-1055 .site-title a {
    color: white !important;
}

/* ============================
   FOOTER - FOND SOMBRE
   ============================ */
body.home .site-footer,
body.page-id-1055 .site-footer {
    background-color: #16171A !important;
    color: rgba(255,255,255,.6) !important;
    border-top: 1px solid rgba(255,255,255,.06);
}

body.home .site-footer a,
body.page-id-1055 .site-footer a {
    color: #F5C518 !important;
}

/* ============================
   IMAGE LOGO HERO
   ============================ */
.wp-block-image.aligncenter img {
    display: block;
    margin: 0 auto;
}

/* ============================
   SIMULATEUR CREDIT IMPOT
   ============================ */
.atelier-sim input[type='range'] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 6px;
    border-radius: 3px;
    background: rgba(255,255,255,.15);
    outline: none;
}

.atelier-sim input[type='range']::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #F5C518;
    cursor: pointer;
    border: 3px solid #1F2024;
    box-shadow: 0 2px 8px rgba(0,0,0,.4);
}

/* ============================
   RESPONSIVE MOBILE
   ============================ */
@media (max-width: 768px) {
    .wp-block-columns.alignwide,
    .wp-block-columns {
        flex-direction: column !important;
    }
    .wp-block-column {
        flex-basis: 100% !important;
        width: 100% !important;
    }
    .wp-block-group.alignfull {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

/* ============================
   PAGES INTÉRIEURES - FOND SOMBRE + FULL WIDTH
   ============================ */
body.page-id-1071,
body.page-id-1067,
body.page-id-1074 {
    background-color: #1F2024;
}

body.page-id-1071 .entry-content,
body.page-id-1067 .entry-content,
body.page-id-1074 .entry-content {
    padding: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
}

body.page-id-1071 .ast-container,
body.page-id-1067 .ast-container,
body.page-id-1074 .ast-container,
body.page-id-1071 #content,
body.page-id-1067 #content,
body.page-id-1074 #content {
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

body.page-id-1071 .site-content .ast-container,
body.page-id-1067 .site-content .ast-container,
body.page-id-1074 .site-content .ast-container {
    max-width: 100% !important;
    padding: 0 !important;
}

/* Header sombre sur les pages intérieures */
body.page-id-1071 .site-header,
body.page-id-1067 .site-header,
body.page-id-1074 .site-header {
    background-color: rgba(31, 32, 36, 0.95) !important;
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255,255,255,.07);
}

body.page-id-1071 .main-header-bar,
body.page-id-1067 .main-header-bar,
body.page-id-1074 .main-header-bar {
    background-color: transparent !important;
}

body.page-id-1071 .main-navigation .menu-link,
body.page-id-1067 .main-navigation .menu-link,
body.page-id-1074 .main-navigation .menu-link {
    color: rgba(255,255,255,.8) !important;
}

body.page-id-1071 .main-navigation .menu-item:hover > .menu-link,
body.page-id-1067 .main-navigation .menu-item:hover > .menu-link,
body.page-id-1074 .main-navigation .menu-item:hover > .menu-link {
    color: #F5C518 !important;
}

body.page-id-1071 .site-title a,
body.page-id-1067 .site-title a,
body.page-id-1074 .site-title a {
    color: white !important;
}

/* Footer sombre */
body.page-id-1071 .site-footer,
body.page-id-1067 .site-footer,
body.page-id-1074 .site-footer {
    background-color: #16171A !important;
    color: rgba(255,255,255,.6) !important;
    border-top: 1px solid rgba(255,255,255,.06);
}

body.page-id-1071 .site-footer a,
body.page-id-1067 .site-footer a,
body.page-id-1074 .site-footer a {
    color: #F5C518 !important;
}

/* Cacher le titre de page Astra sur ces pages */
body.page-id-1071 .entry-header,
body.page-id-1067 .entry-header,
body.page-id-1074 .entry-header {
    display: none !important;
}

/* ============================
   CARTE LEAFLET - RESPONSIVE MOBILE
   ============================ */

/* Le grid carte passe en colonne sur mobile */
#atelier-map-wrap {
    display: grid;
    grid-template-columns: 1.4fr 0.8fr;
    gap: 28px;
    align-items: start;
}

@media (max-width: 768px) {
    #atelier-map-wrap {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
    #atelier-map {
        height: 320px !important;
    }
    /* Colonne info sous la carte */
    #atelier-map-wrap > div:last-child {
        width: 100% !important;
    }
}

/* Logo Astra header : taille contrôlée */
.custom-logo {
    max-height: 52px !important;
    width: auto !important;
}

/* ============================
   FIX 1 - SUREFORMS THEME CLAIR
   ============================ */
/* Fond blanc du formulaire */
.srfm-form-container {
    background: #ffffff !important;
    border-radius: 20px !important;
    padding: 32px !important;
}
/* Champs : fond crème, texte sombre */
.srfm-form-container input[type="text"],
.srfm-form-container input[type="email"],
.srfm-form-container input[type="tel"],
.srfm-form-container input[type="number"],
.srfm-form-container textarea,
.srfm-form-container select,
.srfm-input-wrap input,
.srfm-input-wrap textarea {
    background: #F6F1E6 !important;
    color: #1F2024 !important;
    border: 1.5px solid rgba(31,32,36,0.15) !important;
    border-radius: 10px !important;
    padding: 14px 16px !important;
}
/* Placeholder gris */
.srfm-form-container input::placeholder,
.srfm-form-container textarea::placeholder {
    color: #888888 !important;
}
/* Labels sombres */
.srfm-form-container label,
.srfm-label,
.srfm-form-container .srfm-label {
    color: #1F2024 !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    letter-spacing: .04em !important;
}
/* Focus jaune */
.srfm-form-container input:focus,
.srfm-form-container textarea:focus {
    border-color: #F5C518 !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(245,197,24,0.2) !important;
}
/* Titre du form en sombre */
.srfm-form-container .srfm-form-title,
.page-id-1074 .srfm-form-container h1,
.page-id-1074 .srfm-form-container h2,
.page-id-1074 .srfm-form-container h3 {
    color: #1F2024 !important;
}
/* Bouton submit : JAUNE */
.srfm-submit-btn,
.srfm-form-container button[type="submit"] {
    background: #F5C518 !important;
    color: #1F2024 !important;
    font-weight: 800 !important;
    border: none !important;
    border-radius: 999px !important;
    padding: 14px 36px !important;
    font-size: 16px !important;
    cursor: pointer !important;
    letter-spacing: .05em !important;
    text-transform: uppercase !important;
}
.srfm-submit-btn:hover,
.srfm-form-container button[type="submit"]:hover {
    background: #FFD84D !important;
}

/* ============================
   FIX 2 - HEADER MOBILE
   ============================ */
@media (max-width: 920px) {
    /* Cacher le logo IMAGE dans le header Astra sur mobile */
    .custom-logo-link,
    a.custom-logo-link,
    .site-logo-img,
    .ast-site-identity img,
    img.custom-logo {
        display: none !important;
    }
    /* Afficher le titre texte (Astra le cache quand un logo est défini) */
    .ast-site-name-wrap,
    .ast-site-identity .ast-site-name-wrap {
        display: flex !important;
        align-items: center !important;
    }
    .site-title,
    .ast-site-name-wrap .site-title {
        display: block !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 180px !important;
    }
    .site-title a,
    .ast-site-name-wrap .site-title a {
        color: #ffffff !important;
        text-decoration: none !important;
    }
    /* Colonnes hero : empilées verticalement */
    body.home .wp-block-columns.alignwide,
    body.page-id-1055 .wp-block-columns.alignwide {
        flex-direction: column !important;
        gap: 0 !important;
    }
    body.home .wp-block-column,
    body.page-id-1055 .wp-block-column {
        flex-basis: 100% !important;
        width: 100% !important;
    }
    body.home .wp-block-image img,
    body.page-id-1055 .wp-block-image img {
        max-width: 240px !important;
        margin: 0 auto !important;
        display: block !important;
    }
}

/* ============================
   FIX 5 - MENU MOBILE : popup fond sombre, texte blanc
   ============================ */

/* Popup Astra : fond sombre pour tout */
.ast-mobile-popup-wrapper {
    background: #1F2024 !important;
}
.ast-mobile-popup-inner,
.ast-mobile-popup {
    background: #1F2024 !important;
}

/* Tous les liens et textes du popup en blanc */
.ast-mobile-popup-wrapper .menu-link,
.ast-mobile-popup-wrapper a.menu-link,
.ast-mobile-popup-wrapper .nav-link,
.ast-mobile-popup-inner .menu-link,
.ast-mobile-popup-inner a,
#ast-mobile-popup .menu-link,
#ast-mobile-popup a {
    color: rgba(255,255,255,0.85) !important;
}

/* Élément actif et hover : jaune */
.ast-mobile-popup-wrapper .current-menu-item > .menu-link,
.ast-mobile-popup-wrapper .menu-link:hover,
.ast-mobile-popup-inner .current-menu-item > .menu-link,
.ast-mobile-popup-inner .menu-link:hover {
    color: #F5C518 !important;
}

/* Séparateurs discrets */
.ast-mobile-popup-wrapper .menu-item {
    border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}

/* Bouton fermeture */
.ast-mobile-popup-wrapper .ast-close-btn svg path,
.ast-mobile-popup-inner .ast-close-btn svg path {
    stroke: rgba(255,255,255,0.7) !important;
    fill: rgba(255,255,255,0.7) !important;
}
.ast-mobile-popup-wrapper .ast-close-btn,
.ast-mobile-popup-inner .ast-close-btn {
    color: rgba(255,255,255,0.7) !important;
}

/* Titre du site dans le popup header */
.ast-mobile-popup-wrapper .site-title a,
.ast-mobile-popup-inner .site-title a {
    color: #ffffff !important;
}

/* Override ultra-spécifique pour contrer le CSS sombre du header home */
body.home .ast-mobile-popup-wrapper .main-navigation .menu-link,
body.home .ast-mobile-popup-inner .main-navigation .menu-link,
body.page-id-1055 .ast-mobile-popup-wrapper .menu-link,
body.page-id-1067 .ast-mobile-popup-wrapper .menu-link,
body.page-id-1071 .ast-mobile-popup-wrapper .menu-link,
body.page-id-1074 .ast-mobile-popup-wrapper .menu-link {
    color: rgba(255,255,255,0.85) !important;
}

/* ============================
   FIX 4 - CARTE LEAFLET MOBILE : map seule, pleine largeur
   ============================ */
@media (max-width: 920px) {
    /* Carte mobile : empilée verticalement - map en haut, infos en bas */
    #atelier-map-wrap {
        flex-direction: column !important;
        display: flex !important;
    }
    /* Le panneau info est VISIBLE sous la carte sur mobile */
    #atelier-map-wrap .atelier-map-info,
    #atelier-map-wrap > div:nth-child(2),
    #atelier-map-wrap > div:last-child {
        display: flex !important;
        width: 100% !important;
    }
    #atelier-map-wrap > div:first-child {
        width: 100% !important;
    }
    #atelier-map {
        height: 320px !important;
        border-radius: 16px !important;
    }
}

/* ============================
   FIX 6 - DRAWER MOBILE ASTRA (classes exactes trouvées dans le code)
   ============================ */

/* Fond sombre sur tout le drawer */
.ast-mobile-popup-drawer .ast-mobile-popup-inner {
    background: #1F2024 !important;
    color: rgba(255,255,255,0.85) !important;
}
.ast-mobile-popup-drawer.active .ast-mobile-popup-inner {
    background: #1F2024 !important;
}
.ast-mobile-popup-drawer .ast-mobile-popup-content,
.ast-mobile-popup-drawer .ast-mobile-popup-header {
    background: #1F2024 !important;
}

/* Liens de navigation dans le drawer : blanc */
.ast-mobile-popup-drawer .menu-link,
.ast-mobile-popup-drawer .main-navigation .menu-link,
.ast-mobile-popup-drawer .main-header-menu .menu-link,
.ast-mobile-popup-drawer a {
    color: rgba(255,255,255,0.85) !important;
}

/* Élément actif et hover */
.ast-mobile-popup-drawer .current-menu-item > .menu-link,
.ast-mobile-popup-drawer .menu-link:hover {
    color: #F5C518 !important;
}

/* Séparateur entre items */
.ast-mobile-popup-drawer .menu-item {
    border-color: rgba(255,255,255,0.08) !important;
}

/* Bouton X fermeture */
.ast-mobile-popup-drawer .menu-toggle-close,
.ast-mobile-popup-drawer .menu-toggle-close svg {
    color: rgba(255,255,255,0.7) !important;
}

/* Override Astra qui applique #fafafa via dynamic CSS avec .ast-mobile-popup-drawer.active */
.ast-mobile-popup-drawer.active .ast-mobile-popup-inner {
    background-color: #1F2024 !important;
}


/* ============================================
   MENU MOBILE - FOND SOMBRE (fix definitif)
   ============================================ */
/* Quand le menu hamburger est ouvert, body recoit la classe ast-main-header-nav-open */
body.ast-main-header-nav-open .ast-builder-menu-mobile .main-navigation .main-header-menu,
body.ast-main-header-nav-open .ast-builder-menu-mobile .main-navigation .main-header-menu .menu-link,
body.ast-main-header-nav-open .ast-builder-menu-mobile .main-navigation .main-header-menu .sub-menu,
body.ast-header-break-point .ast-mobile-header-content,
body.ast-header-break-point .ast-mobile-header-wrap .ast-mobile-header-content {
    background-color: #1F2024 !important;
    background: #1F2024 !important;
}
/* Texte des liens : blanc casse */
body.ast-header-break-point .ast-builder-menu-mobile .main-navigation .menu-link,
body.ast-header-break-point .ast-mobile-header-content .menu-link,
body.ast-header-break-point .ast-builder-menu-mobile .main-navigation .main-header-menu .menu-item > .menu-link {
    color: rgba(255, 255, 255, 0.85) !important;
}
/* Lien actif : jaune */
body.ast-header-break-point .ast-builder-menu-mobile .main-navigation .menu-item.current-menu-item > .menu-link,
body.ast-header-break-point .ast-mobile-header-content .current-menu-item > .menu-link {
    color: #F5C518 !important;
}
/* Hover : jaune */
body.ast-header-break-point .ast-builder-menu-mobile .main-navigation .menu-link:hover {
    color: #F5C518 !important;
    background: rgba(255,255,255,0.05) !important;
}


/* ============================
   FIX MOBILE - BOUTONS CALCULATEUR & HERO BUTTON
   ============================ */

/* Boutons "Nombre de personnes" : 3 par ligne max sur mobile */
@media (max-width: 600px) {
    #fc-p {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 10px !important;
    }
    #fc-p .fc-btn {
        width: 100% !important;
        text-align: center !important;
        padding: 10px 8px !important;
        box-sizing: border-box !important;
    }
}

/* Fix bouton "Réserver une séance" sur mobile : z-index et pointer-events */
@media (max-width: 920px) {
    body.home .wp-block-column,
    body.page-id-1055 .wp-block-column {
        position: relative !important;
        z-index: 1 !important;
    }
    body.home .wp-block-buttons,
    body.page-id-1055 .wp-block-buttons {
        position: relative !important;
        z-index: 10 !important;
    }
    body.home .wp-block-button__link,
    body.page-id-1055 .wp-block-button__link {
        pointer-events: auto !important;
        position: relative !important;
        z-index: 10 !important;
        display: inline-block !important;
    }
    /* Eviter que la colonne image ne recouvre la colonne texte */
    body.home .wp-block-columns.alignwide .wp-block-column:first-child,
    body.page-id-1055 .wp-block-columns.alignwide .wp-block-column:first-child {
        z-index: 0 !important;
        pointer-events: none !important;
    }
    body.home .wp-block-columns.alignwide .wp-block-column:last-child,
    body.page-id-1055 .wp-block-columns.alignwide .wp-block-column:last-child {
        z-index: 5 !important;
        pointer-events: auto !important;
    }
}