.no-stock-block{
  background:#fff;
  border:1px solid #cddcf2;
  border-radius:10px;
  padding:12px;
  margin:10px 0 18px 0;
}

.no-stock-label{
  margin-bottom:10px;
}

.no-stock-message{
  background:#f0f6ff;
  border:1px solid #cddcf2;
  border-radius:10px;
  padding:10px 12px;
  text-align:center;
  font-weight:600;
  color:#001d48;
}


.connection-hide { display:none !important }

/* --- Layout liste + filtres --- */
.decoliste-wrap {
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

/* 75% à gauche */
.decoliste-left{
  flex: 0 0 75%;
  max-width: 75%;
  min-width: 0;
}

/* 25% à droite */
.decoliste-filters{
  flex: 0 0 21%;
  max-width: 21%;
  padding:16px;
  border:1px solid #e5e5e5;
  background:#fafafa;
  border-radius:8px;
  position:sticky;
  top:18px;
  height:fit-content;
}

.filter-group{ margin-bottom:14px; }

.filter-group label {
    display: inline-block;
    margin-bottom: 2px;
    cursor: pointer;
    /* float: left; */
    padding-right: 7px;
}


.tailles-soustitre { margin-bottom: 5px; }


.filter-row{ display:flex; gap:8px; }

.filter-row input {
    width: 100%;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 13px;
    margin-top: 7px;
}
.filter-actions{ display:flex; gap:8px; margin-top:10px; }
.filter-actions button{
  flex:1;
  padding:10px;
  border-radius:8px;
  border:1px solid #ddd;
  cursor:pointer;
  background:#fff;
}

/* Mobile : filtres en dessous (100%) */
@media (max-width: 980px){
  .decoliste-wrap{ flex-direction:column; }
  .decoliste-left,
  .decoliste-filters{
    flex: 0 0 100%;
    max-width: 100%;
  }
  .decoliste-filters{ position:static; }
}

.decoliste-wrap{
  width: 100% !important;
  flex-wrap: nowrap !important;
}

.decoliste-left{ width: 75% !important; }

.decoliste, .decoliste-wrap, .decoliste-left, .decoliste-filters{
  float: none !important;
  clear: none !important;
}


.cat-titre {
    padding-bottom: 16px;
    padding-top: 0px !important;
}



@media (max-width: 1048px) {
       .decoliste-left, .decoliste-filters {
        flex: 0 0 100%;
        max-width: 100%;
    }

   .decoliste-left {
    width: 100%;
}

    .decoliste-wrap {
        flex-direction: initial;
  
}

}

.fabrication a { background:#<?php echo $coulbacksoussite2 ?> !important }
.fabrication a:hover {background: #<?php echo $coulbacksoussite3 ?> !important  }


.mobile-filters{
  display:none;
  margin: 10px 0 16px;
}

.mobile-filters__btn{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 12px 12px;
  border: 1px solid #ddd;
  background:#fff;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
}

.mobile-filters__panel{
  margin-top: 8px;
  border: 1px solid #ddd;
  background:#fff;
  border-radius: 8px;
  padding: 12px;
}

/* optionnel: sticky en haut sur mobile */
.mobile-filters.is-sticky{
  position: sticky;
  top: 0;
  z-index: 50;
  background: transparent;
  padding-top: 8px;
}

/* Sur mobile: on affiche le dropdown et on cache l'aside original */
@media (max-width: 768px){
  .mobile-filters{ display:block; }
  aside.decoliste-filters{
    display:none; /* caché tant qu'il n'est pas déplacé */
  }

  /* Si l'aside est déplacé dans le panel, on le ré-affiche là */
  .mobile-filters__panel aside.decoliste-filters{
    display:block;
    margin:0;
  }

  /* Optionnel: supprimer le titre "Filtrer" interne si tu veux */
  .mobile-filters__panel aside.decoliste-filters > h3{
    display:none;
  }
}