/**
 * Framework: Hyper-Fast WP
 * File mobile-box-grid.css
 * Aggiornato al 07-07-2023
 * Incluso da css-lista-mobile.php
 */

/* Stessa altezza per tutti i box con CSS GRID (https://codepen.io/Hlsg/pen/EXKJba) */
/* .archive-box-cont { display: grid; grid-template-columns: repeat(2, 1fr); grid-auto-rows: 1fr; grid-column-gap: 10px; grid-row-gap: 10px; } */

/* GRID: box prodotti stessa altezza riga per riga */
.archive-box-cont, 
.pagina-categoria ul.products, 
.estratto-prodotti ul.products, 
.up-sells ul.products, 
.cross-sells ul.products, 
.wc-shop-box-cont ul.products { display: grid; }

/* Ripristino la larghezza giusta di ogni box */
.pagina-categoria ul.products li.product, 
.estratto-prodotti ul.products li.product, 
.up-sells ul.products li.product, 
.cross-sells ul.products li.product, 
.wc-shop-box-cont ul.products li.product { width: 100% !important; }

@media (min-width: 320px) and (max-width: 767.98px) {
	.pagina-categoria ul.products, 
	.estratto-prodotti ul.products, 
	.archive-box-cont, 
	.up-sells ul.products, 
	.cross-sells ul.products, 
	.mobile .wc-shop-box-cont ul.products { grid-template-columns: repeat( var(--archivio-colonne-numero_MB_small), 1fr); 
    	grid-auto-rows: auto; grid-column-gap: calc( var(--archivio-colonne-gap_MB) / 2 ); 
        grid-row-gap: calc( var(--archivio-righe-gap_MB) / 2 ); 
    }
}
@media (min-width: 768px) and (max-width: 991.98px) {
	.pagina-categoria ul.products, 
	.estratto-prodotti ul.products, 
	.archive-box-cont, 
	.up-sells ul.products, 
	.cross-sells ul.products, 
	.mobile .wc-shop-box-cont ul.products { grid-template-columns: repeat( var(--archivio-colonne-numero_MB_medium), 1fr); 
    	grid-auto-rows: auto; grid-column-gap: var(--archivio-colonne-gap_MB); grid-row-gap: var(--archivio-righe-gap_MB); 
	}
}
@media (min-width: 992px) {
	.pagina-categoria ul.products, 
	.estratto-prodotti ul.products, 
	.archive-box-cont, 
	.up-sells ul.products, 
	.mobile .wc-shop-box-cont ul.products { grid-template-columns: repeat( var(--archivio-colonne-numero_MB_large), 1fr); 
    	grid-auto-rows: auto; grid-column-gap: var(--archivio-colonne-gap_MB); grid-row-gap: var(--archivio-righe-gap_MB);
	}
	.cross-sells ul.products { grid-template-columns: repeat( var(--archivio-colonne-numero_MB_small), 1fr); 
    	grid-auto-rows: auto; grid-column-gap: var(--archivio-colonne-gap_MB); grid-row-gap: calc( var(--archivio-righe-gap_MB) /2 );
	}
}