/**
 * Tarjetas de producto (15-oct-2026): mas bajas y 6 por fila en las listas.
 *
 * Antes median unos 160 x 500 px: la foto en un recuadro de 250 px de alto
 * (mas alto que ancho) y un hueco grande entre el precio y la cantidad; en
 * una pantalla normal se veia una sola fila. La foto se ve del mismo tamano
 * (recuadro de 190 px) y se quita el hueco: ~370 px.
 *
 * Valen para las listas (categoria, marca, busqueda...) y los carruseles de
 * la portada, que usan la misma tarjeta. En el movil no cambian.
 */
@media (min-width: 768px) {
    .js-product-miniature .element-top,
    .js-product-miniature .element-top > a,
    .js-product-miniature .wrapper-imgs {
        height: 190px !important;
    }
    .js-product-miniature .wrapper-imgs img {
        width: 100% !important;
        height: 190px !important;
        object-fit: contain;
    }
    .js-product-miniature .element-bottom {
        height: auto !important;
        padding-top: 4px !important;
    }
    .js-product-miniature .product-description {
        height: auto !important;
    }
    .js-product-miniature .product_name {
        margin-bottom: 2px !important;
    }
    .js-product-miniature .ax-product-cats {
        margin-bottom: 4px !important;
    }
    .js-product-miniature .input-group-add-cart,
    .js-product-miniature .ek-comprar {
        margin-top: 10px !important;
    }

    /* El precio por unidad siempre en su linea: en las tarjetas angostas a
       veces cabia junto al precio y a veces bajaba, y las tarjetas quedaban
       de distinta altura */
    .js-product-miniature .product-price-and-shipping .product-unit-price {
        display: block;
    }

    /* En las listas, todas las tarjetas de una fila del mismo alto, con la
       cantidad y "Agregar" siempre abajo */
    .archive-wrapper-items {
        align-items: stretch !important;
    }
    .archive-wrapper-items > .item {
        display: flex !important;
    }
    .archive-wrapper-items > .item > .js-product {
        display: flex !important;
        flex-direction: column;
        width: 100%;
    }
    .archive-wrapper-items .js-product-miniature {
        display: flex !important;
        flex: 1 1 auto;
        flex-direction: column;
    }
    .archive-wrapper-items .js-product-miniature .element-bottom {
        display: flex !important;
        flex: 1 1 auto;
        flex-direction: column;
    }
    .archive-wrapper-items .js-product-miniature .element-bottom > form {
        margin-top: auto;
    }
}

/* 6 por fila en las listas, en pantallas anchas (los carruseles de la
   portada fijan su numero por su cuenta) */
@media (min-width: 1200px) {
    .archive-wrapper-items > .item {
        flex: 0 0 16.666% !important;
        max-width: 16.666% !important;
    }
}