/* ==========================================================
   ALLO NATUREL — CATÉGORIES
   ========================================================== */


body#category {
  --an-cat-green: #07574f;
  --an-cat-green-dark: #04483f;
  --an-cat-orange: #ff9b43;

  --an-cat-soft: #f7f4ee;
  --an-cat-line: #ded8ce;

  --an-cat-muted: #78918d;

  --an-cat-width: 1580px;
}



/* ==========================================================
   CONTAINER GÉNÉRAL
   ========================================================== */

body#category #wrapper > .container {
  width: min(
    var(--an-cat-width),
    calc(100% - 70px)
  );

  max-width: none;

  margin-left: auto;
  margin-right: auto;
}



/* ==========================================================
   COLONNES DESKTOP
   ========================================================== */

@media (min-width: 992px) {

  body#category #left-column {
    flex: 0 0 230px;

    width: 230px;
    max-width: 230px;

    padding-right: 30px;
  }


  body#category #content-wrapper {
    flex: 1 1 0;

    width: calc(100% - 230px);
    max-width: none;
  }

}



/* ==========================================================
   BREADCRUMB
   ========================================================== */

body#category .breadcrumb {
  margin-bottom: 12px;

  padding: 0;

  background: transparent;

  font-size: 15px;

  color: #829995;
}


body#category .breadcrumb a {
  color: #829995;

  text-decoration: none;
}


body#category .breadcrumb a:hover {
  color: var(--an-cat-green);
}



/* ==========================================================
   PAGE
   ========================================================== */

body#category .an-category-page {
  width: 100%;

  color: var(--an-cat-green);
}



/* ==========================================================
   HEADER CATÉGORIE
   ========================================================== */

body#category .an-category-header {
  margin-bottom: 6px;
}


body#category .an-category-header__top {
  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    auto;

  gap: 50px;

  align-items: end;
}



/* ==========================================================
   H1
   ========================================================== */

body#category .an-category-title {
  max-width: 850px;

  margin:
    0
    0
    12px;

  font-family:
    "Bagrile",
    "Instrument Serif",
    Georgia,
    serif;

  font-size:
    clamp(
      52px,
      4.4vw,
      78px
    );

  font-weight: 400;

  line-height: .9;

  letter-spacing: -.025em;

  color: var(--an-cat-green);
}



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

body#category .an-category-description {
  max-width: 800px;

  margin: 0;

  font-size: 15px;

  line-height: 1.6;

  color: var(--an-cat-green);
}


body#category .an-category-description p {
  margin: 0;
}



/* ==========================================================
   QUIZ
   ========================================================== */

body#category .an-category-header__aside {
  min-width: 190px;

  padding-bottom: 5px;

  display: flex;

  flex-direction: column;

  align-items: flex-end;

  gap: 10px;
}


body#category .an-category-quiz {
  min-height: 40px;

  padding:
    0
    18px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 9px;

  border: 0;

  border-radius: 999px;

  background:
    var(--an-cat-green);

  color: #fff;

  font-family:
    "Geist",
    Arial,
    sans-serif;

  font-size: 11px;

  font-weight: 650;

  cursor: pointer;

  transition:
    background .15s ease,
    transform .15s ease;
}


body#category .an-category-quiz:hover {
  background:
    var(--an-cat-green-dark);
}


body#category .an-category-quiz:active {
  transform:
    scale(.98);
}


body#category .an-category-header__aside small {
  font-size: 9px;

  color: #8ca09d;
}



/* ==========================================================
   FILTRES RAPIDES
   ========================================================== */

body#category .an-category-shortcuts {
  margin-top: 42px;

  display: flex;

  flex-wrap: wrap;

  gap: 8px;
}


body#category .an-category-shortcut {
  min-height: 34px;

  padding:
    0
    14px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  border:
    1px
    solid
    #e3ddd3;

  border-radius: 999px;

  background:
    #f7f4ee;

  font-family:
    "Geist",
    Arial,
    sans-serif;

  font-size: 10px;

  font-weight: 500;

  line-height: 1;

  color:
    var(--an-cat-green);

  text-decoration: none;

  cursor: pointer;

  transition:
    background .15s ease,
    border-color .15s ease,
    color .15s ease;
}


body#category .an-category-shortcut:hover {
  border-color:
    #bfd0cc;

  background:
    #f0f6f5;

  color:
    var(--an-cat-green);
}


body#category .an-category-shortcut.is-active {
  border-color:
    var(--an-cat-green);

  background:
    var(--an-cat-green);

  color: #fff;
}



/* ==========================================================
   COVER CATÉGORIE
   ========================================================== */

body#category .an-category-cover {
  display: none;
}



/* ==========================================================
   SOUS-CATÉGORIES
   ========================================================== */

body#category .an-category-subcategories {
  margin-top: 30px;
}



/* ==========================================================
   TOOLBAR
   ========================================================== */

body#category .an-products-top {
  margin-top: 12px;
}


body#category .an-products-toolbar {
  min-height: 60px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 25px;

  border-bottom:
    1px
    solid
    var(--an-cat-line);
}



/* ==========================================================
   NOMBRE DE PRODUITS
   ========================================================== */

body#category .an-products-count {
  font-size: 10px;

  color: #8ba09c;
}



/* ==========================================================
   TRI
   ========================================================== */

body#category .an-products-toolbar__right {
  margin-left: auto;

  display: flex;

  align-items: center;

  gap: 12px;
}


body#category .an-products-sort {
  display: flex;

  align-items: center;

  gap: 15px;
}


body#category .an-products-sort__label {
  font-size: 10px;

  color: #90a19e;
}



/* Neutralise le look Bootstrap */

body#category .products-sort-order {
  margin: 0;
}


body#category
.products-sort-order
.select-title {
  min-width: 130px;

  padding:
    8px
    28px
    8px
    8px;

  border: 0 !important;

  background: transparent !important;

  box-shadow: none !important;

  font-size: 10px;

  color:
    var(--an-cat-green);
}


body#category
.products-sort-order
.dropdown-menu {
  border:
    1px
    solid
    var(--an-cat-line);

  border-radius: 9px;

  box-shadow:
    0
    12px
    35px
    rgba(
      7,
      87,
      79,
      .08
    );
}



/* ==========================================================
   BOUTON FILTRE MOBILE
   ========================================================== */

body#category .an-products-filter-button {
  min-height: 38px;

  padding:
    0
    15px;

  display: none;

  align-items: center;

  gap: 6px;

  border:
    1px
    solid
    var(--an-cat-line);

  border-radius: 999px;

  background: #fff;

  color:
    var(--an-cat-green);
}



/* ==========================================================
   FILTRES ACTIFS
   ========================================================== */

body#category .an-category-active-filters {
  margin:
    15px
    0
    4px;
}


body#category
.an-category-active-filters:empty {
  display: none;
}


body#category
.active_filters {
  padding: 0;

  border: 0;

  background: transparent;
}


body#category
.active_filters
.filter-block {
  margin:
    0
    6px
    6px
    0;

  padding:
    7px
    10px;

  border-radius: 999px;

  background:
    #f0f6f5;

  font-size: 9px;

  color:
    var(--an-cat-green);
}



/* ==========================================================
   SIDEBAR FACETTES
   ========================================================== */

@media (min-width: 992px) {

  body#category #left-column {
    position: relative;
  }


  body#category
  #left-column
  .block-facets,

  body#category
  #left-column
  #search_filters {
    position: sticky;

    top: 105px;
  }


  body#category
  #left-column
  #search_filters {
    max-height:
      calc(100vh - 130px);

    padding-right: 12px;

    overflow-y: auto;

    scrollbar-width: thin;

    scrollbar-color:
      #999
      transparent;
  }

}



/* ==========================================================
   TITRES FACETTES
   ========================================================== */

body#category
#left-column
.block-facets
.h6,

body#category
#left-column
.block-facets
.title,

body#category
#left-column
#search_filters
.facet-title {
  margin:
    0
    0
    12px;

  font-size: 11px;

  font-weight: 600;

  color:
    var(--an-cat-green);
}



/* ==========================================================
   GROUPE FACETTES
   ========================================================== */

body#category
#left-column
#search_filters
.facet {
  margin: 0;

  padding:
    16px
    0;

  border-bottom:
    1px
    solid
    var(--an-cat-line);
}


body#category
#left-column
#search_filters
.facet:first-child {
  padding-top: 0;
}



/* ==========================================================
   LABEL FACETTES
   ========================================================== */

body#category
#left-column
#search_filters
.facet
li {
  margin-bottom: 9px;
}


body#category
#left-column
#search_filters
.facet-label {
  width: 100%;

  margin: 0;

  display: flex;

  align-items: flex-start;
}


body#category
#left-column
#search_filters
.facet-label
a {
  flex: 1;

  display: flex;

  justify-content: space-between;

  gap: 8px;

  padding-left: 8px;

  font-size: 10px;

  line-height: 1.4;

  color:
    #527c76;

  text-decoration: none;
}


body#category
#left-column
#search_filters
.facet-label
a:hover {
  color:
    var(--an-cat-green);
}



/* ==========================================================
   CHECKBOXES
   ========================================================== */

body#category
#left-column
#search_filters
.custom-checkbox
input,

body#category
#left-column
#search_filters
input[type="checkbox"] {
  accent-color:
    var(--an-cat-green);
}



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

body#category
#js-product-list
.products {
  display: grid !important;

  grid-template-columns:
    repeat(
      3,
      minmax(0, 1fr)
    );

  gap:
    42px
    22px;

  margin:
    24px
    0
    0 !important;
}


body#category
#js-product-list
.products
> * {
  width: auto !important;

  max-width: none !important;

  margin: 0 !important;

  padding: 0 !important;
}



/* ==========================================================
   CARTE
   ========================================================== */

body#category .an-category-card {
  position: relative;

  width: 100% !important;

  max-width: none !important;

  margin: 0 !important;

  padding: 0 !important;
}


body#category .an-category-card__inner {
  height: 100%;

  display: flex;

  flex-direction: column;
}



/* ==========================================================
   MEDIA
   ========================================================== */

body#category .an-category-card__media {
  position: relative;

  height: 340px;

  overflow: hidden;

  background: #fff;
}



/* ==========================================================
   IMAGE
   ========================================================== */

body#category .an-category-card__image {
  width: 100%;

  height: 100%;

  display: flex;

  align-items: center;

  justify-content: center;
}


body#category .an-category-card__image a,
body#category .an-category-card__image picture {
  width: 100%;

  height: 100%;

  display: flex;

  align-items: center;

  justify-content: center;
}


body#category .an-category-card__image img {
  width: 100% !important;

  height: 100% !important;

  max-width: 88% !important;

  max-height: 300px !important;

  margin: auto;

  object-fit: contain !important;

  transition:
    transform .25s ease;
}


body#category
.an-category-card:hover
.an-category-card__image
img {
  transform:
    scale(1.025);
}



/* ==========================================================
   FLAGS
   ========================================================== */

body#category .an-category-card__flags {
  position: absolute;

  z-index: 5;

  top: 10px;

  left: 10px;
}


body#category
.an-category-card__flags
.product-flags {
  position: static !important;

  display: flex !important;

  flex-wrap: wrap;

  gap: 5px;

  margin: 0 !important;

  padding: 0 !important;
}


body#category
.an-category-card__flags
.product-flag {
  min-height: 25px;

  margin: 0 !important;

  padding:
    6px
    9px;

  border: 0;

  border-radius: 999px;

  background:
    var(--an-cat-green);

  font-size: 9px;

  color: #fff;
}


body#category
.an-category-card__flags
.product-flag.new,

body#category
.an-category-card__flags
.product-flag.used,

body#category
.an-category-card__flags
.product-flag.refurbished {
  display: none !important;
}



/* ==========================================================
   FAVORIS
   ========================================================== */

body#category .an-category-card__favorite {
  position: absolute;

  z-index: 7;

  top: 10px;

  right: 10px;
}


body#category
.an-category-card__favorite
button,

body#category
.an-category-card__favorite
a {
  width: 38px;

  height: 38px;

  display: flex;

  align-items: center;

  justify-content: center;

  border:
    1px
    solid
    var(--an-cat-line);

  border-radius: 50%;

  background: #fff;

  color:
    var(--an-cat-green);

  box-shadow: none;
}



/* ==========================================================
   AJOUT PANIER HOVER
   ========================================================== */

body#category .an-category-card__cart,
body#category .an-category-card__details {
  position: absolute;

  z-index: 8;

  right: 12px;

  bottom: 12px;

  left: 12px;

  margin: 0;

  opacity: 0;

  visibility: hidden;

  transform:
    translateY(8px);

  transition:
    opacity .18s ease,
    visibility .18s ease,
    transform .18s ease;
}


body#category
.an-category-card:hover
.an-category-card__cart,

body#category
.an-category-card:focus-within
.an-category-card__cart,

body#category
.an-category-card:hover
.an-category-card__details,

body#category
.an-category-card:focus-within
.an-category-card__details {
  opacity: 1;

  visibility: visible;

  transform:
    translateY(0);
}


body#category .an-category-card__add,
body#category .an-category-card__details {
  width: 100%;

  min-height: 43px;

  padding:
    0
    17px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  border: 0;

  border-radius: 999px;

  background:
    var(--an-cat-green);

  color: #fff;

  font-size: 10px;

  font-weight: 650;

  text-decoration: none;

  cursor: pointer;
}


body#category .an-category-card__add:hover,
body#category .an-category-card__details:hover {
  background:
    var(--an-cat-green-dark);

  color: #fff;
}



/* ==========================================================
   CONTENU CARTE
   ========================================================== */

body#category .an-category-card__content {
  padding-top: 13px;

  display: flex;

  flex: 1;

  flex-direction: column;
}



/* ==========================================================
   META
   ========================================================== */

body#category .an-category-card__meta {
  min-height: 20px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 10px;
}


body#category .an-category-card__category {
  overflow: hidden;

  font-size: 8px;

  font-weight: 500;

  letter-spacing: .11em;

  text-transform: uppercase;

  white-space: nowrap;

  text-overflow: ellipsis;

  color:
    #7f9692;
}



/* ==========================================================
   AVIS
   ========================================================== */

body#category .an-category-card__reviews {
  flex-shrink: 0;

  font-size: 8px;

  color:
    var(--an-cat-green);
}


body#category
.an-category-card__reviews
.product-list-reviews {
  margin: 0 !important;
}



/* ==========================================================
   TITRE
   ========================================================== */

body#category .an-category-card__title {
  margin:
    5px
    0
    2px;

  font-family:
    "Bagrile",
    "Instrument Serif",
    Georgia,
    serif;

  font-size:
    clamp(
      22px,
      1.55vw,
      29px
    );

  font-weight: 400;

  line-height: .92;

  letter-spacing: -.015em;
}


body#category .an-category-card__title a {
  color:
    var(--an-cat-green) !important;

  text-decoration: none !important;
}


body#category
.an-category-card__title
a:hover {
  color:
    var(--an-cat-green-dark) !important;
}



/* ==========================================================
   MARQUE
   ========================================================== */

body#category .an-category-card__brand {
  min-height: 17px;

  margin-top: 4px;

  font-size: 9px;

  color:
    #8ca09d;
}



/* ==========================================================
   BAS CARTE
   ========================================================== */

body#category .an-category-card__footer {
  margin-top: auto;

  padding-top: 9px;

  display: flex;

  align-items: flex-end;

  justify-content: space-between;
}



/* ==========================================================
   PRIX
   ========================================================== */

body#category .an-category-card__prices {
  display: flex;

  align-items: baseline;

  gap: 7px;
}


body#category .an-category-card__price {
  font-family:
    "Bagrile",
    "Instrument Serif",
    Georgia,
    serif;

  font-size: 21px;

  line-height: 1;

  color:
    var(--an-cat-green);
}


body#category .an-category-card__regular-price {
  font-size: 9px;

  text-decoration: line-through;

  color:
    #92a5a2;
}



/* ==========================================================
   MASQUER LES ANCIENS STYLES MINIATURES
   ========================================================== */

body#category
.an-category-card
.product-miniature {
  border: 0 !important;

  box-shadow: none !important;
}



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

body#category .pagination {
  margin-top: 50px;

  justify-content: center;
}


body#category
.pagination
.page-link {
  color:
    var(--an-cat-green);
}


body#category
.pagination
.page-item.active
.page-link {
  border-color:
    var(--an-cat-green);

  background:
    var(--an-cat-green);

  color: #fff;
}



/* ==========================================================
   FOOTER CATÉGORIE
   ========================================================== */

body#category .category__footer {
  width: 100%;

  margin-top: 75px;
}



/* ==========================================================
   RESPONSIVE — TABLETTE
   ========================================================== */

@media (max-width: 1199px) {

  body#category #wrapper > .container {
    width:
      calc(100% - 50px);
  }


  body#category
  #js-product-list
  .products {
    gap:
      35px
      18px;
  }


  body#category
  .an-category-card__media {
    height: 300px;
  }

}



/* ==========================================================
   RESPONSIVE — <= 991
   ========================================================== */

@media (max-width: 991px) {

  body#category #left-column {
    display: none;
  }


  body#category #content-wrapper {
    width: 100%;

    max-width: none;
  }


  body#category
  .an-products-filter-button {
    display:
      inline-flex;
  }


  body#category
  .an-category-header__top {
    grid-template-columns:
      1fr;
  }


  body#category
  .an-category-header__aside {
    align-items: flex-start;

    padding: 0;
  }


  body#category
  .an-category-shortcuts {
    margin-top: 28px;
  }


  body#category
  #js-product-list
  .products {
    grid-template-columns:
      repeat(
        2,
        minmax(0, 1fr)
      );
  }

}



/* ==========================================================
   RESPONSIVE — MOBILE
   ========================================================== */

@media (max-width: 767px) {

  body#category #wrapper > .container {
    width:
      calc(100% - 36px);
  }


  body#category
  .an-category-title {
    font-size: 48px;
  }


  body#category
  .an-category-description {
    font-size: 13px;
  }


  body#category
  .an-category-shortcuts {
    flex-wrap: nowrap;

    margin-right: -18px;

    padding-right: 18px;

    overflow-x: auto;

    scrollbar-width: none;
  }


  body#category
  .an-category-shortcuts::-webkit-scrollbar {
    display: none;
  }


  body#category
  .an-category-shortcut {
    flex:
      0
      0
      auto;
  }


  body#category
  .an-products-count {
    display: none;
  }


  body#category
  .an-products-toolbar {
    justify-content:
      flex-end;
  }


  body#category
  .an-products-toolbar__right {
    width: 100%;

    justify-content:
      space-between;
  }


  body#category
  .an-products-sort__label {
    display: none;
  }


  body#category
  .an-category-card__media {
    height: 255px;
  }


  body#category
  .an-category-card__image
  img {
    max-height:
      225px !important;
  }


  body#category
  .an-category-card__title {
    font-size: 22px;
  }

}



/* ==========================================================
   TRÈS PETIT MOBILE
   ========================================================== */

@media (max-width: 480px) {

  body#category
  #js-product-list
  .products {
    grid-template-columns:
      1fr;

    gap: 36px;
  }


  body#category
  .an-category-card__media {
    height: 340px;
  }


  body#category
  .an-category-card__image
  img {
    max-height:
      300px !important;
  }

}



/* ==========================================================
   ACCESSIBILITÉ
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

  body#category
  .an-category-card__image
  img,

  body#category
  .an-category-card__cart,

  body#category
  .an-category-card__details,

  body#category
  .an-category-shortcut,

  body#category
  .an-category-quiz {
    transition: none;
  }

}

/* ==========================================================
   FILTRE PRIX — PRESTASHOP 9 / NOUISLIDER
   Structure réelle :
   .search-filters__slider.js-faceted-slider-container.noUi-target
   ========================================================== */

/* Nettoyage du bloc facettes */
body#category #search_filters,
body#category #left-column .block-facets {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

/* Le JS masque les autres facettes et le header accordéon Prix.
   On neutralise simplement l'enveloppe du bloc prix. */
body#category .accordion-item:has(.search-filters__slider) {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

body#category .accordion-item:has(.search-filters__slider) .accordion-header {
  display: none !important;
}

body#category .accordion-item:has(.search-filters__slider) .accordion-collapse,
body#category .accordion-item:has(.search-filters__slider) .accordion-collapse.collapse,
body#category .accordion-item:has(.search-filters__slider) .accordion-collapse.show {
  display: block !important;
  height: auto !important;
  max-height: none !important;
  visibility: visible !important;
  opacity: 1 !important;
  border: 0 !important;
}

body#category .accordion-item:has(.search-filters__slider) .accordion-body {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}


/* ==========================================================
   LIBELLÉ PERSONNALISÉ
   Exemple : Prix · jusqu'à 29 €
   ========================================================== */

body#category .an-price-summary {
  margin: 0 0 18px !important;
  display: flex;
  align-items: center;
  gap: 4px;
  font-family: "Geist", Arial, sans-serif;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--an-cat-green, #07574f);
}

body#category .an-price-summary__title {
  font-weight: 600;
}

body#category .an-price-summary__separator {
  opacity: .55;
}

body#category .an-price-summary__value {
  font-weight: 500;
}


/* ==========================================================
   SLIDER — L'ÉLÉMENT .noUi-target EST LE SLIDER LUI-MÊME
   ========================================================== */

body#category .search-filters__slider.an-price-slider.noUi-target,
body#category .search-filters__slider.js-faceted-slider-container.noUi-target {
  position: relative !important;
  width: calc(100% - 12px) !important;
  height: 3px !important;
  min-height: 3px !important;
  margin: 0 6px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #d7dfdc !important;
  box-shadow: none !important;
}

/* Base noUi */
body#category .search-filters__slider .noUi-base {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 999px !important;
}

/* Rail contenant la sélection */
body#category .search-filters__slider .noUi-connects {
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background: transparent !important;
}

/* Partie active */
body#category .search-filters__slider .noUi-connect {
  height: 100% !important;
  border-radius: 999px !important;
  background: var(--an-cat-green, #07574f) !important;
}


/* ==========================================================
   POIGNÉE BASSE — MASQUÉE
   Le filtre devient visuellement "jusqu'à X €"
   ========================================================== */

body#category .search-filters__slider .noUi-handle-lower {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}


/* ==========================================================
   POIGNÉE HAUTE
   ========================================================== */

body#category .search-filters__slider .noUi-handle-upper {
  top: 50% !important;
  right: -6px !important;
  width: 12px !important;
  height: 12px !important;
  min-width: 12px !important;
  min-height: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translateY(-50%) !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: var(--an-cat-green, #07574f) !important;
  box-shadow: none !important;
  cursor: grab !important;
}

body#category .search-filters__slider .noUi-handle-upper:active {
  cursor: grabbing !important;
}

/* Supprime les deux petits traits verticaux natifs */
body#category .search-filters__slider .noUi-handle::before,
body#category .search-filters__slider .noUi-handle::after {
  display: none !important;
  content: none !important;
}

body#category .search-filters__slider .noUi-touch-area {
  width: 100% !important;
  height: 100% !important;
  border-radius: 50% !important;
}

body#category .search-filters__slider .noUi-handle-upper:hover {
  transform: translateY(-50%) scale(1.08) !important;
}

body#category .search-filters__slider .noUi-handle-upper:focus,
body#category .search-filters__slider .noUi-handle-upper:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(7, 87, 79, .12) !important;
}


/* ==========================================================
   BORNES SOUS LE SLIDER
   ========================================================== */

body#category .an-price-limits {
  width: 100%;
  margin: 11px 0 0 !important;
  padding: 0 !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-family: "Geist", Arial, sans-serif;
  font-size: 9px;
  font-weight: 400;
  line-height: 1;
  color: var(--an-cat-muted, #78918d);
}

body#category .an-price-limits__min,
body#category .an-price-limits__max {
  white-space: nowrap;
}


/* ==========================================================
   TEXTE NATIF ÉVENTUEL DE PS_FACETEDSEARCH
   Le JS le masque aussi, ce CSS sert de sécurité.
   ========================================================== */

body#category .accordion-item:has(.search-filters__slider) .facet-range,
body#category .accordion-item:has(.search-filters__slider) .search-filters__range,
body#category .accordion-item:has(.search-filters__slider) > p {
  display: none !important;
}


/* ==========================================================
   DESKTOP — BLOC PRIX COMPACT
   ========================================================== */

@media (min-width: 992px) {
  body#category .accordion-item:has(.search-filters__slider) {
    width: 100%;
    max-width: 190px;
  }
}


/* ==========================================================
   MOBILE / TABLETTE
   ========================================================== */

@media (max-width: 991px) {
  body#category .accordion-item:has(.search-filters__slider) {
    width: 100%;
    max-width: none;
  }

  body#category .search-filters__slider.an-price-slider.noUi-target,
  body#category .search-filters__slider.js-faceted-slider-container.noUi-target {
    width: calc(100% - 12px) !important;
  }
}

/* ==========================================================
   CORRECTIF MOBILE — FILTRES + GRILLE 2 PRODUITS PAR LIGNE
   ========================================================== */

@media (max-width: 767px) {

  body#category #js-product-list .products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 24px 10px !important;
  }

  body#category #js-product-list .products > * {
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
  }

  body#category .an-category-card__media {
    height: 200px !important;
  }

  body#category .an-category-card__image img {
    max-height: 180px !important;
  }

  body#category .an-category-card__title {
    font-size: 18px !important;
    line-height: 1 !important;
  }

  body#category .an-category-card__price {
    font-size: 18px !important;
  }
}

@media (max-width: 380px) {

  body#category #js-product-list .products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px 8px !important;
  }

  body#category .an-category-card__media {
    height: 175px !important;
  }

  body#category .an-category-card__image img {
    max-height: 155px !important;
  }

  body#category .an-category-card__title {
    font-size: 17px !important;
  }
}


/* ==========================================================
   FILTRES MOBILE — MISE EN PAGE FINALE
   ========================================================== */

@media (max-width: 991px) {

  /* PANNEAU */
  body#category #offcanvas-faceted {
    width: calc(100vw - 24px) !important;
    max-width: 380px !important;
    height: 100dvh !important;

    background: #fff !important;
    border: 0 !important;
    box-shadow: 8px 0 30px rgba(0, 0, 0, .10) !important;
  }


  /* HEADER */
  body#category #offcanvas-faceted .offcanvas-header {
    min-height: 58px !important;

    padding: 18px 18px 15px !important;

    background: #fff !important;

    border-bottom: 1px solid #e5e2dc !important;
  }

  body#category #offcanvas-faceted .offcanvas-title {
    margin: 0 !important;

    font-family: "Geist", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 650 !important;

    color: #07574f !important;
  }

  body#category #offcanvas-faceted .btn-close {
    width: 20px !important;
    height: 20px !important;

    padding: 0 !important;
    margin: 0 !important;

    opacity: .55 !important;
  }


  /* CORPS */
  body#category #offcanvas-faceted .offcanvas-body {
    padding: 0 18px 30px !important;

    background: #fff !important;

    overflow-y: auto !important;
    overflow-x: hidden !important;
  }


  /* FACETTES */
  body#category #offcanvas-faceted .accordion-item {
    margin: 0 !important;
    padding: 0 !important;

    background: #fff !important;

    border: 0 !important;
    border-bottom: 1px solid #ebe7e1 !important;
    border-radius: 0 !important;
  }


  /* TITRES */
  body#category #offcanvas-faceted .accordion-button {
    min-height: 46px !important;

    padding: 13px 24px 13px 0 !important;
    margin: 0 !important;

    background: #fff !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    font-family: "Geist", Arial, sans-serif !important;

    font-size: 13px !important;
    line-height: 1.2 !important;
    font-weight: 650 !important;

    color: #07574f !important;

    -webkit-text-fill-color: #07574f !important;
  }

  body#category #offcanvas-faceted .accordion-button:not(.collapsed),
  body#category #offcanvas-faceted .accordion-button:hover,
  body#category #offcanvas-faceted .accordion-button:focus {
    background: #fff !important;

    color: #07574f !important;
    -webkit-text-fill-color: #07574f !important;

    box-shadow: none !important;
  }


  /* CHEVRON */
  body#category #offcanvas-faceted .accordion-button::after {
    position: absolute !important;

    right: 3px !important;
    top: 50% !important;

    width: 7px !important;
    height: 7px !important;

    content: "" !important;

    background: none !important;

    border-right: 1.5px solid #07574f !important;
    border-bottom: 1.5px solid #07574f !important;

    transform:
      translateY(-65%)
      rotate(45deg) !important;

    transition: transform .2s ease !important;
  }

  body#category #offcanvas-faceted
  .accordion-button:not(.collapsed)::after {
    transform:
      translateY(-25%)
      rotate(225deg) !important;
  }


  /* CONTENU */
  body#category #offcanvas-faceted .accordion-body {
    padding: 0 0 14px !important;
    margin: 0 !important;

    background: #fff !important;
  }


  /* LIGNES FILTRES */
  body#category #offcanvas-faceted
  :is(
    .form-check,
    .search-filters__form-check
  ) {
    min-height: 24px !important;

    margin: 0 0 5px !important;
    padding-left: 20px !important;
  }


  /* CASES */
  body#category #offcanvas-faceted .form-check-input {
    width: 13px !important;
    height: 13px !important;

    margin-top: 2px !important;
    margin-left: -20px !important;

    border: 1px solid #c7d1cf !important;
    border-radius: 2px !important;

    background-color: #fff !important;

    box-shadow: none !important;
  }

  body#category #offcanvas-faceted .form-check-input:checked {
    border-color: #07574f !important;
    background-color: #07574f !important;
  }


  /* TEXTE OPTIONS */
  body#category #offcanvas-faceted
  :is(
    .search-link,
    .search-filters__link,
    .facet-label a,
    label
  ) {
    font-family: "Geist", Arial, sans-serif !important;

    font-size: 12px !important;
    line-height: 1.4 !important;
    font-weight: 400 !important;

    color: #284f4a !important;

    text-decoration: none !important;
  }


  /* NOMBRE DE PRODUITS */
  body#category #offcanvas-faceted
  :is(
    .magnitude,
    .search-filters__magnitude
  ) {
    color: #77918d !important;

    font-size: 10px !important;
  }


  /* PRIX */
  body#category #offcanvas-faceted .an-price-summary {
    margin: -2px 0 10px !important;

    font-size: 11px !important;
    line-height: 1.3 !important;

    color: #75908b !important;
  }


  /* SLIDER PRIX */
  body#category #offcanvas-faceted .noUi-target {
    height: 3px !important;

    margin: 3px 7px 13px !important;

    border: 0 !important;

    background: #d7dfdd !important;

    box-shadow: none !important;
  }

  body#category #offcanvas-faceted .noUi-connect {
    background: #07574f !important;
  }

  body#category #offcanvas-faceted .noUi-handle {
    width: 11px !important;
    height: 11px !important;

    top: -4px !important;
    right: -5px !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: #07574f !important;

    box-shadow: none !important;
  }

}

/* ==========================================================
   OFFCANVAS FACETTES — OVERRIDE ISOLÉ V5
   N'affecte jamais la mise en page desktop.
   ========================================================== */

html body.an-faceted-offcanvas-active
.ps-facetedsearch--mobile.offcanvas {
  --bs-offcanvas-width: min(92vw, 360px) !important;

  width: min(92vw, 360px) !important;
  max-width: 360px !important;

  height: 100dvh !important;
  max-height: 100dvh !important;

  background: #fff !important;
  border: 0 !important;

  box-shadow:
    8px 0 30px
    rgba(0, 0, 0, .12) !important;
}


html body.an-faceted-offcanvas-active
.ps-facetedsearch--mobile .offcanvas-header {
  min-height: 58px !important;

  padding:
    16px
    18px !important;

  background: #fff !important;

  border-bottom:
    1px solid #e7e4df !important;
}


html body.an-faceted-offcanvas-active
.ps-facetedsearch--mobile .offcanvas-title {
  color: #07574f !important;
  -webkit-text-fill-color: #07574f !important;

  font-family:
    "Geist",
    Arial,
    sans-serif !important;

  font-size: 14px !important;
  font-weight: 650 !important;
}


html body.an-faceted-offcanvas-active
.ps-facetedsearch--mobile .offcanvas-body {
  padding:
    0
    18px
    30px !important;

  background: #fff !important;

  overflow-x: hidden !important;
  overflow-y: auto !important;
}


html body.an-faceted-offcanvas-active
.ps-facetedsearch--mobile .accordion-item {
  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;

  border-bottom:
    1px solid #ebe7e1 !important;

  border-radius: 0 !important;

  background: #fff !important;
}


html body.an-faceted-offcanvas-active
.ps-facetedsearch--mobile .accordion-button {
  --bs-accordion-btn-color: #07574f !important;
  --bs-accordion-btn-bg: #fff !important;
  --bs-accordion-active-color: #07574f !important;
  --bs-accordion-active-bg: #fff !important;

  position: relative !important;

  min-height: 43px !important;

  padding:
    12px
    28px
    12px
    0 !important;

  background: #fff !important;

  border: 0 !important;
  border-radius: 0 !important;

  box-shadow: none !important;

  color: #07574f !important;
  -webkit-text-fill-color: #07574f !important;

  font-family:
    "Geist",
    Arial,
    sans-serif !important;

  font-size: 13px !important;
  font-weight: 650 !important;
}


html body.an-faceted-offcanvas-active
.ps-facetedsearch--mobile
.accordion-button::after {
  content: "" !important;

  position: absolute !important;

  top: 50% !important;
  right: 3px !important;

  width: 7px !important;
  height: 7px !important;

  margin: 0 !important;

  background: none !important;
  background-image: none !important;

  border-right:
    1.5px solid #07574f !important;

  border-bottom:
    1.5px solid #07574f !important;
}


html body.an-faceted-offcanvas-active
.ps-facetedsearch--mobile
.accordion-button[aria-expanded="true"]::after {
  transform:
    translateY(-25%)
    rotate(225deg) !important;
}


html body.an-faceted-offcanvas-active
.ps-facetedsearch--mobile
.accordion-button[aria-expanded="false"]::after {
  transform:
    translateY(-65%)
    rotate(45deg) !important;
}


html body.an-faceted-offcanvas-active
.ps-facetedsearch--mobile .accordion-body {
  padding:
    0
    0
    13px !important;

  background: #fff !important;
}


html body.an-faceted-offcanvas-active
.ps-facetedsearch--mobile
:is(
  label,
  .facet-label a,
  .search-link,
  .search-filters__link,
  .form-check-label
) {
  color: #365f59 !important;
  -webkit-text-fill-color: #365f59 !important;

  font-size: 12px !important;

  text-decoration: none !important;
}


html body.an-faceted-offcanvas-active
.ps-facetedsearch--mobile .noUi-connect {
  background: #07574f !important;
}

/* ==========================================================
   DESKTOP — NEUTRALISER LE WRAPPER BOOTSTRAP OFFCANVAS
   Le panneau reste dans #left-column et se comporte comme
   un bloc normal de 230px.
   ========================================================== */

@media (min-width: 992px) {

  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted.ps-facetedsearch--mobile.offcanvas {

    --bs-offcanvas-width: 100% !important;

    position: static !important;

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    width: 100% !important;
    max-width: 100% !important;

    height: auto !important;
    max-height: none !important;

    display: block !important;

    visibility: visible !important;

    transform: none !important;

    background: transparent !important;
    background-color: transparent !important;

    border: 0 !important;

    box-shadow: none !important;

    z-index: auto !important;
  }


  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .offcanvas-header {
    display: none !important;
  }


  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .offcanvas-body {

    width: 100% !important;
    max-width: 100% !important;

    height: auto !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible !important;

    background: transparent !important;
  }


  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  #search_filters,

  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  #search-filters,

  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .block-facets {

    width: 100% !important;
    max-width: 100% !important;

    margin-left: 0 !important;
    margin-right: 0 !important;
  }

}

/* ==========================================================
   DESKTOP — LARGEUR UTILE SIDEBAR
   #left-column fait 230px border-box.
   On supprime le gutter gauche Bootstrap de 20px et on garde
   30px à droite comme espace avec la grille produits.
   Largeur utile filtres = 200px.
   ========================================================== */

@media (min-width: 992px) {

  html body#category
  #left-column {
    padding-left: 0 !important;
    padding-right: 30px !important;
  }


  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted.ps-facetedsearch--mobile.offcanvas {
    width: 100% !important;
    max-width: 100% !important;
  }


  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .offcanvas-body {
    width: 100% !important;
    max-width: 100% !important;
  }

}

/* ==========================================================
   DESKTOP — STYLE VISUEL DES FACETTES DANS LE WRAPPER OFFCANVAS
   Le wrapper Bootstrap est neutralisé en desktop ; ce bloc
   remet les accordéons au style Allo Naturel.
   ========================================================== */

@media (min-width: 992px) {

  /* Conteneur */
  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted {
    font-family: "Geist", Arial, sans-serif !important;
    color: #07574f !important;
  }


  /* Groupes */
  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .accordion-item {
    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-bottom: 1px solid #dfe6e4 !important;
    border-radius: 0 !important;

    background: transparent !important;
  }


  /* Titres Format / Besoins / Produits */
  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .accordion-button {
    --bs-accordion-btn-color: #07574f !important;
    --bs-accordion-btn-bg: transparent !important;
    --bs-accordion-active-color: #07574f !important;
    --bs-accordion-active-bg: transparent !important;

    position: relative !important;

    min-height: 38px !important;

    margin: 0 !important;
    padding: 10px 22px 8px 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    background-color: transparent !important;

    box-shadow: none !important;

    color: #07574f !important;
    -webkit-text-fill-color: #07574f !important;

    font-family: "Geist", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 650 !important;
    line-height: 1.15 !important;
  }


  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .accordion-button:hover,

  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .accordion-button:focus,

  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .accordion-button[aria-expanded="true"],

  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .accordion-button[aria-expanded="false"] {
    background: transparent !important;

    color: #07574f !important;
    -webkit-text-fill-color: #07574f !important;

    box-shadow: none !important;
    outline: none !important;
  }


  /* Supprimer le chevron Bootstrap bleu/noir */
  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .accordion-button::after {
    content: "" !important;

    position: absolute !important;
    top: 50% !important;
    right: 2px !important;

    width: 7px !important;
    height: 7px !important;

    margin: 0 !important;

    background: none !important;
    background-image: none !important;

    border-right: 1.5px solid #07574f !important;
    border-bottom: 1.5px solid #07574f !important;

    transition: transform .18s ease !important;
  }


  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .accordion-button[aria-expanded="true"]::after {
    transform: translateY(-25%) rotate(225deg) !important;
  }


  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .accordion-button[aria-expanded="false"]::after {
    transform: translateY(-65%) rotate(45deg) !important;
  }


  /* Contenu des groupes */
  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .accordion-body {
    margin: 0 !important;
    padding: 0 0 10px 0 !important;

    background: transparent !important;
  }


  /* Lignes */
  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  :is(
    .form-check,
    .search-filters__form-check
  ) {
    min-height: 22px !important;
    margin: 0 0 4px !important;
  }


  /* Libellés */
  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  :is(
    label,
    .facet-label,
    .facet-label a,
    .search-link,
    .search-filters__link,
    .form-check-label
  ) {
    color: #284f4a !important;
    -webkit-text-fill-color: #284f4a !important;

    font-family: "Geist", Arial, sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;

    text-decoration: none !important;
  }


  /* Quantités */
  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  :is(
    .magnitude,
    .search-filters__magnitude
  ) {
    color: #78918d !important;
    -webkit-text-fill-color: #78918d !important;

    font-size: 10px !important;
  }


  /* Cases */
  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  input[type="checkbox"] {
    accent-color: #07574f !important;
  }


  /* Résumé prix */
  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .an-price-summary {
    margin: 0 0 10px !important;

    color: #78918d !important;

    font-size: 10px !important;
    line-height: 1.3 !important;
  }


  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .an-price-summary__title {
    color: #07574f !important;
    -webkit-text-fill-color: #07574f !important;

    font-weight: 600 !important;
  }


  /* Slider prix */
  html body#category:not(.an-faceted-offcanvas-active)
  #left-column
  #offcanvas-faceted
  .noUi-connect {
    background: #07574f !important;
  }

}

/* ==========================================================
   V9 — DESKTOP : CIBLAGE DU DOM RÉEL
   Les .accordion-button sont dans #left-column mais ne sont
   PAS descendants de #offcanvas-faceted sur desktop.
   ========================================================== */

@media (min-width: 992px) {

  body#category
  #left-column
  .accordion-item {
    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-bottom: 1px solid #dfe6e4 !important;
    border-radius: 0 !important;

    background: transparent !important;
  }


  body#category
  #left-column
  .accordion-button {
    --bs-accordion-btn-color: #07574f !important;
    --bs-accordion-btn-bg: transparent !important;
    --bs-accordion-active-color: #07574f !important;
    --bs-accordion-active-bg: transparent !important;

    position: relative !important;

    width: 100% !important;
    min-height: 38px !important;

    margin: 0 !important;

    padding:
      10px
      22px
      8px
      0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    background-color: transparent !important;

    box-shadow: none !important;

    color: #07574f !important;
    -webkit-text-fill-color: #07574f !important;

    font-family:
      "Geist",
      Arial,
      sans-serif !important;

    font-size: 14px !important;
    font-weight: 650 !important;
    line-height: 1.15 !important;
  }


  body#category
  #left-column
  .accordion-button:hover,

  body#category
  #left-column
  .accordion-button:focus,

  body#category
  #left-column
  .accordion-button[aria-expanded="true"],

  body#category
  #left-column
  .accordion-button[aria-expanded="false"] {
    background: transparent !important;
    background-color: transparent !important;

    color: #07574f !important;
    -webkit-text-fill-color: #07574f !important;

    box-shadow: none !important;
    outline: none !important;
  }


  body#category
  #left-column
  .accordion-button::after {
    content: "" !important;

    position: absolute !important;

    top: 50% !important;
    right: 2px !important;

    width: 7px !important;
    height: 7px !important;

    margin: 0 !important;

    background: none !important;
    background-image: none !important;

    border-right:
      1.5px solid #07574f !important;

    border-bottom:
      1.5px solid #07574f !important;

    transition:
      transform .18s ease !important;
  }


  body#category
  #left-column
  .accordion-button[aria-expanded="true"]::after {
    transform:
      translateY(-25%)
      rotate(225deg) !important;
  }


  body#category
  #left-column
  .accordion-button[aria-expanded="false"]::after {
    transform:
      translateY(-65%)
      rotate(45deg) !important;
  }


  body#category
  #left-column
  .accordion-body {
    margin: 0 !important;

    padding:
      0
      0
      10px
      0 !important;

    background: transparent !important;
  }


  body#category
  #left-column
  :is(
    .form-check,
    .search-filters__form-check
  ) {
    min-height: 22px !important;

    margin:
      0
      0
      4px !important;
  }


  body#category
  #left-column
  :is(
    label,
    .facet-label,
    .facet-label a,
    .search-link,
    .search-filters__link,
    .form-check-label
  ) {
    color: #284f4a !important;
    -webkit-text-fill-color: #284f4a !important;

    font-family:
      "Geist",
      Arial,
      sans-serif !important;

    font-size: 12.5px !important;
    font-weight: 400 !important;
    line-height: 1.35 !important;

    text-decoration: none !important;
  }


  body#category
  #left-column
  :is(
    .magnitude,
    .search-filters__magnitude
  ) {
    color: #78918d !important;
    -webkit-text-fill-color: #78918d !important;

    font-size: 10px !important;
  }


  body#category
  #left-column
  input[type="checkbox"] {
    accent-color: #07574f !important;
  }


  body#category
  #left-column
  .an-price-summary {
    margin:
      0
      0
      10px !important;

    color: #78918d !important;

    font-size: 10px !important;
    line-height: 1.3 !important;
  }


  body#category
  #left-column
  .an-price-summary__title {
    color: #07574f !important;
    -webkit-text-fill-color: #07574f !important;

    font-weight: 600 !important;
  }


  body#category
  #left-column
  .noUi-connect {
    background: #07574f !important;
  }

}


/* ==========================================================
   V10 — MOBILE / TABLETTE : BACKDROP + INTERACTIONS OFFCANVAS
   Le backdrop doit rester SOUS le panneau.
   ========================================================== */

body.an-faceted-offcanvas-active
#offcanvas-faceted.ps-facetedsearch--mobile.offcanvas {
  position: fixed !important;

  z-index: 2100 !important;

  pointer-events: auto !important;

  background: #fff !important;
  background-color: #fff !important;

  isolation: isolate !important;
}


body.an-faceted-offcanvas-active
#offcanvas-faceted
.offcanvas-body,

body.an-faceted-offcanvas-active
#offcanvas-faceted
.accordion,

body.an-faceted-offcanvas-active
#offcanvas-faceted
.accordion-item,

body.an-faceted-offcanvas-active
#offcanvas-faceted
.accordion-header,

body.an-faceted-offcanvas-active
#offcanvas-faceted
.accordion-button,

body.an-faceted-offcanvas-active
#offcanvas-faceted
.accordion-collapse,

body.an-faceted-offcanvas-active
#offcanvas-faceted
.accordion-body,

body.an-faceted-offcanvas-active
#offcanvas-faceted
label,

body.an-faceted-offcanvas-active
#offcanvas-faceted
input,

body.an-faceted-offcanvas-active
#offcanvas-faceted
button,

body.an-faceted-offcanvas-active
#offcanvas-faceted
a {
  pointer-events: auto !important;
}


/* Backdrop sous le panneau, noir translucide et non vert */
body.an-faceted-offcanvas-active
.offcanvas-backdrop {
  z-index: 2090 !important;

  background: #000 !important;
  background-color: #000 !important;

  opacity: 0 !important;
}


body.an-faceted-offcanvas-active
.offcanvas-backdrop.show {
  opacity: .22 !important;
}


/* Titres mobile : couvrir les deux structures possibles
   (dans l'offcanvas ou encore rattachés à #left-column) */
body.an-faceted-offcanvas-active
#offcanvas-faceted
.accordion-button,

body.an-faceted-offcanvas-active
#left-column
.accordion-button {
  --bs-accordion-btn-color: #07574f !important;
  --bs-accordion-active-color: #07574f !important;
  --bs-accordion-btn-bg: #fff !important;
  --bs-accordion-active-bg: #fff !important;

  background: #fff !important;
  background-color: #fff !important;

  color: #07574f !important;
  -webkit-text-fill-color: #07574f !important;

  box-shadow: none !important;

  touch-action: manipulation !important;
}


/* Zones cliquables des options */
body.an-faceted-offcanvas-active
#offcanvas-faceted
:is(
  .form-check,
  .search-filters__form-check,
  .facet-label,
  .search-link,
  .search-filters__link
),

body.an-faceted-offcanvas-active
#left-column
:is(
  .form-check,
  .search-filters__form-check,
  .facet-label,
  .search-link,
  .search-filters__link
) {
  position: relative !important;

  z-index: 2 !important;

  pointer-events: auto !important;

  touch-action: manipulation !important;
}


/* Inputs au-dessus du backdrop */
body.an-faceted-offcanvas-active
#offcanvas-faceted
input,

body.an-faceted-offcanvas-active
#left-column
input {
  position: relative !important;

  z-index: 3 !important;

  pointer-events: auto !important;
}


/* Sécurité : aucun pseudo-élément ne doit bloquer les clics */
body.an-faceted-offcanvas-active
#offcanvas-faceted
.accordion-button::before,

body.an-faceted-offcanvas-active
#offcanvas-faceted
.accordion-button::after {
  pointer-events: none !important;
}


/* ==========================================================
   V11 — DESKTOP : CHECKBOXES VERT ALLO NATUREL
   ========================================================== */

@media (min-width: 992px) {

  body#category
  #left-column
  .form-check-input:checked,

  body#category
  #left-column
  input[type="checkbox"]:checked {
    background-color: #07574f !important;
    border-color: #07574f !important;
  }


  body#category
  #left-column
  .form-check-input:focus,

  body#category
  #left-column
  input[type="checkbox"]:focus {
    border-color: #07574f !important;
    box-shadow: 0 0 0 .15rem rgba(7, 87, 79, .12) !important;
  }


  body#category
  #left-column
  .custom-checkbox
  input[type="checkbox"] {
    accent-color: #07574f !important;
  }

}


/* ==========================================================
   V12 — CHECKBOX DESKTOP : FORCER LE VERT SUR LE FOND + BORDURE
   ========================================================== */

@media (min-width: 992px) {

  html body#category
  #left-column
  input.form-check-input[type="checkbox"]:checked,

  html body#category
  #left-column
  .form-check
  > input.form-check-input:checked {
    background-color: #07574f !important;
    border-color: #07574f !important;
    box-shadow: none !important;
  }


  html body#category
  #left-column
  input.form-check-input[type="checkbox"]:checked:focus {
    background-color: #07574f !important;
    border-color: #07574f !important;

    box-shadow:
      0 0 0 .15rem
      rgba(7, 87, 79, .12) !important;
  }

}

