/* POWERMAG — tema Black Friday. Se încarcă DOAR cât campania e pornită (body.bf-on). */
:root {
  --bf-black: #07070a;
  --bf-ink: #121218;
  --bf-gold: #ffd400;
  --bf-gold-2: #ffb800;
  --bf-hot: #ff2d55;
}

/* ── Banda de sus ─────────────────────────────────────────────────────────── */
.bf-strip {
  position: relative; overflow: hidden; background: var(--bf-black); color: #fff;
  font-size: 13.5px; border-bottom: 1px solid rgba(255, 212, 0, .25);
}
.bf-strip::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(100deg, transparent 30%, rgba(255, 212, 0, .16) 45%, transparent 60%);
  transform: translateX(-100%); animation: bf-shine 4.5s ease-in-out infinite;
}
.bf-strip-in { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; padding-top: 7px; padding-bottom: 7px; position: relative; z-index: 1; }
.bf-tag {
  background: var(--bf-gold); color: #000; font-weight: 900; letter-spacing: 2px; font-size: 11.5px;
  padding: 3px 10px; border-radius: 4px; animation: bf-pulse 2.2s ease-in-out infinite;
}
.bf-msg b { color: var(--bf-gold); }
.bf-count { color: #d6d6d6; }
.bf-count b { color: #fff; font-variant-numeric: tabular-nums; letter-spacing: .5px; }
.bf-cta { color: var(--bf-gold); font-weight: 800; text-decoration: none; white-space: nowrap; }
.bf-cta:hover { color: #fff; text-decoration: none; }

/* ── Header + meniu ───────────────────────────────────────────────────────── */
.bf-on .site-header { background: radial-gradient(90% 180% at 85% -40%, #2b2300 0, var(--bf-black) 55%); }
.bf-on .topbar { background: rgba(255, 255, 255, .03); }
.bf-on .mainnav {
  background: var(--bf-ink); border-bottom: 3px solid transparent;
  border-image: linear-gradient(90deg, var(--bf-gold-2), var(--bf-hot), var(--bf-gold), var(--bf-gold-2)) 1;
}
.bf-on .search button { background: var(--bf-gold); color: #000; font-weight: 800; }
.bf-on .nav-quick a.nav-bf {
  background: var(--bf-gold); color: #000 !important; font-weight: 900; letter-spacing: .5px;
  border-radius: 6px; padding: 4px 10px; box-shadow: 0 0 14px rgba(255, 212, 0, .45);
}
.bf-on .nav-quick a.nav-bf:hover { background: #fff; text-decoration: none; }

/* ── Bannerul de pe prima pagină ──────────────────────────────────────────── */
.bf-hero {
  position: relative; overflow: hidden; margin: 16px 0; border-radius: 14px; color: #fff;
  background: var(--bf-black); display: grid; grid-template-columns: 1.4fr 1fr; gap: 24px; align-items: center;
  padding: 38px 42px; min-height: 250px; isolation: isolate;
  box-shadow: 0 18px 40px -18px rgba(0, 0, 0, .6);
}
.bfh-glow {
  position: absolute; inset: -40%; z-index: -1;
  background:
    radial-gradient(35% 45% at 78% 40%, rgba(255, 212, 0, .35), transparent 70%),
    radial-gradient(30% 40% at 95% 90%, rgba(255, 45, 85, .30), transparent 70%),
    radial-gradient(40% 50% at 10% 110%, rgba(255, 184, 0, .14), transparent 70%);
  animation: bf-drift 14s ease-in-out infinite alternate;
}
.bf-hero::before {
  content: ''; position: absolute; inset: 0; z-index: -1; opacity: .5;
  background-image: radial-gradient(rgba(255, 255, 255, .09) 1px, transparent 1px); background-size: 18px 18px;
}
.bfh-kicker { text-transform: uppercase; letter-spacing: 3px; font-size: 12px; font-weight: 800; color: var(--bf-gold); }
.bfh-title { margin: 6px 0 10px; font-size: clamp(38px, 6vw, 72px); line-height: .95; font-weight: 900; letter-spacing: -1px; }
.bfh-outline { color: transparent; -webkit-text-stroke: 2px var(--bf-gold); }
.bfh-sub { margin: 0 0 18px; font-size: 16px; color: #d9d9d9; max-width: 46ch; }
.bfh-sub b { color: var(--bf-gold); font-size: 1.15em; }
.bfh-actions { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.bfh-btn {
  background: var(--bf-gold); color: #000; font-weight: 900; padding: 13px 26px; border-radius: 10px; font-size: 15px;
  box-shadow: 0 8px 22px -6px rgba(255, 212, 0, .6); transition: transform .15s, box-shadow .15s;
}
.bfh-btn:hover { background: #fff; color: #000; transform: translateY(-2px); text-decoration: none; }
.bfh-link { color: #fff; font-weight: 700; }
.bfh-link:hover { color: var(--bf-gold); }
.bfh-side { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.bfh-pct {
  font-size: clamp(80px, 11vw, 150px); font-weight: 900; line-height: .85; letter-spacing: -4px;
  background: linear-gradient(180deg, #fff3a6 0%, var(--bf-gold) 40%, var(--bf-gold-2) 75%, #ff7a00 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 6px 24px rgba(255, 196, 0, .35));
}
.bfh-pct small { font-size: .45em; letter-spacing: 0; }
.bfh-count { display: flex; gap: 8px; }
.bfh-count > div {
  background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 212, 0, .35); border-radius: 10px;
  min-width: 62px; padding: 8px 6px; text-align: center; backdrop-filter: blur(4px);
}
.bfh-count b { display: block; font-size: 26px; font-weight: 900; font-variant-numeric: tabular-nums; color: #fff; }
.bfh-count span { font-size: 10.5px; text-transform: uppercase; letter-spacing: 1.5px; color: #bdbdbd; }

/* ── Cardurile de produs ──────────────────────────────────────────────────── */
.badge-bf {
  background: var(--bf-black); color: #fff; font-size: 10.5px; letter-spacing: 1px; border-radius: 4px; padding: 4px 8px;
  box-shadow: 0 0 0 1px rgba(255, 212, 0, .6);
}
.badge-bf b { color: var(--bf-gold); }
.badge-disc-bf { top: 38px; background: var(--bf-hot); font-size: 13px; }
.bf-on .pcard:hover { border-color: var(--bf-gold); box-shadow: 0 10px 26px -12px rgba(0, 0, 0, .35), 0 0 0 1px var(--bf-gold); }
.bf-on .disc-chip { background: var(--bf-black); color: var(--bf-gold); }
.bf-on .section-head::after { background: linear-gradient(90deg, var(--bf-gold), var(--bf-hot)); width: 120px; }

/* ── Pagina produsului ────────────────────────────────────────────────────── */
.pbuy-bf { box-shadow: 0 0 0 2px var(--bf-gold), 0 14px 30px -16px rgba(0, 0, 0, .4); }
.bf-pill {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: -4px 0 10px;
  background: var(--bf-black); color: #fff; border-radius: 8px; padding: 8px 12px; font-size: 13px; font-weight: 600;
}
.bf-pill span { background: var(--bf-gold); color: #000; font-weight: 900; letter-spacing: 1px; font-size: 11px; padding: 2px 7px; border-radius: 4px; }

/* ── Coșul ────────────────────────────────────────────────────────────────── */
.sum-bf { color: #067d38; font-weight: 800; }

/* ── Animații ─────────────────────────────────────────────────────────────── */
@keyframes bf-shine { 0%, 55% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
@keyframes bf-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(255, 212, 0, .55); } 50% { box-shadow: 0 0 0 6px rgba(255, 212, 0, 0); } }
@keyframes bf-drift { from { transform: translate3d(-3%, -2%, 0) scale(1); } to { transform: translate3d(3%, 2%, 0) scale(1.08); } }
@media (prefers-reduced-motion: reduce) {
  .bf-strip::after, .bf-tag, .bfh-glow { animation: none; }
}

/* ── Telefon ──────────────────────────────────────────────────────────────── */
@media (max-width: 800px) {
  .bf-hero { grid-template-columns: 1fr; padding: 26px 20px; text-align: left; gap: 14px; }
  .bfh-side { flex-direction: row; justify-content: space-between; flex-wrap: wrap; }
  .bfh-pct { font-size: 76px; letter-spacing: -2px; }
  .bfh-count > div { min-width: 48px; padding: 6px 4px; }
  .bfh-count b { font-size: 20px; }
  .bf-strip-in { gap: 8px; font-size: 12.5px; }
}

/* ══ v2: mai multă temă ══════════════════════════════════════════════════ */

/* Prima pagină pe fundal închis: cardurile albe ies în față ca pe vitrina de BF. */
body.bf-on.page-home { background: #0d0d11; }
.bf-on.page-home .section-head { border-bottom-color: rgba(255, 255, 255, .12); }
.bf-on.page-home .section-head h2 { color: #fff; }
.bf-on.page-home .section-head a { color: var(--bf-gold); }
.bf-on.page-home .benefit { background: var(--bf-ink); border-color: rgba(255, 212, 0, .22); color: #fff; }
.bf-on.page-home .benefit span { color: #a9a9b3; }
.bf-on.page-home .benefit .ico { color: var(--bf-gold); }
.bf-on.page-home .pcard { border-color: transparent; }
.bf-on.page-home .cs-card { border-color: transparent; }
.bf-on .hero-slide { background: linear-gradient(160deg, #15151c 0%, #0a0a0e 60%, #2a2100 100%) !important; }
.bf-on .hero-slide::after { background: radial-gradient(circle, rgba(255, 212, 0, .35), transparent 70%) !important; }
.bf-on .btn-hero { background: var(--bf-gold); color: #000; }

/* Banda de deasupra listărilor. */
.bf-listing {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin: 6px 0 14px; padding: 12px 18px;
  background: linear-gradient(100deg, var(--bf-black) 0%, #1a1608 70%, #3a2c00 100%); color: #fff; border-radius: 12px;
  box-shadow: inset 0 0 0 1px rgba(255, 212, 0, .3);
}
.bf-listing-pct {
  font-size: 30px; font-weight: 900; line-height: 1; letter-spacing: -1px;
  background: linear-gradient(180deg, #fff3a6, var(--bf-gold) 50%, #ff8a00); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.bf-listing-txt { flex: 1 1 260px; min-width: 0; font-size: 14px; color: #ddd; }
.bf-listing-txt b { color: var(--bf-gold); letter-spacing: 1px; }
.bf-listing-count { font-size: 13px; color: #bbb; }
.bf-listing-count b { color: #fff; font-variant-numeric: tabular-nums; }

/* Cardul: cât economisești. */
.pcard-save { font-size: 12px; font-weight: 800; color: #067d38; margin-top: 2px; }

/* Panglica din colțul pozei mari. */
.bf-on .gallery-main { position: relative; overflow: hidden; }
.bf-ribbon {
  position: absolute; z-index: 3; top: 26px; right: -46px; width: 190px; transform: rotate(45deg);
  background: var(--bf-black); color: #fff; text-align: center; padding: 6px 0 7px; font-size: 18px; font-weight: 900;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .35), inset 0 -2px 0 var(--bf-gold); line-height: 1.05;
}
.bf-ribbon b { display: block; font-size: 9.5px; letter-spacing: 2px; color: var(--bf-gold); }
.bf-pill em { flex-basis: 100%; font-style: normal; color: #cfcfcf; font-size: 12.5px; }
.bf-pill em[hidden] { display: none; }
.bf-pill em b { color: var(--bf-gold); font-variant-numeric: tabular-nums; }

/* Coș. */
.bf-cart {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 0 0 16px; padding: 12px 16px;
  background: var(--bf-black); color: #eee; border-radius: 10px; box-shadow: inset 0 0 0 1px rgba(255, 212, 0, .35);
}
.bf-cart b { color: var(--bf-gold); }
.bf-cart-tag { background: var(--bf-gold); color: #000; font-weight: 900; font-size: 11px; letter-spacing: 1.5px; padding: 3px 8px; border-radius: 4px; }
.bf-cart-count { margin-left: auto; font-size: 13px; color: #bbb; }
.bf-cart-count b { font-variant-numeric: tabular-nums; }

/* Newsletter + footer. */
.bf-on .newsletter-band { background: linear-gradient(90deg, var(--bf-black), #1d1806 60%, #3a2c00); }
.bf-on .newsletter-band h3 { color: var(--bf-gold); }
.bf-on .newsletter-band .btn { background: var(--bf-gold); color: #000; font-weight: 800; }
.bf-on .site-footer { background: var(--bf-black); border-top: 3px solid var(--bf-gold); }

/* Stickerul care plutește (doar pe ecrane mari, ca să nu acopere nimic pe telefon). */
.bf-sticker {
  position: fixed; right: 26px; bottom: 96px; z-index: 80; width: 74px; height: 74px; border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center; text-decoration: none;
  background: radial-gradient(circle at 35% 30%, #fff3a6, var(--bf-gold) 45%, var(--bf-gold-2) 80%);
  color: #000; box-shadow: 0 10px 24px -6px rgba(0, 0, 0, .45), 0 0 0 4px var(--bf-black), 0 0 0 6px var(--bf-gold);
  animation: bf-float 3.5s ease-in-out infinite; transition: transform .15s;
}
.bf-sticker span { font-size: 22px; font-weight: 900; line-height: 1; letter-spacing: -1px; }
.bf-sticker small { font-size: 9.5px; font-weight: 900; letter-spacing: 2px; }
.bf-sticker-x {
  position: fixed; right: 20px; bottom: 160px; z-index: 81; width: 22px; height: 22px; border-radius: 50%; border: 0;
  background: var(--bf-black); color: #fff; font-size: 13px; line-height: 22px; text-align: center; cursor: pointer; padding: 0;
  box-shadow: 0 0 0 1px var(--bf-gold);
}
.bf-sticker[hidden], .bf-sticker-x[hidden] { display: none; }
.bf-sticker:hover { text-decoration: none; transform: scale(1.08) rotate(-6deg); animation-play-state: paused; }
@keyframes bf-float { 0%, 100% { transform: translateY(0) rotate(-8deg); } 50% { transform: translateY(-8px) rotate(4deg); } }
@media (max-width: 900px) { .bf-sticker, .bf-sticker-x { display: none; } }
@media (prefers-reduced-motion: reduce) { .bf-sticker { animation: none; } }

/* ══ v3: carduri închise + texte pe fundal ═══════════════════════════════ */

/* Fundalul primei pagini: „BLACK FRIDAY · POWERMAG" repetat, abia vizibil. */
body.bf-on.page-home {
  background-color: #0d0d11;
  background-image:
    radial-gradient(60% 40% at 50% 0, rgba(255, 212, 0, .07), transparent 70%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='640' height='340'%3E%3Cg transform='rotate(-14 320 170)' font-family='Arial Black,Arial,sans-serif' font-weight='900' text-anchor='middle'%3E%3Ctext x='320' y='150' font-size='64' fill='none' stroke='rgba(255,212,0,.14)' stroke-width='1.6'%3EBLACK FRIDAY%3C/text%3E%3Ctext x='320' y='212' font-size='30' letter-spacing='10' fill='rgba(255,255,255,.07)'%3EPOWERMAG %C2%B7 REDUCERI%3C/text%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, repeat;
  background-size: 100% 900px, 640px 340px;
}
/* Titlurile secțiunilor: steluța aurie în față. */
.bf-on.page-home .section-head h2::before { content: '✦ '; color: var(--bf-gold); }

/* Banda care rulează între secțiuni. */
.bf-marquee {
  position: relative; overflow: hidden; margin: 22px -4px; padding: 10px 0;
  background: var(--bf-gold); color: #000; transform: rotate(-1.2deg);
  box-shadow: 0 10px 26px -12px rgba(255, 212, 0, .55);
}
.bf-marquee-alt { background: var(--bf-black); color: #fff; transform: rotate(1deg); box-shadow: inset 0 0 0 1px rgba(255, 212, 0, .35); }
.bf-marquee-in { display: flex; width: max-content; animation: bf-scroll 38s linear infinite; }
.bf-marquee-alt .bf-marquee-in { animation-direction: reverse; }
.bf-marquee span { font-size: 19px; font-weight: 900; letter-spacing: 2px; white-space: nowrap; padding: 0 18px; }
.bf-marquee i { font-style: normal; font-size: 15px; align-self: center; color: var(--bf-hot); }
.bf-marquee-alt span:nth-child(4n+3) { color: var(--bf-gold); }
@keyframes bf-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* Cardul de produs pe negru (toate paginile cât ține campania).
   Poza rămâne pe alb: pozele furnizorilor au fundal alb și ar arăta decupate pe negru. */
.bf-on .pcard {
  background: linear-gradient(180deg, #17171e 0%, #101015 100%);
  border: 1px solid rgba(255, 212, 0, .16); color: #e9e9ef;
}
.bf-on .pcard:hover { border-color: var(--bf-gold); box-shadow: 0 14px 30px -14px rgba(0, 0, 0, .8), 0 0 0 1px var(--bf-gold), 0 0 22px -6px rgba(255, 212, 0, .45); }
.bf-on .pcard-img { background: #fff; margin: 8px 8px 0; border-radius: 8px; overflow: hidden; }
.bf-on .pcard-name { color: #ececf2; }
.bf-on .pcard-name:hover { color: var(--bf-gold); }
.bf-on .pcard-brand, .bf-on .no-reviews, .bf-on .stars-count, .bf-on .pcard-delivery { color: #9a9aa8; }
.bf-on .stars .st { color: #3a3a46; }
.bf-on .stars .st.on { color: var(--bf-gold); }
.bf-on .pcard .price-old { color: #8d8d9a; }
.bf-on .pcard .pr, .bf-on .pcard .pr-red { color: var(--bf-gold); }
.bf-on .pcard .disc-chip { background: var(--bf-hot); color: #fff; }
.bf-on .pcard .pcard-save { color: #4ee38b; }
.bf-on .pcard .stock-line.in { color: #4ee38b; }
.bf-on .pcard .stock-line.low { color: #ffb347; }
.bf-on .pcard .stock-line.out { color: #ff6b7d; }
.bf-on .pcard .pcard-rate { color: #4ee38b; }
.bf-on .pcard-add button {
  background: var(--bf-gold); color: #000; font-weight: 900; border: 0;
  box-shadow: 0 6px 16px -8px rgba(255, 212, 0, .7);
}
.bf-on .pcard-add button:hover { background: #fff; color: #000; }
.bf-on .pcard .btn-disabled { background: #24242c; color: #8d8d9a; border-color: #24242c; }
.bf-on .fav-heart { background: rgba(10, 10, 14, .85); border-color: rgba(255, 212, 0, .3); color: #8d8d9a; }
.bf-on .fav-heart:hover, .bf-on .fav-heart.on { color: var(--bf-hot); background: #1a1016; border-color: var(--bf-hot); }

/* Restul cardurilor de pe prima pagină. */
.bf-on.page-home .cs-card, .bf-on.page-home .cat-card, .bf-on.page-home .brand-chip {
  background: var(--bf-ink); border-color: rgba(255, 212, 0, .16); color: #ececf2;
}
.bf-on.page-home .cs-top, .bf-on.page-home .cat-card { color: #ececf2; }
.bf-on.page-home .cs-top h3 { color: #fff; }
.bf-on.page-home .cs-top img, .bf-on.page-home .cat-card img { background: #fff; border-radius: 10px; padding: 6px; }
.bf-on.page-home .cs-list { border-top-color: rgba(255, 255, 255, .1); }
.bf-on.page-home .cs-list a { color: #a9a9b6; }
.bf-on.page-home .cs-list a:hover, .bf-on.page-home .cs-all { color: var(--bf-gold); }

/* Cardurile din caruselul de sus: ramă neagră cu auriu, poza tot pe alb. */
.bf-on .home-slider .hero-slide .hgs-imgs .hgs-item .hgs-card {
  background: #15151b; box-shadow: 0 12px 24px rgba(0, 0, 0, .5), 0 0 0 1px rgba(255, 212, 0, .35);
}
.bf-on .home-slider .hero-slide .hgs-imgs .hgs-item .hgs-card img { background: #fff; padding: 3px; }
.bf-on .hgs-name { color: #ececf2; }
.bf-on .hgs-price { background: var(--bf-gold); color: #000; font-weight: 900; }

@media (prefers-reduced-motion: reduce) { .bf-marquee-in { animation: none; } }
@media (max-width: 800px) {
  .bf-marquee { margin: 16px -16px; }
  .bf-marquee span { font-size: 15px; padding: 0 12px; }
}

/* ══ v4: meniul de categorii pe negru ════════════════════════════════════ */
.bf-on .mega-btn { background: var(--bf-gold); color: #000; }
.bf-on .mega-btn:hover, .bf-on .megawrap.open .mega-btn { background: #fff; }
.bf-on .megamenu, .bf-on .home-menu, .bf-on .mm-panel {
  background: linear-gradient(180deg, #17171e 0%, #101015 100%); border-color: rgba(255, 212, 0, .22);
}
.bf-on .home-menu { box-shadow: 0 14px 30px -16px rgba(0, 0, 0, .8), inset 0 3px 0 var(--bf-gold); }
.bf-on .mm-panel { box-shadow: 0 18px 40px -12px rgba(0, 0, 0, .75); }
.bf-on .mm-root-link { color: #e6e6ee; }
.bf-on .mm-root:hover > .mm-root-link, .bf-on .mm-root.open > .mm-root-link {
  background: rgba(255, 212, 0, .08); color: var(--bf-gold); border-left-color: var(--bf-gold);
}
.bf-on .mm-arrow { color: #5c5c6a; }
.bf-on .mm-root:hover .mm-arrow { color: var(--bf-gold); }
.bf-on .mm-ico { background: #fff; padding: 2px; }
.bf-on .mm-ico-dot { background: var(--bf-gold); }
.bf-on .mm-roots { scrollbar-color: #3a3a46 transparent; }
.bf-on .mm-panel-title { color: var(--bf-gold); border-bottom-color: rgba(255, 255, 255, .1); }
.bf-on .mm-panel-links a, .bf-on .mm-col-head { color: #e6e6ee; }
.bf-on .mm-col-links a { color: #a3a3b0; }
.bf-on .mm-panel-links a:hover, .bf-on .mm-col-head:hover, .bf-on .mm-col-links a:hover { color: var(--bf-gold); }
.bf-on .mm-all { color: var(--bf-gold); border-top-color: rgba(255, 255, 255, .1); }
.bf-on .mm-all:hover { background: rgba(255, 212, 0, .08); }