/* 
 * BA MAS VENDIDOS PRO - estilos front
 * Objetivo:
 *  - Carrusel horizontal (una sola línea) con separación prolija entre cards
 *  - Mobile: 2 productos visibles por "vista"
 *  - Tablet: 3 visibles
 *  - Desktop: 4 visibles
 * Compatible Classic PS 1.7 / 8.x
 */

.bamasvendidospro__title{
  margin-bottom: 1.25rem;
}

/* Track del carrusel (una línea) */
.bamasvendidospro__products{
  display: flex;
  flex-wrap: nowrap;
  gap: 1rem;                 /* espacio entre cards */
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  padding-bottom: 0.25rem;
}

/* Scrollbar discreta (si el navegador la muestra) */
.bamasvendidospro__products::-webkit-scrollbar{
  height: 6px;
}
.bamasvendidospro__products::-webkit-scrollbar-thumb{
  border-radius: 999px;
}

/* Cada slide */
.bamasvendidospro__item{
  flex: 0 0 25%;             /* desktop por defecto: 4 visibles */
  max-width: 25%;
  scroll-snap-align: start;
}

/* Ajustes responsivos */
@media (max-width: 991.98px){
  .bamasvendidospro__item{
    flex-basis: 33.3333%;    /* tablet: 3 visibles */
    max-width: 33.3333%;
  }
}

@media (max-width: 767.98px){
  .bamasvendidospro__products{
    gap: 0.75rem;
  }
  .bamasvendidospro__item{
    flex-basis: 50%;         /* móvil: 2 visibles */
    max-width: 50%;
  }
}

/* Mejoras visuales para que no “pegue” con el borde del contenedor */
.bamasvendidospro__products{
  scroll-padding-left: 0.25rem;
}