/* =========================
   FOOTER
========================= */

.footer-container {
    flex-direction: column;
    align-items: flex-start;
}

.footer-menu-wrapper {
    text-align: left;
    margin-bottom: 20px;
}

.footer-copyright {
    text-align: center;
}
    .kroma-block {
    width: 90%;
    padding: 20px;
}
/* =========================
   FOOTER MENU - MOBILE
========================= */

.footer-menu {
    display: flex;
    flex-wrap: wrap;              /* autorise le retour à la ligne */
    justify-content: center;      /* centré */
    gap: 12px 16px;               /* espace vertical / horizontal */
    padding: 0;
    margin: 0;
    list-style: none;
}

/* Item */
.footer-menu > li {
    display: flex;
    align-items: center;
}

/* Lien */
.footer-menu > li > a {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    white-space: nowrap;          /* évite les mots coupés */
}


/* =========================
   USER
========================= */

.user-profile {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 15px;
    gap: 20px;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.user-photo-slider-container {
    width: 100%;
    max-width: 380px;
    height: 360px;
    margin: 0 auto;
    box-sizing: border-box;
}

.user-info-section {
    width: 100%;
    text-align: left;
    box-sizing: border-box;
    
}

/* On cache les flèches sur mobile pour éviter de manger l'écran */
.swiper-button-prev, 
.swiper-button-next {
    display: none !important;
}

/* On active le "Peek" (laisser voir la suite) */
.custom-event-slider {
    padding-right: 50px !important; /* Laisse deviner la carte suivante */
}

/* On stylise les points de pagination (si tu les utilises) */
.swiper-pagination-bullet-active {
    background: #ff9800 !important;
}

/* =========================
   HEADER (GRID)
========================= */

header {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-areas:
        "logo counters"
        "nav nav";
    align-items: center;
    padding: 10px 15px;
    row-gap: 10px;
}

/* Placement des zones */
.site-logo {
    grid-area: logo;
    margin-left:5px;
}

.counter-wrapper {
    grid-area: counters;
    display: flex;
    gap: 6px;
    align-items: center;
    justify-content: flex-end;
}

.header-nav-container {
    grid-area: nav;
}

/* Logo */
.site-logo img {
    height: 30px;
    width: auto;
    display: block;
}


/* Compteur individuel */
.counter {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 6px;
    border-radius: 6px;
    font-size: 10px;
   
}

/* Icône compteur */
.counter-icon {
    display: flex;
    align-items: center;
    width:16px;
    height:16px;
}

/* Texte */
.counter-label {
    display: none;
}

.counter-value {
    font-weight: 600;
}
/* =========================
   HEADER NAV MOBILE
========================= */

.header-nav-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-top: 5px;
}

/* MENU */
.nav-menu {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 12px;
    width: auto !important;
    padding: 0;
    margin: 0;
}

/* Chaque item */
.nav-menu > li {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}

/* Lien principal */
.nav-menu > li > a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    color: transparent; /* cache le texte sans casser le layout */
}
/* Icônes Dashicons */
.nav-menu > li > a::before {
    font-size: 22px;
    line-height: 1;
}

/* =========================
   DRAPEAUX
========================= */

.language-selector {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 0;
}

.language-selector li {
    list-style: none;
}

/* =========================
   SOUS-MENU
========================= */

/* Accueil : icône seule, cliquable */
/* Lien parent affiché comme titre du sous-menu */
.nav-menu > li:first-child {

    display: none;
}


.nav-menu .sub-menu {
     position: absolute;
    top: 100%;
    left: 275%;
    transform: translateX(-50%);
    margin-top: 6px;
    min-width: 180px;
    background: #f2f2f2;
    border-radius: 12px;
    padding: 0;
    display: none;
    box-shadow: 0 6px 20px rgba(0,0,0,0.15);
    z-index: 999;
}

.nav-menu .sub-menu li a {
        display: block;              /* plein bloc */
    width: 100%;                 /* prend toute la largeur */
    box-sizing: border-box;
    padding: 12px 16px;
    font-size: 14px;
    color: #000 !important;      /* force noir */
    background: transparent;
}

.nav-menu .sub-menu li a:first-child {
    font-weight:700;
}

.nav-menu .sub-menu li a:hover {
    background: #e5e5e5;
    color: #000 !important;      /* empêche le blanc */
}

.nav-menu li:hover > .sub-menu,
.nav-menu li:focus-within > .sub-menu {
   background: #ededed;
    border-radius: 10px;
}

.nav-menu .sub-menu li a {
    font-size: 14px;
    padding: 8px 14px;
    white-space: nowrap;
}

/* =========================
   TITRE DU SOUS-MENU (PARENT)
========================= */

.nav-menu > li.menu-item-has-children > .sub-menu::before {
    content: attr(data-title);
    display: block;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    padding: 10px 16px 6px;
    color: #333;
    border-bottom: 1px solid #ddd;
}

.nav-menu > li.menu-item-has-children > a {
    position: relative;
    z-index: 2;
}

.nav-menu > li.menu-item-has-children > a {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: auto;
    padding: 10px 16px;
    background: #f2f2f2;
    color: #222;
    font-weight: 700;
    font-size: 13px;
    text-align: left;
    border-bottom: 1px solid #ddd;
    border-radius: 12px 12px 0 0;
    display: none;
}
/* Garder le sous-menu ouvert quand on le survole */
.nav-menu > li.menu-item-has-children:hover > .sub-menu,
.nav-menu > li.menu-item-has-children:focus-within > .sub-menu,
.nav-menu > li.menu-item-has-children > .sub-menu:hover {
    display: block;
}
.nav-menu > li.menu-item-has-children:hover > a,
.nav-menu > li.menu-item-has-children:focus-within > a,
.nav-menu > li.menu-item-has-children > .sub-menu:hover ~ a {
    display: block;
}
.nav-menu > li.menu-item-has-children {
    touch-action: manipulation;
}
.nav-menu > li,
.nav-menu > li > a,
.nav-menu .sub-menu a {
    cursor: pointer;
}

/* ===========================
   RESPONSIVE FAQ – MOBILE
   =========================== */

.faq-wrapper {
width: 95%;
margin: 60px auto 120px;
padding: 20px 16px 80px;
border-radius: 0; /* plus clean en mobile */
}

.faq-container {
display: flex !important; /* on écrase le grid */
flex-direction: column !important;
gap: 30px !important;
}

.faq-category {
width: 84%;
margin-left:5px;
}


/**** TABLEAU ****/

.wp-block-getwid-section h2 {
    background: linear-gradient(0deg, #e9d734, #e9d734, #DCE400);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
 
    color:white;
    font-size: 1.5em !important;
    margin-left:15px;
}


.wp-block-table.pack {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.wp-block-table.pack table {
    width: 95%;
    font-size: 8px;
    border-radius: 2px;
}

.wp-block-table.pack th,
.wp-block-table.pack td {
    padding: 4px 3px;
}

.wp-block-table.pack .wp-block-button__link {
    font-size: 8px;
    padding: 3px 6px;
    white-space: nowrap;
}

/**** AVIS  & FORMULAIRE ****/


/* On applique le 100% à tout SAUF aux checkbox et radio */
input:not([type="checkbox"]):not([type="radio"]), 
select, 
textarea {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
}

/* On force une taille naturelle pour les cases à cocher */
input[type="checkbox"], 
input[type="radio"] {
    width: auto !important;
    max-width: none !important;
    margin-right: 10px; /* Petit espace avec le label */
    cursor: pointer;
}
textarea {
    resize: vertical; /* empêche le débordement horizontal */
}

.acf-formulaire-container .acf-formulaire-titre-wrapper h3 {
    font-size:16px;
    white-space: nowrap;
}

/********* SLIDER *********/

/* Assombrir les images du slider */
.n2-ss-slide-background-image img {
    filter: brightness(0.55);
}

/********** Google Map *********/

.acf-google-map .map-search-box {
    width: 100vw !important;
    max-width: none !important;
    margin-top: 60px !important;
    margin-left: 22px !important;
    left: 0 !important; /* Sécurité si Google injecte un positionnement */
}

/* Optionnel : Ajuster la liste de suggestions pour qu'elle ne déborde pas non plus */
.pac-container {
    width: inherit !important;
    max-width: calc(100vw - 40px) !important; /* 20px de marge de chaque côté */
}
/******** Formulaire ********/


.acf-formulaire-champ input[type="radio"],
.acf-formulaire-champ input[type="checkbox"] {
    width: auto !important;
    flex-shrink: 0;
}

.acf-formulaire-champ {
    font-weight: bold;
}

.acf-formulaire-container label {
    min-width: 80px;
}

.acf-repeater-item {
    display:block;
}

.activites .acf-checkbox-options label {
    min-width:auto;
}

.acf-radio-options,
.acf-checkbox-options {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.acf-option {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
}

.acf-option-label {
    font-size: 14px;
    line-height: 1.3;
}
.acf-option:has(input:checked) {
    border-color: #ff9800;
    background: #fff7e6;
}

.acf-formulaire-champ input[type="range"] {
    width: 100%;
}

.acf-formulaire-champ select {
    width:50% !important;

}

.acf-repeater-item .acf-repeater-champ {
    display: block;
    width: 100%;
}

.acf-repeater-item label {
    min-width: none;
    width:20px;
  
}

.acf-repeater-item label {
    min-width:30px;
}

.acf-field-title {
    font-weight: bold;
}

.acf-radio-options {
    margin-bottom:15px;
}

.acf-instructions {
    display:block;
    margin-top:5px;
    margin-bottom:5px;
    margin-left:0px;
}

.acf-instructions.success .success-bubble {
    position: absolute;
    right:5px;
    top:-30px;
}


/* =========================
   SLIDER – FLECHES MOBILE
========================= */

.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: var(--swiper-pagination-bottom,-3px) !important;
}

/***********************/
/*        MODAL        */
/***********************/

.modal-box {
    top:80px;
}

/***********************/
/*       OFFRE         */
/***********************/

.infos-user-box {
    max-width: 83%;
}

.acf-etapes-navigation {
    width:100%;
}

.acf-etape {
    width:30px;
    height:30px;
}

/******************/
/*      MODAL     */
/******************/


/* OVERLAY */
.modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.7);
    z-index: 9999;

    display: flex;
    justify-content: center;
    align-items: flex-start;

    overflow-y: auto;
}

/* MODAL BOX */
.modal-box {
    position: relative;
    width: 99%;
    max-width: 99%;
    background: #fff;

    margin: 0;
    padding: 30px 15px 20px; /* espace pour la croix */

    box-sizing: border-box;
}

/* BOUTON FERMER */
#close-modal {
    position: absolute;
    top: 90px;        /* comme tu l’as réglé */
    left: 10px;

    z-index: 10000;

    width: 36px;
    height: 36px;

    border: none;
    border-radius: 50%;

    background: #ff9800;

    font-size: 20px;
    font-weight: bold;
    line-height: 1;

    display: flex;
    align-items: center;
    justify-content: center;

    cursor: pointer;
}


/* OPTIONNEL : HOVER DESKTOP */
#close-modal:hover {
   opacity:0.8;
}

.user-sticker {

    top:-35px;
    right:75px;
}


.header-nav-container {
    position: relative;
}

.acf-formulaire-titre-wrapper {
        display: flex;
        flex-wrap: wrap; /* Permet aux éléments de passer à la ligne */
        align-items: center;
        padding: 10px;
}

.acf-formulaire-titre {
    font-size: 1.1rem !important; /* On réduit un peu la taille sur petit écran */
    line-height: 1.3;
    word-break: break-word; /* Force la coupure si besoin */
    white-space: normal !important; /* Autorise le retour à la ligne */
    margin: 0;
    flex: 1; /* Prend l'espace restant à côté de l'icône */
}