/**
 * Carrusel automático de la galería en productos variables.
 *
 * Sólo se encola en las fichas que califican —producto variable con imágenes
 * distintas por variación—; en el resto no se carga nada.
 *
 * Acá está únicamente el fundido. La rotación, la pausa por hover y el freno
 * los maneja `galeria.js`; el marcado de la galería no se toca.
 */

.woocommerce-product-gallery__image img {
	transition: opacity 220ms ease;
}

/* La clase la pone y la saca el JS justo antes y después de cambiar el src. */
.hbg-galeria--cambiando .woocommerce-product-gallery__image img {
	opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
	.woocommerce-product-gallery__image img {
		transition: none;
	}

	.hbg-galeria--cambiando .woocommerce-product-gallery__image img {
		opacity: 1;
	}
}