/* Sous-menu de catégorie (libertie_subcatmenu), sous le fil d'Ariane */
.libertie-subcatmenu {
  width: 100%;
  margin: 10px 0 20px;
}

.libertie-subcatmenu__list {
  display: flex;
  justify-content: center;
  gap: 25px;
  margin: 0;
  /* Photo de la 1re vignette alignée sur la photo du 1er produit (mesuré sur le thème de prod) : div#js-product-list
     margin-left 50px, .products.row -15px + padding 28px, 1er article sans marge = 63px ; moins 5px de cadre
     (bordure 1px + padding 4px du lien) = 58px. Voir les media queries en bas pour les autres largeurs. */
  padding: 0 35px 0 58px;
  list-style: none;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  scroll-padding: 0 58px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

/* Le thème remonte le bouton Filtres sur la ligne du fil d'Ariane (facets.tpl : div#search_filters_wrapper
   { margin-top: -30px }) ; sous le sous-menu, il chevaucherait les vignettes : on annule la remontée. */
.libertie-subcatmenu + #search_filters_wrapper {
  margin-top: 0;
}

.libertie-subcatmenu__list::-webkit-scrollbar {
  display: none;
}

.libertie-subcatmenu__item {
  flex: 0 0 130px;
  scroll-snap-align: start;
}

/* cadre transparent sur tous les éléments : la page active (encadrée) garde la même taille que les autres */
.libertie-subcatmenu__link {
  display: block;
  padding: 4px 4px 6px;
  border: 1px solid transparent;
  color: inherit;
  text-decoration: none;
}

.libertie-subcatmenu__item.is-current .libertie-subcatmenu__link {
  border-color: #111;
}

.libertie-subcatmenu__img {
  display: block;
  aspect-ratio: 2 / 3;
  overflow: hidden;
  background: #f4f4f4;
}

.libertie-subcatmenu__img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.3s;
}

a.libertie-subcatmenu__link:hover img {
  opacity: 0.7;
}

/* .libertie-subcatmenu__name {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.3;
  text-transform: uppercase;
  text-align: center;
} */

span.libertie-subcatmenu__name {
    font-family: Golos Text;
    font-weight: 400;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    color: #111;
     text-align: center;
       text-transform: uppercase;
       display: block;
         margin-top: 6px;
}

.libertie-subcatmenu__item.is-current .libertie-subcatmenu__name {
  color: #111;
}

/* 769 à 992px : #js-product-list sans marge, .products.row -15px sans padding, article margin-left 7.5px → -7.5px,
   moins les 5px du cadre */
@media (min-width: 769px) and (max-width: 992px) {
  .libertie-subcatmenu__list {
        justify-content: flex-start;
    margin-left: -12.5px;
    padding-left: 0;
    scroll-padding-left: 0;
  }
}

/* 992px pile : les deux media queries du thème se cumulent (padding 28px + article 7.5px, -15px) → 20.5px - 5px */
@media (min-width: 992px) and (max-width: 992px) {
  .libertie-subcatmenu__list {
        justify-content: flex-start;
    margin-left: 0;
    padding-left: 15.5px;
    scroll-padding-left: 15.5px;
  }
}

/* jusqu'à 768px : les produits vont jusqu'au bord de l'écran ; le cadre reste visible (photo à 5px du bord) */
@media (max-width: 768px) {
  .libertie-subcatmenu__list {
        justify-content: flex-start;
    gap: 8px;
    padding: 0 10px 0 0;
    scroll-padding: 0;
  }

  /* 3,5 vignettes visibles : on devine qu'il y en a d'autres à faire défiler */
  .libertie-subcatmenu__item {
    flex-basis: calc((100% - 34px) / 3.5);
  }
  span.libertie-subcatmenu__name{
    font-size: 12px;
  }
}
