/* Contenedor principal del carrusel */
#marcas-carrusel {
    margin-top: 80px;
    margin-bottom: 80px;
    text-align: center; 
    margin-left: auto;
    margin-right: auto;
    max-width: 1100px;
}

/* Estilos para cada item del carrusel (la caja de cada marca) */
#marcas-carrusel .item {
    padding: 15px; /* Espaciado interno para que la imagen no toque los bordes del item */
    text-align: center; /* Para centrar la imagen y el nombre de la marca */
}

/* Estilos para las imágenes de las marcas */
#marcas-carrusel .item img {
    max-width: 100%; /* Asegura que la imagen no se desborde de su contenedor */
    height: auto; /* Mantiene la proporción de la imagen */
    display: block; /* Elimina cualquier espacio extra debajo de la imagen */
    margin: 0 auto; /* Centra la imagen si el ancho es menor al del contenedor */
    max-height: 100px; /* Limita la altura máxima de las imágenes para que se vean uniformes */
    object-fit: contain; /* Ajusta la imagen dentro de su contenedor sin recortar */
}

/* Estilos para los botones de navegación (flechas) */
/* #marcas-carrusel .owl-nav button {
    background: #007bff; 
    color: white; 
    font-size: 24px;
    border-radius: 50%; 
    width: 40px;
    height: 40px;
    line-height: 38px; 
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin: 0;
    padding: 0;
    opacity: 0.8;
    transition: opacity 0.3s;
}

#marcas-carrusel .owl-nav button:hover {
    opacity: 1;
}

#marcas-carrusel .owl-nav .owl-prev {
    left: -50px; 
}

#marcas-carrusel .owl-nav .owl-next {
    right: -50px;
} */

/* Media queries para ajustar los botones en pantallas pequeñas */
@media (max-width: 767px) {
    #marcas-carrusel{
        max-width: 385px;
        padding: 0;
    }
}

/* Si las flechas no aparecen, asegúrate de que el contenedor .owl-carousel-container tenga position: relative; */
.marcas-carrusel-container {
    position: relative;
}

#marcas-carrusel .owl-item .item {
  position: relative;
  width: calc(20% - 10px);
  min-width: 210px;
  padding: 10px;
  margin: 5px;
  text-align: center;
  -webkit-transition: .4s ease-out;
  transition: .4s ease-out;
}

#marcas-carrusel .all-product-link{
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    clear: both;
    font-weight: 500;
    color: #7a7a7a;
}

#marcas-carrusel .products-section-title {
  margin: 2.5rem 0;
  font-weight: 500;
  text-align: center;
}