/**
 * Prodotti — solo ciò che WooCommerce e Bootstrap non danno già.
 *
 * Le schede sono quelle del tema: qui non si ridisegna niente, si sistema la
 * disposizione e si tolgono gli avanzi dell'elenco di WooCommerce.
 */

.ns-prodotti-griglia {
	display: grid;
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 768px) {
	.ns-prodotti-griglia.columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.ns-prodotti-griglia.columns-4,
	.ns-prodotti-griglia.columns-5,
	.ns-prodotti-griglia.columns-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 1200px) {
	.ns-prodotti-griglia.columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.ns-prodotti-griglia.columns-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
	.ns-prodotti-griglia.columns-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

/* La scheda del tema viene inserita nuda, senza il wrapper di colonna di
   content-product.php: le colonne le decide il grid qui sopra, cosi' il campo
   «Colonne» del pannello significa davvero qualcosa. */
.ns-prodotti-griglia > * { min-width: 0; }

/* .swiper in coda: swiper-bundle.css azzera il padding con la stessa specificita'
   e carica dopo di noi, quindi vince l'ordine. Con due classi (0,2,0) la regola
   tiene comunque, senza dipendere da chi viene messo in coda per primo. */
.ns-prodotti-swiper.swiper {
	position: relative;
	padding-bottom: 40px;   /* spazio per i pallini, che stanno sotto e non sopra */
}

.ns-prodotti-swiper .swiper-slide { height: auto; }
.ns-prodotti-swiper .swiper-slide > * { height: 100%; }

.ns-prodotti-swiper > .swiper-button-prev,
.ns-prodotti-swiper > .swiper-button-next {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #fff;
	color: inherit;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .14);
}

.ns-prodotti-swiper > .swiper-button-prev::after,
.ns-prodotti-swiper > .swiper-button-next::after {
	font-size: 15px;
	font-weight: 700;
}

/* Con pochi prodotti Swiper spegne lo scorrimento: le frecce resterebbero visibili
   e inerti, ed e' peggio che non averle. */
.ns-prodotti-swiper.swiper-lock-free .swiper-button-prev,
.ns-prodotti-swiper.swiper-lock-free .swiper-button-next,
.ns-prodotti-swiper .swiper-button-disabled { opacity: 0; pointer-events: none; }

/* Avvisi di configurazione: li vede solo chi puo' rimediare. */
.ns-prodotti-avviso {
	padding: 12px 16px;
	border: 1px dashed currentColor;
	border-radius: 8px;
	opacity: .75;
	font-size: 14px;
}

@media (prefers-reduced-motion: reduce) {
	.ns-prodotti-swiper .swiper-wrapper { transition-duration: 1ms !important; }
}