/**
 * Niche Beverly — single product gallery.
 *
 * Woodmart only sets `width: 100%` on gallery images, so every slide inherits
 * its source image's aspect ratio and the slider jumps height between slides.
 * Lock every slide to one ratio and letterbox the image inside it (contain,
 * centered both ways) so nothing is cropped.
 */

.woocommerce-product-gallery {
	--nb-gallery-ratio: 3 / 4;
	--nb-thumb-ratio: 1 / 1;
	--nb-gallery-bg: #fff;
}

/* ---------- Main slides ---------- */

.woocommerce-product-gallery .wd-gallery-images .woocommerce-product-gallery__image {
	display: block;
	width: 100%;
	aspect-ratio: var(--nb-gallery-ratio);
	background-color: var(--nb-gallery-bg);
}

.woocommerce-product-gallery .wd-gallery-images .woocommerce-product-gallery__image > a {
	display: block;
	width: 100%;
	height: 100%;
}

.woocommerce-product-gallery .wd-gallery-images .woocommerce-product-gallery__image img:not(.zoomImg) {
	width: 100% !important;
	height: 100% !important;
	max-height: none;
	object-fit: contain !important;
	object-position: center center;
}

/* Carousel items must not fight the figure's ratio for height. */
.woocommerce-product-gallery .wd-gallery-images .wd-carousel-item {
	align-self: flex-start;
}

/* ---------- Thumbnails ---------- */

.woocommerce-product-gallery .wd-gallery-thumb .wd-carousel-item img {
	width: 100%;
	height: 100%;
	aspect-ratio: var(--nb-thumb-ratio);
	object-fit: contain;
	object-position: center center;
	background-color: var(--nb-gallery-bg);
}