/*
Theme Name: GeneratePress Child
Theme URI: https://generatepress.com
Author: Tom Usborne
Author URI: https://tomusborne.com
Description: GeneratePress is a lightweight WordPress theme built with a focus on speed and usability. Performance is important to us, which is why a fresh GeneratePress install adds less than 10kb (gzipped) to your page size. We take full advantage of the block editor (Gutenberg), which gives you more control over creating your content. If you use page builders, GeneratePress is the right theme for you. It is completely compatible with all major page builders, including Beaver Builder and Elementor. Thanks to our emphasis on WordPress coding standards, we can boast full compatibility with all well-coded plugins, including WooCommerce. GeneratePress is fully responsive, uses valid HTML/CSS, and is translated into over 25 languages by our amazing community of users. A few of our many features include 60+ color controls, powerful dynamic typography, 5 navigation locations, 5 sidebar layouts, dropdown menus (click or hover), and 9 widget areas. Learn more and check out our powerful premium version at https://generatepress.com
Author:       Agence EVVI
Author URI:   http://example.com
Template:     generatepress
Version:      1.0.0
Text Domain:  generatepress_child
*/

/* Chaque filtre prend de la place et peut s'agrandir */
.wp-grid-builder .wpgb-facet {
    flex: 1;
    min-width: 200px;
}

/* Hide separators */
.wpgb-facet .wpgb-select-facet label .wpgb-select-controls .wpgb-select-separator,
.wpgb-facet .wpgb-select-facet .wpgb-select .wpgb-select-controls .wpgb-select-separator {
    display: none;
}

/* Enhanced select styling */
.wpgb-facet .wpgb-select-facet label select,
.wpgb-facet .wpgb-select-facet .wpgb-select,
.wp-grid-builder .wpgb-select {
    position: relative;
    border: 2px solid #3089CA;
    color: #3089CA;
    font-family: 'SF UI Display', sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    border-radius: 10px;
    padding: 10px 14px;
    transition: all 0.2s ease-in-out;
    background-color: rgba(48, 137, 202, 0.03);
}

/* Style for select elements */
.wp-grid-builder .wpgb-select select,
.wpgb-facet .wpgb-select-facet label select {
    width: 100%;
    height: 42px;
    padding: 0 16px;
    border: 2px solid #3089CA;
    border-radius: 10px;
    background: #FFFFFF;
    color: #3089CA !important;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.875rem;
    appearance: none;
    cursor: pointer;
}

/* Hover state for selects */
.wpgb-facet .wpgb-select-facet label select:hover,
.wpgb-facet .wpgb-select-facet .wpgb-select:hover {
    border-color: #2271b1;
    background-color: rgba(48, 137, 202, 0.08);
    transform: translateY(-1px);
}

/* Focus state for selects */
.wpgb-facet .wpgb-select-facet label select:focus,
.wpgb-facet .wpgb-select-facet .wpgb-select:focus-within {
    border-color: #1e5c8a;
    box-shadow: 0 0 0 2px rgba(48, 137, 202, 0.25);
    outline: none;
}

/* Placeholder text styling */
.wpgb-facet .wpgb-select-facet .wpgb-select .wpgb-select-placeholder input[type=text],
.wpgb-select-placeholder input#wpgb-select-0 {
    color: #3089CA !important;
    font-family: 'SF UI Display', sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    transition: color 0.2s ease;
}

/* SVG icon styling with animation */
.wpgb-facet .wpgb-select-facet label svg,
.wpgb-facet .wpgb-select-facet .wpgb-select svg {
    color: #3089CA;
    transition: transform 0.2s ease;
}

/* Animate icon on hover/focus */
.wpgb-facet .wpgb-select-facet label:hover svg,
.wpgb-facet .wpgb-select-facet .wpgb-select:hover svg,
.wpgb-facet .wpgb-select-facet .wpgb-select:focus-within svg {
    transform: translateY(2px);
    color: #1e5c8a;
}

/* Dropdown styling */
.wpgb-select-dropdown {
    background-color: rgba(48, 137, 202, 0.03);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(48, 137, 202, 0.2);
    padding: 8px 0;
    margin-top: 4px;
    animation: fadeInDropdown 0.2s ease-out;
    max-height: 300px;
    overflow-y: auto;
}

.wpgb-select-dropdown::-webkit-scrollbar {
    width: 6px;
}

.wpgb-select-dropdown::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.03);
    border-radius: 3px;
}

.wpgb-select-dropdown::-webkit-scrollbar-thumb {
    background-color: rgba(48, 137, 202, 0.3);
    border-radius: 3px;
}

.wpgb-select-dropdown #wpgb-select-results .wpgb-dropdown-item {
    padding: 8px 14px;
    color: #333;
    font-size: 14px;
    transition: background 0.2s, color 0.2s;
    cursor: pointer;
}

.wpgb-select- #wpgb-select-results .wpgb-dropdown-item:hover,
.wpgb-select-dropdown #wpgb-select-results .wpgb-dropdown-item.wpgb-dropdown-item-active {
    background-color: rgba(48, 137, 202, 0.1);
    color: #3089CA;
}

.wpgb-select-dropdown #wpgb-select-results .wpgb-dropdown-item.wpgb-dropdown-item-selected {
    background-color: rgba(48, 137, 202, 0.15);
    color: #3089CA;
    font-weight: 500;
}

@keyframes fadeInDropdown {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Responsive : une colonne sur petit écran */
@media (max-width: 768px) {
    .wp-grid-builder .wpgb-area-top-1 {
        flex-direction: column;
    }
}

.wpgb-block-27 {
    position: relative !important;
}

/* ======================== */

.wp-grid-builder.wpgb-grid-3 .wpgb-sidebar {
    flex-basis: 10%;
}

.wpgb-grid-3 .wpgb-carousel {
    display: flex !important;
    gap: 3rem !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    overflow-x: auto; /* Permet le scroll horizontal sur mobile */
    scroll-snap-type: x mandatory; /* Pour effet swipe */
    -webkit-overflow-scrolling: touch;
}

.wpgb-grid-3 .wpgb-carousel .wpgb-masonry {
    display: flex;
    flex-flow: row nowrap;
    gap: 3rem !important;
    width: auto !important;
    align-items: stretch !important;
}

/* Carte standard */
.wpgb-grid-3 .wpgb-carousel article {
    flex: 0 0 auto;
    width: 300px;
    margin-right: 2rem;
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: transform 0.3s ease;
    scroll-snap-align: start;
}

.wpgb-grid-1 .wpgb-masonry article, .wpgb-grid-2 .wpgb-masonry article {
    transition: transform 0.3s ease;
}

.wpgb-grid-3 .wpgb-carousel article:hover {
    transform: translateY(-5px);
}

.wpgb-grid-1 .wpgb-masonry article:hover, .wpgb-grid-2 .wpgb-masonry article:hover {
    transform: translateY(-5px);
}

.wpgb-grid-1 .wpgb-masonry,
.wpgb-grid-2 .wpgb-masonry {
    display: flex !important;
    gap: 3rem !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
}

.wpgb-grid-1 .wpgb-card,
.wpgb-grid-2 .wpgb-card {
    position: relative !important;
    width: calc(33.3333% - 2rem) !important;
    left: 0 !important;
    top: 0 !important;
}

.wpgb-grid-1 .wpgb-card-wrapper,
.wpgb-grid-2 .wpgb-card-wrapper {
    width: 100% !important;
}

.wpgb-grid-1 .wpgb-layout .wpgb-viewport,
.wpgb-grid-2 .wpgb-layout .wpgb-viewport {
    height: max-content !important;
}

/* ====================== */
/* === GLOBAL STYLES === */

/* === RESPONSIVE === */
/* @media screen and (min-width: 1351px) {
    .wpgb-grid-3 .wpgb-carousel article {
        width: 330px;
    }
}

@media screen and (min-width: 769px) and (max-width: 1350px) {
    .wpgb-grid-3 .wpgb-carousel .wpgb-masonry {
        gap: 1.5rem !important;
    }
    
    .wpgb-grid-3 .wpgb-carousel article {
        width: 280px;
        margin-right: 1rem;
    }

    .wp-grid-builder.wpgb-grid-3 .wpgb-sidebar {
        flex-basis: 15%;
    }
} */

/* === MOBILE OPTIMISÉ === */
/* @media screen and (max-width: 768px) {
    .wpgb-grid-3 .wpgb-carousel {
        gap: 1rem !important;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .wpgb-grid-3 .wpgb-carousel article {
        width: 85vw !important;
        margin-right: 1rem;
    }

    .wp-grid-builder.wpgb-grid-3 .wpgb-sidebar {
        display: none;
    }
} */


/* ================================= */

@media screen and (min-width: 769px) and (max-width: 1350px) {
    .wpgb-grid-1 .wpgb-masonry,
    .wpgb-grid-2 .wpgb-masonry {
        display: flex !important;
        gap: 4rem !important;
        flex-wrap: wrap !important;
        align-items: stretch !important;
    }

    .wpgb-grid-1 .wpgb-card,
    .wpgb-grid-2 .wpgb-card {
        position: relative !important;
        width: calc(50% - 2rem) !important;
        /* 2rem gap on each side */
        /* 3 cards per row with gap */
        left: 0 !important;
        top: 0 !important;
    }

    .wpgb-grid-1 .wpgb-card-wrapper,
    .wpgb-grid-2 .wpgb-card-wrapper {
        width: 100% !important;
    }

    .wpgb-grid-1 .wpgb-layout .wpgb-viewport,
    .wpgb-grid-2 .wpgb-layout .wpgb-viewport {
        height: max-content !important;
    }

}

@media screen and (max-width: 768px) {
    .wpgb-grid-1 .wpgb-layout .wpgb-viewport,
    .wpgb-grid-2 .wpgb-layout .wpgb-viewport {
        height: max-content !important;
    }

    .wpgb-grid-1 .wpgb-masonry,
    .wpgb-grid-2 .wpgb-masonry {
        display: flex !important;
        gap: 4rem !important;
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .wpgb-grid-1 .wpgb-card,
    .wpgb-grid-2 .wpgb-card {
        position: static !important;
        width: 100% !important;
        left: auto !important;
        top: auto !important;
    }

    .wpgb-grid-1 .wpgb-card-wrapper,
    .wpgb-grid-2 .wpgb-card-wrapper {
        width: 100% !important;
    }
}

.wp-grid-builder .wpgb-card [class*=wpgb-block-] {

    white-space: normal !important;
}

/*.wp-grid-builder .wpgb-card .wpgb-card-body {*/
/*    flex: auto;*/
/*    position: relative;*/
/*}*/

article {
    width: 30%;
}

.mySwiper {
    height: 30%;
    margin: 0 auto;
    max-height: 300px;
}

.wpgb-layout, .wp-grid-builder .wpgb-main .wpgb-area {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.wpgb-area.wpgb-area-top-1,
.wp-grid-builder .wpgb-area-top-1 {
    background-color: #fff;
    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08); */
    border-radius: 10px;
    padding: 16px;
    transition: box-shadow 0.3s ease;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 4rem;
}


/* .wp-grid-builder .wpgb-main .wpgb-area {
    margin-bottom: 5rem;
} */

/*Filtre page annonce*/
/*.wpgb-area-top-1 {*/
/*    width: 80%;*/
/*}*/
.wpgb-block-25 {
    margin: 0 auto;
    background-color: #DEAD1F;
    padding: 5px;
}

.wpgb-block-26 {
    margin: 0 auto;
    background-color: #3089CA;
}

.wpgb-card-inner .wpgb-card-header .imageCard {
    height: 100% !important;
    width: 100% !important;
    object-fit: cover;
}

.wpgb-grid-3 .wpgb-main .wpgb-layout {
    width: 100%;
}

.wp-grid-builder .wpgb-sidebar {
    width: 20%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.wpgb-prev-button {
    background-color: transparent !important;
    color: #fff !important;
    border: 2px solid white !important;
    border-radius: 50% !important;
}

.wpgb-next-button {
    background-color: transparent !important;
    color: #fff !important;
    border: 2px solid white !important;
    border-radius: 50% !important;
}

/* 1. On rend le body du card positionné pour que les badges puissent être placés par-dessus */
.wpgb-card-body {
    position: relative !important;
    overflow: hidden;
    /* au cas où les badges dépasseraient un peu */
}

/* 2. On cible le conteneur des deux labels (bloc 27) */
.wpgb-block-27 {
    position: absolute !important;
    top: 8px;
    /* ajuster selon ton goût */
    right: 8px;
    /* idem */
    /* display: flex; */
    flex-direction: column;
    gap: 6px;
    /* espace entre les deux badges */
    z-index: 10;
}

/* 3. On uniformise l’apparence des labels */
.wpgb-block-25,
.wpgb-block-26 {
    margin: 0;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 0.85em;
    font-weight: 600;
    color: #fff;
    white-space: nowrap;
}

/* 4. On change seulement les couleurs */
.wpgb-block-25 {
    background-color: var(--secondary-color-gold);
}

/* “A VOIR ABSOLUMENT” */
.wpgb-block-26 {
    background-color: var(--tertiary-color-blue);
}


/* Centre le conteneur de pagination */
.wp-grid-builder .wpgb-pagination-facet {
    display: flex;
    justify-content: center;
    margin-top: 5rem;
}

.wp-grid-builder .wpgb-pagination-facet .wpgb-pagination li a,
.wp-grid-builder .wpgb-pagination-facet .wpgb-pagination li span.wpgb-dots-page {
    font-size: 1.1rem;
    color: var(--e-global-color-accent);
}

.wp-grid-builder .wpgb-pagination-facet .wpgb-pagination li:hover a {
    color: var(--e-global-color-secondary);
    font-size: 1.2rem;
    background-color: rgba(48, 137, 202, 0.1);
    border-radius: 5px;
    transition: background-color 0.3s ease;
}

.wp-grid-builder .wpgb-pagination-facet .wpgb-pagination li a[aria-current] {
    font-weight: bold;
    color: var(--e-global-color-secondary);
    background-color: rgba(48, 137, 202, 0.1);
    border-radius: 5px;
}

/* Assure que la liste reste en ligne */
.wpgb-pagination {
    display: inline-flex;
}