/* src/public/modules/store/product-grid/product-grid.responsive.css */

/* Teléfono (2 columnas: < 600px) */
@media (max-width: 599px) {
    #product-grid-container {
        /* Forzamos 2 columnas de igual tamaño */
        grid-template-columns: repeat(2, 1fr);
        gap: 15px; /* Reducimos el espacio entre productos para ahorrar espacio */
    }
    /* Reducimos la altura de la imagen para que la tarjeta sea más compacta */
    .product-card img {
        height: 180px; 
    }
}


/* Tablet (2 columnas) */
@media (min-width: 600px) {
    #product-grid-container {
        grid-template-columns: repeat(2, 1fr);
        gap: 25px;
    }
}

/* Escritorio (3 columnas o más, similar al ejemplo) */
@media (min-width: 900px) {
    #product-grid-container {
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }
}

@media (min-width: 1200px) {
    #product-grid-container {
        grid-template-columns: repeat(4, 1fr);
    }
}