/* ==========================================================================
   Pagina de produs la Black Friday (aceeasi conditie ca badge-ul negru din
   galerie: reducere de cel putin 10% si nu e in "retrase")
   Se incarca sincron, doar pe aceste produse, peste product-details.css:
   toata pagina trece pe negru (fundal, carduri, bare), iar pretul, butonul
   de cos si eticheta de sus primesc efecte de evidentiere.
   Limitat la .html-promo-product-page.

   Dupa campanie: setarea "blackfriday.productpage.enabled" = False
   (Admin > Configurare > Setari > Toate setarile) opreste fisierul, fundalul
   si eticheta din ProductTemplate.Simple/Grouped; apoi purge in Cloudflare.
   ========================================================================== */

.html-promo-product-page {
	--promo-deep: #0a0a0b;
	--promo-surface: #141416;
	--promo-surface-2: #1d1d21;
	--promo-hot: #c9321a;
	--promo-accent: #ff5a36;

	/* paleta din product-details.css intoarsa pe inchis: tot ce o foloseste
	   (texte, linii, zone gri, pastile) se adapteaza singur */
	--pd-brand: #e8401c;
	--pd-brand-600: #c9321a;
	--pd-brand-50: rgba(255, 90, 54, .1);
	--pd-brand-100: rgba(255, 90, 54, .28);
	--pd-ink: #f4f4f5;
	--pd-text: #c9c9cf;
	--pd-muted: #8e8e97;
	--pd-line: #2a2a30;
	--pd-soft: var(--promo-surface-2);
	--pd-blue: #7cb3ff;
	--pd-ok: #4ade80;
	--pd-ok-bg: rgba(74, 222, 128, .1);
	--pd-shadow: 0 1px 2px rgba(0, 0, 0, .5), 0 12px 32px rgba(0, 0, 0, .45);
	--pd-shadow-hover: 0 2px 4px rgba(0, 0, 0, .5), 0 16px 40px rgba(0, 0, 0, .55);
	color-scheme: dark;
}

/* --------------------------------------------------------------------------
   Fundal pe toata pagina: gradient + iconite care plutesc (strat fix)
   -------------------------------------------------------------------------- */

.html-promo-product-page body,
.html-promo-product-page .master-wrapper-content,
.html-promo-product-page .master-column-wrapper {
	background: var(--promo-deep);
}

.html-promo-product-page .pp-bg {
	position: fixed;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	pointer-events: none;
	background:
		repeating-linear-gradient(0deg, rgba(255, 255, 255, .018) 0, rgba(255, 255, 255, .018) 1px, transparent 1px, transparent 3px),
		radial-gradient(circle at 8% 40%, rgba(201, 50, 26, .16) 0%, transparent 34%),
		radial-gradient(circle at 92% 62%, rgba(201, 50, 26, .2) 0%, transparent 42%),
		radial-gradient(ellipse at 50% 0%, rgba(255, 255, 255, .06) 0%, transparent 55%),
		linear-gradient(170deg, #141416 0%, var(--promo-deep) 50%, #050506 100%);
}

.html-promo-product-page .pp-bg i {
	position: absolute;
	color: rgba(255, 255, 255, .08);
	animation: pp-float ease-in-out infinite alternate;
	will-change: transform;
}

.html-promo-product-page .pp-bg i:nth-child(3n) {
	color: rgba(236, 74, 44, .16);
}

@keyframes pp-float {
	0% { transform: translate3d(0, 0, 0) rotate(-12deg); }
	50% { transform: translate3d(18px, -36px, 0) rotate(6deg); }
	100% { transform: translate3d(-12px, -70px, 0) rotate(18deg); }
}

/* bara de meniu (gri deschis in tema); pe mobil e panoul lateral, ramane ca in tema */
@media (min-width: 1025px) {
	.html-promo-product-page .header-menu {
		background: #0f0f11;
		box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .08);
	}

	.html-promo-product-page .header-menu .category-navigation-title,
	.html-promo-product-page .header-menu .mega-menu > li > a:not([href$="/promotii"]) {
		color: #e6e6e8;
	}

	.html-promo-product-page .header-menu .category-navigation-list-wrapper {
		border-right-color: rgba(255, 255, 255, .12);
	}

	/* pastila neagra "Black Friday" din styles.css: contur ca sa nu se piarda pe bara neagra */
	.html-promo-product-page .header-menu .mega-menu > li > a[href$="/promotii"] {
		outline: 1px solid rgba(255, 255, 255, .3);
		outline-offset: -1px;
	}
}

/* continutul paginii si footer-ul peste stratul de fundal */
.html-promo-product-page .product-details-page,
.html-promo-product-page .footer {
	position: relative;
	z-index: 1;
}

/* --------------------------------------------------------------------------
   Textele care stau direct pe fundalul inchis
   -------------------------------------------------------------------------- */

.html-promo-product-page .product-details-page .breadcrumb a,
.html-promo-product-page .product-details-page .breadcrumb strong,
.html-promo-product-page .product-details-page .breadcrumb li,
.html-promo-product-page .product-details-page .breadcrumb .delimiter {
	color: rgba(255, 255, 255, .85);
}

.html-promo-product-page .product-details-page .breadcrumb a:hover {
	color: var(--promo-accent);
}

/* pe mobil numele e mutat in .mobile-name-holder, in afara .overview */
.html-promo-product-page .product-essential .product-name h1 {
	color: var(--pd-ink);
}

.html-promo-product-page .overview .short-description * {
	color: inherit;
}

.html-promo-product-page .carousel-title strong {
	color: #fff;
}

/* --------------------------------------------------------------------------
   Eticheta de deasupra numelui: pulsatie urmata de o stralucire (ca butonul
   "Black Friday" din meniu)
   -------------------------------------------------------------------------- */

.html-promo-product-page .pp-flag {
	position: relative;
	z-index: 0;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 12px;
	padding: 7px 8px 7px 16px;
	overflow: hidden;
	border: 1px solid rgba(255, 255, 255, .22);
	border-radius: 999px;
	background: #000;
	color: #fff;
	font-size: 14px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	transform-origin: left center;
	animation: pp-pulse 3.2s ease-in-out infinite;
}

.html-promo-product-page .pp-flag::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, .45) 46%, rgba(255, 255, 255, .1) 52%, transparent 60%) no-repeat;
	background-size: 250% 100%;
	background-position: 130% 0;
	animation: pp-sheen 3.2s ease-in-out infinite;
	pointer-events: none;
}

.html-promo-product-page .pp-flag-off {
	padding: 3px 10px;
	border-radius: 999px;
	background: linear-gradient(135deg, #ff6a2b 0%, var(--promo-hot) 100%);
	letter-spacing: 0;
}

@keyframes pp-pulse {
	0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 90, 0, .7); }
	12% { transform: scale(1.06); box-shadow: 0 0 0 6px rgba(255, 90, 0, .35); }
	24%, 100% { transform: scale(1); box-shadow: 0 0 0 12px rgba(255, 90, 0, 0); }
}

@keyframes pp-sheen {
	0%, 28% { background-position: 130% 0; }
	62%, 100% { background-position: -30% 0; }
}

/* --------------------------------------------------------------------------
   Carduri: tot ce era alb devine gri foarte inchis, cu umbra adanca
   -------------------------------------------------------------------------- */

.html-promo-product-page .gallery .thumb-item,
.html-promo-product-page .overview .mainbordersku,
.html-promo-product-page .overview .borderBenefit,
.html-promo-product-page .benefits-toggle,
.html-promo-product-page .product-prices-box,
.html-promo-product-page .attributes-wrapper > div.product-prices-box,
.html-promo-product-page .product-prices-box .qty-input,
.html-promo-product-page .product-prices-box .free-shipping,
.html-promo-product-page .pd-card,
.html-promo-product-page .pd-specs .table-specs td {
	background: var(--promo-surface);
}

.html-promo-product-page .pd-specs .table-specs {
	background: transparent;
}

.html-promo-product-page .gallery .cat-ribbon {
	background: var(--promo-surface-2);
	box-shadow: 0 0 0 1px var(--pd-line), 0 4px 14px rgba(0, 0, 0, .5);
}

/* zonele mai deschise din interiorul cardurilor raman o treapta peste card */
.html-promo-product-page .overview .sku-meta,
.html-promo-product-page .overview .shortBenefit {
	background: var(--pd-soft);
}

.html-promo-product-page .overview .mainbordersku,
.html-promo-product-page .overview .borderBenefit,
.html-promo-product-page .pd-card {
	border-color: var(--pd-line);
	box-shadow: var(--pd-shadow);
}

.html-promo-product-page .product-prices-box .add-to-compare-list-button,
.html-promo-product-page .product-prices-box .add-to-wishlist-button {
	background: var(--promo-surface-2) !important;
}

.html-promo-product-page .product-prices-box .add-to-compare-list-button {
	border-color: rgba(124, 179, 255, .35) !important;
}

.html-promo-product-page .product-prices-box .stockInfo,
.html-promo-product-page .product-prices-box .free-shipping {
	border-color: rgba(74, 222, 128, .25);
}

.html-promo-product-page .add-to-cart-qty-wrapper .plus,
.html-promo-product-page .add-to-cart-qty-wrapper .minus {
	background-color: var(--promo-surface-2);
	color: var(--pd-muted);
}

.html-promo-product-page .add-to-cart-qty-wrapper .plus:hover,
.html-promo-product-page .add-to-cart-qty-wrapper .minus:hover {
	background-color: var(--pd-line);
	color: var(--pd-ink);
}

/* textele inchise din tema: aceeasi specificitate ca in styles.css (.overview
   .additional-details div), ca regulile din product-details.css sa castige in continuare */
.html-promo-product-page .additional-details div {
	color: var(--pd-text);
}

.html-promo-product-page .additional-details div .value {
	color: inherit;
}

.html-promo-product-page .pd-description .full-description :is(p, ul, ol, li, span, div, table, td, th, dd, dt, em, blockquote) {
	color: inherit;
}

.html-promo-product-page .pd-description .full-description :is(strong, b, h2, h3, h4) {
	color: var(--pd-ink);
}

/* --------------------------------------------------------------------------
   Pozele produselor au fundal alb: "multiply" il inlocuieste cu un spot de
   lumina care se stinge spre marginile cardului, produsul ramane neschimbat
   -------------------------------------------------------------------------- */

.html-promo-product-page .gallery .picture,
.html-promo-product-page .gallery .thumb-item,
.html-promo-product-page .product-details-page .item-box .picture {
	background: radial-gradient(ellipse 70% 70% at 50% 50%, #e6e6e9 0%, #cfcfd4 45%, #4d4d54 82%, #26262b 100%);
}

.html-promo-product-page .gallery .picture img[id^="main-product-img-"],
.html-promo-product-page .gallery .thumb-item img,
.html-promo-product-page .product-details-page .item-box .picture img {
	mix-blend-mode: multiply;
}

/* poza produsului: halou cald care respira */
.html-promo-product-page .gallery .picture {
	border-color: transparent;
	animation: pp-halo 3.2s ease-in-out infinite;
}

@keyframes pp-halo {
	0%, 100% { box-shadow: 0 12px 40px rgba(0, 0, 0, .55), 0 0 0 1px rgba(236, 74, 44, .25); }
	50% { box-shadow: 0 12px 40px rgba(0, 0, 0, .55), 0 0 32px 2px rgba(236, 74, 44, .35); }
}

/* --------------------------------------------------------------------------
   Caseta de pret: chenar luminos care se roteste + pret mare
   -------------------------------------------------------------------------- */

@property --pp-angle {
	syntax: "<angle>";
	initial-value: 0deg;
	inherits: false;
}

.html-promo-product-page .product-prices-box,
.html-promo-product-page .attributes-wrapper > div.product-prices-box {
	/* fara position: caseta e deja pozitionata de tema (absolute de la 1280px, relative sub) */
	isolation: isolate;
	border-color: transparent;
	box-shadow: 0 0 0 1px rgba(236, 74, 44, .35), 0 16px 48px rgba(0, 0, 0, .6), 0 0 44px rgba(236, 74, 44, .28);
}

.html-promo-product-page .product-prices-box::before {
	content: "";
	position: absolute;
	inset: -2px;
	z-index: -1;
	padding: 2px;
	border-radius: inherit;
	background: conic-gradient(from var(--pp-angle), transparent 0deg, #ff6a2b 60deg, #fff 90deg, var(--promo-hot) 120deg, transparent 180deg, transparent 360deg);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	animation: pp-spin 4s linear infinite;
	pointer-events: none;
}

@keyframes pp-spin {
	to { --pp-angle: 360deg; }
}

.html-promo-product-page .product-prices-box .product-price span,
.html-promo-product-page .product-prices-box .price-value-wrapper span {
	color: var(--promo-accent);
	text-shadow: 0 0 22px rgba(255, 90, 54, .35);
}

.html-promo-product-page .product-prices-box .old-product-price,
.html-promo-product-page .product-prices-box .tooltip-oldPrince .label {
	text-decoration-color: var(--promo-accent);
	text-decoration-thickness: 2px;
}

/* --------------------------------------------------------------------------
   Butoanele de cos: negre, cu pulsatie
   -------------------------------------------------------------------------- */

.html-promo-product-page .product-prices-box .add-to-cart-button,
.html-promo-product-page .nav-add-to-cart,
.html-promo-product-page .sticky-cart-add {
	position: relative;
	z-index: 0;
	overflow: hidden;
	background: #000 !important;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
	animation: pp-pulse 3.2s ease-in-out infinite;
}

.html-promo-product-page .product-prices-box .add-to-cart-button:hover,
.html-promo-product-page .nav-add-to-cart:hover,
.html-promo-product-page .sticky-cart-add:hover {
	background: var(--promo-hot) !important;
}

.html-promo-product-page .product-prices-box .add-to-cart-button .icoadd,
.html-promo-product-page .sticky-cart-add .icoadd {
	background: var(--promo-hot);
}

/* --------------------------------------------------------------------------
   Bara de navigare fixa (sticla alba in tema) + bara de cos de jos
   -------------------------------------------------------------------------- */

.html-promo-product-page .navbar_sticky.fixed {
	background: rgba(20, 20, 22, .82);
	border-color: rgba(255, 255, 255, .1);
	box-shadow: 0 10px 30px rgba(0, 0, 0, .55);
}

.html-promo-product-page .sticky-cart-bar {
	background: rgba(12, 12, 14, .94);
	border-top: 1px solid rgba(255, 255, 255, .08);
	box-shadow: 0 -8px 28px rgba(0, 0, 0, .6);
}

.html-promo-product-page .sticky-cart-wishlist,
.html-promo-product-page .sticky-cart-qty button {
	background: var(--promo-surface-2);
	border-color: var(--pd-line);
	color: var(--pd-ink);
}

.html-promo-product-page .sticky-cart-wishlist {
	color: var(--promo-accent);
}

.html-promo-product-page .sticky-cart-wishlist:hover {
	background: var(--pd-brand-50);
}

.html-promo-product-page .sticky-cart-qty {
	border-color: var(--pd-line);
}

/* header search stays light: color-scheme: dark would give the input the browser's dark grey fill */
.html-promo-product-page .store-search-box {
	color-scheme: light;
}

.html-promo-product-page .sticky-cart-bar .sticky-cart-qty-input {
	background: var(--promo-surface);
	color: var(--pd-ink);
}

/* --------------------------------------------------------------------------
   Continut cu stiluri inline: widget-urile HTML si descrierile producatorilor
   -------------------------------------------------------------------------- */

/* plati securizate (coloana din mijloc); logo-urile cardurilor raman pe alb */
.html-promo-product-page .overview .html-widget .mainbordersku > div[style] {
	background: var(--pd-soft) !important;
}

.html-promo-product-page .overview .html-widget .mainbordersku div[style*="color"] {
	color: var(--pd-text) !important;
}

/* garantie / conformitate (sub sectiuni) */
.html-promo-product-page .product-details-page .page-body > .html-widget > div[style] {
	background: var(--promo-surface) !important;
	color: var(--pd-text) !important;
	box-shadow: var(--pd-shadow) !important;
}

.html-promo-product-page .product-details-page .page-body > .html-widget p[style] {
	color: var(--pd-text) !important;
}

.html-promo-product-page .product-details-page .page-body > .html-widget a[style] {
	background: none !important;
	color: var(--promo-accent) !important;
	-webkit-text-fill-color: var(--promo-accent) !important;
}

.html-promo-product-page .pd-description .full-description [style*="color"],
.html-promo-product-page .pd-description .full-description font[color] {
	color: inherit !important;
}

.html-promo-product-page .pd-description .full-description [style*="background"] {
	background-color: transparent !important;
}

/* --------------------------------------------------------------------------
   Documentatie (sticla alba in styles.css)
   -------------------------------------------------------------------------- */

.html-promo-product-page .detAttachments,
.html-promo-product-page .detAttachments[open] {
	background: var(--promo-surface);
	border-color: var(--pd-line);
	box-shadow: var(--pd-shadow);
}

.html-promo-product-page .summaryAttachments:hover {
	background: rgba(255, 255, 255, .04);
}

.html-promo-product-page .attachments-text,
.html-promo-product-page .detAttachments .file-attachments ul li a.attachmentLink {
	color: var(--pd-ink);
}

.html-promo-product-page .attachments-count,
.html-promo-product-page .detAttachments .attachment-category .name {
	color: var(--pd-muted);
}

.html-promo-product-page .arrow-icon,
.html-promo-product-page .detAttachments .file-attachments ul li,
.html-promo-product-page .detAttachments .file-attachments ul li:hover,
.html-promo-product-page .detAttachments .file-attachments ul li .attachmentLinkImg,
.html-promo-product-page .detAttachments .file-attachments ul li .attachmentAction {
	background: var(--promo-surface-2);
	border-color: var(--pd-line);
	box-shadow: none;
	color: var(--pd-text);
}

.html-promo-product-page .detAttachments .file-attachments ul li a.attachmentLink:hover,
.html-promo-product-page .detAttachments .file-attachments ul li:hover .attachmentAction {
	color: var(--promo-accent);
}

.html-promo-product-page .detAttachments .attachment-category + .attachment-category {
	border-top-color: var(--pd-line);
}

/* --------------------------------------------------------------------------
   Caruselele de produse de sub pagina
   -------------------------------------------------------------------------- */

.html-promo-product-page .product-details-page .item-box {
	background: var(--promo-surface);
	border-color: var(--pd-line);
	box-shadow: var(--pd-shadow);
}

.html-promo-product-page .product-details-page .item-box .title,
.html-promo-product-page .product-details-page .item-box .title a {
	color: var(--pd-ink);
}

.html-promo-product-page .product-details-page .nop-jcarousel .loading-overlay {
	background: rgba(10, 10, 11, .7);
}

/* --------------------------------------------------------------------------
   Mobil + miscare redusa
   -------------------------------------------------------------------------- */

@media (max-width: 1024px) {
	.html-promo-product-page .pp-bg .pp-bg-desktop {
		display: none;
	}

	.html-promo-product-page .pp-flag {
		font-size: 13px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.html-promo-product-page .pp-bg i,
	.html-promo-product-page .pp-flag,
	.html-promo-product-page .pp-flag::after,
	.html-promo-product-page .gallery .picture,
	.html-promo-product-page .product-prices-box::before,
	.html-promo-product-page .product-prices-box .add-to-cart-button,
	.html-promo-product-page .nav-add-to-cart,
	.html-promo-product-page .sticky-cart-add {
		animation: none;
	}
}