/* Rang Product Image Flipper 1.2.2 */

.woocommerce ul.products li.product .rang-flipper-wrap,
.woocommerce-page ul.products li.product .rang-flipper-wrap {
	position: relative;
	display: block;
	overflow: hidden;
}

.woocommerce ul.products li.product .rang-flipper-wrap > img,
.woocommerce-page ul.products li.product .rang-flipper-wrap > img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
}

.woocommerce ul.products li.product .rang-flipper-hover-image,
.woocommerce-page ul.products li.product .rang-flipper-hover-image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity .28s ease;
	z-index: 2;
}

@media (hover: hover) and (pointer: fine) {
	.woocommerce ul.products li.product:hover .rang-flipper-hover-image,
	.woocommerce-page ul.products li.product:hover .rang-flipper-hover-image {
		opacity: 1;
	}
}

.single-product .woocommerce-product-gallery {
	position: relative;
	touch-action: pan-y pinch-zoom;
}

.rang-gallery-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 30;
	width: 44px;
	height: 44px;
	border: 0;
	border-radius: 50%;
	background: rgba(255,255,255,.94);
	box-shadow: 0 2px 10px rgba(0,0,0,.16);
	font-size: 30px;
	line-height: 40px;
	text-align: center;
	cursor: pointer;
	opacity: 0;
	transition: opacity .2s ease, transform .2s ease;
	padding: 0;
	color: #222;
}

.rang-gallery-arrow:hover {
	transform: translateY(-50%) scale(1.05);
}

.rang-gallery-prev { left: 14px; }
.rang-gallery-next { right: 14px; }

@media (hover: hover) and (pointer: fine) {
	.single-product .woocommerce-product-gallery:hover .rang-gallery-arrow {
		opacity: 1;
	}
}

@media (hover: none), (pointer: coarse) {
	.rang-gallery-arrow {
		display: none !important;
	}
}