/********************
	Part - block category
********************/
.block-category {
  justify-content  : space-between;

  padding          : .75rem;
  margin           : 0;
  z-index: 1;
  background: transparent;
}

.block-category h1 {
  background: transparent;
  border: none;
  color: #FFF;
  font-size: 45px;
  font-style: normal;
  font-weight: 400;
  line-height: 55px;
  text-transform: initial;
  padding: 1em 1.5em 0;
}

.block-subcategory {
  position: relative;
  z-index: 1;
  display: grid;
  align-items: center;
  justify-content: center;
  border-radius: 72.131px;
  background: rgba(41, 73, 100, 0.80);
  backdrop-filter: blur(10px);
  margin: 0 auto;
  padding: 20px;
  gap: 10px;
  width:fit-content;
  max-width: 1210px;
}

.block-subcategory.grid-template {
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}

.subcategory__image img {
  height: 65px;
  width: 65px;
  border-radius: 100%;
}

.subcategory__image a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}

.img-cat {
  border-radius: 50%;
  background: #fff;
}

.subCategory_name {
  color: #FFF;
  font-size: 13.5px;
  font-style: normal;
  font-weight: 300;
  line-height: 18.5px;
  max-width: 110px;
}

/*
  Header catégorie : la hauteur du visuel de fond suit la hauteur réelle du contenu
  (titre + description + sous-catégories). Le JS (category.js) alimente --cat-bg-height ;
  --cat-bg-min-height garde une hauteur plancher par breakpoint quand le contenu est court.
*/
#js-product-list-header {
  --cat-bg-min-height : 535px; /* hauteur mini du visuel */
  --cat-header-trim   : 65px;  /* remonte la liste produits sans toucher au visuel */
  /*
    Deux réglages optionnels, mesurés automatiquement sur le rendu actuel si non définis :
      --cat-header-inner-offset : air sous les sous-catégories, à l'intérieur du visuel
      --cat-header-gap          : air entre le bas du visuel et la liste produits
  */
}

.bg-single-line-category img
{
  display: block;
  width: 100%;
  height: max(var(--cat-bg-min-height, 535px), var(--cat-bg-height, 520px));
  object-fit: cover;
}

/* Voile dégradé au-dessus du visuel de fond (lisibilité du titre / des sous-catégories) */
.bg-single-line-category::after {
  content        : "";
  position       : absolute;
  inset          : 0;
  pointer-events : none;
  background: linear-gradient(180deg, rgb(0 0 0 / 17%) 0%, rgb(0 0 0 / 18%) 48.39%, rgba(0, 0, 0, 0.00) 100%);
}

.block-category #category-description p,
.block-category #category-description strong {
  font-weight : 400;
  color       : var(--color-grey-font-default)
}

.block-category #category-description p {
  color         : var(--color-black-default);
  margin-bottom : 0
}

.block-category #category-description p:first-child {
  margin-bottom : 1.25rem
}

@media (max-width : 767px) {
  .block-category {
    min-height    : 0;
    margin-bottom : 0
  }
}

@media (min-width : 768px) {
  .block-category {
    flex-direction : row;
  }

  .subcategory__image {
    min-width: 200px;
  }
}

@media (max-width : 991px) {
  .block-category {
    padding-bottom : 0
  }
}

/********************
	Part - subcat
********************/
.subcategories-list {
  display               : grid;
  grid-template-columns : repeat(auto-fill, minmax(180px, 1fr));
  grid-gap              : 20px;
  text-align            : center;
}

.subcategories-list .subcategory__name-wrapper {
  margin : 1rem 0 0;
}

/********************
	Part - products
********************/
#products {
  display        : flex;
  flex-direction : column;
}

/********************
	Part - global
********************/
@media (max-width : 575px) {
  #category #left-column #search_filters_wrapper {
    margin-left  : -15px;
    margin-right : -15px
  }
}

@media (max-width : 767px) {
  #category #left-column {
    width : 100%
  }

  #category #left-column #search_filters_wrapper {
    margin-left  : -30px;
    margin-right : -30px
  }

  #category #left-column #search_filter_controls {
    text-align    : center;
    margin-bottom : 1rem
  }

  #category #left-column #search_filter_controls button {
    margin : 0 .5rem
  }

  #category #left-column #search_filters {
    margin-bottom : 0;
    box-shadow    : none;
    padding       : 0;
    border-top    : 1px solid #f6f6f6
  }

  #category #left-column #search_filters .facet {
    padding-top   : 0;
    border-bottom : 1px solid #f6f6f6
  }

  #category #left-column #search_filters .facet .title {
    cursor : pointer
  }

  #category #left-column #search_filters .facet .title .collapse-icons .remove,
  #category #left-column #search_filters .facet .title[aria-expanded=true] .collapse-icons .add {
    display : none
  }

  #category #left-column #search_filters .facet .title[aria-expanded=true] .collapse-icons .remove {
    display : block
  }

  #category #left-column #search_filters .facet .facet-title {
    color          : var(--color-black-default);
    text-transform : uppercase
  }

  #category #left-column #search_filters .facet .h6 {
    margin-bottom : 0;
    padding       : .625rem;
    display       : inline-block
  }

  #category #left-column #search_filters .facet .navbar-toggler {
    display : inline-block;
    padding : .625rem .625rem 0 0
  }

  #category #left-column #search_filters .facet .collapse {
    display : none
  }

  #category #left-column #search_filters .facet .collapse.in {
    display : block
  }

  #category #left-column #search_filters .facet .facet-label a {
    margin-top : 0
  }

  #category #left-column #search_filters .facet ul {
    margin-bottom : 0
  }

  #category #left-column #search_filters .facet ul li {
    border-top : 1px solid #f6f6f6;
    padding    : .625rem
  }

  #category #content-wrapper, #category #search_filter_toggler {
    width : 100%
  }

  .category-cover {
    display : none
  }
}

@media (max-width : 991px) {
  .block-category .category-cover {
    position   : relative;
    text-align : center
  }
}

/********************
	Part - additional_description category
********************/
@supports not (-webkit-touch-callout: none) {
  .additional-description-text {
    overflow           : hidden;
    text-overflow      : ellipsis;
    display            : -webkit-box;
    -webkit-line-clamp : 3; /* number of lines to show */
    line-clamp         : 3;
    -webkit-box-orient : vertical;
    transition         : 0.4s ease;
  }

  .additional-description-text p {
    line-height : 1.4rem;
  }
}

.additional-description__container {
  margin-top : 20px;
  padding: 0 80px;
  font-family: Urbanist, sans-serif;

}
.additional-description-text p {
  line-height: 30px;
  letter-spacing: 0.5px;
  font-size: 20px;
  color: var(--color-primary);
}
.additional-description-text a {
  color : var(--color-secondary)
}

.additional-description-text a:hover {
  text-decoration : underline;
}

@supports (-webkit-touch-callout: none) {
  .additional-description-text {
    overflow   : hidden;
    max-height : 200px;

  }

  .additional-description-text p {
    display     : inline-block;
    line-height : 1.4rem;
  }
}

.see-more-btn {
  position    : relative;
  display     : flex;
  align-items : center;
  background  : transparent;
  color       : var(--color-secondary);
  cursor      : pointer;
  padding-top : 10px;
}

.see-more-btn-text--is-hidden, .see-less-btn-text--is-hidden {
  display : none !important;
}

.see-more-btn-text, .see-less-btn-text {
  display : block;
}
.additional-description__container .see-more-btn-text,.additional-description__container .see-less-btn-text {
  font-size: 16px;
  font-weight: 700;
}

.additional-description-text--is-extended {
  -webkit-line-clamp : unset;
  line-clamp         : unset;
}

/********************
	Part - sibling categories
********************/
.siblingcategories-container {
  margin   : 2em auto 0 auto;
  position  : relative;
}

.siblingcategories-container .swiper-container {
  width  : 100%;
  height : 100%;
}

.siblingcategories__item {
  border-radius   : 50px;
  border          : 1px solid var(--color-tertiary);
  padding         : 15px 50px;
  color           : var(--color-black-default);
  font-size       : 14px;
  font-weight     : 400;
  text-align      : center;
  text-transform  : initial;
  text-decoration : none;
}

.siblingcategories__item:hover {
  background      : var(--color-tertiary);
  color           : var(--color-white-default);
  text-decoration : none;
}

.siblingcategories-slider .siblingcategories-swiper-button-prev {
  right   : 20px;
}
.siblingcategories-slider .siblingcategories-swiper-button-next {
  right : 0;
}

.siblingcategories-slider .siblingcategories-swiper-button-prev,
.siblingcategories-slider .siblingcategories-swiper-button-next {
  position   : absolute;
  background : none;
  top        : 0;
}

.block-subcategory.mobile_only {
  display: none;
}

@media (max-width: 1024px) {
  .block-subcategory  {
    display: flex;
    background: unset;
    backdrop-filter:  unset;
    border-radius: unset;
    width:100%;
    overflow: hidden;
  }

  .subcategory__image {
    padding: 10px;
    background: rgba(41, 73, 100, 0.80);
    backdrop-filter: blur(10px);
    border-radius: 50px;
  }

  .block-subcategory.on-desktop {
    display: none;
  }

  .block-subcategory.mobile_only {
    display: flex;
  }
}

@media (min-width: 768px) and (max-width: 1024) {
  .swiper-category-mobile:not(.grid-template) .swiper-wrapper {
    justify-content: center;
  }
}
