/**
 * View Toggle Styles
 * Styles pour les boutons et animations de basculement liste/carte
 */

/* Smooth scroll pour les animations */
html {
    scroll-behavior: smooth;
}

/* Boutons de toggle */
.list-button a,
.map-button a{
    padding: 12px 24px;
    background-color: #eff1e3!important;
    border: none;
    border-radius: 40px;
    font-size: 16px;
    font-weight: 500;
    color: black;
    cursor: pointer;
    transition: all 0.3s ease;
    outline: none;
    border:0px!important;
}

.wp-block-button.list-button:hover a,
.wp-block-button.is-style-yellow-bg.map-button:hover a{
    background-color: #ffed00!important;
    color:black!important;
        transform: translateY(-2px);
}

.list-button.active a,
.map-button.active a{
    background-color: #ffed00!important;
    color: #000;
}

/* Container pour les vues avec position relative */
.wp-block-query,
.etablissements-map-wrapper {
    width: 100%;
    transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1), 
                max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Vue active : visible et prend de l'espace */
.view-active {
    opacity: 1;
    max-height: 10000px; /* Valeur très grande pour ne pas limiter */
    overflow: visible;
    pointer-events: auto;
}

/* Vue cachée : invisible et ne prend pas d'espace */
.view-hidden {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    pointer-events: none;
    margin: 0 !important;
    padding: 0 !important;
}