/* MODIFICATION GRILLE PRODUITS
// Objectif : 8, 6 et 4 produits par ligne, et images plus petites
// ================================================================ */

/* Pour les écrans très larges (PC de bureau > 1200px) - 8 produits/ligne */
@media (min-width: 1200px) {
  .products .product-miniature.col-xl-3 {
    width: 12.5%; /* 100% / 8 produits */
    flex: 0 0 12.5%;
    max-width: 12.5%;
  }
}

/* Pour les écrans larges (portables > 992px) - 6 produits/ligne */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .products .product-miniature.col-lg-4 {
    width: 16.666%; /* 100% / 6 produits */
    flex: 0 0 16.666%;
    max-width: 16.666%;
  }
}

/* Pour les écrans moyens (tablettes > 768px) - 4 produits/ligne */
@media (min-width: 768px) and (max-width: 991.98px) {
  .products .product-miniature.col-md-6 {
    width: 25%; /* 100% / 4 produits */
    flex: 0 0 25%;
    max-width: 25%;
  }
}

/* ===================================================================
// MODIFICATION IMAGE PRODUIT
// Objectif : Rendre l'image plus petite pour la nouvelle grille dense
// ================================================================ */

.product-miniature .thumbnail-container img.tv-img-responsive {
  /* ATTENTION : Avec 8 produits, il faut une image assez petite */
  max-height: 110px; /* <-- Essayez avec cette valeur, puis ajustez (ex: 100px, 120px) */
  width: auto;
  object-fit: contain;
}