/* =============================================================================
 * PhotoVision — Vision3 → Nova Vision
 * Усі правила скоуплені під .pv-nv-* — нічого чужого не зачіпають.
 * Кольори міняються в одному місці — у :root нижче.
 * ========================================================================== */

:root {
	--pv-nv-badge-bg:      rgba(24, 24, 27, .88);
	--pv-nv-badge-color:   #ffffff;
	--pv-nv-accent:        #d98324; /* акцент «увага, зміна» */
	--pv-nv-btn-bg:        #111111;
	--pv-nv-btn-bg-hover:  #2e2e2e;
	--pv-nv-btn-color:     #ffffff;
	--pv-nv-img-dim:       .75;    /* 1 = без змін, менше = темніше */
}

/* -----------------------------------------------------------------------------
 * 1. Притемнене фото застарілої позиції (працює і на ховері з другим фото)
 * -------------------------------------------------------------------------- */

.pv-nv-legacy .sp-product-image img,
.pv-nv-legacy .img-wrap img,
.pv-nv-legacy .woocommerce-LoopProduct-link img {
	filter: brightness(var(--pv-nv-img-dim)) saturate(.8);
	transition: filter .25s ease;
}

.pv-nv-legacy:hover .sp-product-image img,
.pv-nv-legacy:hover .img-wrap img,
.pv-nv-legacy:hover .woocommerce-LoopProduct-link img {
	filter: brightness(calc(var(--pv-nv-img-dim) + .1)) saturate(.85);
}

/* Приглушуємо і назву — акцент лишається на бейджі та кнопці */
.pv-nv-legacy .woocommerce-loop-product__title {
	opacity: .72;
}

/* -----------------------------------------------------------------------------
 * 2. Бейдж «ЗАМІНЕНО НА NOVA VISION …»
 *    Позиціювання/розміри лишаються від теми — міняємо лише вигляд і перенос.
 * -------------------------------------------------------------------------- */

.out-of-stock-badge.pv-nv-badge {
	background: var(--pv-nv-badge-bg);
	color: var(--pv-nv-badge-color);
	border: 1px solid rgba(255, 255, 255, 0.5);
	box-shadow: 0 0 0 1px rgba(0, 0, 0, .06);
	max-width: 92%;
	box-sizing: border-box;
	white-space: normal;
	text-align: center;
	line-height: 1.25;
	letter-spacing: .02em;
	font-weight: 700;
}

/* Маленька крапка-акцент перед текстом */
/* .out-of-stock-badge.pv-nv-badge::before {
	content: "";
	display: inline-block;
	width: .5em;
	height: .5em;
	margin-right: .5em;
	border-radius: 50%;
	background: var(--pv-nv-accent);
	vertical-align: baseline;
} */

/* На вузьких екранах показуємо скорочений варіант тексту */
@media (max-width: 480px) {
	.out-of-stock-badge.pv-nv-badge[data-pv-nv-short] {
		font-size: 0 !important;
	}
	.out-of-stock-badge.pv-nv-badge[data-pv-nv-short]::before {
		display: none;
	}
	.out-of-stock-badge.pv-nv-badge[data-pv-nv-short]::after {
		content: attr(data-pv-nv-short);
		font-size: 10px;
		letter-spacing: .02em;
		font-weight: 700;
	}
}

/* -----------------------------------------------------------------------------
 * 3. Кнопка «Дивитись заміну» — чорна, щоб відрізнялась від зеленої «У кошик»
 * -------------------------------------------------------------------------- */

.pv-nv-btn,
a.pv-nv-btn,
.woocommerce a.button.pv-nv-btn,
.woocommerce-loop-product__buttons a.pv-nv-btn {
	background: var(--pv-nv-btn-bg) !important;
	background-color: var(--pv-nv-btn-bg) !important;
	background-image: none !important;
	border-color: var(--pv-nv-btn-bg) !important;
	color: var(--pv-nv-btn-color) !important;
	text-decoration: none;
}

.pv-nv-btn:hover,
a.pv-nv-btn:hover,
.woocommerce a.button.pv-nv-btn:hover,
.pv-nv-btn:focus,
a.pv-nv-btn:focus {
	background: var(--pv-nv-btn-bg-hover) !important;
	background-color: var(--pv-nv-btn-bg-hover) !important;
	border-color: var(--pv-nv-btn-bg-hover) !important;
	color: var(--pv-nv-btn-color) !important;
}

/* Стрілка-підказка «веде далі» */
/* .pv-nv-btn::after {
	content: " \2192";
	font-weight: 400;
} */

/* -----------------------------------------------------------------------------
 * 4. Банер на сторінці товару Vision3
 * -------------------------------------------------------------------------- */

.pv-nv-notice {
	margin: 0 0 20px;
	padding: 16px 18px;
	border: 1px solid rgba(217, 131, 36, .45);
	border-left: 4px solid var(--pv-nv-accent);
	border-radius: 10px;
	background: rgba(217, 131, 36, .07);
	box-sizing: border-box;
}

.pv-nv-notice__title {
	font-size: 1.05em;
	font-weight: 700;
	line-height: 1.3;
	margin: 0 0 8px;
}

.pv-nv-notice__text {
	font-size: .92em;
	line-height: 1.55;
	margin: 0 0 14px;
	opacity: .92;
}

.pv-nv-notice__btn,
a.pv-nv-notice__btn {
	display: inline-block;
	padding: 11px 20px;
	border-radius: 6px;
	background: var(--pv-nv-btn-bg) !important;
	color: var(--pv-nv-btn-color) !important;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none !important;
	transition: background .2s ease;
}

.pv-nv-notice__btn:hover,
a.pv-nv-notice__btn:hover,
.pv-nv-notice__btn:focus {
	background: var(--pv-nv-btn-bg-hover) !important;
	color: var(--pv-nv-btn-color) !important;
}

.pv-nv-notice__note {
	margin-top: 10px;
	font-size: .8em;
	opacity: .65;
	line-height: 1.4;
}