/**
 * Repris à l'identique de wp-content/plugins/naturbox/assets/css/openagenda.css
 * (enqueuée par NaturBox via wpnb_front_scripts(), jamais par le thème) : c'est
 * cette feuille qui fournit la mise en page des templates front `sortie`
 * (.featured_nb, .oa-title, #filters, .event-img, etc.), pas le thème lui-même.
 * Désactiver NaturBox sans la reprendre ici casse tout l'affichage front — trouvé
 * après la bascule réelle, à l'origine manqué par l'audit du lot 8 (qui n'avait
 * cherché que les dépendances PHP wpnb_\*\/WC_naturbox, pas les assets enqueués).
 * single_natur_box.js, enqueuée par le même hook, n'a pas été repris : il ne
 * fait que manipuler les anciens formulaires Ninja Forms (classes .ATP/.ADE),
 * sans rapport avec les nouveaux formulaires [an_inscription].
 */
/**
 * Leaflet utilise des z-index internes allant jusqu'à 1000 (contrôles de zoom,
 * popups) — sans confinement, ils passent au-dessus du menu de navigation du
 * thème (sous-menus déroulants), quel que soit l'ordre dans le DOM. `isolation:
 * isolate` crée un nouveau contexte d'empilement pour la carte : ses z-index
 * internes restent piégés à l'intérieur, incapables de dépasser leurs voisins
 * dans la page — pas besoin de connaître la valeur exacte du menu pour la battre.
 */
#map {
    isolation: isolate;
}

/* Indice affiché par AnMap.activerZoomCtrl() (front.js) quand on molette sur la carte
   sans Ctrl : la molette seule fait défiler la page, jamais zoomer par accident. */
.an-map-zoom-hint {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(0, 0, 0, 0.75);
    color: #fff;
    padding: 10px 18px;
    border-radius: 4px;
    font-size: 0.95rem;
    text-align: center;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.2s ease;
    z-index: 1000;
}

.an-map-zoom-hint--visible {
    opacity: 1;
}

/**
 * Formulaires natifs [an_inscription]/[an_modifier_inscription]/[an_desinscription]
 * (class-an-front-shortcodes.php) : reprennent l'apparence de l'ancien rendu Ninja
 * Forms définie dans wp-content/themes/aev/style.css (section "FORMULAIRE" — le
 * fond gris de `.nf-form-layout form`, le rouge #e80000 de `.ninja-forms-req-symbol`).
 * Le titre du formulaire (ex. "Tout public") est un <h3> classique : il hérite du
 * rouge #8D1A1A déjà posé par `.entry-content h3`, pas besoin d'une classe dédiée.
 */
.an-form {
    background-color: #F7F7F7;
    padding: 30px;
    color: #464444;
    border-radius: 30px;
}

.an-mentions {
    font-size: 1.5rem;
    color: grey;
}

.an-req {
    color: #e80000;
}

.an-form label {
    display: block;
    font-size: 1.6rem;
    font-weight: 400;
    margin-bottom: 5px;
}

.an-form input[type="text"],
.an-form input[type="tel"],
.an-form input[type="email"],
.an-form select {
    display: block;
    width: 100%;
    height: 35px;
    box-sizing: border-box;
    padding: 0 10px;
    margin-top: 5px;
    background: white;
    border: 1px solid silver;
    border-radius: 4px;
    font-size: 1.4rem;
    color: #464444;
}

.an-consent {
    display: flex;
    align-items: flex-start;
}

.an-consent label {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 1.4rem;
    font-weight: 400;
}

.an-consent input[type="checkbox"] {
    flex-shrink: 0;
    width: auto;
    margin-top: 4px;
}

.an-form button[type="submit"] {
    background-color: #464444;
    color: white;
    border: none;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 1.4rem;
    padding: 12px 30px;
    border-radius: 4px;
    cursor: pointer;
}

.an-form button[type="submit"]:hover {
    background-color: #2e2d2d;
}

.an-form button[type="submit"]:disabled {
    background-color: #d9d9d9;
    color: #595959;
    cursor: not-allowed;
}

.openagenda {
    width: 90%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.openagenda p,
.openagenda h2 {
    color: black;
    padding: 0;

}

.openagenda p {
    margin: 0px 8px 0px 8px;
    font-size: 1.6rem;
}

.openagenda h2 {
    font-size: 1.8rem;
    margin: 8px 8px 5px 8px;


}

.openagenda a {
    text-decoration: none;
}



.openagenda article.over {
    background: rgba(0, 0, 0, 0.1);
}

.openagenda article {
    margin: 2%;
    width: 320px;
    height: 440px;
    border: 1px solid silver;
    position: relative;
    border-radius: 15px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.02),
        0 2px 2px rgba(0, 0, 0, 0.02),
        0 4px 4px rgba(0, 0, 0, 0.02),
        0 6px 8px rgba(0, 0, 0, 0.02),
        0 8px 16px rgba(0, 0, 0, 0.02);

}

.openagenda article section {
    padding: 0;

}

.openagenda article section p {
    padding: 0;
}


.animation #filters .filter-group {
    background: #efefef;
    padding: 1em;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.animation #filters .filter-group .filter {
    display: flex;
    flex-direction: column;
    padding: 0 1em;
    width: 300px;
}

.filter-group {
    border-bottom: solid 1px #8D1A1A;
}

.filter-group:last-child {
    border-bottom: none;
}

.animation #filters h4 {
    margin: 0;
    padding: 0;

}

.animation #filters .filter-row {
    flex-direction: column;
    justify-content: flex-start;
    display: flex;
}

.animation #filters .filter-row .filter {
    flex-direction: row;
    justify-content: flex-start;
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    padding-bottom: 1em;
}

.animation #filters .filter-row .filter p{
    flex-direction: row;
    display: flex;
    margin-bottom: 5px;
    align-items: center;
    margin-right: 15px;
}
.animation #filters .filter-group .filter p {
    flex-direction: row;
    display: flex;
    margin-bottom: 5px;
    align-items: center;
}
.animation #filters .filter-group .filter p a {
   font-size: 10px;
}
.div_init {
    align-items: center;
    display: flex;
}
.div_init p {
    margin: 0;
}
.animation #filters .filter-group.init {
    background: #efefef;
    padding: 1em;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
}
input[type=radio] {
    display: block;
    margin-top: -5px;
    margin-right: 5px;
}

.animation #filters .filter-title {
    display: flex;
    flex-direction: column;
}

.animation #filters .filter-title h4 {
    font-size: 2.5rem;
    text-transform: uppercase;
    color: #464444;
    margin-right: 20px;
    margin-bottom: 15px;
}

.animation #filters select option.unactive,
.animation #filters p.unactive {
    opacity: 0.4;
}

.filter-group select {
    background:
        linear-gradient(45deg, transparent 50%, white 50%),
        linear-gradient(135deg, white 50%, transparent 50%),
        linear-gradient(to right, #8D1A1A, #8D1A1A);
    background-position:
        calc(100% - 21px) calc(1em + 2px),
        calc(100% - 16px) calc(1em + 2px),
        100% 0;
    background-size:
        5px 5px,
        5px 5px,
        2.5em 2.5em;
    background-repeat: no-repeat;

    /* styling and reset */

    border: thin solid #8D1A1A;
    line-height: 1.5em;
    padding: 0.5em 3em 0.5em 1em;

    /* reset */
    border-radius: 50px;
    margin: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.filter-group select:focus {
    outline: none;
}


.filter-group select:after {

    padding-right: 10px;

}


#filters .row {
    display: flex;
}

.featured_nb {
    display: flex;
    flex-direction: row;
    margin: 0% 10%;
    flex-wrap : wrap;
}

.featured_nb .single_img {
    width: 60%;
}

.featured_nb .single_img img {
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    height: 400px;

}

.featured_nb .single_map {
    width: 40%;
}

.featured_nb .single_map #map {
    height: 400px;
    margin-left: 20px;
}

.single-sortie .post-inner {
    padding-top: 3rem;
    display: flex;
}

.event-img img {
    border-radius: 15px 15px 0px 0px;
    height: 200px;
    width: 100%;
    object-fit: cover;
}

p.date-anim {
    font-weight: 700;
     color: #464444;
}


.oa-title {
    visibility: visible !important;
    font-size: 3rem;
    color: #464444;
    margin: 25px 0 5px 0;
}





.oa-icon {
    width: 66px !important;
    height: 66px !important;
    display: unset;
    vertical-align: middle;
}

.single-sortie .entry-header-inner {
    display: flex;
    flex-direction: column;
    text-align: left;
}



.featured_nb .right-div {
    margin-left: 20px;
    width:38%;
}


.featured_nb .entry-content {
    width: 60%;
    margin-bottom: 2em;
}

.content-right-div {
    height: auto;
    border: #8D1A1A solid 1px;
    padding: 10px;

}

.red_button {
    background: #a29b90 !important;
    width: 100%;
    margin: 0px;
    text-transform: inherit;
    padding: 26px 15px 12px;
    border-radius: 0px 0px 15px 15px;
    position: absolute;
    bottom: 0;
    left: 0;
    line-height: 0.8;
}

.orange_button {
    background: #F8B645 !important;
    width: 100%;
    margin: 0px;
    text-transform: inherit;
    padding: 10px;
    border-radius: 0px 0px 15px 15px;
    position: absolute;
    bottom: 0;
    left: 0;
    font-size: 1.5rem;
}

.cat-icon {
    position: absolute;
    top: -1em;
    left: -1em;
}


button.green_button {
    background-color: #83983e;
    width: 100%;
    margin: 0px;
    text-transform: inherit;
    padding: 15px;
    border-radius: 0px 0px 15px 15px;
    position: absolute;
    bottom: 0;
    left: 0;

}


.openagenda .annule {
    color: green;
    text-align: center;
    border: 1px solid green;
    font-size: 1.7rem;
    width: 100%;
    margin: 0px;
    text-transform: inherit;
    padding: 15px;
    border-radius: 0px 0px 15px 15px;
    position: absolute;
    bottom: 0;
    left: 0;
}


.titre-anim {
width: 100%;
}

@media (max-width: 605px) {
    
    .animation #filters .filter-title {
    width: 100%;
        margin-bottom: 15px;
    }
    
    .animation #filters .filter-group .filter {
    width: 300px;
    margin-bottom: 15px;
    }
    
    .animation #filters .filter-title h4 {
    margin-bottom: 0px; 
    }
    
}

@media (max-width: 1023px) {
    
    .featured_nb {
    padding: 0.3em;
    margin : 0% 3%;
    }
  .featured_nb .single_img {
    width: 100%;
}  
    
    
    .featured_nb .single_map {
    width: 100%;
}

.featured_nb .single_map #map {
    width: 100%;
    height: 200px;
    margin: 0 auto;
}
    
    .featured_nb .right-div {
    margin-left: 0px;
    width: 100%;
    margin-top : 25px;
}

.content-right-div {
    height: auto;
    border: #8D1A1A solid 1px;
    padding: 15px;
    width: 100%;

}
    
    .featured_nb .entry-content {
        width: 100%;
    }
    
}
#all_filters {
    width:60%;
}
.map-div {
    display: flex;
    width: 40%;  
}
.complet {
    position: absolute;
    left: 8.5em;
    bottom: 29px;
    z-index: 300;
    padding: 0 7px;
    font-size: 15px;
    color: white;
    text-transform: uppercase;
}
.participants {
    margin-top: 0;
    flex-direction: column;
    justify-content: space-around;
    display: flex;
}
.participants label {
    margin-top: 1em;
}
div.modif .row {
    margin-top: 2em;
}
div.modif h2 {
    margin: 0 0 1rem;
}
 
div.modif {
    display: flex;
    justify-content: center;
    background-color:#ebebeb;
    margin: 2em 19% 0;
    padding: 1.5em;
    border-radius: 30px;
}
.featured_modif {
    display: flex ;
    flex-direction: column;
    padding: 0 1em;
}
.modif .horaires {
    margin: 1em 0 0;
    display: flex;
    flex-direction: column;
}
.modif .nb_places {
    margin: 2em 0;
}
select .disabled-option {
    color: #a29b90;
}
.popup_update {
    position: absolute;
    background: white;
    padding: 1em 1em 0;
    left: 30%;
    top: 42em;
    border: 1px solid #3f8513;
    -webkit-box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.74); 
    box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.74);
}
.modif .mail_tel {
    justify-content: space-around;
}
.modif .mail_tel p {
    display: flex;
    flex-direction: column;
    align-items: start;
    width: 50%;
}
.modif .mail_tel p input {
    width: 90%;
    border: 1px solid black;
    font-weight: 400;
    padding: 5px;
}
#mod_coords {
    margin-left: 10px;
}
.modif select {
    padding: 5px;
}
.field-wrap>div input[type=checkbox] {
    min-height: 1.5rem;
}
@media (min-width: 1000px) {
    #site-header {
        z-index: 2000 !important;
    }
}
.menu-modal.active {
    z-index: 2000;
}