/**
 * Rotitoo PDP Gallery — mobile-only native gallery
 */

@media (max-width: 1024px) {
	body.rotitoo-app-shell.single-product.rotitoo-pdp-native-gallery .woocommerce-product-gallery {
		position: absolute !important;
		width: 1px !important;
		height: 1px !important;
		padding: 0 !important;
		margin: -1px !important;
		overflow: hidden !important;
		clip: rect(0, 0, 0, 0) !important;
		white-space: nowrap !important;
		border: 0 !important;
		pointer-events: none !important;
	}

	body.rotitoo-app-shell.single-product .rotitoo-pdp-gallery-mount {
		width: 100%;
		margin: 0;
	}

	.rotitoo-pdp-gallery {
		position: relative;
		display: flex;
		flex-direction: column;
		gap: 4px;
		background: #ffffff;
		overflow: hidden;
	}

	.rotitoo-pdp-gallery__counter {
		position: absolute;
		top: 12px;
		inset-inline-end: 12px;
		z-index: 3;
		padding: 5px 11px;
		border-radius: 999px;
		font-size: 0.72rem;
		font-weight: 600;
		color: #1e1814;
		background: rgba(255, 255, 255, 0.92);
		backdrop-filter: blur(8px);
		-webkit-backdrop-filter: blur(8px);
		box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
		line-height: 1;
		pointer-events: none;
	}

	.rotitoo-pdp-gallery__track {
		display: flex;
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	body.rotitoo-app-shell.single-product:not(.rotitoo-pdp-app) .rotitoo-pdp-gallery__track {
		aspect-ratio: 4 / 5;
		height: auto;
		min-height: unset;
		max-height: min(42dvh, 380px);
	}

	.rotitoo-pdp-gallery__slide img {
		width: auto;
		height: auto;
		max-width: 100%;
		max-height: min(42dvh, 380px);
		object-fit: contain;
		object-position: center;
		display: block;
		margin: 0 auto;
		user-select: none;
		-webkit-user-drag: none;
		transform: none !important;
		transition: none !important;
	}

	body.rotitoo-app-shell.single-product:not(.rotitoo-pdp-app) .rotitoo-pdp-gallery__slide img {
		max-height: min(42dvh, 380px);
	}

	.rotitoo-pdp-gallery__track::-webkit-scrollbar {
		display: none;
	}

	.rotitoo-pdp-gallery__slide {
		flex: 0 0 100%;
		width: 100%;
		scroll-snap-align: start;
		scroll-snap-stop: always;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.rotitoo-pdp-gallery__zoom {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		padding: 0;
		border: none;
		background: transparent;
		cursor: zoom-in;
	}

	.rotitoo-pdp-gallery__dots {
		position: absolute;
		bottom: 12px;
		left: 50%;
		transform: translateX(-50%);
		display: flex;
		gap: 5px;
		padding: 5px 9px;
		border-radius: 999px;
		background: rgba(255, 255, 255, 0.8);
		backdrop-filter: blur(6px);
		-webkit-backdrop-filter: blur(6px);
		z-index: 2;
	}

	.rotitoo-pdp-gallery__dot {
		width: 6px;
		height: 6px;
		border-radius: 50%;
		background: #1e1814;
		opacity: 0.28;
		transition: opacity 0.2s ease, width 0.2s ease;
	}

	.rotitoo-pdp-gallery__dot.is-active {
		opacity: 1;
		width: 16px;
		border-radius: 999px;
	}

	.rotitoo-pdp-gallery__thumbs {
		display: flex;
		gap: 8px;
		padding: 4px 14px 14px;
		margin-top: 2px;
		overflow-x: auto;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
		background: #ffffff;
		border-top: 1px solid rgba(215, 185, 165, 0.28);
	}

	.rotitoo-pdp-gallery__thumbs::-webkit-scrollbar {
		display: none;
	}

	.rotitoo-pdp-gallery__thumb {
		flex: 0 0 52px;
		width: 52px;
		height: 52px;
		padding: 0;
		border: 2px solid transparent;
		border-radius: 10px;
		overflow: hidden;
		background: #fff;
		cursor: pointer;
		transition: border-color 0.2s ease;
	}

	.rotitoo-pdp-gallery__thumb.is-active {
		border-color: #1e1814;
	}

	.rotitoo-pdp-gallery__thumb img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}

}