/* HP Product Gallery Video v2.0.0 */

.hpvg-main-stage {
	position: relative !important;
}


/*
 * Hide only Reno's explicit SPSwiper navigation controls. This remains scoped
 * to the product gallery and never matches slide-state classes such as
 * spswiper-slide-prev / spswiper-slide-next.
 */
body.hp-product-has-video #wpgs-gallery .wcgs-spswiper-button-prev,
body.hp-product-has-video #wpgs-gallery .wcgs-spswiper-button-next,
body.hp-product-has-video #wpgs-gallery .wcgs-spswiper-arrow,
body.hp-product-has-video #wpgs-gallery .swiper-button-prev,
body.hp-product-has-video #wpgs-gallery .swiper-button-next,
body.hp-product-has-video #wpgs-gallery .slick-prev,
body.hp-product-has-video #wpgs-gallery .slick-next,
body.hp-product-has-video #wpgs-gallery .wcgs-prev,
body.hp-product-has-video #wpgs-gallery .wcgs-next,
body.hp-product-has-video #wpgs-gallery .wcgs-swiper-button-prev,
body.hp-product-has-video #wpgs-gallery .wcgs-swiper-button-next,
body.hp-product-has-video #wpgs-gallery [class*="swiper-button-prev"],
body.hp-product-has-video #wpgs-gallery [class*="swiper-button-next"],
body.hp-product-has-video .wcgs-woocommerce-product-gallery .swiper-button-prev,
body.hp-product-has-video .wcgs-woocommerce-product-gallery .swiper-button-next,
body.hp-product-has-video .wcgs-woocommerce-product-gallery .slick-prev,
body.hp-product-has-video .wcgs-woocommerce-product-gallery .slick-next,
body.hp-product-has-video .woocommerce-product-gallery .swiper-button-prev,
body.hp-product-has-video .woocommerce-product-gallery .swiper-button-next,
body.hp-product-has-video .woocommerce-product-gallery .slick-prev,
body.hp-product-has-video .woocommerce-product-gallery .slick-next {
	display: none !important;
	visibility: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
	width: 0 !important;
	height: 0 !important;
	min-width: 0 !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
}

/* Remove Reno pseudo-element chevrons/circles that can survive as ghosts. */
body.hp-product-has-video #wpgs-gallery .wcgs-spswiper-button-prev::before,
body.hp-product-has-video #wpgs-gallery .wcgs-spswiper-button-prev::after,
body.hp-product-has-video #wpgs-gallery .wcgs-spswiper-button-next::before,
body.hp-product-has-video #wpgs-gallery .wcgs-spswiper-button-next::after,
body.hp-product-has-video #wpgs-gallery .swiper-button-prev::before,
body.hp-product-has-video #wpgs-gallery .swiper-button-prev::after,
body.hp-product-has-video #wpgs-gallery .swiper-button-next::before,
body.hp-product-has-video #wpgs-gallery .swiper-button-next::after,
body.hp-product-has-video #wpgs-gallery .slick-prev::before,
body.hp-product-has-video #wpgs-gallery .slick-prev::after,
body.hp-product-has-video #wpgs-gallery .slick-next::before,
body.hp-product-has-video #wpgs-gallery .slick-next::after,
body.hp-product-has-video .wcgs-woocommerce-product-gallery .wcgs-prev::before,
body.hp-product-has-video .wcgs-woocommerce-product-gallery .wcgs-prev::after,
body.hp-product-has-video .wcgs-woocommerce-product-gallery .wcgs-next::before,
body.hp-product-has-video .wcgs-woocommerce-product-gallery .wcgs-next::after {
	content: none !important;
	display: none !important;
	visibility: hidden !important;
	opacity: 0 !important;
}

/*
 * Reno owns one active thumbnail state for photos and video.
 */
body.hp-product-has-video #wpgs-gallery .wcgs-thumb {
	position: relative !important;
	box-sizing: border-box !important;
	border-radius: 10px !important;
}

body.hp-product-has-video #wpgs-gallery .wcgs-thumb.spswiper-slide-thumb-active {
	outline: 2px solid #0cc8bd !important;
	outline-offset: -2px !important;
	border-radius: 10px !important;
}

body.hp-product-has-video #wpgs-gallery .wcgs-thumb:not(.spswiper-slide-thumb-active) {
	outline: 0 !important;
}

/* NAVIGATION ARROWS */
.hpvg-gallery-arrow {
	position: absolute !important;
	z-index: 10020 !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 42px !important;
	height: 42px !important;
	padding: 0 !important;
	margin: 0 !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: rgba(255,255,255,.94) !important;
	color: #3d4151 !important;
	box-shadow: 0 3px 14px rgba(61,65,81,.16) !important;
	font-size: 25px !important;
	font-family: Arial, sans-serif !important;
	line-height: 1 !important;
	cursor: pointer !important;
	opacity: .96 !important;
	transition: transform .16s ease, box-shadow .16s ease !important;
}

.hpvg-gallery-arrow:hover {
	transform: translateY(-50%) scale(1.05) !important;
	box-shadow: 0 4px 18px rgba(61,65,81,.22) !important;
}

.hpvg-gallery-arrow-prev { left: 12px !important; }
.hpvg-gallery-arrow-next { right: 12px !important; }

/* A one-photo product still shows the now two-item Reno thumbnail row. */
body.hp-product-has-video #wpgs-gallery.hpvg-gallery-ready .gallery-navigation-carousel-wrapper {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
}

/* Video is a real Reno thumbnail slide. */
.hpvg-video-thumb-slot {
	box-sizing: border-box !important;
	flex-grow: 0 !important;
	flex-shrink: 0 !important;
	overflow: hidden !important;
	aspect-ratio: 1 / 1 !important;
}

.hpvg-video-thumb-slot > .hpvg-video-tile {
	width: 100% !important;
	height: 100% !important;
	min-width: 0 !important;
	max-width: 100% !important;
}

/* Video thumbnail */
.hpvg-video-tile {
	display: block !important;
	box-sizing: border-box !important;
	width: 92px !important;
	height: 92px !important;
	min-width: 92px !important;
	padding: 0 !important;
	margin: 0 !important;
	border: 2px solid transparent !important;
	border-radius: 10px !important;
	background: #fff !important;
	box-shadow: none !important;
	cursor: pointer !important;
	overflow: hidden !important;
	appearance: none !important;
	-webkit-appearance: none !important;
	line-height: 0 !important;
}

.hpvg-video-tile:hover,
.hpvg-video-tile:focus-visible,
.hpvg-video-thumb-slot.spswiper-slide-thumb-active .hpvg-video-tile {
	border-color: #0cc8bd !important;
	outline: none !important;
}

.hpvg-video-thumb-preview {
	position: relative !important;
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	overflow: hidden !important;
	background: #f4f4f4 !important;
}

.hpvg-video-thumb-media {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	min-width: 0 !important;
	min-height: 0 !important;
	max-width: none !important;
	max-height: none !important;
	object-fit: cover !important;
	pointer-events: none !important;
	background: #f4f4f4 !important;
}

.hpvg-thumb-play {
	position: absolute !important;
	left: 50% !important;
	top: 50% !important;
	transform: translate(-50%, -50%) !important;
	width: 34px !important;
	height: 34px !important;
	border-radius: 999px !important;
	background: rgba(12,200,189,.96) !important;
	box-shadow: 0 2px 8px rgba(0,0,0,.16) !important;
}

.hpvg-thumb-play::after {
	content: "" !important;
	position: absolute !important;
	left: 55% !important;
	top: 50% !important;
	transform: translate(-50%, -50%) !important;
	width: 0 !important;
	height: 0 !important;
	border-top: 6px solid transparent !important;
	border-bottom: 6px solid transparent !important;
	border-left: 9px solid #fff !important;
}

/* Video is a real main SPSwiper slide. */
.hpvg-video-slide {
	height: 100% !important;
	background: #fff !important;
}

.hpvg-video-stage {
	width: 100% !important;
	height: 100% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: #fff !important;
}

.hpvg-video {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain !important;
	background: #fff !important;
}

/* HP "Proizvod nije igračka" badge */
.hp-not-toy-badge-row {
	display: flex !important;
	align-items: center !important;
	margin: 12px 0 16px !important;
}

.hp-not-toy-badge {
	display: inline-flex !important;
	align-items: center !important;
	gap: 7px !important;
	min-height: 34px !important;
	padding: 7px 13px 7px 9px !important;
	border: 1px solid rgba(240,200,75,.72) !important;
	border-radius: 999px !important;
	background: #fff8d9 !important;
	color: #3d4151 !important;
	box-shadow: 0 3px 10px rgba(61,65,81,.05) !important;
	font-family: "Quicksand", sans-serif !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
}

.hp-not-toy-badge-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 20px !important;
	height: 20px !important;
	flex: 0 0 20px !important;
	border-radius: 999px !important;
	background: #f0c84b !important;
	color: #3d4151 !important;
	font-size: 12px !important;
	font-weight: 800 !important;
}

@media (max-width: 767px) {
	.hpvg-gallery-arrow {
		width: 38px !important;
		height: 38px !important;
		font-size: 22px !important;
	}

	.hpvg-gallery-arrow-prev { left: 8px !important; }
	.hpvg-gallery-arrow-next { right: 8px !important; }

	.hpvg-thumb-play {
		width: 30px !important;
		height: 30px !important;
	}
}