/* ============================================================
   PÁGINA DE PRODUTO V8 — ficha de alta conversão (área "Página
   de produto"). Prefixo v8sf-p-* · mobile-first · desktop 2 col.
   ============================================================ */

.v8sf-product-page {
	max-width: 1080px !important;
	margin: 0 auto !important;
	padding: 10px 10px 96px !important;
}

@media (min-width: 769px) {
	.v8sf-product-page {
		padding: 18px 16px 64px !important;
	}
}

/* ── Voltar à loja ── */
.v8sf-p-back {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	margin-bottom: 14px !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	color: var(--text-muted, #6b7280) !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

.v8sf-p-back:hover {
	color: var(--brand, #10b981) !important;
}

/* ── Layout ── */
.v8sf-p-layout {
	display: flex !important;
	flex-direction: column !important;
	gap: 18px !important;
}

@media (min-width: 769px) {
	.v8sf-p-layout {
		flex-direction: row !important;
		align-items: flex-start !important;
		gap: 32px !important;
	}
	.v8sf-p-media {
		flex: 0 0 48% !important;
		width: 48% !important;
	}
	.v8sf-p-info {
		flex: 1 1 auto !important;
		min-width: 0 !important;
	}
}

/* ── Galeria ── */
.v8sf-p-stage {
	position: relative !important;
	width: 100% !important;
	border-radius: 10px !important;
	overflow: hidden !important;
	/* Fundo skeleton da foto (mesmo do card da home). */
	background: #fafafa !important;
}

/* ── Moldura da foto (padrão EXATO do card da home): cartão branco
   com a foto interna de raio 10px. ── */
.v8sf-p-media {
	background: var(--surface, #ffffff) !important;
	border: 1px solid var(--border, #e5e7eb) !important;
	border-radius: 14px !important;
	padding: 12px !important;
	box-shadow: 0 14px 28px -10px rgba(0, 0, 0, 0.18) !important;
}

.v8sf-p-stage-img {
	/* SEM CROP: a foto aparece em altura/largura originais (proporção
	   natural do arquivo). Sem aspect-ratio nem object-fit: cover. */
	display: none !important;
	width: 100% !important;
	height: auto !important;
	border-radius: 10px !important;
}

.v8sf-p-stage-img.is-active {
	display: block !important;
}

.v8sf-p-counter {
	position: absolute !important;
	top: 12px !important;
	left: 12px !important;
	z-index: 2 !important;
	padding: 4px 10px !important;
	border-radius: 999px !important;
	background: rgba(17, 24, 39, 0.55) !important;
	color: #ffffff !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	backdrop-filter: blur(2px) !important;
	-webkit-backdrop-filter: blur(2px) !important;
}

.v8sf-p-sale-badge {
	position: absolute !important;
	top: 12px !important;
	right: 12px !important;
	z-index: 2 !important;
	padding: 4px 10px !important;
	border-radius: 999px !important;
	background: #ef4444 !important;
	color: #ffffff !important;
	font-size: 12px !important;
	font-weight: 800 !important;
}

.v8sf-p-thumbs {
	display: flex !important;
	gap: 8px !important;
	margin-top: 10px !important;
	overflow-x: auto !important;
	scrollbar-width: none !important;
}

.v8sf-p-thumbs::-webkit-scrollbar {
	display: none !important;
}

.v8sf-p-thumb {
	flex: 0 0 64px !important;
	width: 64px !important;
	height: 64px !important;
	padding: 0 !important;
	border: 2px solid var(--border, #e5e7eb) !important;
	border-radius: 12px !important;
	overflow: hidden !important;
	background: #f9fafb !important;
	cursor: pointer !important;
	transition: border-color 0.2s ease !important;
}

.v8sf-p-thumb.is-active {
	border-color: #10b981 !important;
}

.v8sf-p-thumb img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
}

/* ── Card de informações ── */
.v8sf-p-info-card {
	/* BRANCO (var(--surface)) — padrão skeleton do carrinho. */
	background: var(--surface, #ffffff) !important;
	border: 1px solid var(--border, #e5e7eb) !important;
	border-radius: 18px !important;
	padding: 18px 16px !important;
	/* Sombra skeleton (padrão do carrinho) */
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 16px 40px -16px rgba(0, 0, 0, 0.12) !important;
	/* Permite a faixa de contato sangrar nos cantos arredondados */
	overflow: hidden !important;
}

@media (min-width: 769px) {
	.v8sf-p-info-card {
		padding: 26px 26px !important;
	}
}

.v8sf-p-title {
	margin: 0 0 8px !important;
	font-size: 22px !important;
	font-weight: 800 !important;
	line-height: 1.25 !important;
	color: var(--text-main, #111827) !important;
	/* FASE 8 — clamp transversal: títulos longos (ex.: nomes de
	   tênis completos) cortam em até 3 linhas com reticências em vez
	   de esticarem a ficha. */
	display: -webkit-box !important;
	-webkit-box-orient: vertical !important;
	-webkit-line-clamp: 3 !important;
	overflow: hidden !important;
}

@media (min-width: 769px) {
	.v8sf-p-title {
		font-size: 26px !important;
	}
}

/* Avaliação */
.v8sf-p-rating {
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
	margin-bottom: 10px !important;
	text-decoration: none !important;
}

.v8sf-p-stars {
	font-size: 15px !important;
	letter-spacing: 2px !important;
	color: #f59e0b !important;
}

.v8sf-p-rating-text {
	font-size: 13px !important;
	font-weight: 600 !important;
	color: var(--text-muted, #6b7280) !important;
	text-decoration: underline !important;
	text-underline-offset: 2px !important;
}

/* Preço */
.v8sf-p-price {
	margin: 4px 0 14px !important;
	font-size: 24px !important;
	font-weight: 800 !important;
	color: var(--text-main, #111827) !important;
	line-height: 1.2 !important;
}

.v8sf-p-price del {
	color: var(--text-muted, #6b7280) !important;
	font-weight: 500 !important;
	font-size: 16px !important;
	margin-right: 8px !important;
}

.v8sf-p-price ins {
	text-decoration: none !important;
}

/* Descrição curta */
.v8sf-p-short {
	margin-bottom: 16px !important;
	font-size: 14px !important;
	line-height: 1.6 !important;
	color: var(--text-muted, #6b7280) !important;
}

.v8sf-p-short p {
	margin: 0 0 8px !important;
}

.v8sf-p-short p:last-child {
	margin-bottom: 0 !important;
}

/* ── Chips de variação ── */
.v8sf-p-attr {
	margin-bottom: 14px !important;
}

.v8sf-p-attr-label {
	display: block !important;
	margin-bottom: 6px !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.04em !important;
	color: var(--text-muted, #6b7280) !important;
}

.v8sf-p-chips {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
}

.v8sf-p-chip {
	min-width: 42px !important;
	padding: 8px 15px !important;
	border: 1.5px solid var(--border, #e5e7eb) !important;
	border-radius: 999px !important;
	background: #ffffff !important;
	color: var(--text-main, #111827) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	cursor: pointer !important;
	transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease !important;
}

.v8sf-p-chip.is-selected {
	border-color: #10b981 !important;
	background: #10b981 !important;
	color: #ffffff !important;
}

.v8sf-p-chip[data-soldout] {
	opacity: 0.45 !important;
	text-decoration: line-through !important;
	cursor: not-allowed !important;
}

/* Disponibilidade / urgência */
.v8sf-p-avail {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	margin: 4px 0 14px !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	color: var(--success, #059669) !important;
}

.v8sf-p-avail-dot {
	width: 8px !important;
	height: 8px !important;
	border-radius: 50% !important;
	background: var(--success, #10b981) !important;
	flex-shrink: 0 !important;
}

.v8sf-p-avail-dot.is-low {
	background: #f59e0b !important;
	animation: v8sf-p-pulse 1.4s ease-in-out infinite !important;
}

.v8sf-p-avail.is-low {
	color: #b45309 !important;
}

@keyframes v8sf-p-pulse {
	0%, 100% { opacity: 1; }
	50% { opacity: 0.35; }
}

/* ── Área de compra ── */
.v8sf-p-add {
	margin: 16px 0 !important;
}

/* ── Barra de frete grátis (progressiva) ── */
.v8sf-fsg {
	margin: 0 0 16px !important;
	padding: 14px 16px !important;
	background: #f9fafb !important;
	border: 1px solid var(--border, #e5e7eb) !important;
	border-radius: 14px !important;
}
.v8sf-fsg-track {
	width: 100% !important;
	height: 10px !important;
	border-radius: 999px !important;
	background: #e5e7eb !important;
	overflow: hidden !important;
	position: relative !important;
}
.v8sf-fsg-track::before {
	content: '' !important;
	position: absolute !important;
	inset: 0 !important;
	background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.6) 50%, transparent 100%) !important;
	animation: v8sf-fsg-track-shine 2.2s ease-in-out infinite !important;
	transform: translateX(-100%) !important;
}
@keyframes v8sf-fsg-track-shine {
	0% { transform: translateX(-100%); }
	100% { transform: translateX(100%); }
}
.v8sf-fsg-bar {
	/* width SEM !important: o JS define inline e precisa vencê-lo. */
	width: 3%;
	height: 100% !important;
	border-radius: 999px !important;
	background: linear-gradient(90deg, #34d399 0%, #10b981 50%, #059669 100%) !important;
	position: relative !important;
	transition: width 0.7s cubic-bezier(0.16, 1, 0.3, 1) !important;
	overflow: hidden !important;
	/* Pulso sutil na barra enquanto progride (dá sensação de vida) */
	animation: v8sf-fsg-breathe 2s ease-in-out infinite !important;
}
/* Brilho animado (preload) enquanto falta atingir a meta */
.v8sf-fsg-bar::after {
	content: '' !important;
	position: absolute !important;
	inset: 0 !important;
	background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.7) 50%, transparent 100%) !important;
	animation: v8sf-fsg-shine 1s ease-in-out infinite !important;
	transform: translateX(-100%) !important;
}
@keyframes v8sf-fsg-breathe {
	0%, 100% { filter: brightness(1); }
	50% { filter: brightness(1.12); }
}
@keyframes v8sf-fsg-shine {
	0% { transform: translateX(-100%); }
	100% { transform: translateX(100%); }
}
.v8sf-fsg.is-done .v8sf-fsg-bar::after {
	display: none !important;
}
.v8sf-fsg.is-done .v8sf-fsg-bar {
	animation: v8sf-fsg-done-pulse 0.8s ease-in-out 3 !important;
}
@keyframes v8sf-fsg-done-pulse {
	0%, 100% { filter: brightness(1); }
	50% { filter: brightness(1.4); }
}
.v8sf-fsg-msg {
	margin: 10px 0 0 !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	line-height: 1.4 !important;
	color: var(--text-main, #111827) !important;
	text-align: center !important;
}
.v8sf-fsg.is-done .v8sf-fsg-msg {
	color: var(--success-dark, #059669) !important;
}
/* Sem itens no carrinho: só o texto, sem a barra/track */
.v8sf-fsg.is-empty .v8sf-fsg-track {
	display: none !important;
}
.v8sf-fsg.is-empty .v8sf-fsg-msg {
	margin-top: 0 !important;
}

.v8sf-p-add-btn {
	width: 100% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	padding: 20px 24px !important;
	border: none !important;
	border-radius: 14px !important;
	background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
	color: #ffffff !important;
	font-size: 17px !important;
	font-weight: 900 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	cursor: pointer !important;
	box-shadow: 0 8px 25px -5px rgba(16, 185, 129, 0.5) !important;
	position: relative !important;
	overflow: hidden !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease !important;
	font-family: inherit !important;
}

.v8sf-p-add-btn:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 12px 30px -5px rgba(16, 185, 129, 0.6) !important;
	color: #ffffff !important;
}

.v8sf-p-add-btn:disabled {
	background: var(--border, #e5e7eb) !important;
	box-shadow: none !important;
	color: var(--text-muted, #6b7280) !important;
	cursor: not-allowed !important;
	transform: none !important;
}

.v8sf-p-add-btn::after {
	content: '' !important;
	position: absolute !important;
	top: 0 !important;
	left: -100% !important;
	width: 50% !important;
	height: 100% !important;
	background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0) 100%) !important;
	transform: skewX(-20deg) !important;
	animation: v8sf-p-btn-shine 1.8s ease-in-out infinite !important;
	pointer-events: none !important;
}

.v8sf-p-add-btn:disabled::after {
	display: none !important;
}

@keyframes v8sf-p-btn-shine {
	0% { left: -100%; }
	100% { left: 200%; }
}

/* Efeito "carregando..." no rótulo (mesmo padrão do Quick View):
   as 3 reticências pulsando — o usuário VÊ que está processando. */
.v8sf-p-add-btn.is-loading {
	pointer-events: none !important;
	opacity: 0.8 !important;
}

.v8sf-p-add-btn.is-loading [data-v8sf-p-add-label]::after {
	content: '';
	display: inline-block !important;
	width: 18px !important;
	text-align: left !important;
	animation: v8sf-p-dots 1.2s infinite !important;
}

@keyframes v8sf-p-dots {
	0%   { content: ''; }
	25%  { content: '.'; }
	50%  { content: '..'; }
	75%  { content: '...'; }
	100% { content: '...'; }
}

/* Kits e agrupados */
.v8sf-p-form {
	display: block !important;
}

/* Aviso sutil: faltam artes para completar o kit (shake leve) */
.vkb-preview.vkb-nudge {
	animation: v8sf-p-kit-nudge 0.4s ease !important;
}

@keyframes v8sf-p-kit-nudge {
	0%, 100% { transform: translateX(0); }
	25% { transform: translateX(-4px); }
	50% { transform: translateX(4px); }
	75% { transform: translateX(-3px); }
}

.v8sf-p-grouped {
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
	margin-bottom: 14px !important;
}

.v8sf-p-grouped-item {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	padding: 12px 14px !important;
	border: 1.5px solid var(--border, #e5e7eb) !important;
	border-radius: 12px !important;
	background: #ffffff !important;
	cursor: pointer !important;
}

.v8sf-p-grouped-item input {
	margin: 0 !important;
}

.v8sf-p-grouped-name {
	flex: 1 1 auto !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	color: var(--text-main, #111827) !important;
	/* FASE 8 — clamp: nome do item agrupado nunca quebra/empurra o preço. */
	min-width: 0 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.v8sf-p-grouped-price {
	font-size: 14px !important;
	font-weight: 800 !important;
	color: var(--text-main, #111827) !important;
}

/* ── Selos de confiança (card próprio acima da descrição) ── */
.v8sf-p-trust-card {
	margin: 28px 0 0 !important;
	background: var(--surface, #ffffff) !important;
	border: 1px solid var(--border, #eef0f3) !important;
	border-radius: 18px !important;
	padding: 16px !important;
}

.v8sf-p-trust {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr) !important;
	gap: 10px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

@media (min-width: 769px) {
	.v8sf-p-trust {
		grid-template-columns: repeat(4, 1fr) !important;
	}
}

.v8sf-p-trust-item {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	padding: 12px 10px !important;
	background: #f9fafb !important;
	border: 1px solid var(--border, #e5e7eb) !important;
	border-radius: 12px !important;
	min-width: 0 !important;
}

.v8sf-p-trust-ic {
	width: 34px !important;
	height: 34px !important;
	flex: 0 0 34px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 10px !important;
	background: rgba(16, 185, 129, 0.12) !important;
	color: var(--success, #10b981) !important;
}

.v8sf-p-trust-txt {
	display: flex !important;
	flex-direction: column !important;
	min-width: 0 !important;
	line-height: 1.25 !important;
}

.v8sf-p-trust-txt strong {
	font-size: 12.5px !important;
	font-weight: 800 !important;
	color: var(--text-main, #111827) !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.v8sf-p-trust-txt small {
	font-size: 11px !important;
	font-weight: 600 !important;
	color: var(--text-muted, #6b7280) !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

/* Mobile: ícone em cima + texto centralizado com quebra de linha */
@media (max-width: 768px) {
	.v8sf-p-trust-item {
		flex-direction: column !important;
		align-items: center !important;
		text-align: center !important;
		gap: 6px !important;
		padding: 14px 8px !important;
	}
	.v8sf-p-trust-txt strong,
	.v8sf-p-trust-txt small {
		white-space: normal !important;
		overflow: visible !important;
		text-overflow: clip !important;
		word-break: normal !important;
	}
}

/* ── Selo de contato WhatsApp — faixa no fim do card ──
   Divide a área de compra (branca) da área de contato (cinza bem
   clarinho, mais claro que o fundo da página), com linha divisória
   suave. O WhatsApp faz parte do card, mas não da compra. */
.v8sf-p-contact {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	/* Vaza até as bordas do card (padding do card: 16px lateral / 18px base) */
	margin: 16px -16px -18px !important;
	padding: 16px 16px 18px !important;
	background: #fafafa !important;
	border-top: 1px solid var(--border, #e5e7eb) !important;
	border-radius: 0 !important;
	text-decoration: none !important;
	transition: background 0.2s ease !important;
}
@media (min-width: 769px) {
	.v8sf-p-contact {
		margin: 18px -26px -26px !important;
		padding: 18px 26px 26px !important;
	}
}
.v8sf-p-contact:hover {
	background: #f3f4f6 !important;
	transform: none !important;
}
.v8sf-p-contact-ic {
	width: 42px !important;
	height: 42px !important;
	flex: 0 0 42px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 50% !important;
	background: #25d366 !important;
	color: #ffffff !important;
}
.v8sf-p-contact-txt {
	display: flex !important;
	flex-direction: column !important;
	flex: 1 !important;
	min-width: 0 !important;
	line-height: 1.3 !important;
}
.v8sf-p-contact-txt strong {
	font-size: 13.5px !important;
	font-weight: 800 !important;
	color: var(--text-main, #111827) !important;
}
.v8sf-p-contact-txt small {
	font-size: 12px !important;
	font-weight: 600 !important;
	color: var(--success-dark, #059669) !important;
}
.v8sf-p-contact-arrow {
	flex-shrink: 0 !important;
	color: var(--success, #10b981) !important;
}

/* ── Meta ── */
.v8sf-p-meta {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 6px !important;
	font-size: 13px !important;
	color: var(--text-muted, #6b7280) !important;
}

.v8sf-p-meta a {
	color: var(--text-main, #111827) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}

/* ── Descrição ── */
.v8sf-p-description {
	margin-top: 28px !important;
	padding: 20px 16px !important;
	background: var(--surface, #ffffff) !important;
	border: 1px solid var(--border, #eef0f3) !important;
	border-radius: 18px !important;
}

@media (min-width: 769px) {
	.v8sf-p-description {
		padding: 26px !important;
	}
}

.v8sf-p-description-title {
	margin: 0 0 12px !important;
	font-size: 18px !important;
	font-weight: 800 !important;
	color: var(--text-main, #111827) !important;
	/* FASE 8 — clamp: título de seção em 1 linha com reticências. */
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.v8sf-p-description-body {
	font-size: 14.5px !important;
	line-height: 1.65 !important;
	color: var(--text-main, #111827) !important;
}

.v8sf-p-description-body p {
	margin: 0 0 12px !important;
}

.v8sf-p-description-body img {
	max-width: 100% !important;
	height: auto !important;
	border-radius: 12px !important;
}

/* ── Relacionados (carrossel) ── */
.v8sf-p-related {
	margin-top: 28px !important;
}

.v8sf-p-related-head {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 12px !important;
	margin-bottom: 12px !important;
}

.v8sf-p-related-title {
	margin: 0 !important;
	font-size: 18px !important;
	font-weight: 800 !important;
	color: var(--text-main, #111827) !important;
	/* FASE 8 — clamp: título do carrossel em 1 linha com reticências. */
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.v8sf-p-related-arrows {
	display: flex !important;
	gap: 8px !important;
}

.v8sf-p-related-arrow {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 34px !important;
	height: 34px !important;
	flex: 0 0 34px !important;
	padding: 0 !important;
	border: 1px solid var(--border, #E5E7EB) !important;
	border-radius: 10px !important;
	background: var(--surface, #FFFFFF) !important;
	color: var(--text-main, #111827) !important;
	cursor: pointer !important;
	transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease, border-color 0.2s ease !important;
}

.v8sf-p-related-arrow:hover:not(:disabled) {
	background: var(--success, #10B981) !important;
	border-color: var(--success, #10B981) !important;
	color: #FFFFFF !important;
}

.v8sf-p-related-arrow:disabled {
	opacity: 0.35 !important;
	cursor: default !important;
}

.v8sf-p-related-track {
	display: flex !important;
	gap: 12px !important;
	overflow-x: auto !important;
	scroll-snap-type: x mandatory !important;
	scrollbar-width: none !important;
	padding-bottom: 6px !important;
}

.v8sf-p-related-track::-webkit-scrollbar {
	display: none !important;
}

.v8sf-p-related-card {
	flex: 0 0 140px !important;
	width: 140px !important;
	scroll-snap-align: start !important;
	display: flex !important;
	flex-direction: column !important;
	background: var(--surface, #ffffff) !important;
	border: 1px solid var(--border, #e5e7eb) !important;
	border-radius: 14px !important;
	padding: 8px !important;
	text-decoration: none !important;
	/* Sombra skeleton (padrão do carrinho) */
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 16px 40px -16px rgba(0, 0, 0, 0.12) !important;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
}

.v8sf-p-related-card:hover {
	border-color: #10b981 !important;
	box-shadow: 0 6px 18px rgba(17, 24, 39, 0.08) !important;
}

/* Moldura branca na imagem (mesmo padrão dos vistos recentes) */
.v8sf-p-related-thumb {
	width: 100% !important;
	aspect-ratio: 4 / 5 !important;
	border-radius: 10px !important;
	overflow: hidden !important;
	background: #ffffff !important;
}

.v8sf-p-related-thumb img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
}

.v8sf-p-related-name {
	padding: 8px 2px 2px !important;
	font-size: 12.5px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	color: var(--text-main, #111827) !important;
	display: -webkit-box !important;
	-webkit-line-clamp: 2 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
}

.v8sf-p-related-price {
	padding: 0 2px 2px !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	color: var(--text-main, #111827) !important;
}

.v8sf-p-related-price del {
	color: var(--text-muted, #6b7280) !important;
	font-weight: 500 !important;
}

/* ── Barra fixa MOBILE (sticky add) ── */
.v8sf-p-sticky {
	position: fixed !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	z-index: 99980 !important;
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	padding: 12px 14px !important;
	background: #ffffff !important;
	border-top: 1px solid var(--border, #eef0f3) !important;
	box-shadow: 0 -6px 24px rgba(17, 24, 39, 0.1) !important;
}

@supports (padding-bottom: max(0px)) {
	.v8sf-p-sticky {
		padding-bottom: max(12px, env(safe-area-inset-bottom)) !important;
	}
}

.v8sf-p-sticky[hidden] {
	display: none !important;
}

@media (min-width: 769px) {
	.v8sf-p-sticky {
		display: none !important;
	}
}

.v8sf-p-sticky-price {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	font-size: 17px !important;
	font-weight: 800 !important;
	color: var(--text-main, #111827) !important;
	line-height: 1.2 !important;
}

.v8sf-p-sticky-price del {
	color: var(--text-muted, #6b7280) !important;
	font-weight: 500 !important;
	font-size: 13px !important;
}

.v8sf-p-sticky-price ins {
	text-decoration: none !important;
}

.v8sf-p-sticky-btn {
	flex: 0 0 auto !important;
	padding: 14px 22px !important;
	border: none !important;
	border-radius: 12px !important;
	background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
	color: #ffffff !important;
	font-size: 14px !important;
	font-weight: 900 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.4px !important;
	cursor: pointer !important;
	box-shadow: 0 6px 18px -4px rgba(16, 185, 129, 0.5) !important;
	font-family: inherit !important;
}

.v8sf-p-sticky-btn:disabled {
	background: var(--border, #e5e7eb) !important;
	box-shadow: none !important;
	color: var(--text-muted, #6b7280) !important;
	cursor: not-allowed !important;
}

/* ==================================================================
   REDESIGN — Ficha de Produto V8 (padrão skeleton, alta qualidade).
   Mantém a estrutura existente e adiciona/sobrescreve os estilos
   para o novo layout pedido (breadcrumb, galeria, preço, chips,
   botão, tabs, relacionados, vistos recentes, popup de medidas).
   ================================================================== */

/* ── Breadcrumb ── */
.v8sf-p-breadcrumb {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	gap: 6px !important;
	margin-bottom: 14px !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	color: var(--text-muted, #6b7280) !important;
}
.v8sf-p-breadcrumb a {
	color: var(--text-muted, #6b7280) !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}
.v8sf-p-breadcrumb a:hover {
	color: var(--success, #10b981) !important;
}
.v8sf-p-crumb-sep {
	margin: 0 3px !important;
	color: var(--border, #d1d5db) !important;
}

/* ── Preço: ANTIGO em cinza claro + ATUAL em verde ── */
.v8sf-p-price {
	color: var(--success, #10b981) !important;
}
.v8sf-p-price del {
	color: #d1d5db !important;
	font-weight: 500 !important;
	font-size: 16px !important;
	margin-right: 8px !important;
}
.v8sf-p-price ins {
	text-decoration: none !important;
	color: inherit !important;
}

/* ── Setas da galeria (sobre a foto) ── */
.v8sf-p-arrow {
	position: absolute !important;
	top: 50% !important;
	z-index: 2 !important;
	width: 36px !important;
	height: 36px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 0 !important;
	border: none !important;
	border-radius: 50% !important;
	background: rgba(255, 255, 255, 0.92) !important;
	color: #111827 !important;
	box-shadow: 0 2px 8px rgba(17, 24, 39, 0.15) !important;
	cursor: pointer !important;
	transform: translateY(-50%) !important;
	transition: transform 0.15s ease, box-shadow 0.2s ease !important;
}
.v8sf-p-arrow.is-prev { left: 10px !important; }
.v8sf-p-arrow.is-next { right: 10px !important; }
.v8sf-p-arrow:hover {
	transform: translateY(-50%) scale(1.08) !important;
	box-shadow: 0 4px 12px rgba(17, 24, 39, 0.2) !important;
}

/* ── Botão "Qual meu tamanho?" ── */
.v8sf-p-sizeguide-row {
	margin: 4px 0 12px !important;
}
.v8sf-p-sizeguide {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	padding: 6px 14px !important;
	border: 1.5px solid var(--border, #e5e7eb) !important;
	border-radius: 999px !important;
	background: transparent !important;
	color: var(--text-muted, #6b7280) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	cursor: pointer !important;
	font-family: inherit !important;
	transition: border-color 0.2s ease, color 0.2s ease !important;
}
.v8sf-p-sizeguide svg {
	color: var(--success, #10b981) !important;
	flex-shrink: 0 !important;
}
.v8sf-p-sizeguide:hover {
	border-color: var(--success, #10b981) !important;
	color: var(--text-main, #111827) !important;
}

/* ── POPUP "Qual meu tamanho?" (medidas) ── */
html.v8sf-p-lock,
html.v8sf-p-lock body {
	overflow: hidden !important;
}
.v8sf-p-sizeguide-pop {
	position: fixed !important;
	inset: 0 !important;
	z-index: 99995 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 16px !important;
}
.v8sf-p-sizeguide-pop[hidden] {
	display: none !important;
}
.v8sf-p-sizeguide-backdrop {
	position: absolute !important;
	inset: 0 !important;
	background: rgba(17, 24, 39, 0.5) !important;
	backdrop-filter: blur(2px) !important;
	-webkit-backdrop-filter: blur(2px) !important;
}
.v8sf-p-sizeguide-card {
	position: relative !important;
	width: 100% !important;
	max-width: 480px !important;
	max-height: 90dvh !important;
	overflow-y: auto !important;
	background: var(--surface, #ffffff) !important;
	border-radius: 20px !important;
	padding: 24px 20px 20px !important;
	box-shadow: 0 20px 60px rgba(17, 24, 39, 0.25) !important;
	animation: v8sf-p-pop-in 0.22s ease !important;
}
@keyframes v8sf-p-pop-in {
	from { transform: translateY(16px); opacity: 0; }
	to { transform: translateY(0); opacity: 1; }
}
.v8sf-p-sizeguide-close {
	position: absolute !important;
	top: 12px !important;
	right: 12px !important;
	width: 32px !important;
	height: 32px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 0 !important;
	border: none !important;
	border-radius: 50% !important;
	background: var(--surface, #f3f4f6) !important;
	color: var(--text-muted, #6b7280) !important;
	cursor: pointer !important;
	transition: background 0.2s ease !important;
}
.v8sf-p-sizeguide-close:hover {
	background: #e5e7eb !important;
}
.v8sf-p-sizeguide-title {
	margin: 0 0 4px !important;
	font-size: 20px !important;
	font-weight: 800 !important;
	color: var(--text-main, #111827) !important;
}
.v8sf-p-sizeguide-sub {
	margin: 0 0 18px !important;
	font-size: 13px !important;
	color: var(--text-muted, #6b7280) !important;
}

/* ── Simulador peso × altura (régua universal) ── */
.v8sf-p-measure {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 10px !important;
	align-items: flex-end !important;
	padding: 14px !important;
	margin-bottom: 14px !important;
	background: #f9fafb !important;
	border: 1px solid var(--border, #e5e7eb) !important;
	border-radius: 12px !important;
}
.v8sf-p-measure-field {
	display: flex !important;
	flex-direction: column !important;
	gap: 4px !important;
	flex: 1 !important;
	min-width: 120px !important;
}
.v8sf-p-measure-field span {
	font-size: 12px !important;
	font-weight: 700 !important;
	color: var(--text-muted, #6b7280) !important;
}
.v8sf-p-measure-field select {
	height: 42px !important;
	padding: 0 10px !important;
	border: 1.5px solid var(--border, #e5e7eb) !important;
	border-radius: 10px !important;
	font-size: 14px !important;
	font-family: inherit !important;
	background: #ffffff !important;
	color: var(--text-main, #111827) !important;
	outline: none !important;
}
.v8sf-p-measure-field select:focus {
	border-color: var(--success, #10b981) !important;
}
.v8sf-p-measure-btn {
	height: 42px !important;
	padding: 0 20px !important;
	border: none !important;
	border-radius: 10px !important;
	background: var(--success, #10b981) !important;
	color: #ffffff !important;
	font-weight: 800 !important;
	font-size: 14px !important;
	font-family: inherit !important;
	cursor: pointer !important;
	transition: background 0.2s ease !important;
}
.v8sf-p-measure-btn:hover {
	background: var(--success-dark, #059669) !important;
}
.v8sf-p-measure-result {
	margin: 0 0 14px !important;
	padding: 14px !important;
	border-radius: 10px !important;
	background: rgba(16, 185, 129, 0.1) !important;
	border: 1px solid rgba(16, 185, 129, 0.3) !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	color: var(--success-dark, #059669) !important;
	text-align: center !important;
}
.v8sf-p-sizeguide-table-wrap {
	overflow-x: auto !important;
	overflow-y: auto !important;
	max-height: 240px !important;
	border: 1px solid var(--border, #e5e7eb) !important;
	border-radius: 10px !important;
}
.v8sf-p-sizeguide-table {
	width: 100% !important;
	border-collapse: collapse !important;
	font-size: 13px !important;
}
.v8sf-p-sizeguide-table th,
.v8sf-p-sizeguide-table td {
	padding: 10px 12px !important;
	text-align: center !important;
	border: 1px solid var(--border, #e5e7eb) !important;
}
.v8sf-p-sizeguide-table th {
	background: #f9fafb !important;
	font-weight: 700 !important;
	color: var(--text-muted, #6b7280) !important;
	font-size: 12px !important;
	text-transform: uppercase !important;
	letter-spacing: 0.04em !important;
}
.v8sf-p-sizeguide-table td {
	font-weight: 600 !important;
	color: var(--text-main, #111827) !important;
}
.v8sf-p-sizeguide-note {
	margin: 14px 0 0 !important;
	font-size: 12.5px !important;
	color: var(--text-muted, #6b7280) !important;
	line-height: 1.5 !important;
}

/* ── Chips de tamanho → CARDS GRANDES (grid 4 colunas) ── */
.v8sf-p-attr-head {
	display: flex !important;
	align-items: baseline !important;
	gap: 6px !important;
	margin-bottom: 8px !important;
}
.v8sf-p-attr-label {
	font-size: 13px !important;
	font-weight: 800 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	color: var(--text-main, #111827) !important;
}
.v8sf-p-attr-hint {
	font-size: 12px !important;
	font-weight: 600 !important;
	color: #9ca3af !important;
	white-space: nowrap !important;
}
.v8sf-p-chips {
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 8px !important;
}
@media (max-width: 768px) {
	/* Mobile: 4 variações = 2x2 · 3 variações = 1 linha de 3 (não quebra 2+1) */
	.v8sf-p-chips {
		grid-template-columns: repeat(2, 1fr) !important;
	}
	.v8sf-p-chips[data-count="3"] {
		grid-template-columns: repeat(3, 1fr) !important;
	}
}
.v8sf-p-chip {
	min-width: 0 !important;
	padding: 14px 8px !important;
	border: 1.5px solid var(--border, #e5e7eb) !important;
	border-radius: 12px !important;
	background: #ffffff !important;
	color: var(--text-main, #111827) !important;
	font-size: 15px !important;
	font-weight: 800 !important;
	text-align: center !important;
	cursor: pointer !important;
	/* Card branco com sombra skeleton — claramente selecionável */
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 8px 24px -14px rgba(0, 0, 0, 0.14) !important;
	transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease !important;
}
.v8sf-p-chip:hover:not([data-soldout]) {
	border-color: rgba(16, 185, 129, 0.5) !important;
	transform: translateY(-1px) !important;
}
.v8sf-p-chip.is-selected {
	border-color: var(--success, #10b981) !important;
	background: var(--success, #10b981) !important;
	color: #ffffff !important;
	box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3) !important;
	transform: none !important;
}
.v8sf-p-chip[data-soldout] {
	opacity: 0.4 !important;
	text-decoration: line-through !important;
	cursor: not-allowed !important;
}

/* ── Botão ADICIONAR — seta animada + estado is-added ── */
.v8sf-p-add-btn {
	padding: 22px 24px !important;
	font-size: 18px !important;
}
.v8sf-p-add-arrow {
	transition: transform 0.25s ease !important;
}
.v8sf-p-add-btn:hover .v8sf-p-add-arrow {
	transform: translateX(4px) !important;
}
.v8sf-p-add-btn.is-loading .v8sf-p-add-arrow {
	opacity: 0 !important;
}
.v8sf-p-add-btn.is-added {
	background: #059669 !important;
	box-shadow: 0 8px 25px -5px rgba(16, 185, 129, 0.5) !important;
}
.v8sf-p-add-btn.is-added .v8sf-p-add-arrow {
	opacity: 0 !important;
}

/* ── Botão "Escolha seu tamanho" — verde pulsando, nunca cinza ── */
.v8sf-p-add-btn.is-need-size {
	background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
	box-shadow: 0 8px 25px -5px rgba(16, 185, 129, 0.5) !important;
	color: #ffffff !important;
	cursor: pointer !important;
	animation: v8sf-p-btn-need-pulse 1.6s ease-in-out infinite !important;
}
.v8sf-p-add-btn.is-need-size::after {
	display: none !important;
}
.v8sf-p-add-btn.is-need-size:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 12px 30px -5px rgba(16, 185, 129, 0.6) !important;
}
@keyframes v8sf-p-btn-need-pulse {
	0%, 100% { transform: scale(1); box-shadow: 0 8px 25px -5px rgba(16, 185, 129, 0.5); }
	50% { transform: scale(1.02); box-shadow: 0 12px 32px -4px rgba(16, 185, 129, 0.7); }
}
.v8sf-p-sticky-btn.is-need-size {
	background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
	box-shadow: 0 6px 18px -4px rgba(16, 185, 129, 0.5) !important;
	color: #ffffff !important;
	animation: v8sf-p-btn-need-pulse 1.6s ease-in-out infinite !important;
}

/* ── Nudge (shake) nos chips de tamanho quando clica sem escolher ── */
.v8sf-p-attrs.is-nudge .v8sf-p-chips {
	animation: v8sf-p-chips-nudge 0.4s ease !important;
}
@keyframes v8sf-p-chips-nudge {
	0%, 100% { transform: translateX(0); }
	25% { transform: translateX(-5px); }
	50% { transform: translateX(5px); }
	75% { transform: translateX(-3px); }
}

/* ── hfit — estilo leve (skeleton) ── */
.hfit-frete-calc-wrapper {
	margin: 12px 0 !important;
	padding: 14px 16px !important;
	background: #f9fafb !important;
	border: 1px solid var(--border, #e5e7eb) !important;
	border-radius: 14px !important;
}
.hfit-frete-header {
	font-size: 13px !important;
	font-weight: 700 !important;
	color: var(--text-muted, #6b7280) !important;
}
.hfit-frete-header svg {
	width: 16px !important;
	height: 16px !important;
	color: var(--success, #10b981) !important;
}
.hfit-frete-form input {
	padding: 10px 12px !important;
	border-radius: 10px !important;
	border: 1.5px solid var(--border, #e5e7eb) !important;
	font-size: 13px !important;
}
.hfit-frete-form button {
	padding: 10px 18px !important;
	border-radius: 10px !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	background: var(--success, #10b981) !important;
	color: #fff !important;
	border: none !important;
	cursor: pointer !important;
}
.hfit-delivery-wrapper {
	margin: 12px 0 0 !important;
	padding: 12px 16px !important;
	background: #f9fafb !important;
	border: 1px solid var(--border, #e5e7eb) !important;
	border-radius: 12px !important;
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	box-shadow: none !important;
}
.hfit-delivery-wrapper svg {
	width: 22px !important;
	height: 22px !important;
	color: var(--success, #10b981) !important;
	flex-shrink: 0 !important;
}
.hfit-delivery-text {
	font-size: 13px !important;
	font-weight: 600 !important;
	color: var(--text-main, #111827) !important;
}
.hfit-delivery-text strong {
	color: var(--success, #10b981) !important;
}

/* ── Accordion (descrição / informações / avaliações) ── */
.v8sf-p-acc {
	margin-top: 28px !important;
	background: var(--surface, #ffffff) !important;
	border: 1px solid var(--border, #eef0f3) !important;
	border-radius: 18px !important;
	overflow: hidden !important;
}
.v8sf-p-acc-item {
	border-bottom: 1px solid var(--border, #eef0f3) !important;
}
.v8sf-p-acc-item:last-child {
	border-bottom: 0 !important;
}
.v8sf-p-acc-head {
	width: 100% !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 12px !important;
	padding: 17px 18px !important;
	border: none !important;
	background: transparent !important;
	color: var(--text-main, #111827) !important;
	font-size: 15px !important;
	font-weight: 800 !important;
	cursor: pointer !important;
	font-family: inherit !important;
	text-align: left !important;
	transition: color 0.2s ease !important;
}
.v8sf-p-acc-head:hover {
	color: var(--success, #10b981) !important;
}
.v8sf-p-acc-head-title {
	flex: 1 !important;
	min-width: 0 !important;
}
.v8sf-p-acc-chevron {
	flex-shrink: 0 !important;
	transition: transform 0.25s ease, color 0.2s ease !important;
	color: var(--text-muted, #6b7280) !important;
}
.v8sf-p-acc-item.is-open .v8sf-p-acc-chevron {
	transform: rotate(180deg) !important;
	color: var(--success, #10b981) !important;
}
.v8sf-p-acc-body {
	max-height: 0 !important;
	overflow: hidden !important;
	transition: max-height 0.35s ease !important;
}
.v8sf-p-acc-item.is-open .v8sf-p-acc-body {
	max-height: 9999px !important;
}
.v8sf-p-acc-content {
	padding: 0 18px !important;
	font-size: 14px !important;
	line-height: 1.65 !important;
	color: var(--text-main, #111827) !important;
}
.v8sf-p-acc-item.is-open .v8sf-p-acc-content {
	padding: 0 18px 20px !important;
}
.v8sf-p-acc-content p:first-child {
	margin-top: 0 !important;
}
.v8sf-p-acc-content p:last-child {
	margin-bottom: 0 !important;
}
.v8sf-p-tab-count {
	display: inline-block !important;
	margin-left: 4px !important;
	padding: 0 7px !important;
	font-size: 11px !important;
	line-height: 18px !important;
	border-radius: 999px !important;
	background: rgba(16, 185, 129, 0.12) !important;
	color: var(--success, #10b981) !important;
}
.v8sf-p-extra-table {
	width: 100% !important;
	border-collapse: collapse !important;
	font-size: 14px !important;
}
.v8sf-p-extra-table th,
.v8sf-p-extra-table td {
	padding: 10px 12px !important;
	text-align: left !important;
	border-bottom: 1px solid var(--border, #eef0f3) !important;
}
.v8sf-p-extra-table th {
	font-weight: 700 !important;
	color: var(--text-muted, #6b7280) !important;
	width: 40% !important;
}

/* ── Produtos relacionados (preço verde) ── */
.v8sf-p-related-price {
	color: var(--success, #10b981) !important;
}
.v8sf-p-related-price del {
	color: var(--text-muted, #6b7280) !important;
	font-weight: 500 !important;
}

/* ── Vistos recentemente (mesmo estilo do carrinho) ── */
.v8sf-product-page .v8sf-recently {
	margin-top: 24px !important;
}
.v8sf-product-page .v8sf-recently-head {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	margin-bottom: 12px !important;
}
.v8sf-product-page .v8sf-recently-title {
	font-size: 15px !important;
	font-weight: 800 !important;
	color: var(--text-main) !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}
.v8sf-product-page .v8sf-recently-nav {
	display: flex !important;
	gap: 8px !important;
}
.v8sf-product-page .v8sf-recently-arrow {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 34px !important;
	height: 34px !important;
	padding: 0 !important;
	border: 1px solid var(--border, #E5E7EB) !important;
	border-radius: 10px !important;
	background: var(--surface, #FFFFFF) !important;
	color: var(--text-main, #111827) !important;
	cursor: pointer !important;
	transition: background 0.2s ease, color 0.2s ease, opacity 0.2s ease !important;
}
.v8sf-product-page .v8sf-recently-arrow:hover:not(:disabled) {
	background: var(--v8sf-hdr-primary, #10B981) !important;
	border-color: var(--v8sf-hdr-primary, #10B981) !important;
	color: #FFFFFF !important;
}
.v8sf-product-page .v8sf-recently-arrow:disabled {
	opacity: 0.35 !important;
	cursor: default !important;
}
.v8sf-product-page .v8sf-recently-track {
	display: flex !important;
	gap: 12px !important;
	overflow-x: auto !important;
	scroll-snap-type: x mandatory !important;
	padding-bottom: 6px !important;
	scrollbar-width: none !important;
}
.v8sf-product-page .v8sf-recently-track::-webkit-scrollbar {
	display: none !important;
}
.v8sf-product-page .v8sf-recently-item {
	flex: 0 0 132px !important;
	scroll-snap-align: start !important;
	background: var(--surface, #ffffff) !important;
	border: 1px solid var(--border, #e5e7eb) !important;
	border-radius: 14px !important;
	padding: 10px !important;
	text-decoration: none !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 6px !important;
	/* Sombra skeleton (padrão do carrinho) */
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 16px 40px -16px rgba(0, 0, 0, 0.12) !important;
	transition: all 0.2s ease !important;
}
.v8sf-product-page .v8sf-recently-item:hover {
	border-color: rgba(16, 185, 129, 0.4) !important;
	transform: translateY(-2px) !important;
}
.v8sf-product-page .v8sf-recently-img {
	width: 100% !important;
	aspect-ratio: 1 !important;
	border-radius: 10px !important;
	overflow: hidden !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: #fff !important;
}
.v8sf-product-page .v8sf-recently-img img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	display: block !important;
}
.v8sf-product-page .v8sf-recently-name {
	font-size: 12px !important;
	font-weight: 700 !important;
	color: var(--text-main) !important;
	line-height: 1.3 !important;
	display: -webkit-box !important;
	-webkit-line-clamp: 2 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
}
.v8sf-product-page .v8sf-recently-price {
	font-size: 12.5px !important;
	font-weight: 800 !important;
	color: var(--success-dark, #059669) !important;
}



/* ── Montar kit (Visual Kit Builder) — completo = tudo que era azul vira verde ── */
.vkb-cta-banner:has(+ .vkb-selector.vkb-complete),
.vkb-cta-banner:has(~ .vkb-selector.vkb-complete) {
	background: linear-gradient(135deg, #34d399 0%, #10b981 52%, #059669 100%) !important;
	box-shadow: 0 8px 20px rgba(16, 185, 129, .22) !important;
}
.vkb-selector.vkb-complete .vkb-toggle-icon::after {
	color: #10b981 !important;
}
.vkb-selector.vkb-complete .vkb-item.selected {
	border-color: #10b981 !important;
	background: #f0fdf4 !important;
	box-shadow: 0 0 0 2px rgba(16, 185, 129, .10) !important;
}
.vkb-selector.vkb-complete .vkb-item.selected .vkb-check {
	background-color: #10b981 !important;
	border-color: #10b981 !important;
}
.vkb-selector.vkb-complete .vkb-selected-slot.filled {
	border-color: #10b981 !important;
	background: #ecfdf5 !important;
}
.vkb-selector.vkb-complete .vkb-counter-bar {
	color: #059669 !important;
}

/* FASE 4.2 — remover o 'super footer' na ficha de produto (opção admin) */
body.fastyshop-v8-single-product.v8sf-sp-nofooter #v8sf-ftr,
body.fastyshop-v8-single-product.v8sf-sp-nofooter footer {
	display: none !important;
}