/* =============================================
   SCROLL HORIZONTAL PRODUCTOS - SOLO SUBPÁGINAS
   NO aplica a la home (ya tiene sus propios estilos)
   NOTA: El body de la home tiene clase "page-index"
   ============================================= */

/* Scroll horizontal productos - SOLO páginas que NO son home */
body:not(.page-index) .featured-products .products,
body:not(.page-index) .bestsellers-products .products,
body:not(.page-index) .newproducts-products .products {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    padding: 0 15px 15px 15px !important;
    margin: 0 !important;
    gap: 10px !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
}

/* Anular Bootstrap row */
body:not(.page-index) .products.row {
    margin: 0 !important;
}
body:not(.page-index) .products.row::before,
body:not(.page-index) .products.row::after {
    display: none !important;
}

/* Productos/wrappers - quitar padding de Bootstrap */
body:not(.page-index) .featured-products .products > *,
body:not(.page-index) .bestsellers-products .products > *,
body:not(.page-index) .newproducts-products .products > * {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
}

/* Marco y efecto hover en productos */
body:not(.page-index) .featured-products .products .product-miniature .thumbnail-container,
body:not(.page-index) .bestsellers-products .products .product-miniature .thumbnail-container,
body:not(.page-index) .newproducts-products .products .product-miniature .thumbnail-container {
    border: 1px solid rgba(0,0,0,0.06) !important;
    border-radius: 8px !important;
    padding: 10px 15px 15px 15px !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    background: #fff !important;
}

body:not(.page-index) .featured-products .products .product-miniature .thumbnail-container:hover,
body:not(.page-index) .bestsellers-products .products .product-miniature .thumbnail-container:hover,
body:not(.page-index) .newproducts-products .products .product-miniature .thumbnail-container:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important;
}

/* Scrollbar estilizado */
body:not(.page-index) .featured-products .products::-webkit-scrollbar,
body:not(.page-index) .bestsellers-products .products::-webkit-scrollbar,
body:not(.page-index) .newproducts-products .products::-webkit-scrollbar {
    height: 8px;
}
body:not(.page-index) .featured-products .products::-webkit-scrollbar-track,
body:not(.page-index) .bestsellers-products .products::-webkit-scrollbar-track,
body:not(.page-index) .newproducts-products .products::-webkit-scrollbar-track {
    background: #f5f5f5;
    border-radius: 4px;
}
body:not(.page-index) .featured-products .products::-webkit-scrollbar-thumb,
body:not(.page-index) .bestsellers-products .products::-webkit-scrollbar-thumb,
body:not(.page-index) .newproducts-products .products::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 4px;
}

/* Título de sección con margen izquierdo */
body:not(.page-index) .featured-products .products-section-title,
body:not(.page-index) .bestsellers-products .products-section-title,
body:not(.page-index) .featured-products > h2,
body:not(.page-index) .bestsellers-products > h2 {
    padding-left: 15px !important;
}

/* Espaciado entre secciones */
body:not(.page-index) .featured-products,
body:not(.page-index) .bestsellers-products,
body:not(.page-index) .newproducts-products {
    margin-bottom: 40px;
}

/* Ocultar botón "Ver producto" en móvil */
@media (max-width: 768px) {
    body:not(.page-index) .featured-products .product-miniature .btn-secondary,
    body:not(.page-index) .featured-products .product-miniature .quick-view,
    body:not(.page-index) .bestsellers-products .product-miniature .btn-secondary,
    body:not(.page-index) .bestsellers-products .product-miniature .quick-view,
    body:not(.page-index) .newproducts-products .product-miniature .btn-secondary,
    body:not(.page-index) .newproducts-products .product-miniature .quick-view {
        display: none !important;
    }
}
