/* Galeria da página do produto: [galeria_produto]
 * Todo seletor usa classes próprias com o prefixo "stv-produto",
 * para não interferir no tema nem em outros plugins (e vice-versa).
 */
.stv-produto{
	--stv-accent:#c8102e;      /* vermelho da marca: ajuste se precisar */
	--stv-produto-radius:12px;
	--stv-produto-thumb:76px;
	width:100%;
}
[class^="stv-produto"],[class*=" stv-produto"],
[class^="stv-produto"]::before,[class*=" stv-produto"]::before,
[class^="stv-produto"]::after,[class*=" stv-produto"]::after{box-sizing:border-box}

/* ---------- Palco ---------- */
.stv-produto .stv-produto__stage{
	position:relative;
	width:100%;
	aspect-ratio:1/1;
	background:#fff;
	border-radius:var(--stv-produto-radius);
	overflow:hidden;
	transition:background-color .25s ease;
}
.stv-produto .stv-produto__stage--video{
	aspect-ratio:16/9;          /* vídeo encaixa no topo, sem sobras */
	background:#000;
}
.stv-produto .stv-produto__media{
	position:absolute;inset:0;
	display:flex;align-items:center;justify-content:center;
}
/* Elemento exibido no palco: imagem, <video> ou iframe */
.stv-produto .stv-produto__media-el{
	display:block;width:100%;height:100%;max-width:none;margin:0;padding:0;
	border:0;border-radius:0;box-shadow:none;
	animation:stvProdutoFade .25s ease;
}
.stv-produto .stv-produto__media-el--image{object-fit:contain}
.stv-produto .stv-produto__media-el--video{background:#000}
@keyframes stvProdutoFade{from{opacity:0}to{opacity:1}}

/* ---------- Setas ---------- */
.stv-produto button.stv-produto__nav{
	appearance:none;-webkit-appearance:none;
	position:absolute;top:50%;z-index:2;
	width:40px;height:40px;min-height:0;margin:0;padding:0;
	display:flex;align-items:center;justify-content:center;
	border:0;border-radius:50%;
	background:rgba(255,255,255,.95);color:#1a1a1a;
	box-shadow:0 2px 10px rgba(0,0,0,.18);
	cursor:pointer;line-height:0;font-size:0;
	opacity:0;transform:translateY(-50%) scale(.9);
	transition:opacity .2s ease,transform .2s ease,background-color .2s ease;
}
.stv-produto button.stv-produto__nav--prev{left:12px}
.stv-produto button.stv-produto__nav--next{right:12px}
.stv-produto .stv-produto__nav-icon{
	display:block;width:18px;height:18px;
	fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;
}
.stv-produto .stv-produto__stage:hover .stv-produto__nav,
.stv-produto .stv-produto__stage--hover .stv-produto__nav,
.stv-produto button.stv-produto__nav:focus-visible{opacity:1;transform:translateY(-50%) scale(1)}
.stv-produto button.stv-produto__nav:hover,
.stv-produto button.stv-produto__nav:focus{background:#fff;color:var(--stv-accent)}
@media (hover:none){
	.stv-produto button.stv-produto__nav{opacity:1;transform:translateY(-50%) scale(1);width:34px;height:34px}
}

/* ---------- Contador ---------- */
.stv-produto .stv-produto__count{
	position:absolute;right:12px;bottom:12px;z-index:2;
	padding:4px 10px;border-radius:999px;
	background:rgba(0,0,0,.6);color:#fff;
	font-size:12px;line-height:1.2;font-weight:600;letter-spacing:.02em;
	pointer-events:none;
}
.stv-produto .stv-produto__count-cur{display:inline;font:inherit;color:inherit}

/* No modo vídeo: setas aparecem no hover (como na imagem),
   e o contador sai para não cobrir o botão de tela cheia do player */
.stv-produto .stv-produto__stage--video .stv-produto__nav{background:rgba(255,255,255,.88)}
.stv-produto .stv-produto__stage--video .stv-produto__count{display:none}

/* ---------- Miniaturas ---------- */
.stv-produto .stv-produto__thumbs{
	position:relative;
	display:flex;gap:10px;
	margin-top:12px;padding:3px;
	overflow-x:auto;overscroll-behavior-x:contain;
	scroll-snap-type:x proximity;
	scrollbar-width:none;
}
.stv-produto .stv-produto__thumbs::-webkit-scrollbar{display:none}

.stv-produto button.stv-produto__thumb{
	appearance:none;-webkit-appearance:none;
	position:relative;flex:0 0 var(--stv-produto-thumb);
	width:var(--stv-produto-thumb);height:var(--stv-produto-thumb);min-height:0;
	margin:0;padding:0;
	border:2px solid #e3e3e3;border-radius:10px;
	background:#fff;box-shadow:none;
	overflow:hidden;cursor:pointer;
	line-height:0;font-size:0;text-transform:none;
	opacity:.6;scroll-snap-align:start;
	transition:opacity .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.stv-produto button.stv-produto__thumb:hover,
.stv-produto button.stv-produto__thumb:focus{
	opacity:1;background:#fff;border-color:#bdbdbd;box-shadow:none;
}
.stv-produto button.stv-produto__thumb--active,
.stv-produto button.stv-produto__thumb--active:hover,
.stv-produto button.stv-produto__thumb--active:focus{
	opacity:1;
	border-color:var(--stv-accent);
	box-shadow:0 0 0 2px var(--stv-accent);
}
.stv-produto button.stv-produto__thumb:focus-visible{outline:2px solid var(--stv-accent);outline-offset:3px}

.stv-produto .stv-produto__thumb-media{
	display:block;width:100%;height:100%;max-width:none;margin:0;padding:0;
	border:0;border-radius:0;box-shadow:none;
	object-fit:cover;pointer-events:none;
}
.stv-produto .stv-produto__thumb--image .stv-produto__thumb-media{object-fit:contain;padding:4px}
.stv-produto .stv-produto__thumb--video{background:#1c1c1c}

/* Selo de "play" */
.stv-produto .stv-produto__play{
	position:absolute;inset:0;
	display:flex;align-items:center;justify-content:center;
	background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.45));
	pointer-events:none;
}
.stv-produto .stv-produto__play-dot{
	width:28px;height:28px;border-radius:50%;
	display:flex;align-items:center;justify-content:center;
	background:rgba(255,255,255,.95);
	box-shadow:0 2px 8px rgba(0,0,0,.35);
}
.stv-produto .stv-produto__play-icon{display:block;width:11px;height:11px;margin-left:2px;fill:#1a1a1a}
.stv-produto .stv-produto__thumb--active .stv-produto__play-dot{background:var(--stv-accent)}
.stv-produto .stv-produto__thumb--active .stv-produto__play-icon{fill:#fff}

@media (max-width:767px){
	.stv-produto{--stv-produto-thumb:62px;--stv-produto-radius:10px}
	.stv-produto .stv-produto__thumbs{gap:8px;margin-top:10px}
}