/* ============================================================
   PARFUMITE.EU — modern design system (frontend)
   Pink / purple / lilac. Loaded on the storefront.
   Author: redesign pass. Safe to extend.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700;800&family=Sora:wght@500;600;700;800&display=swap');

:root{
  /* brand palette */
  --plum:        #3b0764;
  --plum-2:      #4c1d95;
  --violet:      #7c3aed;
  --violet-600:  #6d28d9;
  --pink:        #ec4899;
  --pink-600:    #db2777;
  --lilac:       #c084fc;
  --lilac-soft:  #f3e8ff;

  --grad:        linear-gradient(135deg, #7c3aed 0%, #ec4899 100%);
  --grad-soft:   linear-gradient(135deg, #faf5ff 0%, #fdf2f8 100%);
  --grad-plum:   linear-gradient(120deg, #2e1065 0%, #4c1d95 45%, #831843 100%);

  /* ink + surfaces */
  --ink:         #2a1633;
  --ink-2:       #4a3b53;
  --muted:       #8b7d94;
  --bg:          #ffffff;
  --bg-soft:     #faf7fd;
  --line:        #efe4f6;
  --line-2:      #e7d7f2;

  /* effects */
  --radius:      18px;
  --radius-sm:   12px;
  --radius-lg:   26px;
  --shadow-sm:   0 2px 8px rgba(76,29,149,.06);
  --shadow:      0 10px 30px -12px rgba(76,29,149,.22);
  --shadow-lg:   0 24px 60px -18px rgba(124,58,237,.32);
  --ring:        0 0 0 4px rgba(192,132,252,.28);

  --maxw:        1240px;
  --font:        'Manrope', 'Open Sans', system-ui, sans-serif;
  --display:     'Sora', 'Manrope', system-ui, sans-serif;
}

/* ---------- resets that don't fight the legacy markup ---------- */
.pf, .pf *{ box-sizing:border-box; }
.pf-body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--font); font-size:15px; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
.pf-body img{ max-width:100%; height:auto; }
.pf a{ color:var(--violet-600); text-decoration:none; transition:color .18s; }
.pf a:hover{ color:var(--pink-600); }
.pf-wrap{ max-width:var(--maxw); margin:0 auto; padding:0 22px; }

/* ===========================================================
   HEADER
   =========================================================== */
.pf-topbar{
  background:var(--grad-plum); color:#fff;
  font-size:12.5px; letter-spacing:.04em;
}
.pf-topbar .pf-wrap{ display:flex; gap:18px; align-items:center; justify-content:center;
  height:38px; flex-wrap:wrap; }
.pf-topbar b{ color:#ffd9ef; font-weight:700; }
.pf-topbar span{ opacity:.92; }

.pf-header{
  position:sticky; top:0; z-index:60;
  background:rgba(255,255,255,.82); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
  box-shadow:0 6px 26px -22px rgba(76,29,149,.5);
}
.pf-header__row{ display:flex; align-items:center; gap:22px; height:84px; }
.pf-logo{ display:flex; align-items:center; gap:12px; font-family:var(--display);
  font-weight:700; font-size:28px; color:var(--plum); letter-spacing:.02em; white-space:nowrap; }
.pf-logo span{ background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.pf-logo small{ display:block; font-family:var(--font); font-weight:500; font-size:10.5px;
  letter-spacing:.34em; text-transform:uppercase; color:var(--muted); margin-top:-2px; }

/* search */
.pf-search{ flex:1; max-width:520px; position:relative; }
.pf-search input{
  width:100%; height:48px; border:1.5px solid var(--line-2); border-radius:999px;
  padding:0 52px 0 22px; font:inherit; font-size:14.5px; color:var(--ink);
  background:#fff; transition:.2s; outline:none;
}
.pf-search input:focus{ border-color:var(--lilac); box-shadow:var(--ring); }
.pf-search button{
  position:absolute; right:5px; top:5px; width:38px; height:38px; border:0; cursor:pointer;
  border-radius:999px; background:var(--grad); color:#fff; display:grid; place-items:center;
}
.pf-search button svg{ width:18px; height:18px; }

/* header actions */
.pf-actions{ display:flex; align-items:center; gap:10px; }
.pf-iconbtn{
  display:inline-flex; align-items:center; gap:9px; height:48px; padding:0 16px;
  border-radius:999px; border:1.5px solid var(--line-2); background:#fff; color:var(--ink);
  font-weight:600; font-size:13.5px; cursor:pointer; transition:.2s; white-space:nowrap;
}
.pf-iconbtn:hover{ border-color:var(--lilac); color:var(--plum); transform:translateY(-1px); }
.pf-iconbtn svg{ width:20px; height:20px; }
.pf-cartbtn{ background:var(--grad); border-color:transparent; color:#fff; box-shadow:var(--shadow); }
.pf-cartbtn:hover{ color:#fff; filter:brightness(1.05); }
.pf-cartbtn .pf-cart-count{
  background:#fff; color:var(--pink-600); font-weight:800; font-size:11px;
  min-width:20px; height:20px; padding:0 5px; border-radius:999px; display:grid; place-items:center;
}

/* ===========================================================
   NAV (categories)
   =========================================================== */
.pf-nav{ background:var(--plum); position:relative; z-index:50; }
.pf-nav__inner{ display:flex; align-items:stretch; gap:2px; flex-wrap:wrap; }
.pf-nav a{
  color:#f1e7fb; font-weight:600; font-size:13.5px; letter-spacing:.02em;
  text-transform:uppercase; padding:15px 18px; display:flex; align-items:center; gap:7px;
  position:relative; transition:.18s;
}
.pf-nav a .pf-home{ width:17px; height:17px; }
.pf-nav a::after{ content:""; position:absolute; left:18px; right:18px; bottom:9px; height:2px;
  background:var(--pink); border-radius:2px; transform:scaleX(0); transition:transform .2s; transform-origin:left; }
.pf-nav a:hover{ color:#fff; background:rgba(255,255,255,.07); }
.pf-nav a:hover::after{ transform:scaleX(1); }

/* mobile nav toggle */
.pf-burger{ display:none; }

/* ===========================================================
   HERO
   =========================================================== */
.pf-hero{ position:relative; overflow:hidden; background:var(--grad-soft); }
.pf-hero__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:30px; align-items:center;
  min-height:440px; padding:54px 0; }
.pf-hero__kicker{ display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:12px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--pink-600);
  background:#fff; border:1px solid var(--line-2); padding:8px 15px; border-radius:999px; box-shadow:var(--shadow-sm); }
.pf-hero h1{ font-family:var(--display); font-weight:700; font-size:clamp(34px,4.4vw,58px);
  line-height:1.05; color:var(--plum); margin:20px 0 16px; letter-spacing:-.01em; }
.pf-hero h1 em{ font-style:normal; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.pf-hero p{ font-size:17px; color:var(--ink-2); max-width:480px; margin:0 0 28px; }
.pf-hero__cta{ display:flex; gap:14px; flex-wrap:wrap; }
.pf-hero__art{ position:relative; height:100%; min-height:380px; border-radius:var(--radius-lg);
  background:var(--grad); overflow:hidden; box-shadow:var(--shadow-lg); }
.pf-hero__art img{ width:100%; height:100%; object-fit:cover; mix-blend-mode:luminosity; opacity:.92; }
.pf-hero__blob{ position:absolute; border-radius:50%; filter:blur(46px); opacity:.55; }
.pf-hero__blob.a{ width:280px; height:280px; background:#f9a8d4; top:-60px; right:-40px; }
.pf-hero__blob.b{ width:240px; height:240px; background:#c4b5fd; bottom:-70px; left:-50px; }

/* ===========================================================
   BUTTONS
   =========================================================== */
.pf-btn{ display:inline-flex; align-items:center; justify-content:center; gap:9px;
  height:52px; padding:0 28px; border-radius:999px; font:inherit; font-weight:700; font-size:15px;
  cursor:pointer; border:1.5px solid transparent; transition:.2s; text-decoration:none; }
.pf-btn svg{ width:19px; height:19px; }
.pf-btn--primary{ background:var(--grad); color:#fff; box-shadow:var(--shadow); }
.pf-btn--primary:hover{ color:#fff; transform:translateY(-2px); box-shadow:var(--shadow-lg); }
.pf-btn--ghost{ background:#fff; color:var(--plum); border-color:var(--line-2); }
.pf-btn--ghost:hover{ border-color:var(--lilac); color:var(--plum); transform:translateY(-2px); }
.pf-btn--sm{ height:42px; padding:0 18px; font-size:13.5px; }
.pf-btn--block{ width:100%; }

/* ===========================================================
   SECTION HEADINGS
   =========================================================== */
.pf-section{ padding:56px 0; }
.pf-section--soft{ background:var(--bg-soft); }
.pf-shead{ text-align:center; margin-bottom:36px; }
.pf-shead .eyebrow{ font-weight:700; font-size:12px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--pink-600); }
.pf-shead h2{ font-family:var(--display); font-weight:700; font-size:clamp(26px,3vw,40px);
  color:var(--plum); margin:8px 0 0; }
.pf-shead p{ color:var(--muted); margin:10px auto 0; max-width:560px; }
.pf-shead--left{ text-align:left; display:flex; justify-content:space-between; align-items:flex-end; gap:18px; }

/* ===========================================================
   PRODUCT GRID + CARDS
   Styles BOTH the new .pf-grid/.pf-card and the legacy
   .itemcont / .itempic / .itinfo / .itprice markup so every
   listing page is upgraded automatically.
   =========================================================== */
.pf-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:22px; }
.pf-grid--4{ grid-template-columns:repeat(4,1fr); }

/* shared card look */
.pf-card,
.itemcont{
  position:relative; background:#fff; border:1px solid var(--line);
  border-radius:var(--radius); padding:14px; display:flex; flex-direction:column;
  transition:transform .22s, box-shadow .22s, border-color .22s; overflow:hidden;
}
.pf-card:hover,
.itemcont:hover{ transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:var(--line-2); }

/* legacy: neutralise old fixed sizing so cards align in the new grid */
.itemcont{ width:auto !important; height:auto !important; float:none !important;
  margin:0 !important; }

.pf-card__media,
.itempic{
  position:relative; height:210px !important; border-radius:var(--radius-sm);
  background:var(--grad-soft); display:grid !important; place-items:center; overflow:hidden; margin-bottom:14px;
}
.pf-card__media img,
.itempic img{ max-height:185px; width:auto; object-fit:contain; mix-blend-mode:multiply;
  transition:transform .35s; }
.pf-card:hover .pf-card__media img,
.itemcont:hover .itempic img{ transform:scale(1.06); }

/* legacy text rows */
.itinfo{ color:var(--ink) !important; font-weight:600; font-size:14px; line-height:1.4;
  min-height:42px; display:flex; align-items:center; }
.itinfo br{ display:none; }
.itprice{ color:var(--pink-600) !important; font-weight:800; font-size:14.5px; margin-top:8px; }
.itprice font[style*="line-through"]{ color:var(--muted) !important; font-weight:500; font-size:12.5px; }

/* new card text */
.pf-card__brand{ font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--lilac); }
.pf-card__name{ color:var(--ink); font-weight:600; font-size:14px; line-height:1.4; margin:3px 0 6px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.pf-card__price{ color:var(--pink-600); font-weight:800; font-size:15px; margin-top:auto; }
.pf-card__price del{ color:var(--muted); font-weight:500; font-size:12.5px; margin-left:6px; }

/* card badges */
.pf-badge{ position:absolute; top:12px; left:12px; z-index:3; font-size:11px; font-weight:800;
  letter-spacing:.04em; padding:5px 10px; border-radius:999px; color:#fff; background:var(--pink);
  box-shadow:0 6px 16px -6px rgba(236,72,153,.7); }
.pf-badge--promo{ background:linear-gradient(135deg,#f43f5e,#db2777); }
.pf-badge--new{ background:linear-gradient(135deg,#8b5cf6,#6d28d9); }

/* quick actions injected by JS */
.pf-card__tools{ position:absolute; top:12px; right:12px; z-index:3; display:flex; flex-direction:column; gap:8px;
  opacity:0; transform:translateX(8px); transition:.2s; }
.pf-card:hover .pf-card__tools,
.itemcont:hover .pf-card__tools{ opacity:1; transform:none; }
.pf-card__tool{ width:40px; height:40px; border-radius:50%; border:0; cursor:pointer;
  background:#fff; color:var(--plum); box-shadow:var(--shadow); display:grid; place-items:center; transition:.18s; }
.pf-card__tool:hover{ background:var(--grad); color:#fff; }
.pf-card__tool svg{ width:18px; height:18px; }

/* star rating (display) */
.pf-stars{ --r:0; display:inline-flex; gap:2px; vertical-align:middle; }
.pf-stars i{ width:15px; height:15px; background:var(--line-2); display:inline-block;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/></svg>") center/contain no-repeat; }
.pf-stars i.on{ background:linear-gradient(135deg,#fbbf24,#f59e0b); }
.pf-card__rating{ display:flex; align-items:center; gap:7px; margin:2px 0 8px; }
.pf-card__rating small{ color:var(--muted); font-size:12px; }

/* brand logo carousel */
.pf-brands{ display:flex; gap:34px; align-items:center; flex-wrap:wrap; justify-content:center; }
.pf-brands img{ height:42px; width:auto; filter:grayscale(1); opacity:.6; transition:.2s; }
.pf-brands img:hover{ filter:none; opacity:1; }

/* ===========================================================
   FOOTER
   =========================================================== */
.pf-footer{ background:var(--grad-plum); color:#e9defb; margin-top:40px; }
.pf-footer__top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:30px; padding:54px 0 40px; }
.pf-footer h4{ font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:#fff; margin:0 0 16px; font-weight:700; }
.pf-footer a{ color:#d8c7ef; display:block; padding:5px 0; font-size:14px; }
.pf-footer a:hover{ color:#fff; }
.pf-footer__brand .pf-logo{ color:#fff; }
.pf-footer__brand p{ color:#cbb6e6; font-size:14px; max-width:300px; }
.pf-footer__bottom{ border-top:1px solid rgba(255,255,255,.12); padding:18px 0; font-size:13px;
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; color:#bda6da; }
.pf-news{ display:flex; gap:8px; margin-top:8px; }
.pf-news input{ flex:1; height:46px; border-radius:999px; border:0; padding:0 18px; font:inherit; }
.pf-news button{ height:46px; padding:0 20px; border-radius:999px; border:0; cursor:pointer;
  background:var(--pink); color:#fff; font-weight:700; }

/* ===========================================================
   MODAL (quick view)
   =========================================================== */
.pf-modal{ position:fixed; inset:0; z-index:120; display:none; }
.pf-modal.open{ display:block; }
.pf-modal__backdrop{ position:absolute; inset:0; background:rgba(46,16,101,.42); backdrop-filter:blur(4px);
  opacity:0; transition:opacity .25s; }
.pf-modal.open .pf-modal__backdrop{ opacity:1; }
.pf-modal__dialog{ position:relative; max-width:860px; margin:6vh auto; background:#fff;
  border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); overflow:hidden;
  transform:translateY(20px) scale(.98); opacity:0; transition:.28s; }
.pf-modal.open .pf-modal__dialog{ transform:none; opacity:1; }
.pf-modal__close{ position:absolute; top:14px; right:14px; z-index:4; width:42px; height:42px; border-radius:50%;
  border:0; cursor:pointer; background:#fff; box-shadow:var(--shadow); color:var(--plum); display:grid; place-items:center; }
.pf-modal__close:hover{ background:var(--grad); color:#fff; }
.pf-modal__grid{ display:grid; grid-template-columns:1fr 1fr; }
.pf-modal__media{ background:var(--grad-soft); display:grid; place-items:center; padding:30px; min-height:380px; }
.pf-modal__media img{ max-height:340px; mix-blend-mode:multiply; }
.pf-modal__body{ padding:34px 32px; display:flex; flex-direction:column; }
.pf-modal__brand{ font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--lilac); }
.pf-modal__title{ font-family:var(--display); font-weight:700; font-size:26px; color:var(--plum); margin:6px 0 10px; }
.pf-modal__price{ font-size:24px; font-weight:800; color:var(--pink-600); margin:8px 0 16px; }
.pf-modal__price del{ color:var(--muted); font-weight:500; font-size:16px; margin-left:8px; }
.pf-modal__desc{ color:var(--ink-2); font-size:14px; max-height:140px; overflow:auto; margin-bottom:18px; }
.pf-modal__row{ display:flex; gap:12px; margin-top:auto; }
.pf-modal__loading{ padding:60px; text-align:center; color:var(--muted); grid-column:1/-1; }

/* spinner */
.pf-spin{ width:34px; height:34px; border:3px solid var(--line-2); border-top-color:var(--violet);
  border-radius:50%; animation:pf-spin .8s linear infinite; margin:0 auto 14px; }
@keyframes pf-spin{ to{ transform:rotate(360deg); } }

/* ===========================================================
   TOAST
   =========================================================== */
.pf-toasts{ position:fixed; right:22px; bottom:22px; z-index:200; display:flex; flex-direction:column; gap:12px; }
.pf-toast{ display:flex; align-items:center; gap:12px; background:#fff; border:1px solid var(--line);
  border-left:4px solid var(--pink); border-radius:var(--radius-sm); padding:14px 18px; min-width:280px;
  box-shadow:var(--shadow-lg); transform:translateX(120%); transition:transform .35s cubic-bezier(.2,.8,.2,1); }
.pf-toast.show{ transform:none; }
.pf-toast__ic{ width:38px; height:38px; border-radius:50%; background:var(--lilac-soft); color:var(--violet-600);
  display:grid; place-items:center; flex:none; }
.pf-toast__ic svg{ width:20px; height:20px; }
.pf-toast b{ display:block; color:var(--ink); font-size:14px; }
.pf-toast small{ color:var(--muted); font-size:12.5px; }

/* ===========================================================
   UPSELL RAIL
   =========================================================== */
.pf-rail{ display:flex; gap:18px; overflow-x:auto; padding:6px 2px 14px; scroll-snap-type:x mandatory; }
.pf-rail > *{ flex:0 0 210px; scroll-snap-align:start; }
.pf-rail::-webkit-scrollbar{ height:8px; }
.pf-rail::-webkit-scrollbar-thumb{ background:var(--line-2); border-radius:999px; }

/* trust strip */
.pf-trust{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.pf-trust__item{ display:flex; gap:13px; align-items:center; background:#fff; border:1px solid var(--line);
  border-radius:var(--radius); padding:18px; box-shadow:var(--shadow-sm); }
.pf-trust__ic{ width:46px; height:46px; border-radius:13px; background:var(--lilac-soft); color:var(--violet-600);
  display:grid; place-items:center; flex:none; }
.pf-trust__ic svg{ width:24px; height:24px; }
.pf-trust b{ display:block; color:var(--ink); font-size:14px; }
.pf-trust small{ color:var(--muted); font-size:12.5px; }

/* ===========================================================
   RESPONSIVE
   =========================================================== */
@media (max-width:1080px){
  .pf-grid{ grid-template-columns:repeat(3,1fr); }
  .pf-footer__top{ grid-template-columns:1fr 1fr; }
  .pf-trust{ grid-template-columns:1fr 1fr; }
}
@media (max-width:820px){
  .pf-header__row{ height:auto; flex-wrap:wrap; padding:14px 0; gap:14px; }
  .pf-search{ order:3; max-width:none; flex-basis:100%; }
  .pf-hero__grid{ grid-template-columns:1fr; text-align:center; }
  .pf-hero__art{ display:none; }
  .pf-hero__cta{ justify-content:center; }
  .pf-modal__grid{ grid-template-columns:1fr; }
  .pf-modal__media{ min-height:240px; }
  .pf-burger{ display:inline-flex; }
  .pf-nav__inner{ display:none; flex-direction:column; }
  .pf-nav__inner.open{ display:flex; }
  .pf-nav a{ width:100%; }
}
@media (max-width:560px){
  .pf-grid{ grid-template-columns:repeat(2,1fr); gap:14px; }
  .pf-footer__top{ grid-template-columns:1fr; }
  .pf-trust{ grid-template-columns:1fr; }
  .pf-shead--left{ flex-direction:column; align-items:flex-start; }
}

/* ---- promo price markup coming from PHP (<font line-through>) ---- */
.pf-card__price font[style*="line-through"],
.pf-card__price font[style*="text-decoration"]{ color:var(--muted) !important; font-weight:500; font-size:12.5px; }
.pf-card__price font[style*="color:red"], .pf-card__price font[style*="color:#"]{ color:var(--pink-600) !important; }
.pf-card__name{ text-decoration:none; }
.pf-card__media img{ padding:6px; }
/* keep brand carousel slides tidy before slick initialises */
.pf-brands.slick-initialized img{ margin:0 auto; }
.pf-brands:not(.slick-initialized){ gap:34px; max-height:60px; overflow:hidden; }

/* ---- header cart pill (wraps legacy %%DOTUKA%% markup) ---- */
.pf-cartbtn{ height:auto; min-height:50px; padding:8px 16px; align-items:center; max-width:200px; overflow:hidden; }
.pf-cartbtn a, .pf-cartbtn a:hover{ color:#fff; }
.pf-cartbtn p{ font-size:11px !important; line-height:1.2 !important; }
/* tighten mega-menu so all categories fit one row on desktop */
#mega-menu-4.mega-menu > li > a{ padding:15px 13px !important; font-size:12.5px !important; }
@media (min-width:1100px){ .pf-megabar .pf-burger{ display:none !important; } }

/* ===========================================================
   Legacy catalog listing cards (#catcont/#catit/#catmark) used by
   CATAL / CATALIN — visual-only upgrade (no layout changes so the
   original float grid + pagination keep working). IDs reused per card.
   =========================================================== */
[id="catcont"]{ background:#fff; border:1px solid var(--line); border-radius:16px;
  box-shadow:var(--shadow-sm); transition:transform .2s, box-shadow .2s, border-color .2s; }
[id="catcont"]:hover{ box-shadow:var(--shadow-lg); border-color:var(--line-2); transform:translateY(-4px); }
[id="catimg"] img{ mix-blend-mode:multiply; transition:transform .35s; }
[id="catcont"]:hover [id="catimg"] img{ transform:scale(1.05); }
[id="catit"] a{ color:var(--ink) !important; text-decoration:none !important; font-weight:600; }
[id="catit"] a:hover{ color:var(--pink-600) !important; }
[id="catmark"], [id="catmark"] *{ color:var(--pink-600) !important; }
[id="catmark"] font[style*="line-through"], [id="catmark"] font[style*="line-through"] *{ color:var(--muted) !important; font-weight:500; }

/* ============================================================
   HEADER / NAV V2 — fixes cart overlap, replaces broken dcMegaMenu
   with pure-CSS dropdowns, adds real mobile off-canvas nav, and
   styles the hero slider controls. Loaded last → overrides above.
   ============================================================ */

/* --- cart pill: constrain the icon so it stops inflating the header --- */
.pf-cartbtn{ display:inline-flex !important; align-items:center; gap:10px; height:52px; min-height:0;
  padding:0 18px; border-radius:999px; background:var(--grad); color:#fff; box-shadow:var(--shadow);
  text-decoration:none; max-width:220px; overflow:hidden; }
.pf-cartbtn:hover{ filter:brightness(1.05); color:#fff; transform:translateY(-1px); }
.pf-cartbtn > svg{ width:24px; height:24px; flex:0 0 24px; }
.pf-cartbtn__info{ line-height:1.12; min-width:0; }
.pf-cartbtn__info a, .pf-cartbtn__info a:hover{ color:#fff; text-decoration:none; }
.pf-cartbtn__info b{ font-size:13px; white-space:nowrap; }
.pf-iconbtn--profile svg{ width:20px; height:20px; flex:none; }

/* --- header row alignment --- */
.pf-header__row{ height:84px; align-items:center; }
.pf-burger{ display:none; width:46px; height:46px; flex:none; align-items:center; justify-content:center;
  border:1.5px solid var(--line-2); border-radius:12px; background:#fff; color:var(--plum); cursor:pointer; }
.pf-burger svg{ width:24px; height:24px; }

/* --- nav bar --- */
.pf-nav2{ background:var(--plum); position:relative; z-index:40; }
.pf-nav2 > .pf-wrap{ display:flex; align-items:stretch; }
.pf-megamenu{ display:flex; flex-wrap:wrap; align-items:stretch; list-style:none; margin:0; padding:0; }
.pf-megamenu > li{ position:relative; list-style:none; }
.pf-megamenu > li > a{ display:flex; align-items:center; gap:7px; height:52px; padding:0 15px;
  color:#f1e7fb; font-weight:600; font-size:12.5px; text-transform:uppercase; letter-spacing:.02em;
  text-decoration:none; transition:.15s; position:relative; }
.pf-megamenu > li > a img{ width:22px !important; height:22px !important; position:static !important;
  top:0 !important; left:0 !important; filter:brightness(0) invert(1); }
.pf-megamenu > li > a::after{ content:""; position:absolute; left:15px; right:15px; bottom:9px; height:2px;
  background:var(--pink); border-radius:2px; transform:scaleX(0); transform-origin:left; transition:transform .2s; }
.pf-megamenu > li:hover > a{ color:#fff; background:rgba(255,255,255,.08); }
.pf-megamenu > li:hover > a::after{ transform:scaleX(1); }

/* dropdown panel (pure CSS, from %%PMENU%% nested <ul>) */
.pf-megamenu > li > ul{ position:absolute; top:100%; left:0; margin:0; padding:18px 22px; list-style:none;
  min-width:300px; max-width:720px; background:#fff; border-radius:0 0 18px 18px; box-shadow:var(--shadow-lg);
  border-top:3px solid var(--pink); opacity:0; visibility:hidden; transform:translateY(10px);
  transition:opacity .18s, transform .18s, visibility .18s; z-index:200; }
.pf-megamenu > li:hover > ul{ opacity:1; visibility:visible; transform:none; }
.pf-megamenu > li > ul li{ list-style:none; }
.pf-megamenu > li > ul ul{ list-style:none; margin:0; padding:0; column-count:3; column-gap:24px; }
.pf-megamenu > li > ul a{ display:block; padding:7px 10px; border-radius:8px; color:var(--ink-2);
  font-size:13px; font-weight:500; text-transform:none; white-space:nowrap; text-decoration:none; break-inside:avoid; }
.pf-megamenu > li > ul a:hover{ background:var(--lilac-soft); color:var(--pink-600); }
/* last category sits at the right edge — open its panel toward the left */
.pf-megamenu > li:last-child > ul{ left:auto; right:0; }

.pf-nav-scrim{ position:fixed; inset:0; background:rgba(46,16,101,.5); z-index:110; }

/* --- hero: keep it a real slider, styled controls --- */
.pf-hero__art{ min-height:0; background:transparent; box-shadow:none; }
.pf-hero__art .bx-wrapper{ margin:0; border:0; box-shadow:var(--shadow-lg); border-radius:var(--radius-lg); background:transparent; }
.pf-hero__art .bx-viewport{ border-radius:var(--radius-lg); border:0; left:0; box-shadow:none; background:var(--grad); }
.pf-hero__slides{ margin:0; padding:0; list-style:none; }
.pf-hero__slides li{ list-style:none; }
.pf-hero__slides li img{ width:100%; height:440px; object-fit:cover; display:block; }
.pf-hero__art .bx-controls-direction a{ width:44px; height:44px; margin-top:-22px; border-radius:50%;
  background:rgba(255,255,255,.92); box-shadow:var(--shadow); display:grid; place-items:center; text-indent:0;
  font-size:0; transition:.15s; }
.pf-hero__art .bx-controls-direction a:hover{ background:#fff; transform:scale(1.06); }
.pf-hero__art .bx-prev{ left:16px; } .pf-hero__art .bx-next{ right:16px; }
.pf-hero__art .bx-prev::before, .pf-hero__art .bx-next::before{ content:""; width:11px; height:11px;
  border-top:2.5px solid var(--plum); border-right:2.5px solid var(--plum); display:block; }
.pf-hero__art .bx-prev::before{ transform:rotate(-135deg); margin-left:4px; }
.pf-hero__art .bx-next::before{ transform:rotate(45deg); margin-right:4px; }
.pf-hero__art .bx-pager{ position:absolute; bottom:14px; left:0; right:0; padding:0; z-index:30; }
.pf-hero__art .bx-pager.bx-default-pager a{ background:rgba(255,255,255,.55); width:9px; height:9px; border-radius:999px; }
.pf-hero__art .bx-pager.bx-default-pager a.active,
.pf-hero__art .bx-pager.bx-default-pager a:hover{ background:#fff; width:22px; }

/* ============================================================
   RESPONSIVE V2 (override earlier media blocks)
   ============================================================ */
@media (max-width:1024px){
  .pf-burger{ display:inline-flex; order:-1; }
  .pf-nav2{ position:fixed; top:0; left:0; bottom:0; width:300px; max-width:86vw; z-index:120;
    background:var(--grad-plum); transform:translateX(-100%); transition:transform .3s ease; overflow-y:auto;
    box-shadow:4px 0 40px -16px rgba(46,16,101,.7); }
  body.pf-nav-open .pf-nav2{ transform:none; }
  .pf-nav2 > .pf-wrap{ display:block; padding:64px 12px 24px; max-width:none; }
  .pf-megamenu{ flex-direction:column; }
  .pf-megamenu > li{ position:static; border-bottom:1px solid rgba(255,255,255,.1); }
  .pf-megamenu > li > a{ height:auto; padding:14px 12px; font-size:14px; }
  .pf-megamenu > li > a::after{ display:none; }
  .pf-megamenu > li > ul{ display:none !important; }
}
@media (min-width:1025px){ .pf-nav-scrim{ display:none !important; } }

@media (max-width:820px){
  .pf-header__row{ height:auto; flex-wrap:wrap; padding:12px 0; gap:12px; }
  .pf-logo{ font-size:24px; }
  .pf-search{ order:3; max-width:none; flex-basis:100%; }
  .pf-actions{ margin-left:auto; }
  .pf-iconbtn--profile .pf-iconbtn__txt{ display:none; }
  .pf-iconbtn--profile{ width:50px; padding:0; justify-content:center; }
  /* hero stays a slider on mobile (do NOT hide it) */
  .pf-hero__grid{ grid-template-columns:1fr; text-align:center; }
  .pf-hero__art{ display:block !important; }
  .pf-hero__cta{ justify-content:center; }
  .pf-hero__slides li img{ height:300px; }
  .pf-trust-wrap{ margin-top:18px; }
}
@media (max-width:560px){
  .pf-topbar__sep{ display:none; }
  .pf-topbar .pf-wrap{ gap:10px; font-size:11.5px; }
  .pf-hero__slides li img{ height:240px; }
}

/* ============================================================
   PRODUCT DETAIL PAGE (.pf-pdp) + reviews + upsell
   ============================================================ */
.pf-pdp-wrap{ padding:24px 22px 40px; }
.pf-crumbs{ font-size:13px; color:var(--muted); margin-bottom:18px; }
.pf-crumbs a{ color:var(--muted); } .pf-crumbs a:hover{ color:var(--pink-600); }

.pf-pdp{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:40px; align-items:start; }
.pf-pdp__gallery{ position:sticky; top:96px; }
.pf-pdp__main{ background:var(--grad-soft); border:1px solid var(--line); border-radius:var(--radius-lg);
  min-height:380px; display:grid; place-items:center; padding:24px; overflow:hidden; }
.pf-pdp__main img{ max-width:100%; max-height:460px; width:auto !important; height:auto !important;
  object-fit:contain; mix-blend-mode:multiply; }
.pf-pdp__thumbs{ display:flex; gap:12px; flex-wrap:wrap; margin-top:14px; }
.pf-pdp__thumbs a{ display:block; width:78px; height:78px; border:1.5px solid var(--line-2); border-radius:12px;
  overflow:hidden; background:#fff; cursor:pointer; transition:.15s; padding:4px; }
.pf-pdp__thumbs a:hover{ border-color:var(--lilac); transform:translateY(-2px); }
.pf-pdp__thumbs img{ width:100% !important; height:100% !important; object-fit:contain; mix-blend-mode:multiply; }
.pf-pdp__hidden{ display:none; }

.pf-pdp__info{ min-width:0; }
.pf-pdp__title{ font-family:var(--display); font-weight:700; font-size:clamp(24px,2.6vw,34px); color:var(--plum);
  line-height:1.15; margin:0 0 12px; }
.pf-pdp__meta{ display:flex; align-items:center; gap:12px; margin-bottom:16px; min-height:22px; }
.pf-pdp__kol{ color:var(--muted); font-size:13px; }
.pf-pdp__price{ font-size:15px; color:var(--ink); background:var(--bg-soft); border:1px solid var(--line);
  border-radius:var(--radius); padding:18px 20px; margin:0 0 18px; }
.pf-pdp__price b, .pf-pdp__price font[color], .pf-pdp__price .price{ color:var(--pink-600); }
.pf-pdp__price select, .pf-pdp__price input[type=text]{ margin-top:12px; min-height:46px; border:1.5px solid var(--line-2);
  border-radius:12px; padding:10px 14px; font:inherit; font-size:14.5px; color:var(--ink); background:#fff; max-width:100%; }
.pf-pdp__price select:focus{ outline:none; border-color:var(--lilac); box-shadow:var(--ring); }
.pf-pdp__buy{ width:100%; height:56px; font-size:16px; margin-bottom:16px; }
.pf-pdp__share{ display:flex; align-items:center; gap:8px; color:var(--muted); font-size:13px; font-weight:600;
  padding:14px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-bottom:18px; }
.pf-pdp__tab{ display:inline-block; font-weight:800; font-size:13px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--plum); border-bottom:3px solid var(--pink); padding-bottom:8px; margin-bottom:14px; }
.pf-pdp__desc{ color:var(--ink-2); font-size:14.5px; line-height:1.75; }
.pf-pdp__desc img{ max-width:100%; height:auto; border-radius:12px; }
.pf-pdp__desc ul, .pf-pdp__desc ol{ padding-left:20px; }
.pf-pdp__desc *{ color:var(--ink-2) !important; }

/* upsell + last viewed rails: lay out whatever cards PHP emits */
.pf-pdp__simils, .pf-pdp__last #topros, .pf-pdp__last{ display:flex; flex-wrap:wrap; gap:18px; }
.pf-pdp__simils .itemcont, .pf-pdp__last .itemcont{ width:200px !important; }
.pf-pdp__last{ margin-top:30px; }
.pf-pdp__last h3, .pf-pdp__last h2{ width:100%; font-family:var(--display); color:var(--plum); font-size:22px; margin:10px 0 6px; }

/* reviews */
.pf-reviews{ margin-top:46px; padding-top:8px; }
.pf-review-form{ background:var(--bg-soft); border:1px solid var(--line); border-radius:var(--radius); padding:20px; margin:6px 0 22px; }
.pf-review-form__row{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.pf-review-form__row > *{ flex:1; min-width:160px; min-height:46px; border:1.5px solid var(--line-2); border-radius:12px;
  padding:10px 14px; font:inherit; font-size:14px; background:#fff; }
.pf-review-form textarea{ width:100%; min-height:100px; border:1.5px solid var(--line-2); border-radius:12px;
  padding:12px 14px; font:inherit; font-size:14px; resize:vertical; margin-bottom:12px; }
.pf-review-form :focus{ outline:none; border-color:var(--lilac); box-shadow:var(--ring); }
.pf-reviews__list{ display:grid; gap:14px; }
.pf-review{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px; box-shadow:var(--shadow-sm); }
.pf-review__head{ display:flex; align-items:center; gap:10px; margin-bottom:6px; }
.pf-review__head b{ color:var(--ink); }
.pf-review p{ color:var(--ink-2); font-size:14px; margin:0; }
.pf-reviews__empty{ color:var(--muted); font-size:14px; padding:10px 0; }

@media (max-width:880px){
  .pf-pdp{ grid-template-columns:1fr; gap:24px; }
  .pf-pdp__gallery{ position:static; }
  .pf-pdp__main{ min-height:300px; }
}

/* upsell / last-viewed legacy cards (#similim) */
.pf-pdp__simils [id="similim"], .pf-pdp__last [id="similim"]{ width:210px !important; background:#fff;
  border:1px solid var(--line); border-radius:var(--radius); padding:12px; box-shadow:var(--shadow-sm);
  transition:transform .2s, box-shadow .2s; }
.pf-pdp__simils [id="similim"]:hover, .pf-pdp__last [id="similim"]:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.pf-pdp__simils [id="similim"] img, .pf-pdp__last [id="similim"] img{ max-width:100% !important; height:auto !important; border-radius:10px; mix-blend-mode:multiply; }
.pf-pdp__simils [id="similim"] a, .pf-pdp__last [id="similim"] a{ color:var(--ink) !important; text-decoration:none; }

/* ============================================================
   HERO V3 — full-width image slider (overrides the 2-col hero)
   ============================================================ */
.pf-hero.pf-hero--full{ background:#fff; padding:0; min-height:0; }
.pf-hero--full .pf-wrap{ max-width:none; padding:0; }
.pf-hero--full .pf-hero__slides{ margin:0; padding:0; list-style:none; }
.pf-hero--full .pf-hero__slides li{ list-style:none; }
.pf-hero--full .pf-hero__slides li img{ width:100%; height:auto; max-height:560px; object-fit:cover; display:block; }
.pf-hero--full .bx-wrapper{ margin:0; border:0; box-shadow:none; border-radius:0; background:transparent; }
.pf-hero--full .bx-viewport{ border:0; left:0; box-shadow:none; border-radius:0; background:#faf5ff; }
.pf-hero--full .bx-controls-direction a{ width:48px; height:48px; margin-top:-24px; border-radius:50%;
  background:rgba(255,255,255,.9); box-shadow:var(--shadow); display:grid; place-items:center; text-indent:0; font-size:0; transition:.15s; }
.pf-hero--full .bx-controls-direction a:hover{ background:#fff; transform:scale(1.06); }
.pf-hero--full .bx-prev{ left:22px; } .pf-hero--full .bx-next{ right:22px; }
.pf-hero--full .bx-prev::before, .pf-hero--full .bx-next::before{ content:""; width:12px; height:12px;
  border-top:2.5px solid var(--plum); border-right:2.5px solid var(--plum); display:block; }
.pf-hero--full .bx-prev::before{ transform:rotate(-135deg); margin-left:4px; }
.pf-hero--full .bx-next::before{ transform:rotate(45deg); margin-right:4px; }
.pf-hero--full .bx-pager{ position:absolute; bottom:16px; left:0; right:0; z-index:30; }
.pf-hero--full .bx-pager.bx-default-pager a{ background:rgba(255,255,255,.6); width:10px; height:10px; border-radius:999px; }
.pf-hero--full .bx-pager.bx-default-pager a.active,
.pf-hero--full .bx-pager.bx-default-pager a:hover{ background:#fff; width:26px; }
@media (max-width:820px){
  .pf-hero--full .bx-controls-direction a{ width:38px; height:38px; margin-top:-19px; }
  .pf-hero--full .bx-prev{ left:10px; } .pf-hero--full .bx-next{ right:10px; }
}

/* ===== quick-view: selectable variants + dual CTA ===== */
.pf-modal__vlabel{ font-weight:700; font-size:13px; color:var(--ink-2); margin:4px 0 8px; }
.pf-modal__variants{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.pf-variant{ border:1.5px solid var(--line-2); background:#fff; border-radius:999px; padding:9px 15px;
  font:inherit; font-weight:700; font-size:13px; color:var(--plum); cursor:pointer; transition:.15s; line-height:1; }
.pf-variant small{ font-weight:600; color:var(--muted); }
.pf-variant:hover{ border-color:var(--lilac); transform:translateY(-1px); }
.pf-variant.is-sel{ background:var(--grad); color:#fff; border-color:transparent; box-shadow:var(--shadow); }
.pf-variant.is-sel small{ color:rgba(255,255,255,.85); }
.pf-variant.is-off{ opacity:.45; text-decoration:line-through; cursor:not-allowed; }
.pf-variants--hint{ animation:pf-shake .32s; }
.pf-variants--hint .pf-variant{ border-color:var(--pink); }
@keyframes pf-shake{ 0%,100%{transform:translateX(0)} 25%{transform:translateX(-5px)} 75%{transform:translateX(5px)} }
.pf-modal__row--2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.pf-modal__row--2 .pf-btn{ width:100%; padding:0 16px; }
@media (max-width:560px){ .pf-modal__row--2{ grid-template-columns:1fr; } }

/* ============================================================
   FULL-WIDTH MEGA MENU (photo | links | brand logos)
   ============================================================ */
.pf-nav2 > .pf-wrap{ position:relative; }
.pf-megamenu > li{ position:static; }
.pf-megamenu > li > ul.pf-mega{ left:0; right:0; width:auto; max-width:none; padding:0;
  display:grid; grid-template-columns:250px 1fr 320px; gap:0; overflow:hidden;
  border-radius:0 0 20px 20px; border-top:3px solid var(--pink); }
.pf-mega > li{ list-style:none; }
/* left aside: perfume photo + category title */
.pf-mega__aside{ position:relative; }
.pf-mega__aside a{ display:block !important; position:relative; min-height:290px; height:100%; padding:0 !important; }
.pf-mega__aside a:hover{ background:transparent !important; }
.pf-mega__photo{ position:absolute; inset:0; background:#2e1065 center/cover no-repeat; }
.pf-mega__aside::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(46,16,101,.1),rgba(46,16,101,.88)); }
.pf-mega__asideTxt{ position:absolute; left:22px; right:22px; bottom:22px; z-index:2; color:#fff; }
.pf-mega__asideTxt b{ display:block; font-size:20px; font-weight:800; line-height:1.12; margin-bottom:6px; color:#fff; }
.pf-mega__asideTxt span{ font-size:13px; font-weight:700; color:#ffd9ef; }
/* middle: subcategory links in columns */
.pf-mega__cols{ padding:24px 28px; }
.pf-mega__cols > ul{ column-count:3; column-gap:26px; list-style:none; margin:0; padding:0; }
.pf-mega__cols a{ break-inside:avoid; }
/* right: brand logos filler */
.pf-mega__brands{ background:var(--bg-soft); border-left:1px solid var(--line); padding:20px 22px; }
.pf-mega__brandsTitle{ display:block; font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-bottom:14px; }
.pf-mega__brandsGrid{ display:grid; grid-template-columns:1fr 1fr; gap:10px 12px; }
.pf-mega__brandsGrid a{ display:grid !important; place-items:center; background:#fff; border:1px solid var(--line);
  border-radius:10px; height:48px; padding:6px !important; }
.pf-mega__brandsGrid a:hover{ background:#fff !important; border-color:var(--lilac); }
.pf-mega__brandsGrid img{ max-height:30px; max-width:100%; object-fit:contain; filter:grayscale(1); opacity:.6; transition:.15s; }
.pf-mega__brandsGrid a:hover img{ filter:none; opacity:1; }
@media (max-width:1024px){
  .pf-megamenu > li > ul.pf-mega{ display:block; }
  .pf-mega__aside, .pf-mega__brands{ display:none; }
}

/* ============================================================
   MOBILE NAV V3 — usable drawer (close, search, accordion, quick links)
   Desktop-hidden; activates <=1024px.
   ============================================================ */
.pf-mnav__head, .pf-mnav__search, .pf-mnav__chev, .pf-mnav__quick{ display:none; }
@media (max-width:1024px){
  /* drawer shell */
  .pf-nav2 > .pf-wrap{ padding:6px 10px 10px !important; position:static; }
  .pf-mnav__head{ display:flex; align-items:center; justify-content:space-between; padding:18px 16px 12px; }
  .pf-mnav__brand{ color:#fff; font-weight:800; font-size:18px; letter-spacing:.01em; }
  .pf-mnav__close{ width:44px; height:44px; border-radius:12px; border:0; background:rgba(255,255,255,.14);
    color:#fff; display:grid; place-items:center; cursor:pointer; }
  .pf-mnav__close svg{ width:22px; height:22px; }
  .pf-mnav__search{ display:flex; margin:0 14px 10px; background:#fff; border-radius:12px; overflow:hidden; box-shadow:var(--shadow-sm); }
  .pf-mnav__search input{ flex:1; min-width:0; border:0; padding:0 14px; height:48px; font:inherit; font-size:15px; outline:none; color:var(--ink); }
  .pf-mnav__search button{ width:50px; border:0; background:var(--grad); color:#fff; display:grid; place-items:center; cursor:pointer; }
  .pf-mnav__search button svg{ width:20px; height:20px; }

  /* category rows: big tap targets + chevron */
  .pf-megamenu{ flex-direction:column; }
  .pf-megamenu > li{ position:relative; border-bottom:1px solid rgba(255,255,255,.1); }
  .pf-megamenu > li > a{ min-height:54px; display:flex; align-items:center; padding:14px 56px 14px 14px !important;
    font-size:15px !important; text-transform:none !important; letter-spacing:0 !important; }
  .pf-megamenu > li > a::after{ display:none; }
  .pf-megamenu > li > a img{ width:22px !important; height:22px !important; }
  .pf-mnav__chev{ display:grid; position:absolute; top:4px; right:4px; width:48px; height:48px; place-items:center;
    border:0; background:transparent; color:#fff; cursor:pointer; z-index:2; }
  .pf-mnav__chev svg{ width:24px; height:24px; transition:transform .2s; opacity:.85; }
  .pf-megamenu > li.pf-open > .pf-mnav__chev svg{ transform:rotate(180deg); }

  /* submenu accordion (override the v2 display:none) */
  .pf-megamenu > li > ul.pf-mega{ display:block !important; position:static !important; left:auto; right:auto;
    width:auto; max-width:none; opacity:1 !important; visibility:visible !important; transform:none !important;
    box-shadow:none !important; border:0 !important; border-radius:0 !important; background:rgba(0,0,0,.16) !important;
    grid-template-columns:none !important; max-height:0; overflow:hidden; transition:max-height .28s ease; padding:0 !important; }
  .pf-megamenu > li.pf-open > ul.pf-mega{ max-height:640px; }
  .pf-mega__aside, .pf-mega__brands{ display:none !important; }
  .pf-mega__cols{ padding:4px 12px 10px !important; }
  .pf-mega__cols > ul{ column-count:1 !important; }
  .pf-megamenu > li > ul.pf-mega a{ color:#e6d8f7 !important; padding:12px 14px !important; font-size:14px !important;
    min-height:46px; display:flex !important; align-items:center; border-radius:9px; }
  .pf-megamenu > li > ul.pf-mega a:hover{ background:rgba(255,255,255,.1) !important; color:#fff !important; }

  /* quick links */
  .pf-mnav__quick{ display:flex; flex-wrap:wrap; gap:8px; padding:16px 14px 24px; }
  .pf-mnav__quick a{ flex:1 1 28%; text-align:center; background:rgba(255,255,255,.12); color:#fff;
    padding:13px 8px; border-radius:12px; font-weight:700; font-size:12.5px; }
  .pf-mnav__quick a:hover{ background:rgba(255,255,255,.2); color:#fff; }
}

/* FIX: backdrop-filter on .pf-header creates a containing block that traps the
   fixed mobile drawer (only ~header-tall). Disable it on mobile so the
   off-canvas drawer is full viewport height. */
@media (max-width:1024px){
  .pf-header{ backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
  .pf-nav2{ top:0 !important; bottom:0 !important; height:auto !important; }
}

/* ============================================================
   CATALOG (CATAL/CATALIN) — card layout fix + modern filter sidebar
   (visual/internal only — does NOT change the float grid containers)
   ============================================================ */
[id="catcont"]{ display:flex !important; flex-direction:column; }
[id="catimg"]{ order:0; }
[id="catit"]{ order:1; min-height:36px; margin:6px 0 2px; position:static !important; float:none !important; width:auto !important; }
[id="catcont"] .pf-card__rating{ order:2; margin:2px 0 8px; }
[id="catmark"]{ order:3; margin-top:auto; position:static !important; float:none !important; width:auto !important; }
[id="catcont"] .pf-card__tools{ order:9; }

/* filter sidebar */
[id="krit_head"]{ font-weight:800 !important; font-size:12px !important; letter-spacing:.1em; text-transform:uppercase;
  color:var(--plum) !important; padding:16px 2px 10px !important; border-bottom:1px solid var(--line); margin:0 0 6px !important; }
[id="rezu"]{ font-family:var(--font); }
[id="rezu"] input.autof, [id="rezu"] input[type=checkbox]{ accent-color:var(--violet); width:16px; height:16px; cursor:pointer; }
[id="rezu"] ul{ list-style:none !important; margin:0 !important; padding:8px !important; }
[id="rezu"] span, [id="rezu"] li{ font-size:13.5px; color:var(--ink-2); }
[id="rezu"] a{ color:var(--ink-2); }
[id="rezu"] a:hover{ color:var(--pink-600); }

/* ============================================================
   CART (carta) — modern cart rows + sticky summary
   ============================================================ */
.pf-cart{ display:grid; grid-template-columns:minmax(0,1fr) 350px; gap:28px; align-items:start; padding:28px 0 50px; }
.pf-cart__main{ min-width:0; }
.pf-cart__listhead{ display:grid; grid-template-columns:1fr 150px 120px 44px; gap:12px; padding:0 16px 12px;
  font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
.pf-cart__listhead span:nth-child(2),.pf-cart__listhead span:nth-child(3){ text-align:center; }
.pf-cart__list{ display:flex; flex-direction:column; gap:12px; }
.pf-cart__row{ display:grid; grid-template-columns:84px minmax(0,1fr) 150px 120px 44px; gap:14px; align-items:center;
  background:#fff; border:1px solid var(--line); border-radius:16px; padding:12px 16px; box-shadow:var(--shadow-sm); }
.pf-cart__img{ width:84px !important; height:84px !important; object-fit:contain; mix-blend-mode:multiply;
  background:var(--grad-soft); border-radius:12px; padding:6px; }
.pf-cart__info{ min-width:0; }
.pf-cart__info b{ display:block; color:var(--ink); font-size:14.5px; line-height:1.3; }
.pf-cart__info small{ color:var(--muted); font-size:12.5px; }
.pf-cart__unit{ display:none; }
.pf-cart__qty{ display:inline-flex; align-items:center; border:1.5px solid var(--line-2); border-radius:999px;
  overflow:hidden; justify-self:center; height:42px; background:#fff; }
.pf-qbtn{ width:38px; height:40px; border:0; background:#fff; color:var(--plum); font-size:18px; line-height:1; cursor:pointer; }
.pf-qbtn:hover{ background:var(--lilac-soft); }
.pf-qinput{ width:44px !important; height:40px; border:0 !important; text-align:center; font:inherit; font-weight:700;
  color:var(--ink); padding:0 !important; outline:none; background:transparent; }
.pf-cart__prices{ text-align:right; }
.pf-cart__prices b{ color:var(--pink-600); font-size:15px; }
.pf-cart__prices small{ display:block; color:var(--muted); font-size:11.5px; }
.pf-cart__rm{ width:40px; height:40px; border-radius:50%; display:grid; place-items:center; color:var(--muted);
  border:1px solid var(--line); justify-self:center; transition:.15s; }
.pf-cart__rm:hover{ background:#e11d48; color:#fff; border-color:transparent; }
.pf-cart__rm svg{ width:18px; height:18px; }
/* summary */
.pf-cart__summary{ background:#fff; border:1px solid var(--line); border-radius:18px; padding:22px;
  box-shadow:var(--shadow); position:sticky; top:96px; }
.pf-cart__sumh{ font-size:17px; font-weight:800; color:var(--ink); margin:0 0 14px; }
.pf-cart__summary .pf-btn{ margin-bottom:10px; }
.pf-cart__voucher{ margin:10px 0 4px; }
.pf-cart__voucher input{ width:100%; height:46px; border:1.5px solid var(--line-2); border-radius:12px;
  padding:0 14px; font:inherit; outline:none; margin-bottom:8px; }
.pf-cart__voucher input:focus{ border-color:var(--lilac); box-shadow:var(--ring); }
.pf-cart__vtype{ display:flex; gap:16px; font-size:13px; color:var(--ink-2); margin-bottom:6px; }
.pf-cart__vtype label{ display:flex; align-items:center; gap:6px; cursor:pointer; }
.pf-cart__vtype input{ accent-color:var(--violet); }
.pf-cart__totals{ border-top:1px solid var(--line); margin-top:14px; padding-top:16px; }
.pf-cart__line{ display:flex; justify-content:space-between; align-items:center; color:var(--ink-2); font-size:14px; margin-bottom:10px; }
.pf-cart__line b{ color:var(--ink); }
.pf-cart__grand{ display:flex; justify-content:space-between; align-items:baseline; padding-top:14px;
  border-top:1px dashed var(--line-2); margin-top:8px; }
.pf-cart__grand span{ font-weight:700; color:var(--ink); }
.pf-cart__grand b{ font-size:24px; font-weight:800; color:var(--pink-600); }
.pf-cart__grand small{ font-size:13px; color:var(--muted); font-weight:600; }
.pf-cart__checkout{ height:54px; margin-top:18px !important; font-size:16px; }
.pf-cart__safe{ text-align:center; color:var(--muted); font-size:12px; margin-top:12px; }
@media (max-width:900px){
  .pf-cart{ grid-template-columns:1fr; }
  .pf-cart__summary{ position:static; }
}
@media (max-width:560px){
  .pf-cart__listhead{ display:none; }
  .pf-cart__row{ grid-template-columns:64px minmax(0,1fr) auto; grid-template-areas:'img info rm' 'img qty price'; gap:8px 12px; padding:12px; }
  .pf-cart__img{ width:64px !important; height:64px !important; grid-area:img; align-self:start; }
  .pf-cart__info{ grid-area:info; }
  .pf-cart__qty{ grid-area:qty; justify-self:start; }
  .pf-cart__prices{ grid-area:price; align-self:end; }
  .pf-cart__rm{ grid-area:rm; }
}

/* ============================================================
   CHECKOUT (ORDAR/ORDER) — modernise legacy form + order table
   ============================================================ */
.pf-body #content input.text, .pf-body #content input.verifyText, .pf-body #content input.verifyMail,
.pf-body #content textarea.text, .pf-body #content textarea[name=descr], .pf-body #content select{
  width:100% !important; min-height:46px; border:1.5px solid var(--line-2) !important; border-radius:12px !important;
  padding:11px 14px !important; font-family:var(--font) !important; font-size:14.5px !important; color:var(--ink) !important;
  background:#fff !important; outline:none; box-sizing:border-box !important; margin:4px 0 6px !important; }
.pf-body #content textarea{ min-height:96px !important; resize:vertical; }
.pf-body #content input.text:focus, .pf-body #content textarea:focus, .pf-body #content select:focus{
  border-color:var(--lilac) !important; box-shadow:0 0 0 4px rgba(192,132,252,.25) !important; }
.pf-body #content input[type=radio], .pf-body #content input[type=checkbox]{ accent-color:var(--violet); width:16px; height:16px; }
/* legacy order/checkout summary table -> modern */
.pf-body #content table{ border-collapse:collapse; }
.pf-body #content table td[bgcolor]{ background:#3b0764 !important; color:#fff !important; font-weight:700 !important;
  padding:12px 10px !important; font-size:12.5px; }
.pf-body #content table a[href*="deltador"], .pf-body #content a[href*="deltador"]{ color:var(--pink-600) !important; font-weight:700; text-decoration:none; }
/* the right-side checkout total */
.pf-body #content font[color="red"], .pf-body #content font[color="#ad2525"]{ color:var(--pink-600) !important; }

/* ============================================================
   LEFTOVER PAGES (order/catalog/search/promos/promocat)
   Hide legacy header; the simple nav is a normal bar (no off-canvas).
   ============================================================ */
body.pf-simplehdr #bigtop, body.pf-simplehdr #logot, body.pf-simplehdr #dova,
body.pf-simplehdr #header, body.pf-simplehdr #nadmenu, body.pf-simplehdr #overl{ display:none !important; }
body.pf-simplehdr td[height="141"], body.pf-simplehdr td[background*="menubck"]{ display:none !important; height:0 !important; padding:0 !important; }
.pf-nav2--simple .pf-megamenu > li{ position:static; }
@media (max-width:1024px){
  .pf-nav2--simple{ position:static !important; transform:none !important; width:auto !important; height:auto !important;
    background:var(--plum) !important; box-shadow:none; overflow:visible; }
  .pf-nav2--simple > .pf-wrap{ display:block !important; padding:0 !important; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .pf-nav2--simple .pf-megamenu{ flex-direction:row !important; flex-wrap:nowrap; }
  .pf-nav2--simple .pf-megamenu > li{ border:0 !important; }
  .pf-nav2--simple .pf-megamenu > li > a{ white-space:nowrap; min-height:auto !important; padding:13px 14px !important; font-size:12px !important; }
}

/* simple-header pages: keep header above legacy content, add clearance */
body.pf-simplehdr .pf-topbar, body.pf-simplehdr .pf-header{ position:relative; z-index:200; }
body.pf-simplehdr #content, body.pf-simplehdr #wrap{ position:relative; z-index:1; clear:both; }
body.pf-simplehdr #content{ padding-top:24px; }
body.pf-simplehdr #dova{ display:none !important; }

/* ============================================================
   FIXES: quick-view "Разгледай продукта" button (filled, plum)
   + mobile drawer stacking/scroll
   ============================================================ */
.pf-btn--plum{ background:var(--plum); color:#fff; box-shadow:var(--shadow); border-color:transparent; }
.pf-btn--plum:hover{ background:var(--plum-2); color:#fff; transform:translateY(-2px); box-shadow:var(--shadow-lg); }

@media (max-width:1024px){
  /* .pf-header is sticky => creates a stacking context that traps the fixed
     drawer BEHIND the scrim. Make it non-sticky on mobile so the drawer
     (z-index high) sits above the scrim. */
  .pf-header{ position:static !important; z-index:auto !important; }
  .pf-topbar{ position:static !important; z-index:auto !important; }
  .pf-nav2{ z-index:1200 !important; }
  .pf-nav-scrim{ z-index:1100 !important; }
  body.pf-nav-open{ overflow:hidden; }
  /* the desktop mega dropdown z-index is irrelevant in the mobile accordion */
  .pf-megamenu > li > ul.pf-mega{ z-index:auto !important; }
}

/* ============================================================
   CHECKOUT (ORDAR) — beautiful form + validation states
   ============================================================ */
.pf-body #content #finform{ background:#fff; border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow);
  padding:8px 18px 22px; max-width:560px; }
.pf-body #content #finform table{ width:100%; }
.pf-body #content #finform td{ padding:8px 6px !important; vertical-align:top; }
.pf-body #content #finform td[style*="18px"]{ font-size:18px !important; font-weight:800 !important; color:var(--ink) !important; padding-bottom:6px !important; }
.pf-body #content #finform b, .pf-body #content #finform label{ font-weight:700; color:var(--ink-2); font-size:13.5px; }
.pf-body #content #finform p{ margin:0; }
.pf-body #content .iferror{ display:none; color:#e11d48; font-size:12px; font-weight:600; margin-top:5px; }
.pf-body #content .pf-invalid{ border-color:#e11d48 !important; box-shadow:0 0 0 3px rgba(225,29,48,.14) !important; }
.pf-body #content .pf-invalid ~ .iferror, .pf-body #content .pf-invalid + br + .iferror{ display:inline-block; }
.pf-order__submit{ height:54px; font-size:16px; margin-top:10px; }
.pf-body #content #finform input[type=checkbox]{ margin-right:6px; }
.pf-body #content #finform a[target="_blank"]{ color:var(--violet-600); font-weight:600; }
/* the "Всичко: NN лв." headline on the order panel */
.pf-body #content p[style*="ad2525"], .pf-body #content p[style*="24px"]{ color:var(--pink-600) !important; font-family:var(--font) !important; font-weight:800 !important; }

/* search results pagination */
.pf-pager{ display:flex; justify-content:center; align-items:center; gap:8px; flex-wrap:wrap; padding:34px 0 14px; clear:both; width:100%; }
.pf-pager button{ min-width:44px; height:44px; padding:0 12px; border:1.5px solid var(--line-2); background:#fff;
  border-radius:12px; font:inherit; font-weight:700; font-size:14px; color:var(--plum); cursor:pointer; transition:.15s; }
.pf-pager button:hover:not(:disabled){ border-color:var(--lilac); transform:translateY(-1px); }
.pf-pager button.active{ background:var(--grad); color:#fff; border-color:transparent; box-shadow:var(--shadow); }
.pf-pager button:disabled{ opacity:.4; cursor:not-allowed; }
.pf-pager__dots{ color:var(--muted); padding:0 2px; }

/* ============================================================
   CATALOG V2 — homepage-style card grid (.pf-card in .pagedemo pages)
   ============================================================ */
.pagedemo{ display:none; }
.pagedemo._current{ display:grid !important; grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
  gap:20px; width:100%; }
/* catalog layout: breadcrumb (top), sidebar + results (side by side), pager (bottom) */
[id="topros"]{ display:flex !important; flex-wrap:wrap; align-items:flex-start; gap:0 26px; overflow:visible !important; width:auto !important; }
[id="histbar"]{ flex:0 0 100%; }
[id="dynam"]{ flex:0 0 210px; float:none !important; }
[id="rezul"]{ flex:1 1 0; min-width:0; float:none !important; width:auto !important; margin:0 !important; overflow:visible !important; }
[id="plinks"]{ flex:0 0 100%; }
@media (max-width:1100px){ .pagedemo._current{ grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:16px; } }
@media (max-width:560px){ .pagedemo._current{ grid-template-columns:1fr 1fr; gap:12px; } }

/* ============================================================
   MOBILE: quick-view modal fits + scrolls; drawer scroll/lock
   ============================================================ */
@media (max-width:640px){
  .pf-modal{ }
  .pf-modal__dialog{ margin:10px; max-width:none; width:auto; max-height:calc(100dvh - 20px);
    display:flex; flex-direction:column; border-radius:18px; }
  .pf-modal__grid{ display:block !important; grid-template-columns:1fr !important; overflow-y:auto;
    -webkit-overflow-scrolling:touch; }
  .pf-modal__media{ min-height:0 !important; max-height:38vh; padding:16px; }
  .pf-modal__media img{ max-height:34vh; }
  .pf-modal__body{ padding:18px 18px 22px; }
  .pf-modal__title{ font-size:21px; }
  .pf-modal__row--2{ grid-template-columns:1fr; }
  .pf-modal__close{ top:10px; right:10px; z-index:6; background:#fff; }
}
/* lock background scroll while drawer is open (no page scroll behind menu) */
body.pf-nav-open{ overflow:hidden; }
@media (max-width:1024px){
  body.pf-nav-open{ overflow:hidden; height:100%; }
  .pf-nav2{ overflow-x:hidden !important; overscroll-behavior:contain; }
  .pf-nav2::-webkit-scrollbar{ width:0; height:0; }   /* clean: no visible scrollbar */
  .pf-nav2{ scrollbar-width:none; }
}

/* ============================================================
   ORDAR — prettier order summary + panel
   ============================================================ */
.pf-body #content [style*="F0F0F0"], .pf-body #content [style*="f0f0f0"]{
  background:#fff !important; border:1px solid var(--line) !important; border-radius:18px !important;
  box-shadow:var(--shadow) !important; padding:20px 22px !important; color:var(--ink) !important; }
.pf-body #content [style*="F0F0F0"] p[style*="ad2525"], .pf-body #content p[style*="24px"]{
  color:var(--pink-600) !important; font-weight:800 !important; font-family:var(--font) !important; font-size:22px !important; }
/* order summary table rows */
.pf-body #content table td.repo, .pf-body #content table td[class*="repo"]{ border-bottom:1px solid var(--line) !important;
  vertical-align:middle; font-size:13.5px; color:var(--ink); }
.pf-body #content table img{ width:64px !important; height:64px !important; object-fit:contain;
  background:var(--grad-soft); border-radius:12px; padding:5px; }
.pf-body #content table a[href*="ITM"]{ color:var(--ink) !important; font-weight:700; text-decoration:none; }
.pf-body #content table a[href*="ITM"]:hover{ color:var(--pink-600) !important; }
.pf-body #content table a[href*="deltador"]{ color:var(--pink-600) !important; font-weight:700; }

/* ============================================================
   ORDAR CHECKOUT — responsive layout (panels stack on mobile,
   fluid widths so the customer form never floats off-screen)
   ============================================================ */
body.pf-checkout #content{ width:auto !important; max-width:1240px !important; margin:0 auto !important;
  padding:24px 16px 44px !important; }
body.pf-checkout #topros{ display:flex !important; flex-wrap:wrap; gap:28px; align-items:flex-start;
  width:auto !important; left:0 !important; overflow:visible !important; }
body.pf-checkout #histbar{ flex:0 0 100%; }
body.pf-checkout #topros > *{ float:none !important; margin:0 !important; left:0 !important; }
body.pf-checkout #topros > div[style*="float"]{ flex:1 1 440px; min-width:0; max-width:100%; width:auto !important; }
body.pf-checkout #topros > div[style*="F0F0F0"], body.pf-checkout #topros > div[style*="f0f0f0"]{ flex:1 1 330px; }
body.pf-checkout #topros table{ width:100% !important; table-layout:auto !important; }
body.pf-checkout #finform{ max-width:none !important; }
@media (max-width:780px){
  body.pf-checkout #topros{ flex-direction:column; }
  body.pf-checkout #topros > div[style*="float"]{ flex:1 1 100%; width:100% !important; }
  body.pf-checkout #topros table{ font-size:12.5px; }
  body.pf-checkout #topros table td{ padding:8px 5px !important; }
  body.pf-checkout #topros table img{ width:52px !important; height:52px !important; }
}

/* ============================================================
   FIXES: responsive modal, readable cart, prettier catalog
   filters + pagination
   ============================================================ */

/* --- quick-view modal: fit + scroll on tablets & phones (<=820) --- */
@media (max-width:820px){
  .pf-modal__dialog{ margin:10px auto !important; max-width:560px; width:calc(100% - 20px);
    max-height:calc(100vh - 20px); display:flex; flex-direction:column; border-radius:18px; }
  .pf-modal__grid{ display:block !important; grid-template-columns:1fr !important; overflow-y:auto;
    -webkit-overflow-scrolling:touch; }
  .pf-modal__media{ min-height:0 !important; max-height:36vh; padding:16px; }
  .pf-modal__media img{ max-height:32vh; }
  .pf-modal__body{ padding:18px 18px 22px; }
  .pf-modal__title{ font-size:21px; }
  .pf-modal__row--2{ grid-template-columns:1fr; }
  .pf-modal__close{ top:10px; right:10px; z-index:6; background:#fff; }
}

/* --- header cart button: clearer + compact on mobile --- */
.pf-cartbtn__info{ line-height:1.15; }
.pf-cartbtn__info span{ font-size:11px !important; opacity:.92; letter-spacing:.02em; }
.pf-cartbtn__info b{ font-size:13.5px !important; text-shadow:0 1px 2px rgba(46,16,101,.25); }
@media (max-width:820px){
  .pf-cartbtn{ max-width:none; padding:0 14px; gap:9px; }
  .pf-cartbtn__info span{ display:none; }              /* drop the "Количка" label */
  .pf-cartbtn__info b{ font-size:13px !important; white-space:nowrap; }
}
@media (max-width:420px){
  .pf-cartbtn__info b{ font-size:12px !important; }
  .pf-cartbtn{ padding:0 12px; }
}

/* --- catalog filter sidebar: card + sections + nicer checkboxes --- */
[id="dynam"]{ background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow-sm);
  padding:4px 16px 18px; align-self:flex-start; }
[id="rezu"] > div{ margin-bottom:6px; }
[id="rezu"] ul{ list-style:none !important; margin:0 !important; padding:8px !important; }
[id="rezu"] span, [id="rezu"] li{ display:flex !important; align-items:center; gap:9px; padding:7px 8px !important; border-radius:9px;
  font-size:13.5px; color:var(--ink-2); cursor:pointer; line-height:1.2 !important; height:auto !important; float:none !important; width:auto !important; }
[id="rezu"] span:hover, [id="rezu"] li:hover{ background:var(--lilac-soft); color:var(--plum); }
[id="rezu"] input[type=checkbox]{ accent-color:var(--violet); width:17px; height:17px; flex:none; cursor:pointer; margin:0 !important; }
[id="rezu"] a{ color:var(--ink-2); }

/* --- catalog pagination (#plinks): modern pills --- */
[id="plinks"]{ display:flex !important; justify-content:center; align-items:center; flex-wrap:wrap; gap:7px;
  padding:30px 0 10px; width:100%; }
[id="plinks"] a, [id="plinks"] span{ min-width:42px; height:42px; padding:0 12px; display:inline-flex;
  align-items:center; justify-content:center; border:1.5px solid var(--line-2); background:#fff; border-radius:11px;
  font-weight:700; font-size:14px; color:var(--plum) !important; text-decoration:none; transition:.15s; }
[id="plinks"] a:hover{ border-color:var(--lilac); transform:translateY(-1px); }
[id="plinks"] span, [id="plinks"] .current, [id="plinks"] a.current{ background:var(--grad); color:#fff !important;
  border-color:transparent; box-shadow:var(--shadow); }
[id="plinks"] i.fa{ font-style:normal; }

/* =====================================================================
   v23 — readable header buttons · modern ORDAR table · awesome filters
   ===================================================================== */

/* ---------- (1) HEADER BUTTONS — high-contrast, crisp text ---------- */
.pf-cartbtn{
  background:linear-gradient(135deg,#5b21b6 0%,#7c3aed 46%,#be185d 100%) !important;
  border:none !important;
  box-shadow:0 10px 24px -10px rgba(91,33,182,.65) !important;
}
.pf-cartbtn:hover{ filter:brightness(1.07) !important; }
.pf-cartbtn > svg{ color:#fff !important; filter:drop-shadow(0 1px 2px rgba(0,0,0,.3)); }
.pf-cartbtn__info{ display:flex; flex-direction:column; justify-content:center; }
.pf-cartbtn__info span{
  color:#fff !important; opacity:.95 !important; font-weight:600 !important;
  font-size:10px !important; letter-spacing:.07em; text-transform:uppercase; display:block;
}
.pf-cartbtn__info b{
  color:#fff !important; font-weight:800 !important; font-size:14px !important;
  text-shadow:0 1px 3px rgba(0,0,0,.36) !important; letter-spacing:.01em; white-space:nowrap;
}
/* outline profile button — dark, crisp label */
.pf-iconbtn--profile, .pf-iconbtn--profile .pf-iconbtn__txt{ color:var(--plum) !important; font-weight:700 !important; }
.pf-iconbtn--profile{ border-color:var(--line-2) !important; background:#fff !important; }
.pf-iconbtn--profile:hover{ border-color:var(--lilac) !important; background:var(--lilac-soft) !important; }
/* search submit button — keep icon crisp on its magenta circle */
#tarsi svg, .pf-search button svg{ color:#fff !important; }

/* ---------- (2) ORDAR ORDER TABLE — modern card ---------- */
body.pf-checkout #content table{
  width:100% !important; border-collapse:separate !important; border-spacing:0 !important;
  background:#fff !important; border:1px solid var(--line) !important; border-radius:16px !important;
  overflow:hidden !important; box-shadow:var(--shadow-sm) !important;
}
body.pf-checkout #content table td[bgcolor]{
  background:linear-gradient(135deg,#4c1d95 0%,#7c3aed 100%) !important; color:#fff !important;
  font-weight:700 !important; font-size:11px !important; letter-spacing:.05em; text-transform:uppercase;
  padding:14px 10px !important; border:none !important;
}
body.pf-checkout #content table td.repo{
  padding:14px 12px !important; border-bottom:1px solid var(--line) !important; border-top:none !important;
  vertical-align:middle; font-size:13.5px; color:var(--ink-2); background:transparent;
}
body.pf-checkout #content table tr:hover td.repo{ background:var(--bg-soft); }
body.pf-checkout #content table td[colspan="6"]{ padding:0 !important; border:none !important; height:0 !important; }
body.pf-checkout #content table td[colspan="6"] hr{ display:none !important; }
body.pf-checkout #content table img{
  width:60px !important; height:60px !important; object-fit:contain;
  background:#faf7fd; border:1px solid var(--line); border-radius:12px; padding:4px;
}
body.pf-checkout #content table a[href*="ITM"]{ color:var(--ink) !important; font-weight:700; text-decoration:none; }
body.pf-checkout #content table a[href*="ITM"]:hover{ color:var(--pink-600) !important; }
/* reset the customer-form's inner table so it stays a clean form, not a card */
body.pf-checkout #content #finform table{
  border:none !important; box-shadow:none !important; border-radius:0 !important;
  background:transparent !important; border-collapse:collapse !important; overflow:visible !important;
}
/* totals box (legacy #F0F0F0 float panel) → soft gradient card */
body.pf-checkout #content [style*="F0F0F0"], body.pf-checkout #content [style*="f0f0f0"]{
  background:linear-gradient(160deg,#faf5ff 0%,#fdf2f8 100%) !important;
  border:1px solid var(--line-2) !important; border-radius:16px !important;
  box-shadow:var(--shadow-sm) !important; padding:10px 8px !important;
}
body.pf-checkout #content [style*="F0F0F0"] > p[style*="24px"], body.pf-checkout #content p[style*="ad2525"]{
  color:var(--plum) !important; font-family:var(--font) !important; font-weight:800 !important; font-size:21px !important;
}
body.pf-checkout #content [style*="F0F0F0"] p{ font-family:var(--font) !important; }

/* ---------- (3) CATALOG FILTERS — awesome panel ---------- */
[id="dynam"]{ padding:0 !important; overflow:hidden; }
[id="dynam"] > form{ margin:0 !important; }
/* section heading bar (e.g. "ПРОИЗВОДИТЕЛ") */
[id="krit_head"]{
  background:linear-gradient(135deg,#4c1d95 0%,#7c3aed 100%) !important; color:#fff !important;
  font-weight:800 !important; font-size:12px !important; letter-spacing:.07em; text-transform:uppercase;
  padding:14px 16px !important; margin:0 !important; display:flex; align-items:center; gap:9px;
}
[id="krit_head"]::before{
  content:""; width:15px; height:15px; flex:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M3 5h18M6 12h12M10 19h4'/%3E%3C/svg%3E") center/contain no-repeat;
}
/* scrollable brand list */
[id="krit_head"] + div:last-child{
  max-height:430px; overflow-y:auto; padding:8px !important; margin:0 !important;
  scrollbar-width:thin; scrollbar-color:var(--lilac) transparent;
}
[id="krit_head"] + div:last-child::-webkit-scrollbar{ width:9px; }
[id="krit_head"] + div:last-child::-webkit-scrollbar-thumb{ background:var(--lilac); border-radius:9px; border:2px solid #fff; }
[id="krit_head"] + div:last-child::-webkit-scrollbar-track{ background:transparent; }
/* checkbox rows */
[id="rezu"] ul{ list-style:none !important; margin:0 !important; padding:8px !important; }
[id="rezu"] span, [id="rezu"] li{
  display:flex !important; align-items:center; gap:10px; width:auto !important; height:auto !important;
  float:none !important; margin:0 0 2px !important; padding:8px 10px !important; line-height:1.25 !important;
  border-radius:10px; font-size:13px !important; color:var(--ink-2) !important; cursor:pointer;
  transition:background .15s, color .15s; list-style:none !important; text-indent:0 !important;
}
[id="rezu"] span:hover, [id="rezu"] li:hover{ background:var(--lilac-soft); color:var(--plum) !important; }
[id="rezu"] input[type=checkbox]{ accent-color:var(--violet); width:17px; height:17px; flex:none; cursor:pointer; margin:0 !important; }
[id="rezu"] a{ color:inherit !important; }

/* ---------- v23.1 — crisp readable text on ALL gradient buttons ---------- */
.pf-btn--primary{
  background:linear-gradient(135deg,#6d28d9 0%,#9333ea 48%,#db2777 100%) !important;
  text-shadow:0 1px 2px rgba(0,0,0,.30) !important;
  letter-spacing:.01em;
}
.pf-btn--primary, .pf-btn--primary *{ color:#fff !important; }
.pf-btn--plum{ text-shadow:0 1px 2px rgba(0,0,0,.26) !important; }
[id="krit_head"] + div:not(:last-child){ padding:0 !important; max-height:none !important; overflow:visible !important; }

/* =====================================================================
   v27 — HERO showcase: glass slides, gradient scrim + glow, themed controls
   ===================================================================== */
.pf-hero--full{ position:relative; background:#1a0b2e; }
.pf-hero--full .bx-viewport{ background:#1a0b2e; }
.pf-hslide{ position:relative; overflow:hidden; }
.pf-hslide__bg{ width:100% !important; height:560px !important; max-height:none !important;
  object-fit:cover; display:block; }

/* scrim: darken left for text + soft pink/purple glow, fade to the right */
.pf-hslide__veil{ position:absolute; inset:0; pointer-events:none; z-index:2;
  background:
    linear-gradient(90deg, rgba(26,11,46,.88) 0%, rgba(46,16,101,.60) 38%, rgba(46,16,101,.16) 64%, rgba(46,16,101,0) 82%),
    radial-gradient(120% 95% at 10% 50%, rgba(168,85,247,.42) 0%, rgba(168,85,247,0) 55%),
    radial-gradient(80% 70% at 96% 6%, rgba(236,72,153,.34) 0%, rgba(236,72,153,0) 60%); }
.pf-hslide::after{ content:""; position:absolute; inset:0; pointer-events:none; z-index:2;
  background:linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,0) 18%, rgba(0,0,0,0) 70%, rgba(0,0,0,.18)); }

.pf-hslide__content{ position:absolute; inset:0; display:flex; align-items:center; z-index:5; }
.pf-hslide__content .pf-wrap{ width:100%; }

/* frosted glass card */
.pf-hslide__card{ max-width:560px; position:relative;
  background:linear-gradient(160deg, rgba(255,255,255,.17), rgba(255,255,255,.06));
  -webkit-backdrop-filter:blur(16px) saturate(1.25); backdrop-filter:blur(16px) saturate(1.25);
  border:1px solid rgba(255,255,255,.24); border-radius:24px; padding:34px 38px;
  box-shadow:0 30px 70px -24px rgba(20,8,40,.7), inset 0 1px 0 rgba(255,255,255,.28);
  animation:pf-hero-rise .7s cubic-bezier(.2,.7,.2,1) both; }

.pf-hslide__eyebrow{ display:inline-flex; align-items:center; gap:8px;
  font-weight:700; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:#fff;
  padding:7px 14px; border-radius:999px;
  background:linear-gradient(135deg, rgba(236,72,153,.92), rgba(124,58,237,.92));
  box-shadow:0 6px 18px -6px rgba(236,72,153,.6); margin-bottom:16px; }
.pf-hslide__eyebrow::before{ content:"\2726"; font-size:11px; }

.pf-hslide__title{ font-family:var(--display); font-weight:800; color:#fff;
  font-size:clamp(30px, 4.2vw, 54px); line-height:1.06; letter-spacing:-.015em; margin:0 0 14px;
  text-shadow:0 2px 26px rgba(0,0,0,.40); }
.pf-hslide__title em{ font-style:normal;
  background:linear-gradient(120deg,#fbcfe8,#f9a8d4 45%,#d8b4fe);
  -webkit-background-clip:text; background-clip:text; color:transparent; }

.pf-hslide__sub{ color:rgba(255,255,255,.93); font-size:clamp(15px,1.4vw,18px); line-height:1.55;
  max-width:460px; margin:0 0 26px; text-shadow:0 1px 14px rgba(0,0,0,.35); }

.pf-btn--lg{ height:54px; padding:0 30px; font-size:16px; border-radius:14px; }
.pf-hslide__cta{ box-shadow:0 16px 34px -12px rgba(219,39,119,.7) !important; }
.pf-hslide__cta:hover{ transform:translateY(-3px); box-shadow:0 22px 46px -12px rgba(219,39,119,.85) !important; }

@keyframes pf-hero-rise{ from{ opacity:0; transform:translateY(20px); } to{ opacity:1; transform:none; } }

/* themed slider controls */
.pf-hero--full .bx-controls-direction a{ background:rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.4); box-shadow:0 10px 26px -10px rgba(0,0,0,.55); }
.pf-hero--full .bx-controls-direction a:hover{ background:rgba(255,255,255,.95); }
.pf-hero--full .bx-prev::before, .pf-hero--full .bx-next::before{ border-color:#fff; }
.pf-hero--full .bx-controls-direction a.bx-prev:hover::before,
.pf-hero--full .bx-controls-direction a.bx-next:hover::before{ border-color:var(--plum); }
.pf-hero--full .bx-pager.bx-default-pager a{ background:rgba(255,255,255,.5); height:8px; width:8px;
  box-shadow:0 1px 4px rgba(0,0,0,.45); transition:width .25s, background .25s; }
.pf-hero--full .bx-pager.bx-default-pager a.active{ background:linear-gradient(90deg,#f9a8d4,#fff); width:30px; }

/* RESPONSIVE — tablet */
@media (max-width:900px){
  .pf-hslide__bg{ height:480px !important; }
  .pf-hslide__card{ max-width:none; width:100%; padding:26px 24px; border-radius:20px; }
  .pf-hslide__sub{ max-width:none; }
}
/* RESPONSIVE — mobile (v60): banner image FULLY visible at 100% width (no side crop),
   text card flows BELOW the image on the dark hero background */
@media (max-width:600px){
  .pf-hslide{ background:#1a0b2e; }
  .pf-hslide__bg{ height:auto !important; min-height:0 !important; max-height:none !important; object-fit:contain; }
  .pf-hslide__veil{ display:none; }
  .pf-hslide::after{ display:none; }
  .pf-hslide__content{ position:static; display:block; }
  .pf-hslide__content .pf-wrap{ padding:14px 14px calc(env(safe-area-inset-bottom,0px) + 30px); }
  .pf-hslide__card{ text-align:center; padding:20px 18px; max-width:none; animation:none; }
  .pf-hslide__eyebrow{ margin-left:auto; margin-right:auto; }
  .pf-hslide__title{ font-size:26px; }
  .pf-hslide__sub{ font-size:14px; margin-left:auto; margin-right:auto; }
  .pf-hslide__cta{ width:100%; }
  .pf-hero--full .bx-pager{ bottom:8px; }
  .pf-hero--full .bx-controls-direction{ display:none; }
}

/* v27.1 — dark frosted glass card so white headline + subtitle stay crisp on any image */
.pf-hslide__card{
  background:linear-gradient(160deg, rgba(46,16,101,.48), rgba(20,8,40,.36)) !important;
  border-color:rgba(255,255,255,.20) !important;
  box-shadow:0 30px 70px -24px rgba(10,4,24,.74), inset 0 1px 0 rgba(255,255,255,.16) !important;
}
.pf-hslide__sub{ color:rgba(255,255,255,.96) !important; text-shadow:0 1px 16px rgba(0,0,0,.45) !important; }

/* =====================================================================
   v29 — compact category hero band (inner pages: CATAL / CATALIN)
   ===================================================================== */
[id="histbar"]{ flex:0 0 100% !important; width:100%; margin:0; align-self:flex-start !important; height:auto !important; min-height:0 !important; }
body:not(.pf-checkout) [id="topros"]{ align-items:flex-start !important; }
.pf-cathead{ position:relative; overflow:hidden; border-radius:20px; margin:2px 0 22px;
  background:linear-gradient(120deg,#2e1065 0%,#5b21b6 52%,#9d174d 100%);
  padding:24px 30px; box-shadow:var(--shadow); }
.pf-cathead__glow{ position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(60% 120% at 88% 10%, rgba(236,72,153,.45), transparent 60%),
            radial-gradient(52% 130% at 8% 92%, rgba(168,85,247,.42), transparent 60%); }
.pf-cathead__crumb{ position:relative; z-index:1; font-size:12.5px; font-weight:600;
  color:rgba(255,255,255,.80); margin-bottom:7px; letter-spacing:.02em; }
.pf-cathead__crumb a{ color:rgba(255,255,255,.80); text-decoration:none; }
.pf-cathead__crumb a:hover{ color:#fff; }
.pf-cathead__crumb b{ color:#fff; font-weight:700; }
.pf-cathead__title{ position:relative; z-index:1; font-family:var(--display); font-weight:800;
  color:#fff; font-size:clamp(23px,3vw,38px); line-height:1.1; margin:0; letter-spacing:-.01em;
  text-shadow:0 2px 18px rgba(0,0,0,.32); }
.pf-cathead__title::first-letter{ text-transform:uppercase; }
@media (max-width:600px){ .pf-cathead{ padding:18px 18px; border-radius:16px; margin-bottom:16px; } }

/* =====================================================================
   v31 — ORDAR uses cart layout · mobile no horizontal scroll · scroll-top
   ===================================================================== */

/* ---- ORDAR now renders the .pf-cart layout (customer form in the summary) ---- */
body.pf-checkout #content{ width:auto !important; max-width:1240px !important; margin:0 auto !important;
  padding:18px 22px 50px !important; }
body.pf-checkout #topros{ display:block !important; }
body.pf-checkout #histbar{ display:none; }
.pf-cart--order{ padding-top:6px; }
.pf-cart--order .pf-cart__summary{ position:static; }
.pf-cart__qty--static{ justify-content:center; padding:0 16px; min-width:62px; cursor:default;
  color:var(--ink); font-weight:700; }
.pf-cart__qty--static span{ font-size:14px; }
/* the customer form sits inside the summary card — strip its own card chrome */
.pf-cart__summary #finform, .pf-cart__summary > div[style*="tahoma"]{ background:transparent !important;
  border:none !important; box-shadow:none !important; padding:0 !important; margin:0 !important;
  font-family:var(--font) !important; }
.pf-cart__summary #finform table{ width:100% !important; }
.pf-cart__summary #finform td[style*="18px"]{ font-size:16px !important; }
.pf-cart__line--disc b{ color:var(--pink-600); }

/* ---- MOBILE: kill horizontal scroll / left-right shift ---- */
@media (max-width:1024px){
  html, body{ overflow-x:hidden; max-width:100%; }
  #content, #topros, #wrap, #mid_he_co, #header, #footer{ width:auto !important; max-width:100% !important; }
  #topros{ left:0 !important; }
}
img, video, table, iframe{ max-width:100%; }

/* ---- scroll-to-top button (all pages) ---- */
.pf-totop{ position:fixed; right:18px; bottom:18px; width:48px; height:48px; border:none; border-radius:50%;
  background:var(--grad); color:#fff; box-shadow:0 12px 30px -8px rgba(124,58,237,.6); cursor:pointer;
  display:grid; place-items:center; opacity:0; visibility:hidden; transform:translateY(14px) scale(.9);
  transition:opacity .25s, transform .25s, visibility .25s; z-index:1400; padding:0; }
.pf-totop.show{ opacity:1; visibility:visible; transform:none; }
.pf-totop:hover{ filter:brightness(1.08); transform:translateY(-2px); }
.pf-totop svg{ width:22px; height:22px; }
@media (max-width:600px){
  .pf-totop{ right:14px; bottom:calc(env(safe-area-inset-bottom,0px) + 14px); width:44px; height:44px; }
}

/* =====================================================================
   v32 — small-mobile header (clean topbar + one-row logo/search)
        + easy-to-tap quick-view buy buttons
   ===================================================================== */

/* ---- TOPBAR: a single clean promo line on small phones ---- */
@media (max-width:560px){
  .pf-topbar .pf-wrap{ height:34px; gap:6px; font-size:11.5px; flex-wrap:nowrap;
    justify-content:center; padding:0 14px; }
  .pf-topbar .pf-wrap > span:nth-child(n+2){ display:none; }      /* keep only the first message */
  .pf-topbar .pf-wrap > span:first-child{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
}

/* ---- HEADER: logo + search + cart gathered on ONE tidy row ---- */
@media (max-width:560px){
  .pf-header__row{ flex-wrap:nowrap !important; gap:8px; padding:10px 12px; height:auto; align-items:center; }
  .pf-burger{ order:-1; width:40px; height:40px; flex:none; margin:0; }
  .pf-logo{ order:1; font-size:20px; flex:none; gap:0; }
  .pf-logo small{ display:none; }
  .pf-search{ order:2; flex:1 1 0% !important; min-width:0; max-width:none !important; flex-basis:0% !important; }
  .pf-search input{ height:42px; font-size:14px; padding:0 42px 0 14px; }
  .pf-search button{ width:34px; height:34px; top:4px; right:4px; }
  .pf-actions{ order:3; flex:none; gap:6px; margin:0 !important; }
  .pf-iconbtn--profile{ display:none; }
  .pf-cartbtn{ height:42px; padding:0 12px; }
}
@media (max-width:430px){
  .pf-header__row{ gap:6px; padding:9px 10px; }
  .pf-logo{ font-size:18px; }
  .pf-cartbtn__info{ display:none; }             /* icon-only cart on the smallest screens */
  .pf-cartbtn{ width:42px; padding:0; justify-content:center; }
}

/* ---- QUICK-VIEW MODAL: big buy buttons, always reachable (pinned) ---- */
@media (max-width:820px){
  .pf-modal__row--2{ position:sticky; bottom:0; background:#fff; margin-top:14px;
    padding:12px 0 4px; box-shadow:0 -12px 18px -10px rgba(46,16,101,.18); z-index:5; }
  .pf-modal__row--2 .pf-btn{ height:52px !important; font-size:16px; border-radius:14px; }
}
@media (max-width:560px){
  .pf-modal__media{ max-height:28vh !important; padding:12px !important; }
  .pf-modal__media img{ max-height:24vh !important; }
  .pf-modal__body{ padding:16px 16px 12px !important; }
  .pf-modal__desc{ max-height:92px; overflow-y:auto; -webkit-overflow-scrolling:touch; }
  .pf-variant{ padding:11px 16px; font-size:14px; }      /* bigger ml chips */
  .pf-modal__row--2 .pf-btn{ height:54px !important; }
}

/* v33 — keep header actions tidy: hide any stray re-parented legacy cart anchor */
.pf-actions > a:not(.pf-cartbtn):not(.pf-iconbtn--profile){ display:none !important; }

/* =====================================================================
   v34 — mobile catalog: products full-width, filters in off-canvas drawer
   ===================================================================== */
.pf-filterbar, .pf-filterscrim, .pf-filterhead{ display:none; }

@media (max-width:820px){
  /* products take the whole row + a clean 2-up grid */
  [id="rezul"]{ flex:1 1 100% !important; width:100% !important; min-width:0; }
  [id="plinks"]{ flex:0 0 100% !important; }
  .pagedemo._current{ grid-template-columns:1fr 1fr !important; gap:12px !important; }

  /* "Филтри" toggle bar (its own full-width row, above the products) */
  .pf-filterbar{ display:flex; flex:0 0 100%; width:100%; margin:0 0 14px; }
  .pf-filterbtn{ display:inline-flex; align-items:center; gap:9px; height:46px; padding:0 20px;
    border-radius:999px; border:1.5px solid var(--line-2); background:#fff; color:var(--plum);
    font:inherit; font-weight:700; font-size:14px; cursor:pointer; box-shadow:var(--shadow-sm); }
  .pf-filterbtn svg{ width:18px; height:18px; }
  .pf-filterbtn__n{ background:var(--grad); color:#fff; font-size:12px; min-width:20px; height:20px;
    border-radius:999px; display:grid; place-items:center; padding:0 5px; }

  /* off-canvas filter drawer */
  [id="dynam"]{ position:fixed !important; top:0 !important; left:0 !important; bottom:0 !important; height:100vh !important; height:100dvh !important; max-height:100vh !important; max-height:100dvh !important; width:330px !important; max-width:88vw !important; z-index:1350 !important; flex:none !important;
    transform:translateX(-100%); transition:transform .3s ease; overflow-y:auto !important;
    border-radius:0 !important; margin:0 !important; padding:0 0 24px !important;
    box-shadow:8px 0 50px -14px rgba(46,16,101,.6); }
  body.pf-filters-open [id="dynam"]{ transform:none !important; }
  body.pf-filters-open{ overflow:hidden; }

  /* sticky drawer header with the close button */
  .pf-filterhead{ display:flex; align-items:center; justify-content:space-between; position:sticky; top:0;
    z-index:4; background:#fff; padding:13px 16px; border-bottom:1px solid var(--line);
    font-family:var(--display); font-weight:800; font-size:16px; color:var(--ink); }
  .pf-filterclose{ display:grid; place-items:center; width:36px; height:36px; border-radius:50%;
    border:none; background:var(--lilac-soft); color:var(--plum); cursor:pointer; }
  .pf-filterclose svg{ width:19px; height:19px; }

  /* scrim */
  .pf-filterscrim{ display:block; position:fixed; inset:0; background:rgba(20,8,40,.5); z-index:1340;
    opacity:0; visibility:hidden; transition:opacity .25s, visibility .25s; }
  body.pf-filters-open .pf-filterscrim{ opacity:1; visibility:visible; }
}
@media (max-width:380px){
  .pagedemo._current{ grid-template-columns:1fr !important; }   /* single column on the tiniest screens */
}

/* =====================================================================
   v37 — condensed pager (no footer collision) + mobile filter drawer polish
   ===================================================================== */

/* pagination: box grows with content (kill legacy height:50px/width:700px) + ellipsis look */
[id="plinks"]{ height:auto !important; width:auto !important; max-width:100%; margin:18px 0 10px !important; }
[id="plinks"] .pf-pgell{ background:none !important; border:none !important; box-shadow:none !important;
  min-width:auto !important; height:auto !important; padding:0 3px !important; color:var(--muted) !important;
  align-self:center; font-weight:700; }
[id="plinks"] .pf-pgcur{ background:var(--grad) !important; color:#fff !important; border-color:transparent !important; }

/* mobile filter drawer: full-width content + single scroll (no right white space, full headers) */
@media (max-width:820px){
  #dynam form, #dynam [id="rezu"]{ width:auto !important; max-width:none !important; }
  #dynam [id="rezu"] > div{ width:auto !important; }
  #dynam [id="krit_head"]{ width:auto !important; float:none !important; }
  #dynam [id="krit_head"] + div{ width:auto !important; max-width:none !important; float:none !important;
    height:auto !important; max-height:none !important; overflow:visible !important; }
  #dynam [id="rezu"] span, #dynam [id="rezu"] li{ width:100% !important; box-sizing:border-box !important; float:none !important; height:auto !important; }
}

/* =====================================================================
   v40 — account / auth (login, register, profile, orders, favorites)
   ===================================================================== */
.pf-authwrap{ padding:30px 22px 64px; min-height:50vh; }
.pf-authhead{ text-align:center; margin:6px auto 28px; max-width:640px; }
.pf-authhead h2{ font-family:var(--display); font-weight:800; font-size:clamp(26px,3.4vw,38px); color:var(--ink); margin:6px 0 8px; }
.pf-authhead p{ color:var(--ink-2); margin:0; }

.pf-auth{ display:grid; grid-template-columns:1fr 1fr; gap:24px; max-width:920px; margin:0 auto; align-items:start; }
.pf-authcard{ background:#fff; border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow-sm); padding:30px 30px 28px; }
.pf-authcard__h{ font-family:var(--display); font-size:21px; font-weight:800; color:var(--ink); margin:0 0 4px; }
.pf-authcard__sub{ color:var(--muted); font-size:13.5px; margin:0 0 20px; line-height:1.5; }
.pf-authcard__sub a{ color:var(--violet-600); font-weight:600; }

.pf-field{ display:block; margin-bottom:14px; }
.pf-field > span{ display:block; font-size:12.5px; font-weight:700; color:var(--ink-2); margin-bottom:6px; }
.pf-field input, .pf-field textarea{ width:100%; height:46px; border:1.5px solid var(--line-2); border-radius:12px;
  padding:0 14px; font:inherit; font-size:14.5px; color:var(--ink); background:#fff; transition:.18s; box-sizing:border-box; }
.pf-field textarea{ height:auto; padding:12px 14px; resize:vertical; min-height:80px; }
.pf-field input:focus, .pf-field textarea:focus{ border-color:var(--lilac); box-shadow:var(--ring); outline:none; }
.pf-field input:disabled{ background:var(--bg-soft); color:var(--muted); cursor:not-allowed; }
.pf-field2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.pf-authcard .pf-btn{ margin-top:10px; height:50px; }

.pf-account{ display:grid; grid-template-columns:230px 1fr; gap:24px; max-width:980px; margin:0 auto; align-items:start; }
.pf-account__nav{ display:flex; flex-direction:column; gap:6px; background:#fff; border:1px solid var(--line);
  border-radius:18px; padding:14px; box-shadow:var(--shadow-sm); position:sticky; top:18px; }
.pf-account__link{ display:block; padding:12px 16px; border-radius:12px; font-weight:700; font-size:14px;
  color:var(--ink-2); text-decoration:none; transition:.15s; }
.pf-account__link:hover{ background:var(--lilac-soft); color:var(--plum); }
.pf-account__link.is-active{ background:var(--grad); color:#fff; }
.pf-account__link--out{ color:var(--pink-600); margin-top:6px; }
.pf-account__body{ display:flex; flex-direction:column; gap:20px; min-width:0; }

.pf-orderrow{ display:flex; justify-content:space-between; align-items:center; padding:14px 16px; border:1px solid var(--line);
  border-radius:14px; margin-bottom:10px; text-decoration:none; transition:.15s; }
.pf-orderrow:hover{ border-color:var(--lilac); background:var(--bg-soft); }
.pf-orderrow b{ display:block; color:var(--ink); font-size:14.5px; }
.pf-orderrow small{ color:var(--muted); font-size:12.5px; }
.pf-orderrow__st{ font-weight:700; font-size:13px; color:var(--violet-600); background:var(--lilac-soft); padding:5px 12px; border-radius:999px; }

.pf-favgrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:14px; }
.pf-favcard{ position:relative; background:var(--bg-soft); border:1px solid var(--line); border-radius:14px; padding:10px; text-align:center; }
.pf-favcard a{ text-decoration:none; color:var(--ink); display:block; }
.pf-favcard img{ width:100%; height:96px; object-fit:contain; mix-blend-mode:multiply; }
.pf-favcard span{ display:block; font-size:12px; margin-top:8px; line-height:1.3; color:var(--ink-2); }
.pf-favcard__rm{ position:absolute; top:6px; right:6px; width:24px; height:24px; border:none; border-radius:50%;
  background:#fff; color:var(--muted); cursor:pointer; box-shadow:var(--shadow-sm); font-size:16px; line-height:1; }
.pf-favcard__rm:hover{ background:#e11d48; color:#fff; }

@media (max-width:760px){
  .pf-auth{ grid-template-columns:1fr; }
  .pf-account{ grid-template-columns:1fr; }
  .pf-account__nav{ position:static; flex-direction:row; flex-wrap:wrap; }
  .pf-account__link{ flex:1 1 auto; text-align:center; }
  .pf-field2{ grid-template-columns:1fr; }
}

/* v41 — active favorite heart on product cards */
.pf-card__tool.is-fav{ color:#ec4899 !important; }
.pf-card__tool.is-fav svg{ fill:#ec4899; }

/* =====================================================================
   v42 — AI banners: category wide/narrow + hero rich-text title
   ===================================================================== */
/* category banners (responsive, cropped) */
.pf-catbanner{ flex:0 0 100% !important; width:100%; border-radius:18px; overflow:hidden; margin:0 0 18px;
  box-shadow:var(--shadow-sm); background:var(--bg-soft); }
.pf-catbanner img{ width:100%; display:block; object-fit:cover; }
.pf-catbanner--wide img{ aspect-ratio:1920/400; max-height:300px; }
.pf-catbanner--narrow{ margin:0 0 16px; border-radius:14px; }
.pf-catbanner--narrow img{ aspect-ratio:1200/200; max-height:170px; }
@supports not (aspect-ratio:1/1){ .pf-catbanner--wide img{ height:240px; } .pf-catbanner--narrow img{ height:130px; } }
@media (max-width:600px){ .pf-catbanner--wide img{ max-height:180px; } .pf-catbanner--narrow img{ max-height:120px; } }

/* hero admin rich-text (reuses the glass card + title sizing) */
.pf-hslide__rich{ font-family:var(--display); color:#fff; font-size:clamp(26px,3.6vw,46px); line-height:1.1;
  font-weight:800; letter-spacing:-.01em; margin:0 0 12px; text-shadow:0 2px 24px rgba(0,0,0,.4); }
.pf-hslide__rich *{ color:#fff !important; }
.pf-hslide__rich p{ margin:0; }
.pf-hslide__rich h1, .pf-hslide__rich h2, .pf-hslide__rich h3{ margin:0; font-size:1em; line-height:1.1; }
.pf-hslide__rich a{ color:#fbcfe8 !important; }

/* v42 — visually-hidden helper (SEO h1 etc.) */
.pf-visually-hidden{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* ============================================================
   CART v6 — live qty, swipe-delete, undo toast, upsell, sticky bar
   ============================================================ */
.pf-cart__row{ position:relative; z-index:1; background:#fff; will-change:transform;
  transition:transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .2s; }
.pf-cart__row.is-swiping{ box-shadow:var(--shadow); }
.pf-cart__prices b[data-line]{ transition:color .2s; }
.pf-cart__line--mut{ opacity:.72; font-size:13px; }
.pf-cart__line--mut b{ font-weight:600; }

/* swipe wrapper + red trash area behind (mobile) */
.pf-cart__swipe{ position:relative; border-radius:16px; overflow:hidden; max-height:480px;
  transition:max-height .5s ease .12s, opacity .42s ease, margin .5s ease .12s; }
.pf-cart__swipebg{ position:absolute; inset:0; z-index:0; display:flex; align-items:center; justify-content:flex-end;
  padding-right:26px; color:#fff; border-radius:16px; background:linear-gradient(90deg,#fb7185 0%,#e11d48 100%); }
.pf-cart__swipe.is-gone{ max-height:0 !important; opacity:0; margin-top:-12px; pointer-events:none; }

/* desktop (no wrapper) collapse fallback */
.pf-cart__row.is-gone{ max-height:0; opacity:0; transform:translateX(-110%); overflow:hidden;
  padding-top:0; padding-bottom:0; pointer-events:none;
  transition:transform .42s ease, opacity .42s ease, max-height .5s ease .14s, padding .5s ease .14s; }

/* undo toast */
.pf-toast--undo{ border-left-color:var(--violet); }
.pf-toast--undo b{ display:block; font-size:13px; color:var(--ink); }
.pf-toast--undo small{ color:var(--muted); font-size:12px; }
.pf-toast__undo{ margin-left:auto; border:0; background:var(--grad); color:#fff; font-weight:700; font-size:13px;
  padding:8px 16px; border-radius:999px; cursor:pointer; white-space:nowrap; transition:filter .15s, transform .1s; }
.pf-toast__undo:hover{ filter:brightness(1.08); }
.pf-toast__undo:active{ transform:scale(.96); }

/* upsell rails under each row */
.pf-upsell{ margin:-2px 2px 4px; }
.pf-upsell.is-on{ animation:pfUpFade .4s ease both; }
.pf-upsell__h{ font-size:12px; font-weight:700; color:var(--muted); text-transform:uppercase;
  letter-spacing:.04em; margin:0 0 8px 2px; }
.pf-upsell__row{ display:flex; gap:10px; overflow-x:auto; padding:2px 2px 6px; scrollbar-width:thin; -webkit-overflow-scrolling:touch; }
.pf-upsell__row::-webkit-scrollbar{ height:5px; }
.pf-upsell__row::-webkit-scrollbar-thumb{ background:var(--line-2); border-radius:99px; }
.pf-upsell__card{ position:relative; flex:0 0 auto; width:118px; display:flex; flex-direction:column; align-items:center;
  text-align:center; background:#fff; border:1px solid var(--line); border-radius:14px; padding:10px 8px;
  box-shadow:var(--shadow-sm); transition:transform .15s, box-shadow .15s, border-color .15s; }
.pf-upsell__card:hover{ transform:translateY(-2px); box-shadow:var(--shadow); border-color:var(--line-2); }
.pf-upsell__lnk{ display:flex; flex-direction:column; align-items:center; gap:6px; text-decoration:none; }
.pf-upsell__card img{ width:80px; height:80px; object-fit:contain; border-radius:10px; background:var(--bg-soft); }
.pf-upsell__nm{ font-size:11.5px; line-height:1.25; color:var(--ink); font-weight:600; min-height:2.5em;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.pf-upsell__pr{ font-size:12.5px; font-weight:800; color:var(--violet-600); }
.pf-upsell__add{ position:absolute; top:6px; right:6px; width:25px; height:25px; border-radius:50%; border:0;
  background:var(--grad); color:#fff; font-size:16px; line-height:1; cursor:pointer; display:grid; place-items:center;
  box-shadow:var(--shadow-sm); transition:transform .12s, filter .15s; }
.pf-upsell__add:hover{ filter:brightness(1.1); }
.pf-upsell__add:active{ transform:scale(.9); }
.pf-upsell__add:disabled{ background:#16a34a; cursor:default; }

/* empty cart */
.pf-cart-empty{ text-align:center; padding:60px 20px; max-width:480px; margin:24px auto; }
.pf-cart-empty__ic{ width:84px; height:84px; margin:0 auto 18px; border-radius:50%; display:grid; place-items:center;
  background:var(--grad-soft); color:var(--violet); }
.pf-cart-empty__ic svg{ width:40px; height:40px; }
.pf-cart-empty h2{ font-family:var(--display); font-size:24px; color:var(--ink); margin:0 0 8px; }
.pf-cart-empty p{ color:var(--muted); margin:0 0 22px; }

/* mobile sticky checkout bar */
.pf-cart-bar{ display:none; }
@media (max-width:768px){
  .pf-cart-bar{ position:fixed; left:0; right:0; bottom:0; z-index:90; display:flex; align-items:center; gap:12px;
    background:rgba(255,255,255,.96); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
    border-top:1px solid var(--line); box-shadow:0 -8px 24px -12px rgba(76,29,149,.25);
    padding:10px 14px calc(10px + env(safe-area-inset-bottom)); }
  .pf-cart-bar__l{ display:flex; flex-direction:column; line-height:1.1; }
  .pf-cart-bar__l span{ font-size:11px; color:var(--muted); }
  .pf-cart-bar__total{ font-size:18px; font-weight:800; color:var(--ink); }
  .pf-cart-bar__cta{ margin-left:auto; padding:12px 26px; }
  .pf-cart{ padding-bottom:78px; }
}

/* micro-animations */
@keyframes pfUpFade{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:none;} }
@keyframes pfBump{ 0%{ transform:scale(1);} 35%{ transform:scale(1.12);} 100%{ transform:scale(1);} }
.pf-bump{ animation:pfBump .32s ease; display:inline-block; transform-origin:right center; }
@keyframes pfFlash{ 0%{ background:var(--lilac-soft);} 100%{ background:#fff;} }
.pf-flash{ animation:pfFlash .9s ease; }


/* quick-view secondary action — readable (beats .pf a) + single line; shared by catalog */
.pf-modal__row--2 .pf-btn{ white-space:nowrap; }
.pf-modal__row--2 .pf-btn--plum{ color:#fff; }
@media (min-width:821px){ .pf-modal__row--2 .pf-btn{ font-size:14px; padding:0 12px; } }


/* dual price (лв + €) — euro identical font & colour everywhere (euro adoption) */
.pf-card__price small, .pf-card__price .pf-eur, .pf-cart__prices small, .pf-cart__grand small,
[data-cart-totals] small, .pf-modal__price small, .pf-upsell__pr small, .pf-cart-bar small{
  font:inherit !important; color:inherit !important; letter-spacing:inherit !important; opacity:1 !important; }

.pf-card__old{ text-decoration:line-through; opacity:.5; font-weight:600; margin-right:5px; }

/* header cart button — fit the dual лв/€ total without clipping */
.pf-cartbtn{ max-width:340px !important; overflow:visible !important; }
.pf-cartbtn__info b{ font-size:12px !important; letter-spacing:-.15px; white-space:nowrap; }

/* ============================================================
   MEGAMENU promo products — cards in the 1fr middle column,
   one TOP OFFER product fills the right column (was brands).
   Keeps the .pf-mega 250 / 1fr / 320 grid → size never changes.
   ============================================================ */
.pf-mega__cols{ display:flex; flex-direction:column; padding:22px 28px 16px; }
.pf-mega__cols > ul{ column-count:auto !important; display:flex; flex-wrap:wrap; gap:10px; }
.pf-mega__cols > ul a{ display:inline-flex !important; align-items:center; gap:7px; padding:9px 16px !important;
  background:var(--lilac-soft) !important; border:1px solid var(--line-2); border-radius:999px !important;
  font-size:13px; font-weight:600; color:var(--plum) !important; white-space:nowrap; transition:transform .15s, box-shadow .15s, background .15s, color .15s; }
.pf-mega__cols > ul a::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--pink); flex:0 0 auto; transition:background .15s; }
.pf-mega__cols > ul a:hover{ background:var(--grad) !important; color:#fff !important; border-color:transparent; transform:translateY(-1px); box-shadow:var(--shadow); }
.pf-mega__cols > ul a:hover::before{ background:#fff; }
.pf-mega__cols .pf-mm{ margin-top:auto; }
.pf-mm{ display:block; }
.pf-mm__grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.pf-mm__card{ display:flex !important; flex-direction:column; gap:3px; padding:7px !important; background:var(--bg-soft);
  border:1px solid var(--line); border-radius:10px; text-transform:none !important; white-space:normal !important;
  transition:transform .15s, box-shadow .15s, border-color .15s, background .15s; }
.pf-mm__card:hover{ transform:translateY(-2px); box-shadow:var(--shadow); border-color:var(--line-2); background:#fff !important; color:inherit !important; }
.pf-mm__card img{ width:100%; height:72px; object-fit:contain; }
.pf-mm__name{ font-size:11px; line-height:1.2; color:var(--ink); font-weight:600; white-space:normal;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.pf-mm__price{ font-size:11.5px; font-weight:800; color:var(--violet-600); }
.pf-mega__top{ background:var(--bg-soft); border-left:1px solid var(--line); padding:18px 20px; }
.pf-mega__top .pf-mm__top{ position:relative; display:flex !important; flex-direction:column; gap:8px; height:100%;
  text-decoration:none; text-transform:none !important; white-space:normal !important; }
.pf-mega__top .pf-mm__top img{ width:100%; height:196px; object-fit:contain; }
.pf-mega__top .pf-mm__topbadge{ position:absolute; top:0; left:0; z-index:2; background:var(--grad); color:#fff;
  font-size:11px; font-weight:700; padding:4px 12px; border-radius:999px; box-shadow:var(--shadow-sm); }
.pf-mega__top .pf-mm__name{ font-size:14px; line-height:1.3; color:var(--ink); font-weight:600;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.pf-mega__top .pf-mm__price{ font-size:16px; font-weight:800; color:var(--violet-600); margin-top:auto; }
.pf-mega__top .pf-mm__top:hover .pf-mm__name{ color:var(--violet-600); }
@media (max-width:1024px){ .pf-mega__top, .pf-mm__grid{ display:none; } }

/* ============================================================
   HOME — "Топ оферти" carousel: same .pf-card style as the grids above
   ============================================================ */
.pf-deals .slick-track{ display:flex !important; align-items:stretch; }
.pf-deals .slick-slide{ height:auto; }
.pf-deals .slick-slide > div{ height:100%; }
.pf-dealslide{ padding:6px 10px; height:100%; }
.pf-dealslide .pf-card{ height:100%; margin:0; }

/* ---- header search autocomplete (v58: thumbs + brand + price) ---- */
.pf-ac{ position:absolute; top:calc(100% + 8px); left:0; right:0; z-index:140;
  background:#fff; border:1px solid #eee3f6; border-radius:18px; padding:6px;
  box-shadow:0 24px 60px -18px rgba(76,29,149,.30), 0 6px 18px rgba(76,29,149,.10);
  overflow:hidden; display:none; max-height:70vh; overflow-y:auto; }
.pf-ac.is-open{ display:block; }
.pf-ac__item{ display:flex; align-items:center; gap:12px; padding:8px 12px; border-radius:13px;
  font-size:14px; line-height:1.25; color:#2e1065; text-decoration:none; cursor:pointer; }
.pf-ac__item + .pf-ac__item{ margin-top:2px; }
.pf-ac__thumb{ flex:0 0 46px; width:46px; height:46px; border-radius:12px; background:#fff;
  border:1px solid #f0e7fa; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.pf-ac__thumb img{ width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
.pf-ac__thumb.is-none{ background:linear-gradient(135deg,#faf5ff,#fdf2f8); }
.pf-ac__thumb.is-none::before{ content:"\2726"; font-size:15px; color:#c4b5fd; }
.pf-ac__info{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:1px; }
.pf-ac__brand{ font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#a78bca;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pf-ac__name{ font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pf-ac__price{ flex:0 0 auto; font-weight:800; font-size:13px; color:#6d28d9; white-space:nowrap; }
.pf-ac__item:hover, .pf-ac__item.is-active{ background:linear-gradient(90deg,#faf5ff,#fdf2f8); }
.pf-ac__item:hover .pf-ac__name, .pf-ac__item.is-active .pf-ac__name{ color:#7c3aed; }
/* beat the generic .pf-search button (round magnifier) styling */
.pf-search button.pf-ac__all{ position:static !important; display:flex; width:100% !important; height:auto !important;
  align-items:center; justify-content:center; gap:6px; margin:4px 0 0; top:auto !important; right:auto !important;
  padding:10px 12px; border:0; border-top:1px solid #f3ecfa; background:none !important; box-shadow:none !important;
  font-family:inherit; font-size:12px; font-weight:800; letter-spacing:.07em; text-transform:uppercase;
  color:#7c3aed !important; cursor:pointer; border-radius:0 0 13px 13px !important; }
.pf-search button.pf-ac__all:hover{ background:linear-gradient(90deg,#faf5ff,#fdf2f8) !important; }
/* mobile (v60): the dropdown escapes the narrow search field — fixed, near full viewport width
   (JS sets the exact top; .pf-header's backdrop-filter is already disabled <=1024 so fixed = viewport) */
@media (max-width:820px){
  .pf-ac{ position:fixed; left:10px; right:10px; max-height:62vh; }
  .pf-ac__item{ padding:8px 10px; gap:10px; }
}
@media (max-width:430px){
  .pf-ac__thumb{ flex-basis:42px; width:42px; height:42px; }
  .pf-ac__name{ font-size:13.5px; }
  .pf-ac__price{ font-size:12.5px; }
}
input.pf-invalid{ border-color:#e11d48 !important; box-shadow:0 0 0 3px rgba(225,29,48,.14) !important; }

/* ---- AI chat widget (v55) ---- */
.pf-chat{ position:fixed; right:22px; bottom:22px; z-index:1200; }
.pf-chat__fab{ display:inline-flex; align-items:center; gap:9px; border:0; cursor:pointer; background:linear-gradient(135deg,#7c3aed,#ec4899); color:#fff; font-weight:700; font-size:15px; padding:13px 18px; border-radius:40px; box-shadow:0 12px 30px rgba(124,58,237,.4); }
.pf-chat__fab svg{ width:22px; height:22px; }
.pf-chat.is-open .pf-chat__fab{ display:none; }
.pf-chat__panel{ position:absolute; right:0; bottom:0; width:370px; max-width:calc(100vw - 32px); height:540px; max-height:calc(100vh - 90px); background:#fff; border-radius:20px; overflow:hidden; box-shadow:0 24px 70px rgba(46,16,101,.32); display:none; flex-direction:column; }
.pf-chat.is-open .pf-chat__panel{ display:flex; }
.pf-chat__head{ display:flex; align-items:center; gap:9px; padding:14px 16px; color:#fff; background:linear-gradient(135deg,#6d28d9,#db2777); font-weight:700; }
.pf-chat__head b{ flex:1; font-size:15px; }
.pf-chat__dot{ width:9px; height:9px; border-radius:50%; background:#4ade80; box-shadow:0 0 0 3px rgba(74,222,128,.3); }
.pf-chat__x{ background:rgba(255,255,255,.18); border:0; color:#fff; width:30px; height:30px; border-radius:9px; cursor:pointer; display:grid; place-items:center; }
.pf-chat__x svg{ width:16px; height:16px; }
.pf-chat__body{ flex:1; overflow-y:auto; padding:16px; background:#faf7fe; display:flex; flex-direction:column; gap:4px; }
.pf-chat__msg{ display:flex; margin:3px 0; }
.pf-chat__msg--user{ justify-content:flex-end; }
.pf-chat__msg--bot{ justify-content:flex-start; }
.pf-chat__bub{ max-width:82%; padding:10px 14px; border-radius:16px; font-size:14px; line-height:1.45; word-wrap:break-word; }
.pf-chat__msg--user .pf-chat__bub{ background:linear-gradient(135deg,#7c3aed,#c026d3); color:#fff; border-bottom-right-radius:5px; }
.pf-chat__msg--bot .pf-chat__bub{ background:#fff; color:#2e1065; border:1px solid #eeddfb; border-bottom-left-radius:5px; }
.pf-chat__prods{ display:flex; flex-direction:column; gap:8px; margin:6px 0 4px; }
.pf-chat__prod{ display:flex; align-items:center; gap:11px; background:#fff; border:1px solid #eeddfb; border-radius:14px; padding:9px 11px; text-decoration:none; transition:.15s; }
.pf-chat__prod:hover{ border-color:#d8b4fe; box-shadow:0 6px 16px rgba(124,58,237,.12); }
.pf-chat__prod img{ width:46px; height:46px; object-fit:contain; flex:0 0 46px; }
.pf-chat__pn{ flex:1; font-size:13px; color:#2e1065; line-height:1.3; }
.pf-chat__pn b{ display:block; font-size:11px; color:#9333ea; text-transform:uppercase; letter-spacing:.3px; }
.pf-chat__pp{ font-size:12px; font-weight:700; color:#db2777; white-space:nowrap; }
.pf-chat__foot{ display:flex; gap:8px; padding:12px; border-top:1px solid #eee; background:#fff; }
.pf-chat__foot input{ flex:1; border:1.5px solid #e7d7f2; border-radius:12px; padding:11px 13px; font:inherit; font-size:14px; outline:none; }
.pf-chat__foot input:focus{ border-color:#c084fc; box-shadow:0 0 0 3px rgba(192,132,252,.18); }
.pf-chat__foot button{ border:0; cursor:pointer; background:linear-gradient(135deg,#7c3aed,#ec4899); color:#fff; width:46px; border-radius:12px; display:grid; place-items:center; }
.pf-chat__foot button svg{ width:19px; height:19px; }
.pf-chat__dots{ display:inline-flex; gap:4px; padding:2px 0; }
.pf-chat__dots i{ width:7px; height:7px; border-radius:50%; background:#c4b5fd; animation:pfblink 1s infinite; }
.pf-chat__dots i:nth-child(2){ animation-delay:.2s; }
.pf-chat__dots i:nth-child(3){ animation-delay:.4s; }
@keyframes pfblink{ 0%,60%,100%{ opacity:.3; } 30%{ opacity:1; } }
.pf-totop{ bottom:92px !important; }
@media(max-width:560px){ .pf-chat{ right:14px; bottom:14px; } .pf-chat__fab span{ display:none; } .pf-chat__fab{ padding:15px; border-radius:50%; } .pf-chat__panel{ height:calc(100vh - 100px); width:calc(100vw - 28px); } }

/* ---- chat product cards: two buttons + ml chips (v56) ---- */
.pf-chat__prod{ display:block; background:#fff; border:1px solid #eeddfb; border-radius:14px; padding:10px 11px; margin-bottom:8px; }
.pf-chat__prod:hover{ box-shadow:0 6px 16px rgba(124,58,237,.10); }
.pf-chat__prodmain{ display:flex; align-items:center; gap:11px; text-decoration:none; }
.pf-chat__prodmain img{ width:46px; height:46px; object-fit:contain; flex:0 0 46px; }
.pf-chat__prodfoot{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:9px; }
.pf-chat__pbtns{ display:flex; gap:6px; }
.pf-chat__pview{ font-size:12px; font-weight:600; color:#7c3aed; text-decoration:none; border:1px solid #e7d7f2; border-radius:9px; padding:6px 10px; white-space:nowrap; }
.pf-chat__pview:hover{ background:#faf5ff; }
.pf-chat__padd{ display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:700; color:#fff; border:0; cursor:pointer; background:linear-gradient(135deg,#7c3aed,#ec4899); border-radius:9px; padding:6px 11px; white-space:nowrap; }
.pf-chat__padd svg{ width:14px; height:14px; }
.pf-chat__mls{ display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }
.pf-chat__mlchip{ font-size:12px; font-weight:600; color:#5b21b6; background:#f3e8ff; border:1px solid #e2ceff; border-radius:8px; padding:6px 10px; cursor:pointer; }
.pf-chat__mlchip:hover{ background:#7c3aed; color:#fff; border-color:#7c3aed; }

/* ---- chat cards v57: contained buttons row + variants toggle on Добави ---- */
.pf-chat__prod{ overflow:hidden; }
.pf-chat__prodmain{ display:flex; align-items:center; gap:11px; text-decoration:none; }
.pf-chat__pp{ font-size:12.5px; font-weight:700; color:#db2777; margin-top:8px; }
.pf-chat__pbtns{ display:flex; gap:7px; margin-top:10px; }
.pf-chat__pview, .pf-chat__padd{ flex:1 1 0; min-width:0; box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; gap:5px; height:34px; padding:0 8px; border-radius:9px; font-size:12px; font-weight:700; }
.pf-chat__pview{ color:#7c3aed; text-decoration:none; border:1px solid #e7d7f2; background:#fff; }
.pf-chat__pview:hover{ background:#faf5ff; }
.pf-chat__padd{ color:#fff; border:0; cursor:pointer; background:linear-gradient(135deg,#7c3aed,#ec4899); }
.pf-chat__padd svg{ width:14px; height:14px; }
.pf-chat__mls{ display:none; flex-wrap:wrap; gap:6px; margin-top:10px; }
.pf-chat__mls.is-open{ display:flex; }
.pf-chat__mlslbl{ width:100%; font-size:11px; color:#8b7d94; font-weight:600; margin-bottom:1px; }
.pf-chat__mlchip{ font-size:12px; font-weight:600; color:#5b21b6; background:#f3e8ff; border:1px solid #e2ceff; border-radius:8px; padding:6px 10px; cursor:pointer; }
.pf-chat__mlchip:hover{ background:#7c3aed; color:#fff; border-color:#7c3aed; }

/* ============================================================
   МЕГА МЕНЮ — списък със случайни марки по категория (лимит 20)
   Живее в средната колона (.pf-mega__cols), между чиповете с
   видовете аромати и промо продуктите.
   ============================================================ */
.pf-mega__cols .pf-mmb{ margin-top:14px; padding-top:12px; border-top:1px dashed var(--line-2); }
.pf-mmb__ttl{ display:block; font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--muted); margin-bottom:8px; }
.pf-mega__cols .pf-mmb__list{ display:flex !important; flex-wrap:wrap; gap:6px 8px; column-count:auto !important;
  margin:0; padding:0; list-style:none; }
.pf-mega__cols .pf-mmb__list li{ margin:0; padding:0; list-style:none; }
.pf-mega__cols .pf-mmb__list a{ display:inline-block !important; padding:4px 10px !important; border-radius:999px !important;
  background:transparent !important; border:1px solid var(--line); color:var(--ink-2) !important;
  font-size:12px; font-weight:600; line-height:1.5; white-space:nowrap; text-transform:none !important;
  max-width:170px; overflow:hidden; text-overflow:ellipsis;
  transition:background .15s, color .15s, border-color .15s, transform .15s; }
.pf-mega__cols .pf-mmb__list a::before{ content:none !important; }
.pf-mega__cols .pf-mmb__list a:hover{ background:var(--lilac-soft) !important; color:var(--plum) !important;
  border-color:var(--lilac); transform:translateY(-1px); }
.pf-mega__cols a.pf-mmb__all{ display:inline-block !important; margin-top:9px; padding:0 !important;
  background:none !important; border:0 !important; border-radius:0 !important;
  font-size:12px; font-weight:700; color:var(--violet-600) !important; white-space:nowrap; }
.pf-mega__cols a.pf-mmb__all::before{ content:none !important; }
.pf-mega__cols a.pf-mmb__all:hover{ text-decoration:underline; transform:none; box-shadow:none; }
@media (max-width:1024px){ .pf-mmb{ display:none; } }

/* ============================================================
   ОТЗИВИ — обобщение, избор на звездички, статуси
   ============================================================ */
.pf-revsum{ display:flex; gap:28px; align-items:center; flex-wrap:wrap;
  background:var(--bg-soft); border:1px solid var(--line); border-radius:var(--radius);
  padding:16px 20px; margin:2px 0 18px; }
.pf-revsum__score{ display:flex; flex-direction:column; align-items:center; gap:4px; min-width:104px; }
.pf-revsum__score b{ font-size:34px; line-height:1; color:var(--ink); font-weight:800; }
.pf-revsum__score small{ color:var(--muted); font-size:12px; }
.pf-revsum__bars{ flex:1; min-width:220px; display:grid; gap:4px; }
.pf-revbar{ display:flex; align-items:center; gap:9px; font-size:12px; color:var(--muted); }
.pf-revbar span{ width:26px; flex:0 0 auto; color:var(--ink-2); }
.pf-revbar i{ flex:1; height:7px; border-radius:999px; background:var(--line-2); overflow:hidden; display:block; }
.pf-revbar i b{ display:block; height:100%; border-radius:999px; background:linear-gradient(135deg,#fbbf24,#f59e0b); }
.pf-revbar small{ width:26px; text-align:right; flex:0 0 auto; }

.pf-rate-pick{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.pf-rate-pick__lbl{ font-size:13px; font-weight:700; color:var(--ink-2); }
.pf-rate-pick__lbl i{ color:var(--pink); font-style:normal; margin-left:2px; }
.pf-rate-pick__stars{ display:inline-flex; gap:4px; }
.pf-rate-pick__stars button{ width:28px; height:28px; padding:0; border:0; cursor:pointer; background:var(--line-2);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/></svg>") center/contain no-repeat;
  transition:background .12s, transform .12s; }
.pf-rate-pick__stars button:hover{ transform:scale(1.08); }
.pf-rate-pick__stars button.on{ background:linear-gradient(135deg,#fbbf24,#f59e0b); }

.pf-review-form__foot{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:12px; }
.pf-review-form__foot small{ color:var(--muted); font-size:12px; }
.pf-review-form__msg{ margin:12px 0 0; font-size:13.5px; font-weight:600; padding:10px 14px; border-radius:12px; }
.pf-review-form__msg.ok{ background:#ecfdf5; color:#047857; border:1px solid #a7f3d0; }
.pf-review-form__msg.err{ background:#fef2f2; color:#b91c1c; border:1px solid #fecaca; }
.pf-review__head time{ margin-left:auto; color:var(--muted); font-size:12px; }
@media (max-width:640px){
  .pf-revsum{ gap:16px; padding:14px; }
  .pf-revsum__score{ min-width:84px; }
}
/* [hidden] трябва да бие display:flex по-горе (иначе празното обобщение се вижда) */
.pf-revsum[hidden], .pf-review-form[hidden], .pf-review-form__msg[hidden]{ display:none !important; }

/* ============================================================
   Продуктова страница — йерархия на заглавията (H1 -> H2)
   ============================================================ */
.pf-pdp__sub{ margin:2px 0 10px; font-size:13.5px; font-weight:600; letter-spacing:.04em;
  text-transform:uppercase; color:var(--muted); }
.pf-pdp__sub:empty{ display:none; }
.pf-pdp__oos{ color:#b91c1c; text-transform:none; letter-spacing:0; font-weight:700; }
.pf-pdp__oos font{ color:#b91c1c !important; }
h2.pf-pdp__tab{ margin:26px 0 8px; }
.pf-shead__h{ margin:6px 0 0; font-family:var(--display); font-weight:700;
  font-size:clamp(20px,2vw,26px); color:var(--plum); }
h2.pf-pdp__lasth{ margin:0 0 18px; font-family:var(--display); font-weight:700;
  font-size:clamp(18px,1.8vw,22px); color:var(--plum); }