/* //////////////////////////////////////////// */
/* /////////// LISTING CATEGORIE ////////////// */
/* /////////// Pyrenees Canin ///////////////// */
/* //////////////////////////////////////////// */


/* ============================================ */
/* ======= LAYOUT FULL WIDTH ================= */
/* ============================================ */

#left-column {
    display: none !important;
}

#content-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}


/* ============================================ */
/* ======= MASQUER LE WIDGET FILTRE CE ======= */
/* ============================================ */

/* On cache le widget listing-filters natif sur la page
   (il sera deplace dans la modal par le JS) */
.elementor-widget-listing-filters {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}


/* ============================================ */
/* ======= GRILLE PRODUITS =================== */
/* ============================================ */

#js-product-list .products,
#js-product-list .ce-products,
#js-product-list .ce-product-grid,
#js-product-list .products.ce-products.ce-product-grid.elementor-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 28px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    flex-wrap: unset !important;
    width: 100% !important;
}

/* 4 colonnes */
@media (max-width: 1200px) {

    #js-product-list .products,
    #js-product-list .ce-products,
    #js-product-list .ce-product-grid,
    #js-product-list .products.ce-products.ce-product-grid.elementor-grid {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

/* 3 colonnes */
@media (max-width: 992px) {

    #js-product-list .products,
    #js-product-list .ce-products,
    #js-product-list .ce-product-grid,
    #js-product-list .products.ce-products.ce-product-grid.elementor-grid {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

/* 2 colonnes */
@media (max-width: 768px) {

    #js-product-list .products,
    #js-product-list .ce-products,
    #js-product-list .ce-product-grid,
    #js-product-list .products.ce-products.ce-product-grid.elementor-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 16px !important;
    }
}

/* 1 colonne */
@media (max-width: 480px) {

    #js-product-list .products,
    #js-product-list .ce-products,
    #js-product-list .ce-product-grid,
    #js-product-list .products.ce-products.ce-product-grid.elementor-grid {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
}

/* Reset des items CE */
#js-product-list .js-product.product,
#js-product-list .ce-product-grid>div {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    flex: none !important;
    -webkit-flex-basis: auto !important;
    flex-basis: auto !important;
}


/* ============================================ */
/* ======= CARD PRODUIT ====================== */
/* ============================================ */

#js-product-list .product-miniature {
    background-color: #ffffff !important;
    border: 1px solid #eeeeee !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    transition: box-shadow 0.3s ease !important;
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    padding: 12px !important;
}

#js-product-list .product-miniature:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
    transform: none !important;
}

/* Empecher tout deplacement des elements internes au hover */
#js-product-list .product-miniature .thumbnail-container,
#js-product-list .product-miniature .thumbnail-top,
#js-product-list .product-miniature .product-thumbnail,
#js-product-list .product-miniature .product-thumbnail img,
#js-product-list .product-miniature .product-description,
#js-product-list .product-miniature .product-title,
#js-product-list .product-miniature .product-price-and-shipping {
    transform: none !important;
}

#js-product-list .product-miniature:hover .thumbnail-container,
#js-product-list .product-miniature:hover .thumbnail-top,
#js-product-list .product-miniature:hover .product-thumbnail,
#js-product-list .product-miniature:hover .product-thumbnail img,
#js-product-list .product-miniature:hover .product-description,
#js-product-list .product-miniature:hover .product-title,
#js-product-list .product-miniature:hover .product-price-and-shipping {
    transform: none !important;
}

/* Thumbnail container */
#js-product-list .product-miniature .thumbnail-container {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    position: relative !important;
    overflow: visible !important;
}

/* Zone image */
#js-product-list .product-miniature .thumbnail-top {
    position: relative !important;
    overflow: hidden !important;
    border-radius: 12px !important;
    background: #f9f9f9 !important;
}

#js-product-list .product-miniature .thumbnail-top .product-thumbnail {
    display: block !important;
}

#js-product-list .product-miniature .thumbnail-top .product-thumbnail img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    object-fit: cover !important;
    border-radius: 12px !important;
}

/* Badges */
#js-product-list .product-miniature .product-flags {
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    z-index: 2 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

#js-product-list .product-miniature .product-flag {
    display: inline-block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    padding: 5px 12px !important;
    border-radius: 6px !important;
    line-height: 1.3 !important;
    text-transform: uppercase !important;
}

#js-product-list .product-miniature .product-flag.discount {
    background-color: #e74c3c !important;
    color: #ffffff !important;
}

#js-product-list .product-miniature .product-flag.new {
    background-color: #A0CE4D !important;
    color: #ffffff !important;
}

#js-product-list .product-miniature .product-flag.on-sale {
    background-color: #e74c3c !important;
    color: #ffffff !important;
}

/* Quick view overlay */
#js-product-list .product-miniature .highlighted-informations,
#js-product-list .product-miniature .highlighted-informations.no-variants {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    background: rgba(0, 0, 0, 0.55) !important;
    padding: 0 !important;
    text-align: center !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.3s ease, visibility 0.3s ease !important;
    z-index: 3 !important;
    height: 40px !important;
    max-height: 40px !important;
    min-height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    transform: none !important;
    margin: 0 !important;
    border-radius: 0 0 12px 12px !important;
}

#js-product-list .product-miniature:hover .highlighted-informations {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}

#js-product-list .product-miniature .quick-view {
    color: #ffffff !important;
    font-size: 13px !important;
    text-decoration: none !important;
}

#js-product-list .product-miniature .quick-view i {
    font-size: 16px !important;
    vertical-align: middle !important;
    margin-right: 4px !important;
}

/* Masquer variant-links completement */
#js-product-list .product-miniature .highlighted-informations .variant-links {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    position: absolute !important;
    left: -9999px !important;
}


/* ============================================ */
/* ======= DESCRIPTION PRODUIT =============== */
/* ============================================ */

#js-product-list .product-miniature .product-description {
    padding: 12px 4px 44px 4px !important;
    position: relative !important;
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    transform: none !important;
    transition: none !important;
}

/* Nom du produit */
#js-product-list .product-miniature .product-title {
    margin: 0 0 6px 0 !important;
}

#js-product-list .product-miniature .product-title a {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #232323 !important;
    text-decoration: none !important;
    line-height: 1.3 !important;
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#js-product-list .product-miniature .product-title a:hover {
    color: #A0CE4D !important;
}

/* Prix */
#js-product-list .product-miniature .product-price-and-shipping {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    margin-top: auto !important;
}

#js-product-list .product-miniature .price {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #232323 !important;
    order: 2 !important;
}

#js-product-list .product-miniature .regular-price {
    font-size: 13px !important;
    color: #bbbbbb !important;
    text-decoration: line-through !important;
    font-weight: 400 !important;
    order: 1 !important;
}

/* Masquer le badge % dans le prix (deja dans les flags) */
#js-product-list .product-miniature .discount-percentage,
#js-product-list .product-miniature .discount-amount,
#js-product-list .product-miniature .discount-product {
    display: none !important;
}

/* Avis — masquer */
#js-product-list .product-miniature .product-list-reviews {
    display: none !important;
}

/* Bouton panier vert rond — positionne sur la card directement */
#js-product-list .product-miniature::after {
    content: "" !important;
    position: absolute !important;
    bottom: 16px !important;
    right: 16px !important;
    background-color: #A0CE4D !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    display: block !important;
    cursor: pointer !important;
    box-shadow: 0 2px 8px rgba(160, 206, 77, 0.3) !important;
    z-index: 5 !important;
    transition: background-color 0.3s ease !important;
    transform: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='31' height='31' viewBox='0 0 31 31'%3E%3Cpath d='M27.853,28.036,26.012,10.55a2.672,2.672,0,0,0-2.667-2.4h-.027l-1.8.017V6.037a6.037,6.037,0,0,0-12.073,0V8.283L7.568,8.3A2.681,2.681,0,0,0,4.926,10.71l-1.78,17.3a2.683,2.683,0,0,0,2.664,2.957L25.181,31h0a2.683,2.683,0,0,0,2.667-2.964Zm-16.468-22a4.1,4.1,0,0,1,8.2,0V8.184l-8.2.08Zm14.353,22.78a.691.691,0,0,1-.553.246h0l-19.37-.031a.745.745,0,0,1-.74-.821l1.779-17.3a.736.736,0,0,1,.734-.669l1.86-.018v1.6a.969.969,0,1,0,1.938,0V10.2l8.2-.08v1.7a.969.969,0,1,0,1.938,0V10.1l1.816-.018h.008a.742.742,0,0,1,.741.667l1.841,17.487a.691.691,0,0,1-.188.577Z' fill='%23fff'/%3E%3Cg transform='translate(8.559 13.008)'%3E%3Cpath d='M12.116,7.428a1.891,1.891,0,0,1-.644.985,1.284,1.284,0,0,1-.781.282,1.085,1.085,0,0,1-.3-.041,1.217,1.217,0,0,1-.787-.773,1.984,1.984,0,0,1,.616-2.163,1.157,1.157,0,0,1,1.867.532A1.9,1.9,0,0,1,12.116,7.428Zm-7.5-1.021a1.36,1.36,0,0,0,1.1-.644,2.44,2.44,0,0,0,.395-1.37,2.44,2.44,0,0,0-.395-1.371,1.36,1.36,0,0,0-1.1-.644,1.36,1.36,0,0,0-1.106.644,2.448,2.448,0,0,0-.394,1.371,2.448,2.448,0,0,0,.394,1.37A1.36,1.36,0,0,0,4.617,6.407Zm3.648,0A1.36,1.36,0,0,0,9.37,5.762a2.448,2.448,0,0,0,.394-1.37A2.448,2.448,0,0,0,9.37,3.022a1.36,1.36,0,0,0-1.106-.644,1.36,1.36,0,0,0-1.1.644,2.44,2.44,0,0,0-.395,1.371,2.44,2.44,0,0,0,.395,1.37A1.36,1.36,0,0,0,8.264,6.407ZM3.3,6.7a1.9,1.9,0,0,0-.644-.986A1.219,1.219,0,0,0,1.58,5.478a1.217,1.217,0,0,0-.789.773,1.987,1.987,0,0,0,.617,2.163,1.284,1.284,0,0,0,.781.282,1.077,1.077,0,0,0,.3-.041,1.217,1.217,0,0,0,.789-.773A1.9,1.9,0,0,0,3.3,6.7Zm5.339.985a3.045,3.045,0,0,0-2.2-1,3.038,3.038,0,0,0-2.2,1A4.618,4.618,0,0,0,3.09,10.1a1.757,1.757,0,0,0,.5,1.578,1.47,1.47,0,0,0,1.56.352,3.868,3.868,0,0,1,2.58,0,1.531,1.531,0,0,0,.514.091,1.489,1.489,0,0,0,1.045-.443,1.755,1.755,0,0,0,.5-1.578,4.625,4.625,0,0,0-1.15-2.408Z' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 22px 22px !important;
}

#js-product-list .product-miniature:hover::after {
    background-color: #8abb3a !important;
    transform: none !important;
}


/* ============================================ */
/* ======= SELECT TRI (PERTINENCE) =========== */
/* ============================================ */

.elementor-widget-listing-sort-order {
    display: flex !important;
    justify-content: flex-end !important;
}

.elementor-widget-listing-sort-order .ce-sort-order {
    width: 260px !important;
    max-width: 100% !important;
}

/* Reset la fleche CE native */
.elementor-widget-listing-sort-order .elementor-select-wrapper::before {
    display: none !important;
}

/* Fleche custom */
.ce-sort-order .elementor-select-wrapper {
    position: relative !important;
}

.ce-sort-order .elementor-select-wrapper::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    right: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 0 !important;
    height: 0 !important;
    border-left: 5px solid transparent !important;
    border-right: 5px solid transparent !important;
    border-top: 6px solid #232323 !important;
    pointer-events: none !important;
}

/* Le select */
.elementor-widget-listing-sort-order select,
.ce-sort-order select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    width: 100% !important;
    background-color: #ffffff !important;
    border: 2px solid #e0e0e0 !important;
    border-radius: 50px !important;
    padding: 12px 44px 12px 20px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #232323 !important;
    cursor: pointer !important;
    transition: border-color 0.3s ease !important;
    line-height: 1.2 !important;
    height: auto !important;
}

.elementor-widget-listing-sort-order select:hover,
.elementor-widget-listing-sort-order select:focus,
.ce-sort-order select:hover,
.ce-sort-order select:focus {
    border-color: #A0CE4D !important;
    outline: none !important;
}


/* ============================================ */
/* ======= BOUTON FILTRER ==================== */
/* ============================================ */

.btn-filtrer {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    background-color: #232323 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 12px 28px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: background-color 0.3s ease !important;
    line-height: 1 !important;
    text-decoration: none !important;
}

.btn-filtrer:hover {
    background-color: #444444 !important;
    color: #ffffff !important;
}

.btn-filtrer svg {
    width: 18px !important;
    height: 18px !important;
    fill: #ffffff !important;
    flex-shrink: 0 !important;
}


/* ============================================ */
/* ======= MODAL FILTRE (DRAWER GAUCHE) ====== */
/* ============================================ */

.filter-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9998;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.filter-modal-overlay.active {
    opacity: 1;
    visibility: visible;
}

.filter-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 380px;
    max-width: 90vw;
    height: 100%;
    background: #ffffff;
    z-index: 9999;
    transform: translateX(-100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    flex-direction: column;
    box-shadow: 5px 0 30px rgba(0, 0, 0, 0.15);
}

.filter-modal.active {
    transform: translateX(0);
}

body.filter-modal-open {
    overflow: hidden !important;
}

/* Header */
.filter-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 2px solid #f0f0f0;
    flex-shrink: 0;
}

.filter-modal__title {
    font-size: 20px;
    font-weight: 700;
    color: #232323;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.filter-modal__title svg {
    width: 22px;
    height: 22px;
    fill: #A0CE4D;
}

.filter-modal__close {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #f5f5f5;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.3s ease;
    font-size: 20px;
    color: #232323;
    line-height: 1;
}

.filter-modal__close:hover {
    background: #e0e0e0;
}

/* Body */
.filter-modal__body {
    flex: 1;
    overflow-y: auto;
    padding: 0;
    -webkit-overflow-scrolling: touch;
}

.filter-modal__body::-webkit-scrollbar {
    width: 4px;
}

.filter-modal__body::-webkit-scrollbar-track {
    background: #f5f5f5;
    border-radius: 4px;
}

.filter-modal__body::-webkit-scrollbar-thumb {
    background: #A0CE4D;
    border-radius: 4px;
}

/* Footer */
.filter-modal__footer {
    padding: 16px 24px;
    border-top: 2px solid #f0f0f0;
    flex-shrink: 0;
}

.filter-modal__apply {
    display: block;
    width: 100%;
    background: #A0CE4D;
    color: #ffffff;
    border: none;
    border-radius: 50px;
    padding: 14px;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.3s ease;
    text-align: center;
}

.filter-modal__apply:hover {
    background: #8abb3a;
}


/* ============================================ */
/* === STYLES FILTRES CE DANS LA MODAL ======== */
/* ============================================ */

/* Reset : rendre visible quand dans la modal */
.filter-modal__body .ce-filters {
    display: block !important;
    position: static !important;
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Masquer le bouton X natif CE */
.filter-modal__body .dialog-close-button {
    display: none !important;
}

/* Masquer le titre vide */
.filter-modal__body .elementor-heading-title:empty {
    display: none !important;
}

/* Chaque groupe de filtre */
.filter-modal__body .elementor-field-group {
    border-bottom: 1px solid #f0f0f0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

.filter-modal__body .elementor-field-group:last-child {
    border-bottom: none !important;
}

/* Titre du filtre (accordeon) */
.filter-modal__body .ce-filters__tab {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 16px 24px !important;
    margin: 0 !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
    background: transparent !important;
}

.filter-modal__body .ce-filters__tab:hover {
    background: #fafafa !important;
}

.filter-modal__body .ce-filters__title {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #232323 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
}

/* Compteur de filtres actifs */
.filter-modal__body .ce-filters__title[data-count]:not([data-count="0"])::after {
    content: attr(data-count) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    background: #A0CE4D !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    margin-left: 8px !important;
}

/* Fleche accordeon */
.filter-modal__body .ce-filters__tab-icon {
    color: #aaaaaa !important;
    font-size: 14px !important;
    transition: transform 0.3s ease !important;
}

.filter-modal__body .ce-filters__tab[aria-expanded="true"] .ce-filters__tab-icon,
.filter-modal__body .ce-filters__title[aria-expanded="true"]~.ce-filters__tab-icon {
    transform: rotate(90deg) !important;
}

/* Sous-groupe (options) */
.filter-modal__body .elementor-field-subgroup {
    padding: 0 24px 16px 24px !important;
    display: block !important;
}

/* Chaque option de filtre */
.filter-modal__body .elementor-field-option {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 8px 0 !important;
    text-decoration: none !important;
    color: #555555 !important;
    font-size: 14px !important;
    transition: color 0.2s ease !important;
}

.filter-modal__body .elementor-field-option:hover {
    color: #232323 !important;
}

/* Checkbox custom CE */
.filter-modal__body .elementor-field-option input[type="checkbox"] {
    display: none !important;
}

.filter-modal__body .ce-checkbox {
    width: 22px !important;
    height: 22px !important;
    border: 2px solid #d0d0d0 !important;
    border-radius: 6px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0 !important;
    transition: border-color 0.2s ease, background 0.2s ease !important;
    flex-shrink: 0 !important;
    background: #ffffff !important;
    color: transparent !important;
}

.filter-modal__body .ce-checkbox::before {
    font-size: 13px !important;
    color: transparent !important;
    transition: color 0.2s ease !important;
}

/* Checkbox cochee */
.filter-modal__body .elementor-field-option input[type="checkbox"]:checked~.ce-checkbox,
.filter-modal__body .ce-checkbox[aria-checked="true"] {
    background: #A0CE4D !important;
    border-color: #A0CE4D !important;
    color: #ffffff !important;
}

.filter-modal__body .ce-checkbox[aria-checked="true"]::before {
    color: #ffffff !important;
    font-size: 13px !important;
}

/* Couleurs (swatches) */
.filter-modal__body .elementor-field-type-color .ce-checkbox {
    border-radius: 50% !important;
    width: 28px !important;
    height: 28px !important;
    border-width: 3px !important;
}

.filter-modal__body .elementor-field-type-color .ce-checkbox[aria-checked="true"] {
    border-color: #A0CE4D !important;
    box-shadow: 0 0 0 2px rgba(160, 206, 77, 0.3) !important;
}

.filter-modal__body .elementor-field-type-color .ce-checkbox.ce-color--light {
    border-color: #d0d0d0 !important;
}

/* Label */
.filter-modal__body .elementor-field-label {
    flex: 1 !important;
    font-size: 14px !important;
    color: inherit !important;
}

/* Magnitude (nombre de resultats) */
.filter-modal__body .elementor-field-label[data-magnitude]::after {
    content: " (" attr(data-magnitude) ")" !important;
    color: #aaaaaa !important;
    font-size: 12px !important;
    font-weight: 400 !important;
}

/* Slider de prix CE */
.filter-modal__body .ce-dual-range {
    position: relative !important;
    height: 6px !important;
    background: #e8e8e8 !important;
    border-radius: 3px !important;
    margin: 20px 0 12px !important;
}

.filter-modal__body .ce-dual-range__selected {
    position: absolute !important;
    height: 100% !important;
    background: #A0CE4D !important;
    border-radius: 3px !important;
}

.filter-modal__body .ce-dual-range input[type="range"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    position: absolute !important;
    width: 100% !important;
    height: 6px !important;
    background: transparent !important;
    pointer-events: none !important;
    top: 0 !important;
    margin: 0 !important;
}

.filter-modal__body .ce-dual-range input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    width: 22px !important;
    height: 22px !important;
    background: #ffffff !important;
    border: 3px solid #A0CE4D !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
    margin-top: -8px !important;
}

.filter-modal__body .ce-dual-range input[type="range"]::-moz-range-thumb {
    width: 22px !important;
    height: 22px !important;
    background: #ffffff !important;
    border: 3px solid #A0CE4D !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
}

/* Bouton Effacer tout */
.filter-modal__body .ce-filters__clear {
    padding: 16px 24px !important;
    border-top: 1px solid #f0f0f0 !important;
    margin-top: 8px !important;
}

.filter-modal__body .ce-filters__clear .js-search-link {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: transparent !important;
    border: 2px solid #e0e0e0 !important;
    border-radius: 50px !important;
    padding: 10px 22px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #888888 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
}

.filter-modal__body .ce-filters__clear .js-search-link:hover {
    border-color: #e74c3c !important;
    color: #e74c3c !important;
    background: #fef5f5 !important;
}

.filter-modal__body .ce-filters__clear .elementor-button-icon {
    font-size: 12px !important;
    line-height: 1 !important;
}

.filter-modal__body .ce-filters__clear .elementor-button-icon i {
    font-size: 12px !important;
}

.filter-modal__body .ce-filters__clear .elementor-button-text {
    line-height: 1 !important;
}

/* Labels prix sous le slider */
.filter-modal__body .elementor-field-type-slider .elementor-field-label {
    display: flex !important;
    justify-content: space-between !important;
    font-size: 13px !important;
    color: #666666 !important;
    font-weight: 600 !important;
    margin-top: 4px !important;
}


/* ============================================ */
/* ======= PAGINATION ======================== */
/* ============================================ */

#js-product-list .pagination {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    margin-top: 40px !important;
    padding: 20px 0 !important;
}

#js-product-list .pagination .page-list {
    display: flex !important;
    gap: 4px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

#js-product-list .pagination a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #232323 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

#js-product-list .pagination a:hover {
    background: #f0f0f0 !important;
}

#js-product-list .pagination li.active>a,
#js-product-list .pagination .current a {
    background: #A0CE4D !important;
    color: #ffffff !important;
}

#js-product-list .total-products {
    text-align: center !important;
    font-size: 13px !important;
    color: #999999 !important;
    margin-bottom: 10px !important;
}


/* ============================================ */
/* ======= RESPONSIVE ======================== */
/* ============================================ */

@media (max-width: 768px) {
    .btn-filtrer {
        padding: 10px 20px !important;
        font-size: 13px !important;
    }

    .elementor-widget-listing-sort-order .ce-sort-order {
        width: 100% !important;
    }

    .ce-sort-order select {
        padding: 10px 36px 10px 16px !important;
        font-size: 13px !important;
    }

    .filter-modal {
        width: 100%;
        max-width: 100%;
    }

    #js-product-list .product-miniature::after {
        width: 36px !important;
        height: 36px !important;
        background-size: 20px 20px !important;
        bottom: 14px !important;
        right: 14px !important;
    }

    #js-product-list .product-miniature .product-title a {
        font-size: 13px !important;
    }

    #js-product-list .product-miniature .price {
        font-size: 14px !important;
    }
}

.breadcrumbcate .ce-breadcrumb__item:first-child {
    position: relative !important;
    padding-left: 0px !important;
}

.breadcrumbcate .ce-breadcrumb__item:first-child::before {
    content: "" !important;
    position: absolute !important;
    top: -10px !important;
    left: -15px !important;
    transform: translateY(-50%) !important;
    width: 32px !important;
    height: 32px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='148.631' height='148.631' viewBox='0 0 148.631 148.631'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Crect width='105.098' height='105.098' fill='%23fff' stroke='%23707070' stroke-width='1'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg transform='translate(0 74.315) rotate(-45)' clip-path='url(%23a)'%3E%3Cpath d='M104.367,46.107a17.268,17.268,0,0,1-5.878,9,11.723,11.723,0,0,1-7.128,2.573,9.909,9.909,0,0,1-2.714-.375,11.115,11.115,0,0,1-7.189-7.054A18.111,18.111,0,0,1,87.081,30.5a10.563,10.563,0,0,1,17.041,4.855,17.367,17.367,0,0,1,.246,10.748ZM35.9,36.786c3.851,0,7.527-2.143,10.087-5.883a22.273,22.273,0,0,0,3.6-12.508,22.277,22.277,0,0,0-3.6-12.512C43.424,2.144,39.748,0,35.9,0S28.36,2.144,25.8,5.882a22.352,22.352,0,0,0-3.594,12.512A22.348,22.348,0,0,0,25.8,30.9C28.36,34.643,32.037,36.786,35.9,36.786Zm33.3,0c3.861,0,7.537-2.143,10.1-5.883a22.348,22.348,0,0,0,3.594-12.508A22.352,22.352,0,0,0,79.3,5.883C76.737,2.144,73.061,0,69.2,0S61.673,2.144,59.113,5.883a22.277,22.277,0,0,0-3.6,12.512,22.273,22.273,0,0,0,3.6,12.508C61.673,34.643,65.35,36.786,69.2,36.786ZM23.9,39.5a17.387,17.387,0,0,0-5.878-9,11.126,11.126,0,0,0-9.841-2.2,11.108,11.108,0,0,0-7.2,7.054A17.365,17.365,0,0,0,.731,46.107a17.268,17.268,0,0,0,5.878,9,11.723,11.723,0,0,0,7.128,2.573,9.836,9.836,0,0,0,2.7-.375,11.107,11.107,0,0,0,7.2-7.054A17.352,17.352,0,0,0,23.9,39.5ZM72.641,48.5C67.029,42.6,59.9,39.35,52.549,39.35S38.058,42.6,32.467,48.5A42.161,42.161,0,0,0,21.96,70.478a16.041,16.041,0,0,0,4.567,14.4,13.419,13.419,0,0,0,14.245,3.211,35.317,35.317,0,0,1,23.554,0,13.978,13.978,0,0,0,4.69.833,13.6,13.6,0,0,0,9.544-4.043,16.019,16.019,0,0,0,4.578-14.4A42.225,42.225,0,0,0,72.641,48.5Z' transform='translate(0 8.086)' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    pointer-events: none !important;
}


/* ============================================ */
/* ======= MODAL CONNEXION WISHLIST ========== */
/* ============================================ */

.modal-dialog.modal-dialog-centered .modal-content {
    border-radius: 16px !important;
    border: none !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15) !important;
    overflow: hidden !important;
}

.modal-dialog.modal-dialog-centered .modal-header {
    border-bottom: 1px solid #f0f0f0 !important;
    padding: 20px 24px !important;
}

.modal-dialog.modal-dialog-centered .modal-title {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #232323 !important;
}

.modal-dialog.modal-dialog-centered .modal-header .close {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    background: #f5f5f5 !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 20px !important;
    color: #232323 !important;
    opacity: 1 !important;
    transition: background 0.3s ease !important;
    padding: 0 !important;
    margin: 0 !important;
}

.modal-dialog.modal-dialog-centered .modal-header .close:hover {
    background: #e0e0e0 !important;
}

.modal-dialog.modal-dialog-centered .modal-body {
    padding: 24px !important;
}

.modal-dialog.modal-dialog-centered .modal-text {
    font-size: 14px !important;
    color: #666666 !important;
    line-height: 1.6 !important;
    margin: 0 !important;
}

.modal-dialog.modal-dialog-centered .modal-footer {
    border-top: 1px solid #f0f0f0 !important;
    padding: 16px 24px !important;
    gap: 12px !important;
}

.modal-dialog.modal-dialog-centered .modal-cancel.btn-secondary {
    background: transparent !important;
    border: 2px solid #e0e0e0 !important;
    border-radius: 50px !important;
    padding: 10px 24px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #888888 !important;
    transition: all 0.3s ease !important;
}

.modal-dialog.modal-dialog-centered .modal-cancel.btn-secondary:hover {
    border-color: #232323 !important;
    color: #232323 !important;
}

.modal-dialog.modal-dialog-centered .btn-primary {
    background: #A0CE4D !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 10px 28px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    transition: background 0.3s ease !important;
}

.modal-dialog.modal-dialog-centered .btn-primary:hover {
    background: #8abb3a !important;
}


.blockwhiteecri {
    color: white !important;
}


#js-product-list .product-miniature .thumbnail-top .product-thumbnail img {
    height: 26rem !important;
    width: 100% !important;
    object-fit: cover !important;
    background: #fff !important;
}

@media (max-width: 1200px) {
    #js-product-list .product-miniature .thumbnail-top .product-thumbnail img {
        height: 22rem !important;
    }
}

@media (max-width: 992px) {
    #js-product-list .product-miniature .thumbnail-top .product-thumbnail img {
        height: 18rem !important;
    }
}

@media (max-width: 768px) {
    #js-product-list .product-miniature .thumbnail-top .product-thumbnail img {
        height: 15rem !important;
    }
}

@media (max-width: 480px) {
    #js-product-list .product-miniature .thumbnail-top .product-thumbnail img {
        height: 12rem !important;
    }
}