/* ---------- Shortcode player ---------- */
.ipt-wcgv {
	--ipt-wcgv-ratio: 1 / 1;
	--ipt-wcgv-fit: cover;
	--ipt-wcgv-bg: #f2f2f2;
	--ipt-wcgv-gap: 10px;
	--ipt-wcgv-thumb: 72px;
	--ipt-wcgv-accent: currentColor;
	max-width: 100%;
}

.ipt-wcgv .ipt-wcgv__stage {
	position: relative;
}

.ipt-wcgv .ipt-wcgv__track {
	position: relative;
	display: flex;
	aspect-ratio: var(--ipt-wcgv-ratio);
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	outline-offset: 2px;
}

.ipt-wcgv .ipt-wcgv__track::-webkit-scrollbar {
	display: none;
}

.ipt-wcgv .ipt-wcgv__slide {
	position: relative;
	flex: 0 0 100%;
	min-width: 0;
	overflow: hidden;
	scroll-snap-align: start;
	scroll-snap-stop: always;
	background: var(--ipt-wcgv-bg);
}

.ipt-wcgv .ipt-wcgv__slide > img,
.ipt-wcgv .ipt-wcgv__slide > .ipt-wcgv-video,
.ipt-wcgv .ipt-wcgv__slide > .ipt-wcgv-yt {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	margin: 0;
}

.ipt-wcgv .ipt-wcgv__slide > img,
.ipt-wcgv .ipt-wcgv__slide > .ipt-wcgv-video {
	object-fit: var(--ipt-wcgv-fit);
}

/* Arrows */
.ipt-wcgv .ipt-wcgv__arrow {
	position: absolute;
	top: 50%;
	z-index: 2;
	width: 40px;
	height: 40px;
	min-width: 0;
	margin: -20px 0 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.9);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
	color: #111;
	line-height: 1;
	cursor: pointer;
	appearance: none;
	transition: opacity 0.2s;
}

.ipt-wcgv .ipt-wcgv__arrow--prev {
	left: 10px;
}

.ipt-wcgv .ipt-wcgv__arrow--next {
	right: 10px;
}

.ipt-wcgv .ipt-wcgv__arrow::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 9px;
	height: 9px;
	border: solid currentColor;
	border-width: 2px 2px 0 0;
	transform: translate(-70%, -50%) rotate(45deg);
}

.ipt-wcgv .ipt-wcgv__arrow--prev::before {
	transform: translate(-30%, -50%) rotate(-135deg);
}

.ipt-wcgv .ipt-wcgv__arrow[disabled] {
	opacity: 0;
	pointer-events: none;
}

/* Thumbnails */
.ipt-wcgv .ipt-wcgv__thumbs {
	position: relative;
	display: flex;
	gap: var(--ipt-wcgv-gap);
	margin-top: var(--ipt-wcgv-gap);
	padding: 2px;
	overflow-x: auto;
	scrollbar-width: thin;
}

.ipt-wcgv .ipt-wcgv__thumb {
	position: relative;
	flex: 0 0 var(--ipt-wcgv-thumb);
	width: var(--ipt-wcgv-thumb);
	height: var(--ipt-wcgv-thumb);
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: var(--ipt-wcgv-bg);
	box-shadow: none;
	overflow: hidden;
	opacity: 0.6;
	cursor: pointer;
	appearance: none;
	transition: opacity 0.2s;
}

.ipt-wcgv .ipt-wcgv__thumb:hover,
.ipt-wcgv .ipt-wcgv__thumb.is-active {
	opacity: 1;
}

.ipt-wcgv .ipt-wcgv__thumb.is-active {
	outline: 2px solid var(--ipt-wcgv-accent);
	outline-offset: 0;
}

.ipt-wcgv .ipt-wcgv__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
}

/* Play badge on video thumbnails */
.ipt-wcgv .ipt-wcgv__thumb--video::before,
.ipt-wcgv .ipt-wcgv__thumb--youtube::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 1;
	width: 26px;
	height: 26px;
	margin: -13px 0 0 -13px;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.65);
}

.ipt-wcgv .ipt-wcgv__thumb--video::after,
.ipt-wcgv .ipt-wcgv__thumb--youtube::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 1;
	margin: -6px 0 0 -3px;
	border-style: solid;
	border-width: 6px 0 6px 9px;
	border-color: transparent transparent transparent #fff;
}

/* ---------- YouTube (shortcode player and default gallery) ---------- */
.ipt-wcgv-yt {
	position: relative;
	background: #000;
}

.ipt-wcgv-yt .ipt-wcgv-yt__poster,
.ipt-wcgv-yt iframe {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	border: 0;
}

.ipt-wcgv-yt .ipt-wcgv-yt__poster {
	object-fit: cover;
}

.ipt-wcgv-yt .ipt-wcgv-yt__play {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 68px;
	height: 48px;
	min-width: 0;
	margin: -24px 0 0 -34px;
	padding: 0;
	border: 0;
	border-radius: 12px;
	background: rgba(0, 0, 0, 0.75);
	box-shadow: none;
	cursor: pointer;
	appearance: none;
}

.ipt-wcgv-yt .ipt-wcgv-yt__play::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -10px 0 0 -7px;
	border-style: solid;
	border-width: 10px 0 10px 17px;
	border-color: transparent transparent transparent #fff;
}

.ipt-wcgv-yt.is-loaded .ipt-wcgv-yt__poster,
.ipt-wcgv-yt.is-loaded .ipt-wcgv-yt__play {
	display: none;
}

/* ---------- Default WooCommerce gallery ---------- */
.woocommerce-product-gallery .ipt-wcgv-native .ipt-wcgv-video {
	display: block;
	width: 100%;
	height: auto;
	background: #000;
}

.woocommerce-product-gallery .ipt-wcgv-native .ipt-wcgv-yt {
	aspect-ratio: 16 / 9;
}