

span.woocommerce-Price-amount.amount
 {
display: none!important;
}

/* ==========================================================================
   1) BOUTONS CATÉGORIES
   ========================================================================== */
#ajax-product-categories {
  margin-bottom: 20px;
}
.ajax-cat-btn {
 
  padding: 10px 20px;
  background: #f5f5f5;
  border: 1px solid #ddd;
  color: #333;
  cursor: pointer;
  font-size: 18px;
  text-transform: uppercase;
}
.ajax-cat-btn.active-cat {
  background: #e71f64;
  color: #fff;
  border: none;
}

/* ==========================================================================
   2) GRILLE PRODUITS 
   ========================================================================== */
#ajax-products-list {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  
}

/*Le cas ou il y a aucun produit selectionné */
div.aucun-produit{
width: 100%;
text-align: center;
padding: 50px;
border: 1px solid #e71f64;
display: flex;
align-items: center;
justify-content: center;
}

div.aucun-produit p{
width: 50%;

line-height: 1.6;
font-size: 20px;
}

#listing-products #ajax-products-list .product-item {
   width: calc(25% - 20px);
    border: 1px solid #eee;
  text-align: center;
  box-sizing: border-box;
  transition: all 0.2s ease;
  margin-bottom: 20px;
  
}



.product-item {
  width: calc(33.333% - 20px);
  border: 1px solid #eee;
  text-align: center;
  box-sizing: border-box;
  transition: all 0.2s ease;
  margin-bottom: 20px;
}
.product-item:hover{
  transform: scale(1.05);
  border: 1px solid #e71f64;
  transition: all 0.2s ease;
}
.product-item img{

  width: 100%;

}


.product-item h4{

  padding: 20px;
  color:#e71f64;
 

}
.product-item bdi{
  color:#e71f64;
  
}
/* ==========================================================================
   3) PANNEAU FILTRES
   ========================================================================== */
#filter-panel { 
  background: #fff;
  border: 1px solid #e71f64;
}
#filter-toggle {
  width: 100%;
  background: #f5f5f5;
  border: none;
  padding: 10px;
  font-size: 20px;
  text-align: left;
  cursor: pointer;
  position: relative;
color: white;
  background:#e71f64;;
}
#filter-toggle::after {
  content: "▾";
  position: absolute;
  right: 12px;
  transition: transform 0.3s;
}
#filter-panel.open #filter-toggle::after {
  transform: rotate(180deg);
}
.et_pb_toggle_title .et-pb-icon {
  display: none !important;
}

/* ==========================================================================
   4) AFFICHAGE / MASQUAGE DES FILTRES
   ========================================================================== */
#filter-panel #filters-container {
  display: none;
}
#filter-panel.open #filters-container {
  display: block;
}

/* ==========================================================================
   5) STYLES DES GROUPES DE FILTRES
   ========================================================================== */
.filter-group {
  margin-bottom: 10px;
  padding: 0px 20px 0px 20px;
}
.filter-group > strong {
  display: block;
 
  margin: 15px 5px 5px 5px ;
  font-size: 16px;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #333;
  
}
.filter-couleurs .color-square {
  display: inline-block;
  width: 25px;
  height: 25px;
  margin: 3px;
  border: 1px solid #ccc;
  cursor: pointer;
}
.filter-couleurs .color-square.selected {
  border: 2px solid #0073aa;
}

/* ==========================================================================
   6) SLIDER PRIX
   ========================================================================== */
.price-slider-container {
  margin-top: 12px;
  display: flex;
  flex-direction: column;
}
#price-slider {
  width: 100%;
  height: 6px;
  background: transparent;
  margin: 0;
  cursor: pointer;
}

/* WebKit */
#price-slider::-webkit-slider-runnable-track {
  height: 6px;
  border-radius: 3px;
  background: linear-gradient(
    to right,
    #e2bac8 0%,
    #e2bac8 calc((var(--val,50) / var(--max,100)) * 1%),
    #f1f1f1 calc((var(--val,50) / var(--max,100)) * 1%),
    #f1f1f1 100%
  );
}
#price-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 14px;
  height: 14px;
  margin-top: -4px;
  border-radius: 50%;
  background: #e2bac8;
  border: 2px solid #fff;
  cursor: pointer;
}

/* Firefox */
#price-slider::-moz-range-track {
  height: 6px;
  border-radius: 3px;
  background: #f1f1f1;
}
#price-slider::-moz-range-progress {
  height: 6px;
  border-radius: 3px;
  background: #e2bac8;
}
#price-slider::-moz-range-thumb {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #e2bac8;
  border: none;
  cursor: pointer;
}

/* IE/Edge */
#price-slider::-ms-track {
  width: 100%;
  height: 6px;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
#price-slider::-ms-fill-lower {
  background: #e2bac8;
  border-radius: 3px;
}
#price-slider::-ms-fill-upper {
  background: #f1f1f1;
  border-radius: 3px;
}
#price-slider::-ms-thumb {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #e2bac8;
  border: 2px solid #fff;
  cursor: pointer;
}

/* ==========================================================================
   7) LOADER INFINITE SCROLL
   ========================================================================== */
.loader {
  border: 4px solid #f3f3f3;
  border-top: 4px solid #e71f64;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  animation: spin 1s linear infinite;
  margin: 20px auto;
}
.loader.hidden {
  display: none;
}
@keyframes spin {
  to { transform: rotate(360deg); }
}

/* ==========================================================================
   8) RECHERCHE AJAX
   ========================================================================== */
#ajax-search-wrapper {
  margin: 0px;
  
}
#ajax-product-search {
  width: 100%;
  padding: 10px 30px;
  font-size: 16px;
  border-radius: 50px;
 
}


div #ajax-search-results{
 margin-top: 2px;

}
#ajax-search-results {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 1000;
  max-height: 380px;
  overflow-y: auto;
border-radius: 20px;
  background: #fff;
}
.ajax-search-list {
  list-style: none;
 
  padding: 0;
}
.ajax-search-list li {
  padding: 0px;

 
}

.ajax-search-list :hover{
  padding: 0px;
 
  background: #ebebeb;
}

.ajax-search-list li:last-child {
  border-bottom: none;
}
.ajax-search-list li a {
  display: flex;
  align-items: center;
  color: #333;
  text-decoration: none;
  font-size: 16px;
}
.ajax-search-list li a img {
  width: 80px;
  height: auto;
  margin-right: 10px;
}

#ajax-search-results ul  {
  margin:0px!important;
  list-style: none;
  padding: 0px!important;
}




/* ==========================================================================
  RESPONSIVE
   ========================================================================== */
@media (max-width: 768px) {
  .product-item { 
    width: calc(50% - 15px); 
    
 }
}
@media (max-width: 480px) {
  .product-item { width: 100%; }
  .ajax-cat-btn {
    font-size: 12px!important;
  }

   #filter-toggle{
    font-size: 14px!important;
  }
}
