/*
 * Front/back product image hover swap.
 * Replaces JetWooBuilder's broken jet-woo-thumb-with-effect. See
 * inc/product-hover-swap.php for why.
 *
 * SPECIFICITY MATTERS HERE. Elementor ships `.elementor-widget-image img
 * { height: auto }` (0,2,0). A plain `.dbnh-hover-swap__back { height: 100% }`
 * (0,1,0) loses to it, so the back image kept its intrinsic aspect and
 * overflowed the box — measured 2026-09-21 at 416px tall inside a 347px
 * container, which is the "image shifts up on hover" the client reported.
 * It only looked correct while the back image happened to be a square crop in
 * a square box. These selectors are scoped tightly enough to outrank it.
 */

.jet-listing-grid__item.dbnh-hover-swap .elementor-widget-image .elementor-widget-container {
	position: relative;
}

.jet-listing-grid__item.dbnh-hover-swap .elementor-widget-image img.dbnh-hover-swap__back {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
	object-fit: cover;
	object-position: center;
	opacity: 0;
	transition: opacity 0.35s ease;
	pointer-events: none;
}

.jet-listing-grid__item.dbnh-hover-swap:hover .elementor-widget-image img.dbnh-hover-swap__back,
.jet-listing-grid__item.dbnh-hover-swap:focus-within .elementor-widget-image img.dbnh-hover-swap__back {
	opacity: 1;
}

/*
 * Touch devices have no hover, so the back image would never be seen and is
 * pure download weight. Keep it out of the layout entirely there.
 */
@media (hover: none) {
	.jet-listing-grid__item.dbnh-hover-swap .elementor-widget-image img.dbnh-hover-swap__back {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.jet-listing-grid__item.dbnh-hover-swap .elementor-widget-image img.dbnh-hover-swap__back {
		transition: none;
	}
}

/*
 * WooCommerce flexslider's "Previous / Next" gallery nav.
 *
 * Two reasons. ShopEngine's stylesheet used to suppress it and we no longer
 * load that sheet (see the ShopEngine asset-diet mu-plugin), so it reappeared
 * as bulleted text under the gallery thumbnails — a regression from that
 * change, measured 2026-09-21: list-style went none -> disc and the anchors
 * became visible. And it is unwanted anyway: the thumbnails already navigate
 * the gallery.
 */
.woocommerce-product-gallery .flex-direction-nav {
	display: none;
}