/* ================================================================================
   SHAZDEH REDESIGN — Components CSS
   Loaded after szd-redesign.css. Each phase appends its component styles here.
   ================================================================================ */

/* ============ A2 — TOP UTILITY BAR ============ */
.szd-utility-bar{
  background:var(--szd-cream);
  border-bottom:1px solid var(--szd-line);
  padding:8px 0;
  font-size:12px;
  color:var(--szd-ink-2);
  font-family:'Vazirmatn','yekanbakh',Tahoma,sans-serif;
  position:relative;z-index:5;
}
.szd-utility-bar__row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:8px 18px;
}
.szd-utility-bar__left,
.szd-utility-bar__right{
  display:flex;
  gap:18px;
  align-items:center;
  flex-wrap:wrap;
}
.szd-utility-bar__item{
  display:inline-flex;
  align-items:center;
  gap:6px;
  white-space:nowrap;
  color:var(--szd-ink-2);
  text-decoration:none;
  transition:color .15s;
}
.szd-utility-bar__item:hover{color:var(--szd-pink-dk)}
.szd-utility-bar__item svg{
  width:14px;height:14px;
  color:var(--szd-pink-dk);
  flex-shrink:0;
}
.szd-utility-bar__item b{color:var(--szd-ink);font-weight:800}
.szd-utility-bar__phone{font-weight:700;font-variant-numeric:tabular-nums}
.szd-utility-bar__phone:hover{color:var(--szd-pink-dk)}
.szd-utility-bar__link{
  color:var(--szd-ink-2);
  text-decoration:none;
  font-weight:600;
  transition:color .15s;
}
.szd-utility-bar__link:hover{color:var(--szd-pink-dk)}
.szd-utility-bar__login b{color:var(--szd-pink-dk);font-weight:800}
.szd-utility-bar__login:hover b{color:var(--szd-pink)}

/* MOBILE: tighten + hide secondary items */
.szd-hide-md{display:inline-flex}
@media (max-width:1023px){
  .szd-utility-bar{font-size:11.5px;padding:6px 0}
  .szd-hide-md{display:none!important}
}
@media (max-width:767px){
  .szd-utility-bar{font-size:11px;padding:5px 0}
  .szd-utility-bar__row{justify-content:center;gap:4px 14px}
  .szd-utility-bar__left{flex:1;justify-content:flex-start;gap:12px}
  .szd-utility-bar__right{justify-content:flex-end;gap:10px}
  .szd-utility-bar__phone{display:none} /* phone moves to header on mobile */
  .szd-utility-bar__ship b{font-size:11px}
}

/* ================================================================================
   A3 (REVISED) — MAIN HEADER for DESKTOP + MOBILE, with rdquicksearch styled
   ================================================================================ */

/* Hide panda's original headers (desktop + mobile both) to prevent duplication */
#header_primary_row,
.header_top_box #header_primary_row{display:none !important}
#mobile_header,
.mobile_header_box,
header#header .mobile_header_top_container{display:none !important}

/* ============ DESKTOP HEADER (shown ≥1024px) ============ */
.szd-hdr--desk{
  background:#fff;
  /* دور ۱۰۱: breathing room for the search bar (دور ۱۰۰'s 1px bottom was too cramped);
     the seam «line» is gone now (section#top_extra border-top removed in szd-menu-desktop). */
  padding:14px 0 9px;
  border-bottom:0;
  position:sticky;top:0;z-index:50;
  font-family:'Vazirmatn','yekanbakh',Tahoma,sans-serif;
}
.szd-hdr--desk .szd-hdr__row{
  display:grid;
  grid-template-columns:260px 1fr auto;
  align-items:center;
  gap:28px;
}
.szd-hdr__logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.szd-hdr__logo-mark{
  width:54px;height:54px;border-radius:14px;
  background:linear-gradient(135deg,var(--szd-pink-soft),var(--szd-yellow-soft));
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 2px 6px rgba(244,120,169,.18);
  overflow:hidden;
}
.szd-hdr__logo-mark svg{width:36px;height:36px}
.szd-hdr__logo-img{max-width:46px;max-height:46px;object-fit:contain}
.szd-hdr__logo-text strong{display:block;font-size:18px;font-weight:900;color:var(--szd-ink);line-height:1.2}
.szd-hdr__logo-text small{display:block;font-size:11px;color:var(--szd-ink-3);margin-top:2px;font-weight:600}

/* ============ ICONS ============ */
.szd-hdr__icons{display:flex;gap:10px;align-items:center}
.szd-hdr__icon{
  position:relative;width:52px;height:52px;border-radius:14px;
  background:var(--szd-cream);border:1px solid var(--szd-line);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
  color:var(--szd-ink-2);text-decoration:none;transition:all .2s;
}
.szd-hdr__icon:hover{background:var(--szd-pink-soft);color:var(--szd-pink-dk);border-color:var(--szd-pink-soft);transform:translateY(-2px)}
.szd-hdr__icon svg{width:22px;height:22px}
.szd-hdr__icon-lbl{font-size:9.5px;font-weight:700;margin-top:1px}
.szd-hdr__icon-badge{
  position:absolute;top:-4px;right:-4px;background:var(--szd-pink-dk);color:#fff;
  font-size:10px;font-weight:900;min-width:20px;height:20px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  border:2px solid #fff;padding:0 5px;font-variant-numeric:tabular-nums;
}

/* ============================================================
   دور ۱۰۲: header action icons → soft gouache illustrations (NO box),
   wallet smaller, cart/account flyouts fixed (on-screen, above the
   mega-menu, styled card). Scoped to .szd-hdr--desk = desktop only.
   ============================================================ */
.szd-hdr--desk .szd-hdr__icon-host{
  background-color:transparent !important; border:0 !important; box-shadow:none !important;
  border-radius:0 !important; padding:0 !important;
  width:46px !important; height:46px !important; min-width:0 !important; max-width:none !important; flex:0 0 auto !important; position:relative;
  display:inline-flex; align-items:center; justify-content:center;
  background-repeat:no-repeat !important; background-position:center !important; background-size:contain !important;
  overflow:visible; transition:transform .25s cubic-bezier(.34,1.56,.64,1);
  filter:drop-shadow(0 3px 5px rgba(150,90,110,.18));
}
.szd-hdr--desk .szd-hdr__icon-host:hover{ transform:translateY(-3px) scale(1.07); background-color:transparent !important; }
.szd-hdr--desk .szd-hdr__icon-host--wallet{ background-image:url('/img/szd-menu/ic-wallet.png') !important; width:36px !important; height:36px !important; }
.szd-hdr--desk .szd-hdr__icon-host--cart{ background-image:url('/img/szd-menu/ic-cart.png') !important; }
.szd-hdr--desk .szd-hdr__icon-host--account{ background-image:url('/img/szd-menu/ic-account.png') !important; }
/* hide the modules' built-in glyph/svg/text labels */
.szd-hdr--desk .szd-hdr__icon-host i[class*="fto-"],
.szd-hdr--desk .szd-hdr__icon-host svg,
.szd-hdr--desk .szd-hdr__icon-host .header_icon_btn_text,
.szd-hdr--desk .szd-hdr__icon-host .cart_text{ display:none !important; }
/* inner link fills the icon (stays clickable), no chrome */
.szd-hdr--desk .szd-hdr__icon-host > a,
.szd-hdr--desk .szd-hdr__icon-host .blockcart,
.szd-hdr--desk .szd-hdr__icon-host .st_shopping_cart,
.szd-hdr--desk .szd-hdr__icon-host .login,
.szd-hdr--desk .szd-hdr__icon-host .header_item,
.szd-hdr--desk .szd-hdr__icon-host .header_icon_btn_2,
.szd-hdr--desk .szd-hdr__icon-host .header_icon_btn_3,
.szd-hdr--desk .szd-hdr__icon-host .header_icon_btn_icon{
  display:block !important; width:100% !important; height:100% !important;
  padding:0 !important; margin:0 !important; background:transparent !important;
  border:0 !important; box-shadow:none !important; border-radius:0 !important; min-width:0 !important;
}
/* raise header above the mega-menu (z-index:60) so flyouts aren't trapped under it.
   High-specificity selector: another rule forces z-index:2 on the header. */
body #st_header header.szd-hdr--desk{ z-index:999 !important; }
/* cart/account flyout — anchored below the icon, on-screen, styled card */
.szd-hdr--desk .szd-hdr__icon-host .dropdown_list{
  position:absolute !important; top:calc(100% + 12px) !important; left:0 !important; right:auto !important;
  z-index:9999 !important; width:330px !important; max-width:90vw !important;
  background:#fff !important; border:1px solid #F6E9EF !important; border-radius:18px !important;
  box-shadow:0 20px 48px rgba(176,58,110,.18), 0 4px 12px rgba(0,0,0,.05) !important;
  padding:16px !important; direction:rtl !important; text-align:right !important;
}
.szd-hdr--desk .szd-hdr__icon-host .dropdown_box{ padding:0 !important; }
.szd-hdr--desk .szd-hdr__icon-host .cart_empty{ color:#8a6b73; font-size:13px; text-align:center; padding:12px 0; }

/* ============================================================
   دور ۱۰۳: keep the gouache icon ON HOVER (a :hover rule was wiping
   background-image → the icon vanished) + a "lit" two-state hover;
   and restyle the cart/account dropdown content (clean rows, no gold box).
   ============================================================ */
body #st_header .szd-hdr__icon-host--wallet,  body #st_header .szd-hdr__icon-host--wallet:hover  { background-image:url('/img/szd-menu/ic-wallet.png') !important; }
body #st_header .szd-hdr__icon-host--cart,     body #st_header .szd-hdr__icon-host--cart:hover     { background-image:url('/img/szd-menu/ic-cart.png') !important; }
body #st_header .szd-hdr__icon-host--account,  body #st_header .szd-hdr__icon-host--account:hover  { background-image:url('/img/szd-menu/ic-account.png') !important; }
/* two-state "lit" hover (lift + grow + brighten + pink glow), not disappear */
body #st_header .szd-hdr--desk .szd-hdr__icon-host:hover{
  background-color:transparent !important;
  transform:translateY(-3px) scale(1.13) !important;
  filter:saturate(1.18) brightness(1.06) drop-shadow(0 8px 13px rgba(224,86,139,.4)) !important;
}
/* dropdown inner content — clean rows, RTL, drop the gold inner box */
.szd-hdr--desk .szd-hdr__icon-host .dropdown_list .dropdown_box,
.szd-hdr--desk .szd-hdr__icon-host .dropdown_list .shoppingcart-list,
.szd-hdr--desk .szd-hdr__icon-host .dropdown_list ul,
.szd-hdr--desk .szd-hdr__icon-host .dropdown_list li,
.szd-hdr--desk .szd-hdr__icon-host .dropdown_list > div{
  background:transparent !important; border:0 !important; box-shadow:none !important; list-style:none !important; margin:0 !important;
}
/* account-menu links only (NOT the cart product rows — those need their own layout) */
.szd-hdr--desk .szd-hdr__icon-host--account .dropdown_list a{
  display:block !important; padding:9px 12px !important; border-radius:10px !important;
  color:#5A4A4C !important; font-size:13.5px !important; font-weight:600 !important;
  text-decoration:none !important; text-align:right !important; transition:background .18s, color .18s;
}
.szd-hdr--desk .szd-hdr__icon-host--account .dropdown_list a:hover{ background:#FFF0F5 !important; color:#E0568B !important; }
.szd-hdr--desk .szd-hdr__icon-host .dropdown_list .cart_empty{ color:#8a6b73 !important; font-size:13px !important; text-align:center !important; padding:14px 0 !important; }

/* ============================================================
   دور ۱۰۴: cart-flyout product rows — fix the vertical-wrap break
   (دور ۱۰۳'s global link rule had forced .product-name to display:block).
   Row = [image] [name (≤2 lines) / qty · price · remove]. + wider search box.
   ============================================================ */
.szd-hdr__icon-host--cart .dropdown_list .small_cart_product_image{ width:50px !important; height:50px !important; object-fit:contain !important; border-radius:8px !important; }
.szd-hdr__icon-host--cart .dropdown_list li.line_item{ padding:9px 2px !important; border-bottom:1px solid #F6E9EF !important; }
.szd-hdr__icon-host--cart .dropdown_list li.line_item > .flex_container{ display:flex !important; gap:9px !important; align-items:center !important; }
.szd-hdr__icon-host--cart .dropdown_list .small_cart_info{ flex:1 1 auto !important; min-width:0 !important; }
.szd-hdr__icon-host--cart .dropdown_list .small_cart_info > .flex_container{ display:flex !important; flex-wrap:wrap !important; align-items:center !important; gap:3px 8px !important; }
.szd-hdr__icon-host--cart .dropdown_list .product-name{ flex:1 1 100% !important; display:block !important; white-space:normal !important; line-height:1.45 !important; max-height:2.9em !important; overflow:hidden !important; padding:0 !important; margin:0 !important; color:#3D2C2E !important; font-size:12.5px !important; font-weight:600 !important; }
.szd-hdr__icon-host--cart .dropdown_list .product-quantity{ color:#E0568B !important; font-weight:800 !important; font-size:11.5px !important; }
.szd-hdr__icon-host--cart .dropdown_list .price{ color:#5A4A4C !important; font-weight:700 !important; font-size:12.5px !important; padding:0 !important; margin:0 !important; }
.szd-hdr__icon-host--cart .dropdown_list .ajax_remove_button{ margin-right:auto !important; opacity:.55; }
/* totals summary + checkout button → brand (was amber #FFC107) */
.szd-hdr__icon-host--cart .dropdown_list .small_cart_sumary{ padding:10px 4px 2px !important; font-size:12.5px !important; }
.szd-hdr__icon-host--cart .dropdown_list .small_cart_sumary,
.szd-hdr__icon-host--cart .dropdown_list .small_cart_sumary *{ color:#5A4A4C !important; }
.szd-hdr__icon-host--cart .dropdown_list a.small_cart_btn{
  display:block !important; text-align:center !important; margin-top:8px !important;
  background:linear-gradient(135deg,#E0568B,#FF9CC0) !important; color:#fff !important;
  border:0 !important; border-radius:12px !important; padding:11px !important; font-weight:800 !important; font-size:13.5px !important;
  box-shadow:0 6px 14px rgba(224,86,139,.3) !important;
}
.szd-hdr__icon-host--cart .dropdown_list a.small_cart_btn:hover{ filter:brightness(1.06) !important; color:#fff !important; }
/* wider search box (fills the header's middle column) */
.szd-hdr--desk .szd-hdr__search-wrap{ max-width:none !important; width:100% !important; }

/* ============ SEARCH WRAP (around rdquicksearch hook output) ============ */
.szd-hdr__search-wrap{
  position:relative;
  max-width:680px;width:100%;
  justify-self:center;
}
/* Adapt Radyab QuickSearchBlock to look like our design */
.szd-hdr__search-wrap .QuickSearchBlock{margin:0;padding:0}
.szd-hdr__search-wrap .QuickSearchBox{position:relative;width:100%}
/* دور ۹۸.۱: kill the rdquicksearch module's default GRAY form frame (#f2f2f2 bg +
   1px border + 5px radius) — that was the "gray zone" around the field, not a shadow. */
.szd-hdr__search-wrap .QuickSearchForm{position:relative;display:flex;width:100%;margin:0;
  background:transparent !important;border:0 !important;border-radius:14px !important;
  padding:0 !important;box-shadow:none !important}
.szd-hdr__search-wrap .QuickSearchInput{
  position:relative;flex:1;display:flex;align-items:center;
  background:#fff;border:1.5px solid transparent;border-radius:14px;
  /* دور ۹۸: soft floating shadow instead of the hard gray outline */
  box-shadow:0 8px 22px rgba(176,58,110,.13),0 2px 5px rgba(45,28,32,.06);
  transition:border-color .2s,box-shadow .2s;
  overflow:visible;
}
.szd-hdr__search-wrap .QuickSearchInput:focus-within{
  border-color:var(--szd-pink);
  box-shadow:0 0 0 4px var(--szd-pink-soft);
}
.szd-hdr__search-wrap .QuickSearchInputText{
  flex:1;width:100%;
  padding:14px 56px 14px 18px;
  border:0;background:transparent;outline:none;
  font-family:inherit;font-size:14px;
  color:var(--szd-ink);
}
.szd-hdr__search-wrap .QuickSearchInputText::placeholder{color:var(--szd-ink-3);transition:opacity .3s}
/* Radyab's built-in search icon → style as our pink button */
/* دور ۹۸: search button = the soft illustrated magnifier (mega-menu icon style),
   gently floating/wiggling at rest, pops on hover. Pink-button chrome removed. */
.szd-hdr__search-wrap .QuickSearchBtnSearch{
  position:absolute;right:6px;top:50%;
  width:46px;height:46px;border:0;border-radius:0;
  background:url('/img/szd-menu/search.png') center/contain no-repeat !important;
  color:transparent;font-size:0;cursor:pointer;box-shadow:none;
  z-index:2;
  filter:drop-shadow(0 4px 7px rgba(150,90,110,.22));
  transform:translateY(-50%);
  transform-origin:center 60%;
  animation:szdSearchFloat 3s ease-in-out infinite;
  transition:transform .25s ease;
}
.szd-hdr__search-wrap .QuickSearchBtnSearch::before{display:none !important;}
.szd-hdr__search-wrap .QuickSearchBtnSearch:hover{
  animation:none;
  transform:translateY(-50%) scale(1.13) rotate(-7deg);
}
@keyframes szdSearchFloat{
  0%,100%{transform:translateY(-50%) rotate(0deg);}
  30%{transform:translateY(-57%) rotate(-4deg);}
  65%{transform:translateY(-45%) rotate(4.5deg);}
}
/* Hide Radyab's original icon glyph (we use ::before above) */
.szd-hdr__search-wrap .QuickSearchBtnSearch.fa,
.szd-hdr__search-wrap .QuickSearchBtnSearch[class*="icon"],
.szd-hdr__search-wrap .QuickSearchBtnSearch i{font-size:0}
/* Category select (if shown) */
.szd-hdr__search-wrap .QuickSearchCategory{
  background:var(--szd-cream);border:0;border-right:1px solid var(--szd-line);
  padding:0 14px;font-family:inherit;font-size:13px;font-weight:600;color:var(--szd-ink-2);
  outline:none;cursor:pointer;
}
/* RESULTS dropdown — autocomplete */
.szd-hdr__search-wrap .QuickSearchResults{
  position:absolute;top:calc(100% + 6px);left:0;right:0;
  background:#fff;border-radius:14px;
  box-shadow:0 12px 32px rgba(45,28,32,.14);
  border:1px solid var(--szd-line);
  max-height:480px;overflow-y:auto;
  z-index:60;
  padding:8px;
}
.szd-hdr__search-wrap .QuickSearchResults:empty{display:none}
.szd-hdr__search-wrap .QuickSearchResults a{
  display:flex;gap:10px;padding:10px;
  border-radius:10px;text-decoration:none;color:var(--szd-ink);
  align-items:center;transition:background .15s;
}
.szd-hdr__search-wrap .QuickSearchResults a:hover{background:var(--szd-pink-soft)}
.szd-hdr__search-wrap .QuickSearchResults img{
  width:48px;height:48px;border-radius:8px;
  object-fit:contain;background:var(--szd-cream);flex-shrink:0;
}
.szd-hdr__search-wrap .QuickSearch_more_products{
  display:block;text-align:center;
  background:linear-gradient(135deg,var(--szd-pink),var(--szd-pink-dk));
  color:#fff;padding:10px;border-radius:10px;
  font-weight:800;font-size:13px;margin-top:8px;
  text-decoration:none;
}
.szd-hdr__search-wrap .QuickSearch_no_products{
  padding:20px;text-align:center;color:var(--szd-ink-3);font-size:13px;
}
.szd-hdr__search-wrap .QuickSearchTags{
  display:flex;flex-wrap:wrap;gap:6px;padding:8px;
  border-top:1px solid var(--szd-line);margin-top:8px;
}
.szd-hdr__search-wrap .QuickSearchTagLink{
  background:var(--szd-cream);color:var(--szd-pink-dk);
  font-size:11.5px;font-weight:700;padding:5px 10px;
  border-radius:999px;text-decoration:none;
}
.szd-hdr__search-wrap .QuickSearchTagLink:hover{background:var(--szd-pink-soft)}

/* Animated placeholder (subtle fade) */
.szd-hdr__search-wrap .QuickSearchInputText[placeholder]{transition:none}
@keyframes szd-ph-fade{0%,100%{opacity:1}50%{opacity:.4}}

/* ============ MOBILE HEADER (shown <1024px) ============ */
.szd-hdr--mob{display:none}

@media (max-width:1023px){
  .szd-hdr--desk{display:none!important}
  .szd-hdr--mob{
    display:block;
    background:#fff;
    padding:10px 0;
    border-bottom:1px solid var(--szd-line);
    position:sticky;top:0;z-index:50;
    font-family:'Vazirmatn','yekanbakh',Tahoma,sans-serif;
  }
  .szd-hdr-m__row{
    display:grid;
    grid-template-columns:42px 1fr 42px 42px;
    align-items:center;gap:10px;
  }
  .szd-hdr-m__btn{
    width:42px;height:42px;border-radius:12px;
    background:var(--szd-cream);border:1px solid var(--szd-line);
    display:flex;align-items:center;justify-content:center;
    color:var(--szd-ink);cursor:pointer;
    position:relative;text-decoration:none;
    transition:all .2s;
  }
  .szd-hdr-m__btn:hover,.szd-hdr-m__btn:active{
    background:var(--szd-pink-soft);color:var(--szd-pink-dk);
  }
  .szd-hdr-m__btn svg{width:20px;height:20px}
  .szd-hdr-m__logo{
    display:flex;align-items:center;gap:10px;
    text-decoration:none;color:inherit;min-width:0;
  }
  .szd-hdr-m__mark{
    width:42px;height:42px;border-radius:12px;
    background:linear-gradient(135deg,var(--szd-pink-soft),var(--szd-yellow-soft));
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 2px 6px rgba(244,120,169,.18);
    overflow:hidden;
  }
  .szd-hdr-m__mark svg{width:30px;height:30px}
  .szd-hdr-m__logo-img{max-width:34px;max-height:34px;object-fit:contain}
  .szd-hdr-m__text{min-width:0;overflow:hidden}
  .szd-hdr-m__text strong{
    display:block;font-size:14px;font-weight:900;color:var(--szd-ink);line-height:1.1;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  }
  .szd-hdr-m__text small{
    display:block;font-size:10px;color:var(--szd-ink-3);margin-top:1px;font-weight:600;
  }
  .szd-hdr-m__badge{
    position:absolute;top:-4px;right:-4px;
    background:var(--szd-pink-dk);color:#fff;
    font-size:10px;font-weight:900;min-width:18px;height:18px;border-radius:9px;
    display:flex;align-items:center;justify-content:center;
    border:2px solid #fff;padding:0 4px;font-variant-numeric:tabular-nums;
  }

  /* MOBILE SEARCH DRAWER — slides down when search-toggle tapped */
  .szd-hdr-m__search-drawer{
    position:fixed;top:0;left:0;right:0;
    background:#fff;
    padding:14px;
    z-index:200;
    box-shadow:0 6px 20px rgba(0,0,0,.12);
    transform:translateY(-100%);
    transition:transform .35s cubic-bezier(.34,1.4,.6,1);
    display:flex;align-items:center;gap:10px;
  }
  body.szd-search-open .szd-hdr-m__search-drawer{transform:translateY(0)}
  body.szd-search-open::after{
    content:"";position:fixed;inset:0;background:rgba(45,28,32,.5);
    z-index:199;animation:szd-fade-in .25s ease;
  }
  @keyframes szd-fade-in{from{opacity:0}to{opacity:1}}
  .szd-hdr-m__close{
    width:42px;height:42px;border-radius:12px;
    background:var(--szd-cream);border:0;
    display:flex;align-items:center;justify-content:center;
    color:var(--szd-ink);flex-shrink:0;cursor:pointer;
  }
  .szd-hdr-m__close svg{width:20px;height:20px}
  /* The drawer wraps rdquicksearch hook — match the same styling */
  .szd-hdr-m__search-drawer .QuickSearchBlock{flex:1;margin:0}
  .szd-hdr-m__search-drawer .QuickSearchBox{position:relative}
  .szd-hdr-m__search-drawer .QuickSearchInput{
    background:var(--szd-cream);border:1.5px solid var(--szd-line);border-radius:12px;
    display:flex;align-items:center;
  }
  .szd-hdr-m__search-drawer .QuickSearchInput:focus-within{
    border-color:var(--szd-pink);background:#fff;
  }
  .szd-hdr-m__search-drawer .QuickSearchInputText{
    flex:1;padding:12px 50px 12px 14px;border:0;background:transparent;outline:none;
    font-family:inherit;font-size:14px;color:var(--szd-ink);
  }
  .szd-hdr-m__search-drawer .QuickSearchBtnSearch{
    position:absolute;right:6px;top:50%;transform:translateY(-50%);
    width:38px;height:38px;border-radius:10px;
    background:linear-gradient(135deg,var(--szd-pink),var(--szd-pink-dk));
    display:flex;align-items:center;justify-content:center;
    font-size:0;
  }
  .szd-hdr-m__search-drawer .QuickSearchBtnSearch::before{
    content:"";width:18px;height:18px;
    background:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.5' y2='16.5'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  .szd-hdr-m__search-drawer .QuickSearchResults{
    position:absolute;top:calc(100% + 8px);left:14px;right:14px;
    background:#fff;border-radius:14px;
    box-shadow:0 12px 32px rgba(45,28,32,.14);
    max-height:60vh;overflow-y:auto;padding:8px;
  }
}

/* Tablet adjustments (768-1023) — give mobile header a bit more breathing room */
@media (min-width:768px) and (max-width:1023px){
  .szd-hdr-m__row{grid-template-columns:48px 1fr auto 48px 48px;gap:14px}
  .szd-hdr-m__btn{width:48px;height:48px}
  .szd-hdr-m__mark{width:48px;height:48px}
  .szd-hdr-m__text strong{font-size:15px}
}

/* Very small mobile (<400) — hide tagline */
@media (max-width:400px){
  .szd-hdr-m__text small{display:none}
  .szd-hdr-m__text strong{font-size:13px}
  .szd-hdr-m__row{gap:6px}
}

/* ============ A3-FINAL — inline mobile search (no drawer), hide all leftover panda strips ============ */

/* Aggressively hide panda's old top/header bars (multiple selector variants for safety) */
#top_bar,#header_top_bar,#mobile_header,#header_primary_row,
.nav_bar,.header_top_bar_box,.mobile_header_box,.header_top_box #header_primary_row,
header#header .mobile_header_top_container,
header#header > .top_bar_box,header#header .top_bar,
.header-top,#header_top_links,.header-language-currency{display:none !important}

/* Our headers — viewport-based show/hide */
.szd-utility-bar{display:block !important}
@media (min-width:1024px){
  .szd-hdr--desk{display:block !important}
  .szd-hdr--mob{display:none !important}
}
@media (max-width:1023px){
  .szd-hdr--desk{display:none !important}
  .szd-hdr--mob{display:block !important}
}

/* ============ MOBILE INLINE SEARCH (no drawer) ============ */
.szd-hdr-m__row{
  display:grid;
  /* hamburger | logo (collapses) | inline-search | cart */
  grid-template-columns:42px auto 1fr 42px;
  align-items:center;gap:8px;
}
.szd-hdr-m__search-inline{
  position:relative;
  display:flex;align-items:center;
  background:var(--szd-cream);
  border:1.5px solid var(--szd-line);
  border-radius:12px;
  overflow:hidden;
  margin:0;min-width:0;
  transition:border-color .2s,box-shadow .2s;
}
.szd-hdr-m__search-inline:focus-within{
  border-color:var(--szd-pink);
  background:#fff;
  box-shadow:0 0 0 3px var(--szd-pink-soft);
}
.szd-hdr-m__search-inline input{
  flex:1;width:100%;min-width:0;
  padding:9px 42px 9px 10px;
  border:0;background:transparent;outline:none;
  font-family:inherit;font-size:12.5px;
  color:var(--szd-ink);
  -webkit-tap-highlight-color:rgba(244,120,169,.2);
}
.szd-hdr-m__search-inline input::placeholder{color:var(--szd-ink-3)}
.szd-hdr-m__search-inline button{
  position:absolute;right:4px;top:50%;transform:translateY(-50%);
  width:32px;height:32px;border-radius:8px;
  background:linear-gradient(135deg,var(--szd-pink),var(--szd-pink-dk));
  color:#fff;border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 6px rgba(244,120,169,.3);
}
.szd-hdr-m__search-inline button svg{width:16px;height:16px}

/* Tighten logo on mobile when search is inline (smaller text) */
.szd-hdr-m__text strong{font-size:13px;line-height:1}
.szd-hdr-m__text small{font-size:9px}
@media (max-width:600px){
  .szd-hdr-m__text{display:none}
  .szd-hdr-m__row{grid-template-columns:42px 42px 1fr 42px}
  .szd-hdr-m__search-inline input{font-size:12px;padding:9px 38px 9px 8px}
}
@media (max-width:380px){
  /* very tight: hide menu icon, only logo+search+cart */
  .szd-hdr-m__row{grid-template-columns:36px 1fr 36px;gap:5px}
  .szd-hdr-m__menu{display:none}
  .szd-hdr-m__mark{width:36px;height:36px}
  .szd-hdr-m__mark svg{width:26px;height:26px}
  .szd-hdr-m__btn{width:36px;height:36px}
}

/* ============ A3 SEARCH CLEANUP — hide "View all products" + "No products" buttons ============ */

/* These appear BELOW the search input and break the desktop layout.
   They were originally shown as fallback messages but we don't need them visible
   outside the autocomplete dropdown. Autocomplete clones them inside results. */
.szd-hdr__search-wrap > .QuickSearchBlock > .QuickSearchBox > .QuickSearch_more_products,
.szd-hdr__search-wrap > .QuickSearchBlock > .QuickSearchBox > .QuickSearch_no_products,
.szd-hdr__search-wrap .QuickSearchBox > .QuickSearch_more_products,
.szd-hdr__search-wrap .QuickSearchBox > .QuickSearch_no_products,
.szd-hdr__search-wrap .QuickSearchTags{display:none !important}

/* Keep them visible ONLY inside the autocomplete results dropdown (where JS clones them) */
.szd-hdr__search-wrap .QuickSearchResults .QuickSearch_more_products,
.szd-hdr__search-wrap .QuickSearchResults .QuickSearch_no_products{display:block !important}

/* Same for mobile inline search context */
.szd-hdr-m__search-inline .QuickSearch_more_products,
.szd-hdr-m__search-inline .QuickSearch_no_products,
.szd-hdr-m__search-inline .QuickSearchTags{display:none !important}

/* When autocomplete shows results, style the cloned "View all" button cleanly */
.QuickSearchResults .QuickSearch_more_products{
  text-align:center;
  background:linear-gradient(135deg,var(--szd-pink),var(--szd-pink-dk));
  color:#fff !important;
  padding:10px;border-radius:10px;
  font-weight:800;font-size:13px;
  margin-top:8px;
  text-decoration:none;
}
.QuickSearchResults .QuickSearch_no_products{
  padding:16px;text-align:center;color:var(--szd-ink-3);font-size:13px;
}

/* Autocomplete dropdown — devbridge default styles override */
.autocomplete-suggestions{
  border:1px solid var(--szd-line) !important;
  background:#fff !important;
  border-radius:14px !important;
  box-shadow:0 12px 32px rgba(45,28,32,.14) !important;
  margin-top:6px;
  max-height:480px;overflow-y:auto;
  padding:8px;
  font-family:'Vazirmatn','yekanbakh',Tahoma,sans-serif;
}
.autocomplete-suggestion{
  padding:0 !important;
  border-bottom:1px solid var(--szd-line);
  cursor:pointer;
}
.autocomplete-suggestion:last-child{border-bottom:0}
.autocomplete-suggestion .QuickSearchResultProductBox{
  display:flex;gap:10px;padding:10px;
  border-radius:10px;text-decoration:none;color:var(--szd-ink);
  align-items:center;transition:background .15s;
}
.autocomplete-suggestion:hover .QuickSearchResultProductBox,
.autocomplete-suggestion.autocomplete-selected .QuickSearchResultProductBox{
  background:var(--szd-pink-soft) !important;
}
.autocomplete-suggestion img.ResultProductImg{
  width:48px;height:48px;border-radius:8px;
  object-fit:contain;background:var(--szd-cream);flex-shrink:0;
}
.QuickSearchResultProductBox_line{flex:1;min-width:0}
.QuickSearchResultName{
  font-size:13px;font-weight:700;color:var(--szd-ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.ResultProductBrand{
  font-size:11px;color:var(--szd-ink-3);margin-top:2px;font-weight:500;
}
.ResultProductPriceBox{display:flex;gap:6px;align-items:baseline;margin-top:3px}
.ResultProductPrice{font-size:13px;font-weight:900;color:var(--szd-pink-dk);font-variant-numeric:tabular-nums}
.ResultProductOldPrice{font-size:11px;color:var(--szd-ink-3);text-decoration:line-through;font-variant-numeric:tabular-nums}
.ResultProductPrice,.ResultProductOldPrice{white-space:nowrap}

/* Loading spinner state on search button */
.QuickSearchBtnSearch.active{
  animation:szd-spin-pulse .8s ease-in-out infinite;
}
@keyframes szd-spin-pulse{0%,100%{opacity:1;transform:translateY(-50%) scale(1)}50%{opacity:.6;transform:translateY(-50%) scale(.92)}}

/* ============ A3 — MOBILE SEARCH (rdquicksearch-compatible, autocomplete enabled) ============ */

/* Override previous mobile inline-search styles — now uses .QuickSearchBox markup */
.szd-hdr-m__search-inline{display:none !important}

/* Mobile QuickSearchBox — looks like our inline pill but uses rdquicksearch classes */
.szd-hdr--mob .szd-hdr-m__search{
  position:relative;
  display:flex;align-items:center;
  margin:0;min-width:0;
}
.szd-hdr--mob .szd-hdr-m__search .QuickSearchForm{
  display:flex;flex:1;margin:0;width:100%;
}
.szd-hdr--mob .szd-hdr-m__search .QuickSearchInput{
  position:relative;flex:1;display:flex;align-items:center;
  background:var(--szd-cream);
  border:1.5px solid var(--szd-line);
  border-radius:12px;
  overflow:hidden;
  transition:border-color .2s,box-shadow .2s;
}
.szd-hdr--mob .szd-hdr-m__search .QuickSearchInput:focus-within{
  border-color:var(--szd-pink);
  background:#fff;
  box-shadow:0 0 0 3px var(--szd-pink-soft);
}
.szd-hdr--mob .szd-hdr-m__search .QuickSearchInputText{
  flex:1;width:100%;min-width:0;
  padding:9px 42px 9px 10px;
  border:0;background:transparent;outline:none;
  font-family:inherit;font-size:12.5px;
  color:var(--szd-ink);
  -webkit-tap-highlight-color:rgba(244,120,169,.2);
}
.szd-hdr--mob .szd-hdr-m__search .QuickSearchInputText::placeholder{color:var(--szd-ink-3)}
.szd-hdr--mob .szd-hdr-m__search .QuickSearchBtnSearch{
  position:absolute;right:4px;top:50%;transform:translateY(-50%);
  width:32px;height:32px;border-radius:8px;
  background:linear-gradient(135deg,var(--szd-pink),var(--szd-pink-dk));
  color:#fff;border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 6px rgba(244,120,169,.3);
  font-size:0;
  z-index:2;
}
.szd-hdr--mob .szd-hdr-m__search .QuickSearchBtnSearch::before{
  content:"";display:block;width:14px;height:14px;
  background:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.5' y2='16.5'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Mobile autocomplete dropdown — appears below input as a fixed panel */
.szd-hdr--mob .szd-hdr-m__search .autocomplete-suggestions{
  position:fixed !important;
  top:auto !important;
  left:8px !important;right:8px !important;
  background:#fff !important;
  border:1px solid var(--szd-line) !important;
  border-radius:14px !important;
  box-shadow:0 12px 32px rgba(45,28,32,.2) !important;
  max-height:60vh !important;
  overflow-y:auto !important;
  padding:6px !important;
  z-index:9999 !important;
  font-family:'Vazirmatn','yekanbakh',Tahoma,sans-serif;
}
/* Position the dropdown right below the header search row */
@media (max-width:1023px){
  .autocomplete-suggestions{
    top:62px !important;  /* below the ~58px tall mobile header */
  }
}
.szd-hdr--mob .szd-hdr-m__search .autocomplete-suggestion{
  padding:0 !important;
  border-bottom:1px solid var(--szd-line);
  cursor:pointer;
}
.szd-hdr--mob .szd-hdr-m__search .autocomplete-suggestion:last-child{border-bottom:0}
.szd-hdr--mob .szd-hdr-m__search .QuickSearchResultProductBox{
  display:flex;gap:10px;padding:8px;
  border-radius:10px;text-decoration:none;color:var(--szd-ink);
  align-items:center;
}
.szd-hdr--mob .szd-hdr-m__search .autocomplete-suggestion:hover .QuickSearchResultProductBox,
.szd-hdr--mob .szd-hdr-m__search .autocomplete-suggestion.autocomplete-selected .QuickSearchResultProductBox{
  background:var(--szd-pink-soft);
}
.szd-hdr--mob .szd-hdr-m__search .ResultProductImg{
  width:42px;height:42px;border-radius:8px;
  object-fit:contain;background:var(--szd-cream);flex-shrink:0;
}
.szd-hdr--mob .szd-hdr-m__search .QuickSearchResultProductBox_line{flex:1;min-width:0}
.szd-hdr--mob .szd-hdr-m__search .QuickSearchResultName{
  font-size:12px;font-weight:700;color:var(--szd-ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  line-height:1.4;
}
.szd-hdr--mob .szd-hdr-m__search .ResultProductBrand{
  font-size:10px;color:var(--szd-ink-3);font-weight:500;margin-top:1px;
}
.szd-hdr--mob .szd-hdr-m__search .ResultProductPriceBox{
  display:flex;gap:6px;align-items:baseline;margin-top:2px;
}
.szd-hdr--mob .szd-hdr-m__search .ResultProductPrice{font-size:12px;font-weight:900;color:var(--szd-pink-dk);font-variant-numeric:tabular-nums}
.szd-hdr--mob .szd-hdr-m__search .ResultProductOldPrice{font-size:10px;color:var(--szd-ink-3);text-decoration:line-through;font-variant-numeric:tabular-nums}

/* Hide fallback buttons in mobile context (only show inside dropdown) */
.szd-hdr--mob .szd-hdr-m__search > .QuickSearch_more_products,
.szd-hdr--mob .szd-hdr-m__search > .QuickSearch_no_products{display:none !important}

/* Tighten when search has focus — push other items aside */
@media (max-width:600px){
  .szd-hdr-m__text{display:none}
  .szd-hdr-m__row{grid-template-columns:42px 42px 1fr 42px}
}
@media (max-width:380px){
  .szd-hdr-m__row{grid-template-columns:36px 1fr 36px;gap:5px}
  .szd-hdr-m__menu{display:none}
  .szd-hdr-m__mark{width:36px;height:36px}
  .szd-hdr-m__btn{width:36px;height:36px}
  .szd-hdr--mob .szd-hdr-m__search .QuickSearchInputText{padding:8px 36px 8px 8px;font-size:12px}
  .szd-hdr--mob .szd-hdr-m__search .QuickSearchBtnSearch{width:28px;height:28px;right:3px}
}

/* ================================================================================
   A4 — MEGA NAVIGATION (desktop horizontal nav + mobile slide drawer)
   ================================================================================ */

/* Hide panda's original menu chrome (header_menu block + mobile nav) */
#easymenu_container,.easymenu_bar,
#top_extra,#top_extra_container,
.st_mega_menu_container,
#main_menu_widgets,
header#header > .header_menu,
.boxed_megamenu,
.stmobilemenu,.st-mobile-menu,
#mobile_menu,.mobile_menu_box{display:none !important}

/* ============ DESKTOP NAV (≥1024px) ============ */
.szd-nav--desk{display:none}
@media (min-width:1024px){
  .szd-nav--desk{
    display:block;
    background:#fff;
    border-bottom:1px solid var(--szd-line);
    position:sticky;top:88px;z-index:49;  /* sits under sticky header (88 = 18+54+18 padding) */
    font-family:'Vazirmatn','yekanbakh',Tahoma,sans-serif;
  }
}
.szd-nav__row{
  display:flex;align-items:stretch;
  height:48px;
  gap:0;
}

/* "همه دسته‌بندی‌ها" — pink CTA with always-on (hover) dropdown */
.szd-nav__all-wrap{position:relative}
.szd-nav__cats{
  background:linear-gradient(135deg,var(--szd-pink),var(--szd-pink-dk));
  color:#fff;padding:0 20px;
  display:flex;align-items:center;gap:8px;
  font-size:13px;font-weight:900;
  border-radius:0 0 14px 14px;
  border:0;font-family:inherit;cursor:pointer;height:48px;
  box-shadow:0 4px 12px rgba(244,120,169,.3);
  white-space:nowrap;
  position:relative;
}
.szd-nav__cats svg{width:18px;height:18px}
.szd-nav__cats-chev{font-size:9px;opacity:.85}
.szd-nav__all-wrap:hover .szd-nav__all-dd,
.szd-nav__all-wrap:focus-within .szd-nav__all-dd{display:grid}
.szd-nav__all-dd{
  position:absolute;top:100%;right:0;
  background:#fff;border-radius:0 0 16px 16px;
  box-shadow:0 18px 40px rgba(45,28,32,.16);
  border-top:2px solid var(--szd-pink);
  padding:14px;width:560px;
  display:none;
  grid-template-columns:1fr 1fr;
  gap:6px;
  z-index:60;
}
.szd-nav__all-item{
  display:flex;align-items:center;gap:10px;
  padding:10px 12px;border-radius:10px;
  text-decoration:none;color:var(--szd-ink);
  transition:background .15s,transform .15s;
}
.szd-nav__all-item:hover{background:var(--szd-pink-soft);transform:translateX(-3px)}
.szd-nav__all-item svg{
  width:32px;height:32px;padding:6px;
  background:var(--szd-cream);border-radius:10px;
  color:var(--szd-pink-dk);flex-shrink:0;
}
.szd-nav__all-item:nth-child(2) svg{color:#C68C1C;background:var(--szd-yellow-soft)}
.szd-nav__all-item:nth-child(3) svg{color:var(--szd-teal-dk);background:var(--szd-teal-soft)}
.szd-nav__all-item:nth-child(4) svg{color:#6BB36B;background:#E0F0D8}
.szd-nav__all-item:nth-child(5) svg{color:#7B5BC8;background:#EFE5FF}
.szd-nav__all-item:nth-child(6) svg{color:#D14F2B;background:#FFE3DC}
.szd-nav__all-item:nth-child(7) svg{color:#3B6FCE;background:#D7E5FA}
.szd-nav__all-item:nth-child(8) svg{color:var(--szd-pink-dk);background:#FFEAF1}
.szd-nav__all-item:nth-child(9) svg{color:#8B6F50;background:var(--szd-cream)}
.szd-nav__all-item:nth-child(10) svg{color:var(--szd-pink-dk);background:var(--szd-pink-soft)}
.szd-nav__all-item:nth-child(11) svg{color:var(--szd-teal-dk);background:var(--szd-teal-soft)}
.szd-nav__all-item:nth-child(12) svg{color:#C68C1C;background:var(--szd-yellow-soft)}
.szd-nav__all-item:nth-child(13) svg{color:#7B5BC8;background:#EFE5FF}
.szd-nav__all-item strong{display:block;font-size:13px;font-weight:800;color:var(--szd-ink);line-height:1.2}
.szd-nav__all-item small{display:block;font-size:10.5px;color:var(--szd-ink-3);margin-top:2px;font-weight:600;font-variant-numeric:tabular-nums}

/* Top-level menu items (categories + special) */
.szd-nav__item{
  padding:0 16px;height:48px;
  display:flex;align-items:center;gap:5px;
  font-size:13.5px;font-weight:700;color:var(--szd-ink);
  position:relative;cursor:pointer;border:0;background:transparent;
  font-family:inherit;text-decoration:none;
  transition:color .2s;
  white-space:nowrap;
}
.szd-nav__item:hover{color:var(--szd-pink-dk)}
.szd-nav__item::after{
  content:"";position:absolute;bottom:0;left:16px;right:16px;height:3px;
  background:var(--szd-pink);border-radius:2px 2px 0 0;
  transform:scaleX(0);transition:transform .25s;
}
.szd-nav__item:hover::after{transform:scaleX(1)}
.szd-nav__chev{font-size:9px;color:var(--szd-ink-3);transition:transform .2s}
.szd-nav__item:hover .szd-nav__chev{color:var(--szd-pink-dk);transform:rotate(180deg)}
.szd-nav__item--special{color:var(--szd-red);font-weight:900}
.szd-nav__item--special:hover{color:#D14F2B}
.szd-nav__item--special::after{background:var(--szd-red)}

/* Mega dropdown for items */
.szd-nav__dd{
  position:absolute;top:48px;right:0;
  background:#fff;border-radius:0 0 16px 16px;
  box-shadow:0 18px 40px rgba(45,28,32,.16);
  border-top:2px solid var(--szd-pink);
  padding:20px;width:720px;
  display:none;
  z-index:50;
}
.szd-nav__item:hover .szd-nav__dd,
.szd-nav__item:focus-within .szd-nav__dd{display:block}
.szd-nav__dd-cols{
  display:grid;
  grid-template-columns:1fr 1fr 1fr 220px;
  gap:24px;
}
.szd-nav__dd-col h4{
  font-size:13px;font-weight:900;color:var(--szd-ink);
  margin-bottom:10px;padding-bottom:6px;
  border-bottom:2px solid var(--szd-pink-soft);
  display:flex;align-items:center;gap:6px;
}
.szd-nav__dd-badge{
  background:var(--szd-pink-soft);color:var(--szd-pink-dk);
  font-size:9.5px;font-weight:900;padding:2px 6px;border-radius:6px;
}
.szd-nav__dd-col a{
  display:flex;align-items:center;justify-content:space-between;
  padding:6px 0;color:var(--szd-ink-2);font-size:13px;font-weight:600;
  text-decoration:none;transition:color .15s,transform .15s;
}
.szd-nav__dd-col a:hover{color:var(--szd-pink-dk);transform:translateX(-3px)}
.szd-nav__dd-count{
  color:var(--szd-ink-3);font-size:11px;font-weight:500;font-variant-numeric:tabular-nums;
}
/* Promo card */
.szd-nav__dd-promo{
  background:linear-gradient(135deg,var(--szd-yellow-soft),var(--szd-pink-soft));
  border-radius:14px;padding:16px;
  display:flex;flex-direction:column;justify-content:center;gap:6px;
  position:relative;overflow:hidden;
}
.szd-nav__dd-promo::before{
  content:"";position:absolute;top:-30px;left:-30px;
  width:100px;height:100px;border-radius:50%;
  background:rgba(244,120,169,.18);
}
.szd-nav__dd-promo-kicker{
  font-size:11px;color:var(--szd-pink-dk);font-weight:800;
  position:relative;z-index:1;
}
.szd-nav__dd-promo h4{
  font-size:14px;font-weight:900;color:var(--szd-ink);
  position:relative;z-index:1;
}
.szd-nav__dd-promo p{
  font-size:11.5px;color:var(--szd-ink-2);line-height:1.5;
  position:relative;z-index:1;
}
.szd-nav__dd-cta{
  background:var(--szd-pink);color:#fff;border:0;
  padding:6px 14px;border-radius:9px;font-weight:800;font-size:11.5px;
  align-self:flex-start;text-decoration:none;
  box-shadow:0 4px 10px rgba(244,120,169,.3);
  position:relative;z-index:1;
  font-family:inherit;cursor:pointer;
}

/* Simple dropdown (single column) */
.szd-nav__dd--simple{
  width:280px;padding:12px;
}
.szd-nav__dd--simple > a{
  display:flex;align-items:center;justify-content:space-between;
  padding:9px 12px;border-radius:10px;
  color:var(--szd-ink-2);font-size:13px;font-weight:700;
  text-decoration:none;transition:background .15s;
}
.szd-nav__dd--simple > a:hover{background:var(--szd-pink-soft);color:var(--szd-pink-dk)}

/* Spacer (pushes phone to far end in RTL) */
.szd-nav__spacer{flex:1}

/* Phone support — right side (visual left in RTL) */
.szd-nav__phone{
  display:inline-flex;align-items:center;gap:8px;
  padding:0 16px;height:48px;
  color:var(--szd-ink-2);font-weight:700;font-size:13px;
  text-decoration:none;
}
.szd-nav__phone:hover{color:var(--szd-pink-dk)}
.szd-nav__phone svg{width:16px;height:16px;color:var(--szd-pink-dk)}
.szd-nav__phone b{color:var(--szd-ink);font-weight:900;font-variant-numeric:tabular-nums}

/* ============ MOBILE DRAWER (<1024px) ============ */
.szd-drawer{
  position:fixed;top:0;bottom:0;right:0;left:auto;
  width:86%;max-width:340px;
  background:#fff;
  z-index:9999;
  transform:translateX(100%);
  transition:transform .32s ease-out;       /* no overshoot — avoids a transient right-edge gap */
  display:flex;flex-direction:column;
  overflow-y:auto;overflow-x:hidden;
  font-family:'Vazirmatn','yekanbakh',Tahoma,sans-serif;
  box-shadow:-8px 0 24px rgba(45,28,32,.18);
}
body.szd-drawer-open .szd-drawer{transform:translateX(0) !important}

.szd-drawer__backdrop{
  position:fixed;inset:0;width:100vw;height:100%;
  background:rgba(30,18,22,.62);
  z-index:9998;
  opacity:0;pointer-events:none;
  transition:opacity .25s;
}
body.szd-drawer-open .szd-drawer__backdrop{opacity:1;pointer-events:auto}

/* Desktop hides drawer entirely */
@media (min-width:1024px){
  .szd-drawer,.szd-drawer__backdrop{display:none !important}
}

/* ============ ALWAYS-ON CATEGORY ICON ANIMATIONS (home grid + drawer) ============
   live icons are .ic-{catid} with mockup part classes (.body-bob/.eye-blink/.cover-l/r/.piece-2/.arm-l/.blob/.bubble) */
@keyframes szd-ic-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-2.5px)}}
@keyframes szd-ic-blink{0%,90%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
@keyframes szd-ic-coverl{0%,80%,100%{transform:rotate(0)}85%,95%{transform:rotate(-55deg)}}
@keyframes szd-ic-coverr{0%,80%,100%{transform:rotate(0)}85%,95%{transform:rotate(55deg)}}
@keyframes szd-ic-puzzle{0%,80%,100%{transform:translateX(16px) rotate(14deg);opacity:.25}85%,95%{transform:translateX(0) rotate(0);opacity:1}}
@keyframes szd-ic-arm{0%,80%,100%{transform:rotate(0)}85%,95%{transform:rotate(32deg)}}
@keyframes szd-ic-palette{0%,80%,100%{transform:translateY(0)}85%,95%{transform:translateY(9px)}}
@keyframes szd-ic-science{0%,80%,100%{transform:translateY(0);opacity:.5}85%,95%{transform:translateY(-12px);opacity:1}}
.cat-icon .body-bob,.szd-ic-svg .body-bob{animation:szd-ic-bob 2.6s ease-in-out infinite;transform-origin:center bottom;transform-box:fill-box}
.cat-icon .eye-blink,.szd-ic-svg .eye-blink{animation:szd-ic-blink 3.6s ease-in-out infinite;transform-origin:center;transform-box:fill-box}
.cat-icon .cover-l,.szd-ic-svg .cover-l{animation:szd-ic-coverl 7s ease-in-out infinite;transform-origin:50px 30px}
.cat-icon .cover-r,.szd-ic-svg .cover-r{animation:szd-ic-coverr 7s ease-in-out infinite;transform-origin:50px 30px}
.cat-icon .piece-2,.szd-ic-svg .piece-2{animation:szd-ic-puzzle 7s ease-in-out infinite 1s;transform-origin:70px 60px}
.cat-icon .arm-l,.szd-ic-svg .arm-l{animation:szd-ic-arm 7s ease-in-out infinite 2s;transform-origin:72px 60px}
.cat-icon .blob,.szd-ic-svg .blob{animation:szd-ic-palette 7s ease-in-out infinite 3s;transform-origin:center;transform-box:fill-box}
.cat-icon .bubble,.szd-ic-svg .bubble{animation:szd-ic-science 7s ease-in-out infinite 4s;transform-origin:center;transform-box:fill-box}
@media (prefers-reduced-motion:reduce){ .cat-icon *,.szd-ic-svg *{animation:none !important} }

/* Drawer head — pink gradient + user info */
.szd-drawer__head{
  background:linear-gradient(135deg,var(--szd-pink),var(--szd-pink-dk));
  color:#fff;padding:24px 18px 22px;position:relative;
  flex-shrink:0;
}
.szd-drawer__head::before{
  content:"";position:absolute;top:-30px;left:-30px;
  width:120px;height:120px;border-radius:50%;
  background:rgba(255,255,255,.15);
}
.szd-drawer__head::after{
  content:"";position:absolute;bottom:-40px;right:-40px;
  width:140px;height:140px;border-radius:50%;
  background:rgba(255,255,255,.1);
}
.szd-drawer__close{
  position:absolute;top:14px;left:14px;
  width:34px;height:34px;border-radius:50%;
  background:rgba(255,255,255,.22);
  color:#fff;border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  z-index:2;
}
.szd-drawer__close svg{width:18px;height:18px}
.szd-drawer__user{
  display:flex;align-items:center;gap:14px;
  position:relative;z-index:1;
}
.szd-drawer__user-avatar{
  width:56px;height:56px;border-radius:50%;
  background:#fff;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
  box-shadow:0 4px 12px rgba(0,0,0,.15);
}
.szd-drawer__user-avatar svg{width:30px;height:30px;color:var(--szd-pink-dk)}
.szd-drawer__user-body{min-width:0}
.szd-drawer__user-body strong{
  display:block;font-size:15px;font-weight:900;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.szd-drawer__user-link{
  display:inline-block;margin-top:4px;
  font-size:12px;font-weight:700;opacity:.95;
  text-decoration:none;color:#fff;
}

/* Sections */
.szd-drawer__section{
  padding:14px 0;
  border-bottom:1px solid var(--szd-line);
}
.szd-drawer__section:last-of-type{border-bottom:0}
.szd-drawer__section-title{
  font-size:11px;font-weight:900;color:var(--szd-ink-3);
  padding:0 18px 8px;text-transform:uppercase;letter-spacing:.5px;
}

/* Links */
.szd-drawer__link{
  display:flex;align-items:center;justify-content:space-between;
  padding:11px 18px;
  color:var(--szd-ink-2);text-decoration:none;
  font-size:14px;font-weight:600;
  transition:background .15s,color .15s;
}
.szd-drawer__link:hover,.szd-drawer__link:active{background:var(--szd-pink-soft);color:var(--szd-pink-dk)}
.szd-drawer__link > span{
  color:var(--szd-ink-3);font-size:11px;font-weight:500;
  font-variant-numeric:tabular-nums;
}
.szd-drawer__link--special{color:var(--szd-red);font-weight:800}
.szd-drawer__link--logout{color:var(--szd-red)}
.szd-drawer__link-badge{
  background:var(--szd-pink-dk);color:#fff !important;
  font-size:10px;font-weight:900;
  min-width:20px;height:20px;border-radius:10px;
  display:inline-flex;align-items:center;justify-content:center;
  padding:0 6px;
}

/* ===== Drawer v2 — bespoke icon tiles + category accordion (NO emoji) ===== */
.szd-drawer__link{justify-content:flex-start;gap:10px}
.szd-drawer__lic{
  width:34px;height:34px;flex-shrink:0;border-radius:9px;padding:4px;
  display:flex;align-items:center;justify-content:center;
  background:var(--szd-cream,#FFF5F0);
}
.szd-drawer__lic svg{width:100%;height:100%;display:block;overflow:visible}
.szd-drawer__link > .szd-drawer__ltxt{
  flex:1;text-align:right;font-size:14px;font-weight:700;color:var(--szd-ink,#3D2C2E);
}
.szd-drawer__link--special > .szd-drawer__ltxt{color:var(--szd-red);font-weight:800}
.szd-drawer__link--logout > .szd-drawer__ltxt{color:var(--szd-red)}

/* Drawer category accordion — UNIQUE prefix szd-dacc (szd-acc__* is the ACCOUNT-page namespace; do not reuse) */
.szd-dacc{display:flex;flex-direction:column}
.szd-dacc__item{border-bottom:1px solid var(--szd-line,#F2E7E3)}
.szd-dacc__head{
  display:flex;align-items:center;gap:10px;width:100%;
  padding:8px 18px;background:transparent;border:0;cursor:pointer;
  font-family:inherit;text-align:right;color:var(--szd-ink,#3D2C2E);text-decoration:none;
}
.szd-dacc__head:active{background:var(--szd-pink-soft,#FFE3EC)}
.szd-dacc__name{flex:1;font-size:14px;font-weight:700;text-align:right;line-height:1.3;color:var(--szd-ink,#3D2C2E)}
.szd-dacc__head .szd-drawer__cat-iconwrap{
  width:36px !important;height:36px !important;border-radius:10px;padding:4px;
  background:var(--szd-cream,#FFF5F0);flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
}
.szd-dacc__head .szd-drawer__cat-iconwrap svg,
.szd-dacc__head .szd-drawer__cat-iconwrap .szd-ic-svg{width:100% !important;height:100% !important;display:block}
.szd-dacc__chev{width:17px;height:17px;color:var(--szd-ink-3,#7B6B6D);flex-shrink:0;transition:transform .25s}
.szd-dacc__item.--open > .szd-dacc__head .szd-dacc__chev{transform:rotate(90deg)}
.szd-dacc__chev--static{opacity:.65}
.szd-dacc__panel{overflow:hidden;max-height:0;transition:max-height .3s ease;background:rgba(255,245,240,.5)}
.szd-dacc__item.--open > .szd-dacc__panel{max-height:640px}
.szd-dacc__sub{
  display:flex;align-items:center;gap:9px;padding:8px 30px 8px 18px;
  font-size:13px;font-weight:600;color:var(--szd-ink-2,#5A4A4C);text-decoration:none;
  border-top:1px solid var(--szd-line,#F2E7E3);
}
.szd-dacc__sub-ic{
  width:26px;height:26px;flex-shrink:0;border-radius:7px;padding:3px;
  background:var(--szd-cream,#FFF5F0);display:flex;align-items:center;justify-content:center;
}
.szd-dacc__sub-ic .szd-subic{width:100%;height:100%;display:block;overflow:visible}
.szd-dacc__sub:active{color:var(--szd-pink-dk,#E0568B);background:var(--szd-pink-soft,#FFE3EC)}
.szd-dacc__sub--all{color:var(--szd-pink-dk,#E0568B);font-weight:800}

/* Footer (sticky phone CTA) */
.szd-drawer__footer{
  padding:14px 18px;
  border-top:1px solid var(--szd-line);
  margin-top:auto;
  background:var(--szd-cream);
  flex-shrink:0;
}
.szd-drawer__phone{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;
  background:var(--szd-teal-soft);
  border-radius:12px;
  color:var(--szd-ink);text-decoration:none;
  font-size:12px;font-weight:700;
}
.szd-drawer__phone svg{width:22px;height:22px;color:var(--szd-teal-dk);flex-shrink:0}
.szd-drawer__phone div{flex:1}
.szd-drawer__phone b{
  display:block;font-size:14px;font-weight:900;
  color:var(--szd-teal-dk);font-variant-numeric:tabular-nums;
}

/* ================================================================================
/* ================================================================================
   SHAZDEH v8 — Pure CSS theme overlay on PANDA NATIVE MODULES
   No hardcoded TPL content. All content comes from BO module configuration.

   Modules styled:
   - stowlcarousel (HOME group 9)    → v8 hero slider (admin: BO → Modules → stowlcarousel)
   - stfeaturedcategories             → v8 category icon grid (admin: BO → Modules → stfeaturedcategories)
   - stbanner (all home groups)      → v8 promo/banner cards (admin: BO → Modules → stbanner)
   - stbrandsslider                   → v8 brand strip (admin: BO → Modules → stbrandsslider)
   - stblogrecentarticles             → v8 blog cards (admin: BO → Modules → stblog)
   - steasycontent (footer cols)     → v8 footer (admin: BO → Modules → steasycontent)
   ================================================================================ */

/* === GLOBAL: Vazirmatn font, cream bg === */
:root{
  --szd-pink:#F478A9; --szd-pink-dk:#E0568B; --szd-pink-soft:#FFE3EC;
  --szd-yellow:#FFD96B; --szd-yellow-dk:#F0BB3D;
  --szd-teal:#6FD3CB; --szd-teal-dk:#3DA39B; --szd-teal-soft:#D6F0EE;
  --szd-purple:#9579D0; --szd-purple-soft:#E8DCFB;
  --szd-cream:#FFF5F0; --szd-ink:#3D2C2E; --szd-ink-2:#5A4A4C; --szd-ink-3:#7B6B6D;
  --szd-line:#F2E7E3;
  --szd-r-md:14px; --szd-r-lg:20px;
  --szd-sh-1:0 2px 6px rgba(0,0,0,.05);
  --szd-sh-2:0 6px 14px rgba(244,120,169,.10);
}
body{font-family:'Vazirmatn','yekanbakh',system-ui,Tahoma,sans-serif !important;background:#EFE7E1 !important;color:var(--szd-ink) !important}

/* ====================================================================
   1) stowlcarousel — v8 hero slider (HOME group 9)
   ==================================================================== */
.owl_carousel_container_9,
.st_owl_carousel-9{
  border-radius:var(--szd-r-lg);
  overflow:hidden;
  margin:14px 12px;
  background:linear-gradient(135deg,#FFD96B 0%,#FFB347 100%);
  box-shadow:var(--szd-sh-2);
  position:relative;
}
.owl_carousel_container_9::before{
  content:"";position:absolute;top:-30px;left:-30px;width:160px;height:160px;
  border-radius:50%;background:rgba(255,255,255,.25);z-index:1;
}
.st_owl_carousel_9 .owl-item,
.st_owl_carousel-9 .owl-item{position:relative;z-index:2}
.st_owl_carousel_block{position:relative;min-height:200px;padding:24px 28px;display:flex;align-items:center}
.st_owl_carousel_block_30{background:linear-gradient(135deg,#FFD96B 0%,#FFB347 100%) !important}
.st_owl_carousel_block_31{background:linear-gradient(135deg,#C5B0E8 0%,#9579D0 100%) !important}
.st_owl_carousel_block_32{background:linear-gradient(135deg,#A8E2DC 0%,#3DA39B 100%) !important}
.st_owl_carousel_block_31 *,
.st_owl_carousel_block_32 *{color:#fff !important}
.st_owl_carousel_block_31 h2 span,
.st_owl_carousel_block_32 h2 span{color:#FFD96B !important}
.st_owl_carousel_image{display:none !important}  /* hide bg image; we use CSS gradient */
.st_owl_carousel_text{
  position:relative;z-index:2;width:60%;padding:8px 18px;
  color:var(--szd-ink);
}
.st_owl_carousel_text h2{font-size:22px;font-weight:900;line-height:1.3;margin:0 0 8px;color:var(--szd-ink)}
.st_owl_carousel_text h2 span{color:var(--szd-pink-dk)}
.st_owl_carousel_text p{font-size:12px;color:var(--szd-ink-2);margin:0 0 14px;line-height:1.6}
.st_owl_carousel_text a,
.st_owl_carousel_text .btn{
  display:inline-block;background:var(--szd-pink);color:#fff !important;
  border:0;border-radius:24px;padding:9px 22px;
  font-weight:800;font-size:13px;text-decoration:none;
  box-shadow:0 4px 12px rgba(244,120,169,.35);
  transition:background .2s,transform .2s;
}
.st_owl_carousel_text a:hover{background:var(--szd-pink-dk);transform:translateY(-1px)}

@media (min-width:1024px){
  .owl_carousel_container_9{margin:14px 24px}
  .st_owl_carousel_block{min-height:280px;padding:40px}
  .st_owl_carousel_text{padding:0 28px;width:55%}
  .st_owl_carousel_text h2{font-size:34px}
  .st_owl_carousel_text p{font-size:14px}
}

/* Owl nav arrows: subtle round */
.st_owl_carousel-9 .owl-prev,
.st_owl_carousel-9 .owl-next{
  background:rgba(255,255,255,.7) !important;
  color:var(--szd-pink-dk) !important;
  border-radius:50% !important;
  width:36px !important;height:36px !important;
  display:flex;align-items:center;justify-content:center;
  font-size:18px !important;
}
.st_owl_carousel-9 .owl-prev:hover,
.st_owl_carousel-9 .owl-next:hover{background:#fff !important}

/* Owl dots */
.st_owl_carousel-9 .owl-dots{position:absolute;bottom:10px;left:0;right:0;text-align:center;z-index:5}
.st_owl_carousel-9 .owl-dot span{background:#fff !important;width:8px;height:8px;border-radius:50%;display:inline-block;margin:0 3px;opacity:.5;transition:all .3s}
.st_owl_carousel-9 .owl-dot.active span{width:20px;border-radius:4px;opacity:1;background:var(--szd-pink-dk) !important}

/* ====================================================================
   2) stfeaturedcategories — v8 category icon grid
   ==================================================================== */
.featured_categories_container{
  background:transparent !important;
  margin:14px 12px !important;
  padding:0 !important;
}
.featured_categories_container .title_block,
.featured_categories_container h2.module-title,
.featured_categories_container .block_title{
  font-size:16px !important;font-weight:900 !important;color:var(--szd-ink) !important;
  margin-bottom:12px !important;
  position:relative;padding-bottom:8px;
}
.featured_categories_container .title_block::after{
  content:"";position:absolute;right:0;bottom:0;width:36px;height:3px;
  background:linear-gradient(90deg,var(--szd-pink),var(--szd-pink-dk));
  border-radius:2px;
}

/* Override the swiper slider so all cats show as GRID (no horizontal scroll) */
.featured_categories_container .swiper-container,
.featured_categories_container .products_sldier_swiper{
  overflow:visible !important;
  padding:0 !important;
}
.featured_categories_container .swiper-wrapper{
  display:grid !important;
  grid-template-columns:repeat(4, 1fr) !important;
  gap:8px !important;
  transform:none !important;
  width:100% !important;
}
.featured_categories_container .swiper-slide{
  width:100% !important;
  margin:0 !important;
  height:auto !important;
}

/* Hide swiper navigation arrows since we're in grid mode */
.featured_categories_container .swiper-button,
.featured_categories_container .swiper-button-prev,
.featured_categories_container .swiper-button-next,
.featured_categories_container .swiper-pagination,
.featured_categories_container .swiper-button-tr{display:none !important}

/* Each cat card */
.featured_categories_container .swiper-slide > a,
.featured_categories_container .fc_cat_image{
  display:flex !important;flex-direction:column;align-items:center;
  padding:12px 6px !important;
  border-radius:14px !important;
  background:#fff !important;
  box-shadow:var(--szd-sh-1) !important;
  text-decoration:none !important;
  transition:transform .2s, background .2s, box-shadow .2s;
  border:1px solid var(--szd-line);
  height:auto !important;width:100% !important;
  position:relative;
}
.featured_categories_container .swiper-slide{
  display:flex;
  flex-direction:column;
}
.featured_categories_container .swiper-slide:hover .fc_cat_image,
.featured_categories_container .swiper-slide:hover > a{
  background:var(--szd-pink-soft) !important;
  border-color:var(--szd-pink-soft);
  transform:translateY(-3px);
  box-shadow:0 8px 16px rgba(244,120,169,.15) !important;
}

/* Category image */
.featured_categories_container .fc_cat_image img,
.featured_categories_container .swiper-slide img{
  width:54px !important;height:54px !important;
  object-fit:contain !important;
  margin:0 auto !important;
  transition:transform .35s cubic-bezier(.34,1.4,.6,1);
  border-radius:50% !important;
}
.featured_categories_container .swiper-slide:hover img{
  transform:scale(1.12) rotate(-3deg);
}

/* Category name (lives in .pro_second_box .s_title_block) */
.featured_categories_container .pro_second_box{
  padding:6px 4px 0 !important;
  width:100%;
  text-align:center;
}
.featured_categories_container .s_title_block,
.featured_categories_container .s_title_block a{
  font-size:11.5px !important;font-weight:800 !important;
  text-align:center !important;color:var(--szd-ink) !important;
  line-height:1.3 !important;margin:0 !important;padding:0 !important;
  text-decoration:none !important;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}

@media (min-width:768px){
  .featured_categories_container .swiper-wrapper{
    grid-template-columns:repeat(6, 1fr) !important;
  }
  .featured_categories_container .fc_cat_image img,
  .featured_categories_container .swiper-slide img{width:64px !important;height:64px !important}
}
@media (min-width:1024px){
  .featured_categories_container{margin:14px 24px !important}
  .featured_categories_container .swiper-wrapper{
    grid-template-columns:repeat(7, 1fr) !important;
    gap:10px !important;
  }
  .featured_categories_container .swiper-slide > a,
  .featured_categories_container .fc_cat_image{padding:16px 8px !important}
  .featured_categories_container .fc_cat_image img,
  .featured_categories_container .swiper-slide img{width:72px !important;height:72px !important}
  .featured_categories_container .s_title_block,
  .featured_categories_container .s_title_block a{font-size:12.5px !important}
}

/* ====================================================================
   3) stbanner — v8 promo cards
   ==================================================================== */
.st_banner_block,
.st_banner_container,
.st_banner_wrap{
  border-radius:var(--szd-r-md) !important;
  overflow:hidden;
  box-shadow:var(--szd-sh-1);
  transition:transform .2s, box-shadow .2s;
}
.st_banner_block:hover,
.st_banner_wrap:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 18px rgba(244,120,169,.15);
}
.st_banner_text{
  padding:12px !important;color:var(--szd-ink);
}
.st_banner_text h2,
.st_banner_text h3{
  font-size:14px !important;font-weight:900 !important;color:var(--szd-ink) !important;
  margin:0 0 4px !important;line-height:1.3;
}
.st_banner_text p{font-size:11px !important;color:var(--szd-ink-2) !important;line-height:1.5}
.st_banner_text .btn,
.st_banner_text a.btn{
  background:var(--szd-pink) !important;color:#fff !important;
  border:0 !important;border-radius:18px !important;
  padding:6px 14px !important;font-weight:800 !important;font-size:11px !important;
  text-decoration:none !important;display:inline-block;
}

/* ====================================================================
   4) stbrandsslider — v8 brand strip
   ==================================================================== */
.brands_slider_container,
#brands-slider{
  background:#fff !important;
  border-radius:var(--szd-r-md) !important;
  padding:14px 8px !important;
  margin:14px 12px !important;
  box-shadow:var(--szd-sh-1) !important;
}
@media (min-width:1024px){
  .brands_slider_container{margin:14px 24px !important}
}
.brands_slider_item{
  background:var(--szd-cream) !important;
  border-radius:12px !important;
  padding:6px !important;
  margin:0 4px !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  height:46px !important;
  border:1px solid rgba(0,0,0,.04);
  transition:transform .2s;
}
.brands_slider_item:hover{transform:scale(1.05);background:#fff !important}
.brands_slider_item img{width:auto !important;height:32px !important;object-fit:contain;mix-blend-mode:multiply}

/* ====================================================================
   5) stblogrecentarticles — v8 blog cards
   ==================================================================== */
.st_blog_recent_articles_wrap,
.stblog-recent-articles{
  margin:14px 12px !important;
}
.st_blog_article,
.stblog-article{
  background:#fff !important;
  border-radius:var(--szd-r-md) !important;
  overflow:hidden;
  box-shadow:var(--szd-sh-1) !important;
  transition:transform .2s;
}
.st_blog_article:hover{transform:translateY(-2px)}
.st_blog_article h3,
.st_blog_article .article-title{
  font-size:12.5px !important;font-weight:700 !important;color:var(--szd-ink) !important;
  padding:10px !important;line-height:1.5 !important;margin:0 !important;
}
.st_blog_article .article-meta,
.st_blog_article .article-categories{
  font-size:10px !important;color:var(--szd-pink-dk) !important;
  padding:0 10px 4px !important;font-weight:700;
}

/* ====================================================================
   6) Section titles (universal panda module title styling)
   ==================================================================== */
.title_block,
.module-title,
.block_title,
.products_section .title_block h2,
.title_align_0 .title{
  font-size:16px !important;font-weight:900 !important;color:var(--szd-ink) !important;
  position:relative;padding-bottom:8px;margin-bottom:12px !important;
}
.products_section .title_block h2::after,
.title_block .title::after{
  content:"";position:absolute;right:0;bottom:0;width:36px;height:3px;
  background:linear-gradient(90deg,var(--szd-pink),var(--szd-pink-dk));
  border-radius:2px;
}

/* ====================================================================
   7) Product cards in carousels (panda's .pro_item / .product-miniature)
   ==================================================================== */
.products_slider .pro_item,
.bestseller .pro_item,
.h_scroll .pro_item,
.product-miniature{
  background:#fff !important;
  border-radius:14px !important;
  padding:8px !important;
  box-shadow:var(--szd-sh-1) !important;
  border:1px solid rgba(0,0,0,.03);
  transition:transform .2s;
  margin:0 4px !important;
}
.products_slider .pro_item:hover,
.product-miniature:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(244,120,169,.12) !important}
.products_slider .pro_item img,
.product-miniature img{border-radius:10px !important;width:100%;height:auto}
.products_slider .pro_item .pro_name,
.product-miniature .product-title{
  font-size:11.5px !important;font-weight:600 !important;color:var(--szd-ink) !important;
  margin:6px 0 4px !important;line-height:1.4 !important;
}
.products_slider .pro_item .price,
.product-miniature .price{
  color:var(--szd-pink-dk) !important;font-weight:900 !important;font-size:12.5px !important;
}

/* ====================================================================
   8) HIDE old panda chrome that doesn't fit v8 (selective; admin can override)
   ==================================================================== */
/* Hide stproducttabs (legacy tabbed product carousel) */
.page-home .stproducttabs,
.page-home .h-home-product-tabs,
.page-home .home-tab-container,
.page-home .home_tab_container_box{display:none !important}

/* ====================================================================
   9) Container constraints
   ==================================================================== */
.szd-container{max-width:1400px;margin:0 auto;padding:0 14px;width:100%}
@media (min-width:768px){.szd-container{padding:0 20px}}
@media (min-width:1024px){.szd-container{padding:0 24px}}

/* ====================================================================
   10) Mobile body padding for bottom safe area (no bottom nav now, but
       respect notch on iOS)
   ==================================================================== */
@media (max-width:1023px){
  body{padding-bottom:env(safe-area-inset-bottom)}
}
/* ================================================================================
   SHAZDEH v8 — BUG FIX BATCH
   Issues seen on staging after build:
   1. Cart shows literal "SHOPPING CART" text → hide the text spans
   2. Account icon nested oddly → tighten styling
   3. Empty 433px easycontent_container_1145 → hide on desktop
   4. Envato Facebook embed → hide stfblikebox
   5. "POPULAR TAGS / No tags" English → hide sttags when empty
   6. Discount red carousel "کالاهای تخفیف دار" → hide stproducttabs/owl carousel
   7. Mega-menu dropdowns overflowing → constrain to viewport
   8. Footer dark unstyled → light v8 background
   ================================================================================ */

/* === FIX 1: Hide ALL text labels inside header icon hosts (cart, account, wallet) === */
.szd-hdr__icon-host .cart_text,
.szd-hdr__icon-host .ajax_cart_product_txt,
.szd-hdr__icon-host .ajax_cart_split,
.szd-hdr__icon-host .header_icon_btn_text,
.szd-hdr__icon-host .my_account_link,
.szd-hdr__icon-host .welcome,
.szd-hdr__icon-host span:empty,
.szd-hdr__icon-host .header_item > span:not(.header_icon_btn_icon):not(.ajax_cart_quantity):not(.amount_circle){
  display:none !important;
}
/* Force show the badge (cart count) and icon */
.szd-hdr__icon-host .header_icon_btn_icon,
.szd-hdr__icon-host .ajax_cart_quantity,
.szd-hdr__icon-host .amount_circle{display:flex !important;align-items:center;justify-content:center}

/* Cart anchor: width-constrained so SHOPPING CART text doesn't bleed even if shown */
.szd-hdr__icon-host--cart a,
.szd-hdr__icon-host--cart .header_item{
  max-width:52px !important;
  width:auto !important;
  overflow:hidden;
  padding:0 !important;
  background:transparent !important;
  color:inherit !important;
}
.szd-hdr__icon-host--cart .header_item *:not(.header_icon_btn_icon):not(.ajax_cart_quantity):not(.amount_circle):not(i){
  display:none !important;
}

/* Account icon — same treatment */
.szd-hdr__icon-host--account .userinfo_mod_top,
.szd-hdr__icon-host--account .dropdown_wrap,
.szd-hdr__icon-host--account .header_item{
  background:transparent !important;
  padding:0 !important;margin:0 !important;border:0 !important;
  display:flex;align-items:center;
  color:inherit !important;
}
.szd-hdr__icon-host--account .arrow_down,
.szd-hdr__icon-host--account .fto-angle-do,
.szd-hdr__icon-host--account .fto-angle-down{
  display:none !important;  /* hide chevron clutter */
}
.szd-hdr__icon-host--account .header_icon_btn_icon i{
  font-size:22px !important;color:var(--szd-ink-2,#5A4A4C) !important;
}
.szd-hdr__icon-host--account:hover .header_icon_btn_icon i{color:var(--szd-pink-dk,#E0568B) !important}

/* === FIX 2: Hide the EMPTY 433px easycontent_container_1145 on desktop === */
/* 1145 is the desktop "age categories" block with broken/missing images */
#easycontent_container_1145{
  display:none !important;
}
/* But keep 1152 (mobile age cards) visible — it works fine */
@media (max-width:991px){
  #easycontent_container_1145{display:none !important}
  #easycontent_container_1152{display:block !important}
}

/* === FIX 3: Hide Envato Facebook embed (stfblikebox) === */
.facebook_likebox,
.st_fb_likebox_block,
[class*="fblikebox"],
[id*="fblikebox"],
[id*="facebook_likebox"]{
  display:none !important;
}

/* === FIX 4: Hide "POPULAR TAGS / No tags" (sttags empty block) === */
.tags-section:has(.no-tags),
.tags-section:empty,
.popular-tags-block:empty,
[class*="sttags"]:has(.no-tags),
[id*="sttags"]:has(.warning){
  display:none !important;
}
/* Conservative — hide any block whose only text is "No tags" */
.tags-section .no-tags,
.tags-section h2,
[class*="sttags"] .warning{display:none}
/* If sttags is on footer-bottom, hide whole section */
#footer .tags-section,
#footer .popular-tags{display:none !important}

/* === FIX 5: Hide red discount product carousel "کالاهای تخفیف دار" === */
/* This is from stowlcarousel groups other than HOME (9). Or stspecialproducts. */
/* Only target on page-home */
/* NOTE: do NOT use [class*="discounted"] here — it substring-matches the product
   price span `.price.st_discounted_price` and would hide the SELLING price on every
   discounted product (the home flash/special slider). Target the block classes only. */
.page-home .stspecialproducts,
.page-home #special-products,
.page-home .stbestsellers .red,
.page-home [style*="background-color: rgb(220"],
.page-home [style*="background:#dc"],
.page-home [style*="background:#E"],
.page-home .stproducttabs,
.page-home .h-home-product-tabs,
.page-home .home_tab_container_box{display:none !important}

/* The red carousel is likely .owl_carousel_container_NUMBER where NUMBER != 9 */
.page-home [id^="owl_carousel_container_"]:not([id*="_9"]){
  display:none !important;
}
.page-home [class*="st_owl_carousel-"]:not([class*="st_owl_carousel-9"]){
  display:none !important;
}

/* === FIX 6: Constrain mega-menu hover dropdowns to viewport === */
.szd-nav__all-dd,
.szd-nav__dd{
  max-width:calc(100vw - 40px) !important;
  right:auto !important;
  left:auto !important;
}
.szd-nav__all-wrap{position:relative}
.szd-nav__all-wrap .szd-nav__all-dd{
  right:0 !important;
  left:auto !important;
}
.szd-nav__item{position:relative}
.szd-nav__item .szd-nav__dd{
  right:0 !important;
  max-width:min(720px, calc(100vw - 40px)) !important;
}

/* === FIX 7: FOOTER — light theme cream background, hide Envato/Tags === */
#footer,
.footer-container,
#footer-bottom-container,
#footer #footer-primary,
#footer #footer-secondary,
#footer #footer-tertiary{
  background:linear-gradient(180deg, #FFF5F0 0%, #FFEAD6 50%, #FFE3EC 100%) !important;
  color:#3D2C2E !important;
  padding:24px 20px !important;
}
#footer *,
.footer-container *{color:#3D2C2E !important}
#footer h3, #footer h4, #footer h5,
.footer-container h3, .footer-container h4, .footer-container h5{
  color:#3D2C2E !important;font-weight:900 !important;font-size:14px !important;
  margin-bottom:10px !important;
}
#footer a,
.footer-container a{
  color:#5A4A4C !important;text-decoration:none !important;
  font-size:12px !important;
}
#footer a:hover{color:#E0568B !important}
/* Footer columns — bg white card */
#footer .col-md-3,
#footer .col-md-4,
#footer .col-lg-3,
#footer #stacked_footer_column_1,
#footer #stacked_footer_column_2,
#footer #stacked_footer_column_3,
#footer #stacked_footer_column_4,
#footer #stacked_footer_column_5,
#footer #stacked_footer_column_6,
.footer-container .footer-col{
  background:#fff !important;
  border-radius:14px !important;
  padding:16px !important;
  margin:8px !important;
  box-shadow:0 2px 6px rgba(0,0,0,.05);
  border:1px solid rgba(0,0,0,.04);
}

/* Brand strip in footer (the broken-image brand chips) */
.brands_slider_item img{
  max-height:32px !important;width:auto !important;
}
.brands_slider_item:has(img:not([src*="brand_default"])){
  /* Hide chips with broken brand images */
  opacity:.6;
}

/* Footer english strings — hide */
#footer:has(>:not(.szd-foot)) h3:contains("FACEBOOK"),
#footer h3:contains("POPULAR TAGS"){display:none}

/* === FIX 8: Hide leftover "Featured categories" English title === */
.featured_categories_container .title_block_inner{
  font-size:0 !important;
}
.featured_categories_container .title_block_inner::before{
  content:"دسته‌بندی‌ها";
  font-size:16px;font-weight:900;color:#3D2C2E;
}

/* === FIX 9: Empty inner sections on home should not push huge cream gap === */
.page-home div:empty:not(.szd-bnav__shape):not(span):not(.swiper-button):not(.szd-hdr__badge){
  display:none;
}
.page-home section:empty{display:none}
.page-home .easycontent_container:not(:has(*)){display:none !important}
.page-home .easycontent_container[id="easycontent_container_1145"]{display:none !important}

/* Force-hide containers that are visually empty (no img, no text) */
.page-home #easycontent_container_1145,
.page-home #easycontent_container_1149{display:none !important}

/* === FIX 10: Make sure body/page has cream bg consistently === */
body.page-index,
body.page-index #wrapper,
body.page-index #main{background:#EFE7E1 !important}

/* === FIX 11: Bring back fluid container width === */
.page-home #main{max-width:1400px;margin:0 auto;padding:0 14px}
@media (min-width:1024px){.page-home #main{padding:0 24px}}
/* ================================================================================
   SHAZDEH v8 — FIX BATCH 2
   1. Restore .szd-hdr__icon-host to 52x52 with cream box (was collapsed to 14x21)
   2. Hide stspecialslider (red "کالاهای تخفیف دار" carousel)
   3. Hide reviewmaster .rm-home (customer reviews carousel)
   4. Hide #facebook_like_box_footer (Envato FB embed)
   5. Hide .tags_block (POPULAR TAGS / No tags)
   6. Ensure clean v8 spacing
   ================================================================================ */

/* === Restore icon host size === */
.szd-hdr__icon-host{
  position:relative !important;
  display:flex !important;align-items:center;justify-content:center;
  min-width:52px !important;width:52px !important;height:52px !important;
  border-radius:14px !important;
  background:#FFF5F0 !important;
  border:1px solid #F2E7E3 !important;
  padding:0 !important;
  transition:all .2s;
}
.szd-hdr__icon-host:hover{
  background:#FFE3EC !important;
  border-color:#FFE3EC !important;
  transform:translateY(-2px);
}
.szd-hdr__icon-host > div,
.szd-hdr__icon-host > a{
  display:flex !important;align-items:center;justify-content:center;
  width:100% !important;height:100% !important;
  background:transparent !important;
}
.szd-hdr__icon-host i{
  font-size:22px !important;
  color:#5A4A4C !important;
}
.szd-hdr__icon-host:hover i{color:#E0568B !important}

/* Cart count badge */
.szd-hdr__icon-host .ajax_cart_quantity,
.szd-hdr__icon-host .amount_circle{
  position:absolute !important;
  top:-4px !important;right:-4px !important;left:auto !important;bottom:auto !important;
  background:#E0568B !important;color:#fff !important;
  min-width:20px !important;height:20px !important;border-radius:10px !important;
  font-size:10px !important;font-weight:900 !important;
  border:2px solid #fff;
  padding:0 5px;
  display:flex !important;align-items:center;justify-content:center;
}

/* Wallet special look (teal) */
.szd-hdr__icon-host--wallet{
  background:linear-gradient(135deg,#D6F0EE,#FFF5F0) !important;
  border-color:#D6F0EE !important;
}
.szd-hdr__icon-host--wallet:hover{
  background:linear-gradient(135deg,#D6F0EE,#fff) !important;
  border-color:#6FD3CB !important;
}
.szd-hdr__icon-host--wallet i{color:#3DA39B !important}

/* === Hide red discount carousel "کالاهای تخفیف دار" === */
.page-home [id^="stspecialslider_container"],
.page-home .stspecialslider_container,
.page-home .s_countdown_block,
body.page-index [id^="stspecialslider_container"],
body.page-index .stspecialslider_container{
  display:none !important;
}

/* === Hide reviewmaster module on home === */
.page-home .rm-home,
body.page-index .rm-home,
body.page-index [class*="reviewmaster"]{
  display:none !important;
}

/* === Hide Envato Facebook embed === */
#facebook_like_box_footer,
#fb-root,
.fb_like_box_warp,
.fb-page.fb_iframe_widget{
  display:none !important;
}

/* === Hide POPULAR TAGS / No tags === */
.tags_block,
[class*="tags_block"]{
  display:none !important;
}

/* === Hide other useless empty footer blocks === */
#footer .stsearch_block_left:empty,
#footer .block:empty,
#footer .ybc-blog-recent-posts:empty{display:none !important}

/* === Hero slider — ensure full v8 look === */
.owl_carousel_container_9,
[id^="owl_carousel_container_9"]{
  margin:14px 24px !important;
  border-radius:20px !important;
  overflow:hidden !important;
  box-shadow:0 6px 14px rgba(244,120,169,.10) !important;
}

/* The slider blocks (my 3 v8 slides) */
.st_owl_carousel_block{
  min-height:300px !important;
  padding:40px !important;
  position:relative;
}

/* Background image (panda's image_lang_default) — show it but with overlay */
.st_owl_carousel_image{
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  opacity:.4 !important;
}
.st_owl_carousel_text{
  position:relative !important;
  z-index:5 !important;
  padding:20px 30px !important;
}

/* === Fix empty cream gap above hero — hide steasycontent_1145 (the 433px empty block) === */
#easycontent_container_1145,
.easycontent_container[data-id="1145"]{display:none !important}

/* === Make sure the page has consistent cream bg === */
body, body.page-index, #wrapper, #main{
  background:#EFE7E1 !important;
}

/* === stfeaturedcategories: ensure cats render as nice cards === */
.featured_categories_container{margin:24px 14px !important}
@media (min-width:1024px){
  .featured_categories_container{margin:24px 24px !important}
}

/* === Fix any leftover Bootstrap col padding from rendered modules === */
.page-home .pro_outer_box,
.page-home .pro_item{box-sizing:border-box}

/* === Container max width for home === */
.page-home #wrapper > #main{
  max-width:1400px;
  margin:0 auto;
}

/* === Footer global cleanup === */
#footer-tertiary,
#footer-secondary,
#footer-primary{
  background:transparent !important;
  margin:0 !important;
}
#footer .container,
#footer .container-fluid{
  background:transparent !important;
}

/* Force-show legitimate footer columns */
#footer .footer_block:not(:empty){
  background:#fff !important;
  border-radius:14px !important;
  padding:18px !important;
  margin:8px !important;
  box-shadow:0 2px 6px rgba(0,0,0,.05);
}

/* ================================================================================
   SHAZDEH v8 � FIX BATCH 3 (yellow band + cat images)
   ================================================================================ */

/* === Remove yellow container bg from owl carousel � let slides own their color === */
.owl_carousel_container_9,
[id^="owl_carousel_container_9"]{
  background:transparent !important;
  background-image:none !important;
}
.owl_carousel_container_9::before{display:none !important}

/* === Each slide gets its own bg gradient (defined by block class) === */
.st_owl_carousel_block_30{background:linear-gradient(135deg,#FFD96B 0%,#FFB347 100%) !important}
.st_owl_carousel_block_31{background:linear-gradient(135deg,#C5B0E8 0%,#9579D0 100%) !important}
.st_owl_carousel_block_32{background:linear-gradient(135deg,#A8E2DC 0%,#3DA39B 100%) !important}
.st_owl_carousel_block_31 *,
.st_owl_carousel_block_32 *{color:#fff !important}

/* The owl-stage/owl-item should be transparent so block bg shows */
.st_owl_carousel-9 .owl-stage-outer,
.st_owl_carousel-9 .owl-stage,
.st_owl_carousel-9 .owl-item{background:transparent !important}

/* === Hide the swiper-lazy preloader so empty cat cards don't show spinner === */
.featured_categories_container .swiper-lazy-preloader{display:none !important}

/* === Show category image fallback when admin hasn't uploaded === */
.featured_categories_container .swiper-slide img{
  opacity:1 !important;
  filter:none !important;
}
/* Force-load lazy images by removing lazy class effect */
.featured_categories_container .swiper-lazy{opacity:1 !important}

/* === Container max width fixes (mega-nav overflow) === */
.szd-nav .szd-container,
.szd-nav__row{
  max-width:1400px !important;
  margin:0 auto !important;
  flex-wrap:wrap;
}
.szd-nav__cats{
  white-space:nowrap;
}

/* === Hide leftover empty cream blocks above hero === */
#easycontent_container_1149,
#easycontent_container_1125,
#easycontent_container_1135,
#easycontent_container_1123{display:none !important}
/* But KEEP the mobile age cards 1152 visible */
@media (max-width:991px){
  #easycontent_container_1152{display:block !important}
}

/* ================================================================================
   FIX BATCH 4 � Remove yellow band on top (#header_primary)
   ================================================================================ */
#header_primary{
  background-color:transparent !important;
  background-image:none !important;
  padding:0 !important;
}
#header_primary_container,
#header_primary .wide_container_box{
  background:transparent !important;
}

/* Top utility bar (mine) stays */
.szd-utility-bar{background:linear-gradient(90deg,#FFF1DA 0%,#FFE5C4 100%) !important}

/* Mega-nav strip background */
.szd-nav--desk{background:#fff !important;border-bottom:1px solid #F2E7E3 !important}

/* === KILL ALL PANDA TOP-BAR CHROME ABOVE THE HERO === */
#header_primary,
#header_primary_container,
#header_primary > *,
#header .header_top_bar,
#header .top_bar_box,
.header_top_bar_box,
[id*="top_bar"]:not(.szd-utility-bar):not([id*="easycontent"]),
[class*="top_bar"]:not(.szd-utility-bar):not([class*="szd-"]),
.header-container > div:not(.szd-utility-bar):not(.szd-hdr):not(.szd-nav):not(.szd-hdr--mob){
  background:transparent !important;
  background-image:none !important;
}

/* Hide panda's tb-bg2.png pattern image specifically */
*[style*="tb-bg2"],
[style*="tb-bg"]{background-image:none !important;background-color:transparent !important}

/* Hide ALL elements with class containing 'top_bar' OR 'header_top' (except mine) */
.header_top:not(.szd-utility-bar),
#header_top:not(.szd-utility-bar),
.top_bar:not(.szd-utility-bar),
.top_bar_container,
.panda_top_bar_box{display:none !important}

/* Add padding-top so the slider doesn't touch top */
.owl_carousel_container_9{margin-top:14px !important}

/* PHONE LINK in mega-nav: small inline style (not yellow band) */
.szd-nav__phone{
  background:transparent !important;
  padding:8px 12px !important;
  margin:0 !important;
  font-size:12px !important;
}
/* ================================================================================
   SHAZDEH v8 — Category icons as CSS background-image (no image upload needed)
   Each category card overrides the broken placeholder img with embedded SVG.
   Admin can later upload real category images via BO; CSS uses :not([src*="default"])
   to defer to admin's upload when present.
   ================================================================================ */

/* Hide the default broken placeholder image inside cat cards */
.featured_categories_container .fc_cat_image img[src*="default"],
.featured_categories_container .fc_cat_image img.holder,
.featured_categories_container .fc_cat_image .swiper-lazy[data-src=""],
.featured_categories_container .fc_cat_image img[width=""]{
  opacity:0 !important;
}

/* Sized container slot for the SVG icon */
.featured_categories_container .fc_cat_image{
  position:relative;
  min-height:80px;
  display:flex !important;
  align-items:center;
  justify-content:center;
  background-size:contain !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
  padding-bottom:8px !important;
}
.featured_categories_container .pro_outer_box{
  position:relative;
  min-height:100px;
}

/* === ID 11 — کتاب کودک — book with face === */
.featured_categories_container .fc_cat_image[href*="/11-"]{
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M64 18 L78 18 L78 42 L71 36 L64 42 Z' fill='%23FFD96B'/%3E%3Crect x='20' y='30' width='60' height='56' rx='6' fill='%23E0568B'/%3E%3Cpath d='M50 30 L80 30 L80 80 Q 80 86 74 86 L50 86 Z' fill='%23F478A9'/%3E%3Cpath d='M50 30 L20 30 L20 80 Q 20 86 26 86 L50 86 Z' fill='%23F478A9'/%3E%3Cellipse cx='40' cy='58' rx='2.5' ry='3.4' fill='%233D2C2E'/%3E%3Cellipse cx='60' cy='58' rx='2.5' ry='3.4' fill='%233D2C2E'/%3E%3Cpath d='M 45 68 Q 50 71 55 68' stroke='%233D2C2E' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* === ID 112 — کتاب نی نی — baby rattle === */
.featured_categories_container .fc_cat_image[href*="/112-"]{
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Ccircle cx='50' cy='36' r='26' fill='%23FFC1D6' stroke='%23E0568B' stroke-width='2'/%3E%3Ccircle cx='40' cy='28' r='3' fill='%23FFD96B'/%3E%3Ccircle cx='60' cy='30' r='3' fill='%236FD3CB'/%3E%3Crect x='46' y='60' width='8' height='26' rx='4' fill='%239579D0'/%3E%3Ccircle cx='50' cy='90' r='6' fill='%23FFD96B' stroke='%23F0BB3D' stroke-width='2'/%3E%3Cellipse cx='44' cy='36' rx='2.4' ry='3' fill='%233D2C2E'/%3E%3Cellipse cx='56' cy='36' rx='2.4' ry='3' fill='%233D2C2E'/%3E%3C/svg%3E");
}

/* === ID 12 — بازی فکری — puzzle === */
.featured_categories_container .fc_cat_image[href*="/12-"]:not([href*="/112-"]):not([href*="/120-"]){
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M 18 50 L 18 66 Q 12 66 12 72 Q 12 78 18 78 L 18 90 L 50 90 L 50 78 Q 56 78 56 72 Q 56 66 50 66 L 50 50 L 38 50 Q 38 44 32 44 Q 26 44 26 50 Z' fill='%23C5B0E8' stroke='%239579D0' stroke-width='2'/%3E%3Cpath d='M 50 50 L 50 66 Q 56 66 56 72 Q 56 78 50 78 L 50 90 L 82 90 Q 88 90 88 84 L 88 56 Q 88 50 82 50 L 70 50 Q 70 44 64 44 Q 58 44 58 50 Z' fill='%23FFD96B' stroke='%23F0BB3D' stroke-width='2'/%3E%3C/svg%3E");
}

/* === ID 13 — لگو و ساختنی — blocks === */
.featured_categories_container .fc_cat_image[href*="/13-"]:not([href*="/130-"]):not([href*="/134-"]):not([href*="/13X"]){
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Crect x='32' y='20' width='36' height='20' rx='3' fill='%23F478A9'/%3E%3Ccircle cx='40' cy='18' r='3' fill='%23F478A9'/%3E%3Ccircle cx='50' cy='18' r='3' fill='%23F478A9'/%3E%3Ccircle cx='60' cy='18' r='3' fill='%23F478A9'/%3E%3Crect x='22' y='44' width='56' height='20' rx='3' fill='%23FFD96B'/%3E%3Crect x='18' y='68' width='64' height='20' rx='3' fill='%236FD3CB'/%3E%3C/svg%3E");
}

/* === ID 14 — لوازم التحریر — pencil === */
.featured_categories_container .fc_cat_image[href*="/14-"]:not([href*="/14X"]):not([href*="/145-"]):not([href*="/141-"]):not([href*="/146-"]):not([href*="/147-"]):not([href*="/148-"]):not([href*="/149-"]){
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Crect x='40' y='10' width='20' height='10' rx='2' fill='%23F478A9'/%3E%3Crect x='40' y='20' width='20' height='4' fill='%23C0B8A5'/%3E%3Crect x='40' y='24' width='20' height='50' fill='%23FFD96B'/%3E%3Cpath d='M 40 74 L 50 90 L 60 74 Z' fill='%23E8D4B8'/%3E%3Cpath d='M 46 84 L 50 90 L 54 84 Z' fill='%233D2C2E'/%3E%3Cellipse cx='44' cy='40' rx='2.5' ry='3.5' fill='%233D2C2E'/%3E%3Cellipse cx='56' cy='40' rx='2.5' ry='3.5' fill='%233D2C2E'/%3E%3C/svg%3E");
}

/* === ID 113 — بازی رومیزی — dice === */
.featured_categories_container .fc_cat_image[href*="/113-"]{
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Crect x='14' y='42' width='72' height='44' rx='6' fill='%23A8DFA8' stroke='%236BB36B' stroke-width='2'/%3E%3Crect x='36' y='14' width='28' height='28' rx='5' fill='white' stroke='%233D2C2E' stroke-width='2'/%3E%3Ccircle cx='44' cy='22' r='2' fill='%233D2C2E'/%3E%3Ccircle cx='56' cy='22' r='2' fill='%233D2C2E'/%3E%3Ccircle cx='50' cy='28' r='2' fill='%233D2C2E'/%3E%3Ccircle cx='44' cy='34' r='2' fill='%233D2C2E'/%3E%3Ccircle cx='56' cy='34' r='2' fill='%233D2C2E'/%3E%3C/svg%3E");
}

/* === ID 114 — بازی کارتی — cards === */
.featured_categories_container .fc_cat_image[href*="/114-"]{
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cg transform='rotate(-15 50 60)'%3E%3Crect x='22' y='30' width='32' height='48' rx='4' fill='white' stroke='%233D2C2E' stroke-width='2'/%3E%3Ctext x='28' y='42' font-size='10' font-weight='800' fill='%23F25F5C'%3EA%3C/text%3E%3Cpath d='M 38 56 L 32 64 L 38 72 L 44 64 Z' fill='%23F25F5C'/%3E%3C/g%3E%3Cg transform='rotate(15 50 60)'%3E%3Crect x='46' y='30' width='32' height='48' rx='4' fill='white' stroke='%233D2C2E' stroke-width='2'/%3E%3Ctext x='52' y='42' font-size='10' font-weight='800' fill='%233D2C2E'%3E%E2%99%A0%3C/text%3E%3C/g%3E%3C/svg%3E");
}

/* === ID 115 — آزمایشگاه — flask === */
.featured_categories_container .fc_cat_image[href*="/115-"]{
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Ccircle cx='35' cy='20' r='3' fill='%236FD3CB'/%3E%3Ccircle cx='55' cy='14' r='2.5' fill='%23A8DFA8'/%3E%3Cpath d='M 32 22 L 32 36 L 22 78 Q 20 86 28 86 L 72 86 Q 80 86 78 78 L 68 36 L 68 22 Z' fill='white' stroke='%233D2C2E' stroke-width='2.5'/%3E%3Cpath d='M 30 22 L 70 22' stroke='%233D2C2E' stroke-width='2.5'/%3E%3Cpath d='M 28 54 L 26 78 Q 24 84 30 84 L 70 84 Q 76 84 74 78 L 72 54 Q 50 56 28 54 Z' fill='%23A8DFA8'/%3E%3Cellipse cx='42' cy='64' rx='2.2' ry='3' fill='%233D2C2E'/%3E%3Cellipse cx='58' cy='64' rx='2.2' ry='3' fill='%233D2C2E'/%3E%3C/svg%3E");
}

/* === ID 116 — کاردستی خلاقیت — palette === */
.featured_categories_container .fc_cat_image[href*="/116-"]{
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M 18 52 Q 18 22 50 22 Q 82 22 82 52 Q 82 72 64 78 Q 60 80 60 74 Q 60 66 52 66 Q 44 66 44 74 Q 44 82 36 84 Q 18 80 18 52 Z' fill='%23FFF5F0' stroke='%233D2C2E' stroke-width='2'/%3E%3Ccircle cx='36' cy='36' r='5' fill='%23F478A9'/%3E%3Ccircle cx='50' cy='32' r='5' fill='%23FFD96B'/%3E%3Ccircle cx='64' cy='36' r='5' fill='%236FD3CB'/%3E%3Ccircle cx='32' cy='52' r='5' fill='%23FF9F8A'/%3E%3Ccircle cx='68' cy='52' r='5' fill='%23C5B0E8'/%3E%3Cellipse cx='44' cy='48' rx='2.3' ry='3' fill='%233D2C2E'/%3E%3Cellipse cx='58' cy='48' rx='2.3' ry='3' fill='%233D2C2E'/%3E%3C/svg%3E");
}

/* === ID 130 — عروسک بازی — teddy bear === */
.featured_categories_container .fc_cat_image[href*="/130-"]{
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Ccircle cx='28' cy='30' r='9' fill='%23FF9F8A'/%3E%3Ccircle cx='72' cy='30' r='9' fill='%23FF9F8A'/%3E%3Ccircle cx='28' cy='30' r='4' fill='%23FFCFC4'/%3E%3Ccircle cx='72' cy='30' r='4' fill='%23FFCFC4'/%3E%3Cellipse cx='50' cy='48' rx='26' ry='24' fill='%23FF9F8A'/%3E%3Cellipse cx='50' cy='58' rx='14' ry='10' fill='%23FFE3DC'/%3E%3Cellipse cx='40' cy='46' rx='3' ry='4' fill='%233D2C2E'/%3E%3Cellipse cx='60' cy='46' rx='3' ry='4' fill='%233D2C2E'/%3E%3Cellipse cx='50' cy='56' rx='3' ry='2.5' fill='%233D2C2E'/%3E%3Cpath d='M 44 64 Q 50 68 56 64' stroke='%233D2C2E' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* === ID 134 — ماشین بازی — car === */
.featured_categories_container .fc_cat_image[href*="/134-"]{
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M 12 64 Q 12 50 22 50 L 30 50 L 38 36 Q 40 32 46 32 L 64 32 Q 70 32 74 36 L 82 50 L 86 50 Q 90 50 90 56 L 90 64 Q 90 70 84 70 L 16 70 Q 12 70 12 64 Z' fill='%23FFD96B' stroke='%23F0BB3D' stroke-width='2'/%3E%3Cpath d='M 38 50 L 44 38 L 62 38 L 68 50 Z' fill='%236FD3CB'/%3E%3Cellipse cx='46' cy='46' rx='3' ry='4' fill='%233D2C2E'/%3E%3Cellipse cx='60' cy='46' rx='3' ry='4' fill='%233D2C2E'/%3E%3Ccircle cx='28' cy='72' r='9' fill='%233D2C2E'/%3E%3Ccircle cx='72' cy='72' r='9' fill='%233D2C2E'/%3E%3Ccircle cx='28' cy='72' r='4' fill='%23A99A9C'/%3E%3Ccircle cx='72' cy='72' r='4' fill='%23A99A9C'/%3E%3C/svg%3E");
}

/* === ID 141 — بازی حرکتی ورزشی — football === */
.featured_categories_container .fc_cat_image[href*="/141-"]{
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Ccircle cx='50' cy='50' r='32' fill='white' stroke='%233D2C2E' stroke-width='2.5'/%3E%3Cpolygon points='50,30 60,38 56,50 44,50 40,38' fill='%233D2C2E'/%3E%3Cline x1='50' y1='18' x2='50' y2='30' stroke='%233D2C2E' stroke-width='2'/%3E%3Cline x1='60' y1='38' x2='72' y2='34' stroke='%233D2C2E' stroke-width='2'/%3E%3Cline x1='40' y1='38' x2='28' y2='34' stroke='%233D2C2E' stroke-width='2'/%3E%3Cline x1='56' y1='50' x2='64' y2='64' stroke='%233D2C2E' stroke-width='2'/%3E%3Cline x1='44' y1='50' x2='36' y2='64' stroke='%233D2C2E' stroke-width='2'/%3E%3C/svg%3E");
}

/* === ID 145 — نقش بازی — crown === */
.featured_categories_container .fc_cat_image[href*="/145-"]{
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M 18 50 L 26 30 L 36 50 L 50 30 L 64 50 L 74 30 L 82 50 L 82 70 L 18 70 Z' fill='%23FFD96B' stroke='%23F0BB3D' stroke-width='2'/%3E%3Ccircle cx='26' cy='50' r='3' fill='%23F478A9'/%3E%3Ccircle cx='50' cy='50' r='3' fill='%236FD3CB'/%3E%3Ccircle cx='74' cy='50' r='3' fill='%23C5B0E8'/%3E%3Crect x='18' y='68' width='64' height='8' rx='2' fill='%23E0568B'/%3E%3C/svg%3E");
}

/* === Hover scale === */
.featured_categories_container .swiper-slide:hover .fc_cat_image{
  transform:scale(1.06) rotate(-2deg);
  transition:transform .35s cubic-bezier(.34,1.4,.6,1);
}

/* Hide the broken default img element entirely */
.featured_categories_container .fc_cat_image .swiper-lazy,
.featured_categories_container .fc_cat_image picture,
.featured_categories_container .fc_cat_image img{display:none !important}
/* ================================================================================
   SHAZDEH v8 — Category icons via nth-child (PrestaShop URL rewrite strips ID)
   Cat insertion order:
   1=11 کتاب کودک, 2=12 بازی فکری, 3=130 عروسک, 4=134 ماشین, 5=14 لوازم تحریر,
   6=116 خلاقیت, 7=115 علمی, 8=13 لگو, 9=113 رومیزی, 10=114 کارتی,
   11=141 ورزشی, 12=145 نقش, 13=112 نی‌نی
   ================================================================================ */

/* Remove the broken image entirely — we use bg-image */
.featured_categories_container .fc_cat_image img,
.featured_categories_container .fc_cat_image picture,
.featured_categories_container .fc_cat_image .swiper-lazy-preloader{
  display:none !important;
}

/* Cat image slot: render bg-image */
.featured_categories_container .fc_cat_image{
  display:block !important;
  width:64px;
  height:64px;
  margin:0 auto;
  background-size:contain !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}
@media (min-width:1024px){
  .featured_categories_container .fc_cat_image{width:72px;height:72px}
}

/* === 1. کتاب کودک (id 11) === */
.featured_categories_container .swiper-slide:nth-child(1) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M64 18 L78 18 L78 42 L71 36 L64 42 Z' fill='%23FFD96B'/%3E%3Crect x='20' y='30' width='60' height='56' rx='6' fill='%23E0568B'/%3E%3Cpath d='M50 30 L80 30 L80 80 Q 80 86 74 86 L50 86 Z' fill='%23F478A9'/%3E%3Cpath d='M50 30 L20 30 L20 80 Q 20 86 26 86 L50 86 Z' fill='%23F478A9'/%3E%3Cellipse cx='40' cy='58' rx='2.5' ry='3.4' fill='%233D2C2E'/%3E%3Cellipse cx='60' cy='58' rx='2.5' ry='3.4' fill='%233D2C2E'/%3E%3Cpath d='M 45 68 Q 50 71 55 68' stroke='%233D2C2E' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* === 2. بازی فکری (id 12) — puzzle === */
.featured_categories_container .swiper-slide:nth-child(2) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M 18 50 L 18 66 Q 12 66 12 72 Q 12 78 18 78 L 18 90 L 50 90 L 50 78 Q 56 78 56 72 Q 56 66 50 66 L 50 50 L 38 50 Q 38 44 32 44 Q 26 44 26 50 Z' fill='%23C5B0E8' stroke='%239579D0' stroke-width='2'/%3E%3Cpath d='M 50 50 L 50 66 Q 56 66 56 72 Q 56 78 50 78 L 50 90 L 82 90 Q 88 90 88 84 L 88 56 Q 88 50 82 50 L 70 50 Q 70 44 64 44 Q 58 44 58 50 Z' fill='%23FFD96B' stroke='%23F0BB3D' stroke-width='2'/%3E%3C/svg%3E");
}

/* === 3. عروسک (id 130) — teddy bear === */
.featured_categories_container .swiper-slide:nth-child(3) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Ccircle cx='28' cy='30' r='9' fill='%23FF9F8A'/%3E%3Ccircle cx='72' cy='30' r='9' fill='%23FF9F8A'/%3E%3Ccircle cx='28' cy='30' r='4' fill='%23FFCFC4'/%3E%3Ccircle cx='72' cy='30' r='4' fill='%23FFCFC4'/%3E%3Cellipse cx='50' cy='48' rx='26' ry='24' fill='%23FF9F8A'/%3E%3Cellipse cx='50' cy='58' rx='14' ry='10' fill='%23FFE3DC'/%3E%3Cellipse cx='40' cy='46' rx='3' ry='4' fill='%233D2C2E'/%3E%3Cellipse cx='60' cy='46' rx='3' ry='4' fill='%233D2C2E'/%3E%3Cellipse cx='50' cy='56' rx='3' ry='2.5' fill='%233D2C2E'/%3E%3C/svg%3E");
}

/* === 4. ماشین بازی (id 134) — car === */
.featured_categories_container .swiper-slide:nth-child(4) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M 12 64 Q 12 50 22 50 L 30 50 L 38 36 Q 40 32 46 32 L 64 32 Q 70 32 74 36 L 82 50 L 86 50 Q 90 50 90 56 L 90 64 Q 90 70 84 70 L 16 70 Q 12 70 12 64 Z' fill='%23FFD96B' stroke='%23F0BB3D' stroke-width='2'/%3E%3Cpath d='M 38 50 L 44 38 L 62 38 L 68 50 Z' fill='%236FD3CB'/%3E%3Cellipse cx='46' cy='46' rx='3' ry='4' fill='%233D2C2E'/%3E%3Cellipse cx='60' cy='46' rx='3' ry='4' fill='%233D2C2E'/%3E%3Ccircle cx='28' cy='72' r='9' fill='%233D2C2E'/%3E%3Ccircle cx='72' cy='72' r='9' fill='%233D2C2E'/%3E%3Ccircle cx='28' cy='72' r='4' fill='%23A99A9C'/%3E%3Ccircle cx='72' cy='72' r='4' fill='%23A99A9C'/%3E%3C/svg%3E");
}

/* === 5. لوازم التحریر (id 14) — pencil === */
.featured_categories_container .swiper-slide:nth-child(5) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Crect x='40' y='10' width='20' height='10' rx='2' fill='%23F478A9'/%3E%3Crect x='40' y='20' width='20' height='4' fill='%23C0B8A5'/%3E%3Crect x='40' y='24' width='20' height='50' fill='%23FFD96B'/%3E%3Cpath d='M 40 74 L 50 90 L 60 74 Z' fill='%23E8D4B8'/%3E%3Cpath d='M 46 84 L 50 90 L 54 84 Z' fill='%233D2C2E'/%3E%3Cellipse cx='44' cy='40' rx='2.5' ry='3.5' fill='%233D2C2E'/%3E%3Cellipse cx='56' cy='40' rx='2.5' ry='3.5' fill='%233D2C2E'/%3E%3C/svg%3E");
}

/* === 6. کاردستی خلاقیت (id 116) — palette === */
.featured_categories_container .swiper-slide:nth-child(6) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M 18 52 Q 18 22 50 22 Q 82 22 82 52 Q 82 72 64 78 Q 60 80 60 74 Q 60 66 52 66 Q 44 66 44 74 Q 44 82 36 84 Q 18 80 18 52 Z' fill='%23FFF5F0' stroke='%233D2C2E' stroke-width='2'/%3E%3Ccircle cx='36' cy='36' r='5' fill='%23F478A9'/%3E%3Ccircle cx='50' cy='32' r='5' fill='%23FFD96B'/%3E%3Ccircle cx='64' cy='36' r='5' fill='%236FD3CB'/%3E%3Ccircle cx='32' cy='52' r='5' fill='%23FF9F8A'/%3E%3Ccircle cx='68' cy='52' r='5' fill='%23C5B0E8'/%3E%3Cellipse cx='44' cy='48' rx='2.3' ry='3' fill='%233D2C2E'/%3E%3Cellipse cx='58' cy='48' rx='2.3' ry='3' fill='%233D2C2E'/%3E%3C/svg%3E");
}

/* === 7. آزمایشگاه (id 115) — flask === */
.featured_categories_container .swiper-slide:nth-child(7) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Ccircle cx='35' cy='20' r='3' fill='%236FD3CB'/%3E%3Ccircle cx='55' cy='14' r='2.5' fill='%23A8DFA8'/%3E%3Cpath d='M 32 22 L 32 36 L 22 78 Q 20 86 28 86 L 72 86 Q 80 86 78 78 L 68 36 L 68 22 Z' fill='white' stroke='%233D2C2E' stroke-width='2.5'/%3E%3Cpath d='M 30 22 L 70 22' stroke='%233D2C2E' stroke-width='2.5'/%3E%3Cpath d='M 28 54 L 26 78 Q 24 84 30 84 L 70 84 Q 76 84 74 78 L 72 54 Q 50 56 28 54 Z' fill='%23A8DFA8'/%3E%3C/svg%3E");
}

/* === 8. لگو ساختنی (id 13) — blocks === */
.featured_categories_container .swiper-slide:nth-child(8) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Crect x='32' y='20' width='36' height='20' rx='3' fill='%23F478A9'/%3E%3Ccircle cx='40' cy='18' r='3' fill='%23F478A9'/%3E%3Ccircle cx='50' cy='18' r='3' fill='%23F478A9'/%3E%3Ccircle cx='60' cy='18' r='3' fill='%23F478A9'/%3E%3Crect x='22' y='44' width='56' height='20' rx='3' fill='%23FFD96B'/%3E%3Crect x='18' y='68' width='64' height='20' rx='3' fill='%236FD3CB'/%3E%3C/svg%3E");
}

/* === 9. بازی رومیزی (id 113) — dice === */
.featured_categories_container .swiper-slide:nth-child(9) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Crect x='14' y='42' width='72' height='44' rx='6' fill='%23A8DFA8' stroke='%236BB36B' stroke-width='2'/%3E%3Crect x='36' y='14' width='28' height='28' rx='5' fill='white' stroke='%233D2C2E' stroke-width='2'/%3E%3Ccircle cx='44' cy='22' r='2' fill='%233D2C2E'/%3E%3Ccircle cx='56' cy='22' r='2' fill='%233D2C2E'/%3E%3Ccircle cx='50' cy='28' r='2' fill='%233D2C2E'/%3E%3Ccircle cx='44' cy='34' r='2' fill='%233D2C2E'/%3E%3Ccircle cx='56' cy='34' r='2' fill='%233D2C2E'/%3E%3C/svg%3E");
}

/* === 10. بازی کارتی (id 114) — cards === */
.featured_categories_container .swiper-slide:nth-child(10) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cg transform='rotate(-15 50 60)'%3E%3Crect x='22' y='30' width='32' height='48' rx='4' fill='white' stroke='%233D2C2E' stroke-width='2'/%3E%3Cpath d='M 38 56 L 32 64 L 38 72 L 44 64 Z' fill='%23F25F5C'/%3E%3C/g%3E%3Cg transform='rotate(15 50 60)'%3E%3Crect x='46' y='30' width='32' height='48' rx='4' fill='white' stroke='%233D2C2E' stroke-width='2'/%3E%3Ctext x='62' y='62' font-size='18' font-weight='800' fill='%233D2C2E' text-anchor='middle'%3E%E2%99%A0%3C/text%3E%3C/g%3E%3C/svg%3E");
}

/* === 11. ورزشی (id 141) — football === */
.featured_categories_container .swiper-slide:nth-child(11) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Ccircle cx='50' cy='50' r='32' fill='white' stroke='%233D2C2E' stroke-width='2.5'/%3E%3Cpolygon points='50,30 60,38 56,50 44,50 40,38' fill='%233D2C2E'/%3E%3Cline x1='50' y1='18' x2='50' y2='30' stroke='%233D2C2E' stroke-width='2'/%3E%3Cline x1='60' y1='38' x2='72' y2='34' stroke='%233D2C2E' stroke-width='2'/%3E%3Cline x1='40' y1='38' x2='28' y2='34' stroke='%233D2C2E' stroke-width='2'/%3E%3Cline x1='56' y1='50' x2='64' y2='64' stroke='%233D2C2E' stroke-width='2'/%3E%3Cline x1='44' y1='50' x2='36' y2='64' stroke='%233D2C2E' stroke-width='2'/%3E%3C/svg%3E");
}

/* === 12. نقش بازی (id 145) — crown === */
.featured_categories_container .swiper-slide:nth-child(12) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M 18 50 L 26 30 L 36 50 L 50 30 L 64 50 L 74 30 L 82 50 L 82 70 L 18 70 Z' fill='%23FFD96B' stroke='%23F0BB3D' stroke-width='2'/%3E%3Ccircle cx='26' cy='50' r='3' fill='%23F478A9'/%3E%3Ccircle cx='50' cy='50' r='3' fill='%236FD3CB'/%3E%3Ccircle cx='74' cy='50' r='3' fill='%23C5B0E8'/%3E%3Crect x='18' y='68' width='64' height='8' rx='2' fill='%23E0568B'/%3E%3C/svg%3E");
}

/* === 13. کتاب نی نی (id 112) — rattle === */
.featured_categories_container .swiper-slide:nth-child(13) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Ccircle cx='50' cy='36' r='26' fill='%23FFC1D6' stroke='%23E0568B' stroke-width='2'/%3E%3Ccircle cx='40' cy='28' r='3' fill='%23FFD96B'/%3E%3Ccircle cx='60' cy='30' r='3' fill='%236FD3CB'/%3E%3Crect x='46' y='60' width='8' height='26' rx='4' fill='%239579D0'/%3E%3Ccircle cx='50' cy='90' r='6' fill='%23FFD96B' stroke='%23F0BB3D' stroke-width='2'/%3E%3Cellipse cx='44' cy='36' rx='2.4' ry='3' fill='%233D2C2E'/%3E%3Cellipse cx='56' cy='36' rx='2.4' ry='3' fill='%233D2C2E'/%3E%3C/svg%3E");
}

/* Hover bounce */
.featured_categories_container .swiper-slide:hover .fc_cat_image{
  transform:scale(1.08) rotate(-3deg);
  transition:transform .35s cubic-bezier(.34,1.4,.6,1);
}

/* === stbanner Twin promos styling (Torob/Digi) === */
.st_banner_group_234 .st_banner_block,
[id*="banner_group_234"] .st_banner_block{
  border-radius:14px !important;
  overflow:hidden;
  min-height:120px;
  margin:8px;
}
.st_banner_group_234 .st_banner_block:nth-child(1){
  background:linear-gradient(135deg,#0099E5 0%,#3FC3D7 100%) !important;
}
.st_banner_group_234 .st_banner_block:nth-child(2){
  background:linear-gradient(135deg,#EF393F 0%,#FF6B6B 100%) !important;
}

/* === OVERRIDE: white-bg rule for cat cards uses background shorthand which kills bg-image. 
   Move white BG to outer wrapper, leave fc_cat_image for the icon. === */
.featured_categories_container .swiper-slide > .pro_outer_box,
.featured_categories_container .swiper-slide{
  background:#fff !important;
  border-radius:14px !important;
  padding:16px 8px 12px !important;
  box-shadow:0 2px 6px rgba(0,0,0,.05) !important;
  border:1px solid #F2E7E3;
}
.featured_categories_container .swiper-slide:hover > .pro_outer_box,
.featured_categories_container .swiper-slide:hover{
  background:#FFE3EC !important;
  border-color:#FFE3EC !important;
  transform:translateY(-3px);
  transition:all .25s ease;
}
/* fc_cat_image should NOT have a white bg � it needs to show the SVG bg-image */
.featured_categories_container .fc_cat_image,
.featured_categories_container .swiper-slide > a,
.featured_categories_container .pro_outer_box > a,
.featured_categories_container .swiper-slide .fc_cat_image,
html body .featured_categories_container .swiper-slide .fc_cat_image{
  background-color:transparent !important;
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  box-shadow:none !important;
  width:64px !important;
  height:64px !important;
  margin:0 auto !important;
  display:block !important;
}
/* === FINAL OVERRIDE: SVG cat icons with html body specificity === */
html body .featured_categories_container .fc_cat_image{
  background-color:transparent !important;
  background-size:contain !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}

html body .featured_categories_container .swiper-slide:nth-child(1) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M64 18 L78 18 L78 42 L71 36 L64 42 Z' fill='%23FFD96B'/%3E%3Crect x='20' y='30' width='60' height='56' rx='6' fill='%23E0568B'/%3E%3Cpath d='M50 30 L80 30 L80 80 Q 80 86 74 86 L50 86 Z' fill='%23F478A9'/%3E%3Cpath d='M50 30 L20 30 L20 80 Q 20 86 26 86 L50 86 Z' fill='%23F478A9'/%3E%3Cellipse cx='40' cy='58' rx='2.5' ry='3.4' fill='%233D2C2E'/%3E%3Cellipse cx='60' cy='58' rx='2.5' ry='3.4' fill='%233D2C2E'/%3E%3Cpath d='M 45 68 Q 50 71 55 68' stroke='%233D2C2E' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}
html body .featured_categories_container .swiper-slide:nth-child(2) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M 18 50 L 18 66 Q 12 66 12 72 Q 12 78 18 78 L 18 90 L 50 90 L 50 78 Q 56 78 56 72 Q 56 66 50 66 L 50 50 L 38 50 Q 38 44 32 44 Q 26 44 26 50 Z' fill='%23C5B0E8' stroke='%239579D0' stroke-width='2'/%3E%3Cpath d='M 50 50 L 50 66 Q 56 66 56 72 Q 56 78 50 78 L 50 90 L 82 90 Q 88 90 88 84 L 88 56 Q 88 50 82 50 L 70 50 Q 70 44 64 44 Q 58 44 58 50 Z' fill='%23FFD96B' stroke='%23F0BB3D' stroke-width='2'/%3E%3C/svg%3E") !important;
}
html body .featured_categories_container .swiper-slide:nth-child(3) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Ccircle cx='28' cy='30' r='9' fill='%23FF9F8A'/%3E%3Ccircle cx='72' cy='30' r='9' fill='%23FF9F8A'/%3E%3Cellipse cx='50' cy='48' rx='26' ry='24' fill='%23FF9F8A'/%3E%3Cellipse cx='50' cy='58' rx='14' ry='10' fill='%23FFE3DC'/%3E%3Cellipse cx='40' cy='46' rx='3' ry='4' fill='%233D2C2E'/%3E%3Cellipse cx='60' cy='46' rx='3' ry='4' fill='%233D2C2E'/%3E%3Cellipse cx='50' cy='56' rx='3' ry='2.5' fill='%233D2C2E'/%3E%3C/svg%3E") !important;
}
html body .featured_categories_container .swiper-slide:nth-child(4) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M 12 64 Q 12 50 22 50 L 30 50 L 38 36 Q 40 32 46 32 L 64 32 Q 70 32 74 36 L 82 50 L 86 50 Q 90 50 90 56 L 90 64 Q 90 70 84 70 L 16 70 Q 12 70 12 64 Z' fill='%23FFD96B' stroke='%23F0BB3D' stroke-width='2'/%3E%3Cpath d='M 38 50 L 44 38 L 62 38 L 68 50 Z' fill='%236FD3CB'/%3E%3Ccircle cx='28' cy='72' r='9' fill='%233D2C2E'/%3E%3Ccircle cx='72' cy='72' r='9' fill='%233D2C2E'/%3E%3C/svg%3E") !important;
}
html body .featured_categories_container .swiper-slide:nth-child(5) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Crect x='40' y='10' width='20' height='10' rx='2' fill='%23F478A9'/%3E%3Crect x='40' y='24' width='20' height='50' fill='%23FFD96B'/%3E%3Cpath d='M 40 74 L 50 90 L 60 74 Z' fill='%23E8D4B8'/%3E%3Cpath d='M 46 84 L 50 90 L 54 84 Z' fill='%233D2C2E'/%3E%3Cellipse cx='44' cy='40' rx='2.5' ry='3.5' fill='%233D2C2E'/%3E%3Cellipse cx='56' cy='40' rx='2.5' ry='3.5' fill='%233D2C2E'/%3E%3C/svg%3E") !important;
}
html body .featured_categories_container .swiper-slide:nth-child(6) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M 18 52 Q 18 22 50 22 Q 82 22 82 52 Q 82 72 64 78 Q 60 80 60 74 Q 60 66 52 66 Q 44 66 44 74 Q 44 82 36 84 Q 18 80 18 52 Z' fill='%23FFF5F0' stroke='%233D2C2E' stroke-width='2'/%3E%3Ccircle cx='36' cy='36' r='5' fill='%23F478A9'/%3E%3Ccircle cx='50' cy='32' r='5' fill='%23FFD96B'/%3E%3Ccircle cx='64' cy='36' r='5' fill='%236FD3CB'/%3E%3Ccircle cx='32' cy='52' r='5' fill='%23FF9F8A'/%3E%3Ccircle cx='68' cy='52' r='5' fill='%23C5B0E8'/%3E%3C/svg%3E") !important;
}
html body .featured_categories_container .swiper-slide:nth-child(7) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M 32 22 L 32 36 L 22 78 Q 20 86 28 86 L 72 86 Q 80 86 78 78 L 68 36 L 68 22 Z' fill='white' stroke='%233D2C2E' stroke-width='2.5'/%3E%3Cpath d='M 30 22 L 70 22' stroke='%233D2C2E' stroke-width='2.5'/%3E%3Cpath d='M 28 54 L 26 78 Q 24 84 30 84 L 70 84 Q 76 84 74 78 L 72 54 Q 50 56 28 54 Z' fill='%23A8DFA8'/%3E%3C/svg%3E") !important;
}
html body .featured_categories_container .swiper-slide:nth-child(8) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Crect x='32' y='20' width='36' height='20' rx='3' fill='%23F478A9'/%3E%3Crect x='22' y='44' width='56' height='20' rx='3' fill='%23FFD96B'/%3E%3Crect x='18' y='68' width='64' height='20' rx='3' fill='%236FD3CB'/%3E%3C/svg%3E") !important;
}
html body .featured_categories_container .swiper-slide:nth-child(9) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Crect x='14' y='42' width='72' height='44' rx='6' fill='%23A8DFA8' stroke='%236BB36B' stroke-width='2'/%3E%3Crect x='36' y='14' width='28' height='28' rx='5' fill='white' stroke='%233D2C2E' stroke-width='2'/%3E%3Ccircle cx='44' cy='22' r='2' fill='%233D2C2E'/%3E%3Ccircle cx='56' cy='22' r='2' fill='%233D2C2E'/%3E%3Ccircle cx='50' cy='28' r='2' fill='%233D2C2E'/%3E%3Ccircle cx='44' cy='34' r='2' fill='%233D2C2E'/%3E%3Ccircle cx='56' cy='34' r='2' fill='%233D2C2E'/%3E%3C/svg%3E") !important;
}
html body .featured_categories_container .swiper-slide:nth-child(10) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cg transform='rotate(-15 50 60)'%3E%3Crect x='22' y='30' width='32' height='48' rx='4' fill='white' stroke='%233D2C2E' stroke-width='2'/%3E%3Cpath d='M 38 56 L 32 64 L 38 72 L 44 64 Z' fill='%23F25F5C'/%3E%3C/g%3E%3Cg transform='rotate(15 50 60)'%3E%3Crect x='46' y='30' width='32' height='48' rx='4' fill='white' stroke='%233D2C2E' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E") !important;
}
html body .featured_categories_container .swiper-slide:nth-child(11) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Ccircle cx='50' cy='50' r='32' fill='white' stroke='%233D2C2E' stroke-width='2.5'/%3E%3Cpolygon points='50,30 60,38 56,50 44,50 40,38' fill='%233D2C2E'/%3E%3Cline x1='60' y1='38' x2='72' y2='34' stroke='%233D2C2E' stroke-width='2'/%3E%3Cline x1='40' y1='38' x2='28' y2='34' stroke='%233D2C2E' stroke-width='2'/%3E%3C/svg%3E") !important;
}
html body .featured_categories_container .swiper-slide:nth-child(12) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Cpath d='M 18 50 L 26 30 L 36 50 L 50 30 L 64 50 L 74 30 L 82 50 L 82 70 L 18 70 Z' fill='%23FFD96B' stroke='%23F0BB3D' stroke-width='2'/%3E%3Ccircle cx='26' cy='50' r='3' fill='%23F478A9'/%3E%3Ccircle cx='50' cy='50' r='3' fill='%236FD3CB'/%3E%3Ccircle cx='74' cy='50' r='3' fill='%23C5B0E8'/%3E%3Crect x='18' y='68' width='64' height='8' rx='2' fill='%23E0568B'/%3E%3C/svg%3E") !important;
}
html body .featured_categories_container .swiper-slide:nth-child(13) .fc_cat_image{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-5 -5 110 110'%3E%3Ccircle cx='50' cy='36' r='26' fill='%23FFC1D6' stroke='%23E0568B' stroke-width='2'/%3E%3Crect x='46' y='60' width='8' height='26' rx='4' fill='%239579D0'/%3E%3Ccircle cx='50' cy='90' r='6' fill='%23FFD96B' stroke='%23F0BB3D' stroke-width='2'/%3E%3C/svg%3E") !important;
}

/* === BANNERS as IMAGES (per user request) === */
/* Show slider image, hide text/description overlay since SVG contains everything */
.st_owl_carousel_image{display:block !important;opacity:1 !important}
.st_owl_carousel_image img{width:100% !important;height:auto !important;display:block !important;border-radius:20px !important}
.st_owl_carousel_text{display:none !important}  /* image contains all text now */

/* Slider block � let the image fill, no gradient bg */
.st_owl_carousel_block{
  background:transparent !important;
  padding:0 !important;
  min-height:auto !important;
}
.st_owl_carousel_block_30,
.st_owl_carousel_block_31,
.st_owl_carousel_block_32{
  background:transparent !important;
}

/* Twin promos: show banner image, no html overlay */
.st_banner_group_234 .st_banner_block,
[id*="banner_group_234"] .st_banner_block{
  background:transparent !important;
  padding:0 !important;
}
.st_banner_group_234 .st_banner_text,
[id*="banner_group_234"] .st_banner_text{display:none !important}
.st_banner_group_234 .st_banner_image img,
[id*="banner_group_234"] .st_banner_image img,
[id*="banner_group_234"] img{width:100% !important;height:auto !important;display:block !important;border-radius:14px !important}

/* Twin grid: 2 cols on desktop, stack on mobile */
[id*="banner_group_234"]{display:grid !important;grid-template-columns:1fr 1fr;gap:14px;margin:14px 24px}
@media (max-width:767px){
  [id*="banner_group_234"]{grid-template-columns:1fr 1fr;gap:8px;margin:14px 12px}
}

/* === FORCE SLIDER MIN HEIGHT (was collapsed because SVG natural size 0x0) === */
.owl_carousel_container_9,
#owl_carousel_container_9,
.st_owl_carousel_9,
.st_owl_carousel-9{
  min-height:280px !important;
}
.st_owl_carousel-9 .owl-stage-outer{min-height:280px !important}
.st_owl_carousel-9 .owl-item{height:auto !important}
.st_owl_carousel_block{
  min-height:280px !important;
}
.st_owl_carousel_image,
.st_owl_carousel_image picture,
.st_owl_carousel_image a{display:block !important;width:100%;height:100%}
.st_owl_carousel_image img,
.st_owl_carousel_block img{
  width:100% !important;
  height:280px !important;
  object-fit:cover !important;
  border-radius:20px !important;
  display:block !important;
}

@media (min-width:1024px){
  .owl_carousel_container_9,
  .st_owl_carousel-9,
  .st_owl_carousel_block,
  .st_owl_carousel_image img{min-height:340px !important}
  .st_owl_carousel_image img{height:340px !important}
}

/* === Twin promos min height === */
[id*="banner_group_234"] .st_banner_block,
[id*="banner_group_234"] .st_banner_image{min-height:160px !important}
[id*="banner_group_234"] img{height:160px !important;object-fit:cover !important}

/* === FORCE IMG with class .st_owl_carousel_image (the IMG itself, not parent) === */
img.st_owl_carousel_image{
  width:100% !important;
  height:280px !important;
  object-fit:cover !important;
  border-radius:20px !important;
  display:block !important;
  margin:0 !important;
}
@media (min-width:1024px){
  img.st_owl_carousel_image{height:340px !important}
}

.st_owl_carousel_block,
.st_owl_carousel_block_30,
.st_owl_carousel_block_31,
.st_owl_carousel_block_32{
  display:block !important;
  min-height:280px !important;
  background:transparent !important;
}
.st_owl_carousel_block picture{display:block;width:100%}

/* Twin promos: IMG with class st_banner_image */
img.st_banner_image,
[id*="banner_group_234"] img{
  width:100% !important;
  height:auto !important;
  display:block !important;
  border-radius:14px !important;
}

/* === Constrain slider total height; let owl JS handle slide transitions === */
.owl_carousel_container_9,
#owl_carousel_container_9{
  max-height:340px !important;
  overflow:hidden !important;
}
.st_owl_carousel-9{
  max-height:340px !important;
}
.st_owl_carousel-9 .owl-stage-outer{max-height:340px !important;overflow:hidden}
.st_owl_carousel-9 .owl-stage{display:flex !important;align-items:stretch}

/* IMG with class st_owl_carousel_image (also selecting tag attr) */
.st_owl_carousel-9 img,
.owl_carousel_container_9 img,
img.st_owl_carousel_image,
[class*="st_owl_carousel_block"] img,
[id*="st_owl_carousel_block"] img{
  max-height:340px !important;
  height:340px !important;
  width:100% !important;
  object-fit:cover !important;
  display:block !important;
  border-radius:20px !important;
}
@media (max-width:1023px){
  .owl_carousel_container_9,
  .st_owl_carousel-9,
  .st_owl_carousel-9 .owl-stage-outer,
  .st_owl_carousel-9 img{max-height:220px !important}
  .st_owl_carousel-9 img{height:220px !important}
}

/* Final: contain instead of cover so full SVG visible */
.st_owl_carousel-9 img,
img.st_owl_carousel_image,
[id*="st_owl_carousel_block"] img{
  object-fit:contain !important;
  background:transparent !important;
}
/* ================================================================================
   SHAZDEH — Mobile home header cleanup (step S1)
   Issues fixed:
   1. Mobile header was 2 rows because of wallet button → hide wallet on mobile
      (still accessible via drawer)
   2. "شازده کوچولو" logo block was breaking layout → compact single-row layout
   3. تومان in top utility bar not rendering symbol → force symbol on mobile too
   ================================================================================ */

@media (max-width:1023px){

  /* === FIX 1: Hide wallet button on mobile (keep in drawer) === */
  .szd-hdr-m__wallet,
  .szd-hdr-m__btn.szd-hdr-m__wallet{
    display:none !important;
  }

  /* === FIX 2: Mobile header — single tight row === */
  .szd-hdr--mob{
    display:block !important;
    background:#fff !important;
    padding:8px 0 !important;
    border-bottom:1px solid var(--szd-line, #F2E7E3);
  }
  .szd-hdr-m__row{
    display:grid !important;
    grid-template-columns:42px auto 1fr 42px !important;
    gap:8px !important;
    align-items:center !important;
    padding:0 12px !important;
    max-width:100%;
  }

  /* Hamburger button (right side in RTL) */
  .szd-hdr-m__menu{
    width:42px !important;height:42px !important;
    border-radius:12px !important;
    background:#fff !important;
    border:1px solid var(--szd-line, #F2E7E3) !important;
    display:flex !important;align-items:center;justify-content:center;
    padding:0 !important;
  }
  .szd-hdr-m__menu svg{width:22px;height:22px;color:var(--szd-ink, #3D2C2E)}

  /* Logo block — compact, no cream bg, no extra padding */
  .szd-hdr-m__logo{
    display:flex !important;
    align-items:center;
    gap:6px;
    text-decoration:none;
    background:transparent !important;
    padding:0 !important;
    margin:0 !important;
    min-height:42px;
  }
  .szd-hdr-m__mark{
    width:36px;height:36px;
    background:transparent !important;
    border-radius:0 !important;
    padding:0;margin:0;
    flex-shrink:0;
    display:flex;align-items:center;justify-content:center;
  }
  .szd-hdr-m__mark img,
  .szd-hdr-m__logo-img{
    width:36px !important;height:36px !important;
    object-fit:contain;
    border-radius:8px;
  }
  .szd-hdr-m__text{
    display:none !important;  /* hide "شازده کوچولو فروشگاه کودکان" text on mobile — logo image is enough */
  }

  /* Search — inline, flex-grow */
  .szd-hdr-m__search{
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    min-width:0;
    width:100%;
  }
  .szd-hdr-m__search .QuickSearchInput{
    background:var(--szd-cream, #FFF5F0) !important;
    border:1px solid var(--szd-line, #F2E7E3) !important;
    border-radius:12px !important;
    height:42px !important;
    padding:0 12px !important;
    display:flex;align-items:center;
  }
  .szd-hdr-m__search .QuickSearchInputText{
    background:transparent !important;
    border:0 !important;
    font-size:13px !important;
    width:100%;
  }
  .szd-hdr-m__search .QuickSearchBtnSearch{
    color:var(--szd-pink, #F478A9) !important;
    font-size:16px !important;
  }

  /* Cart button — pink rounded square left side */
  .szd-hdr-m__cart{
    width:42px !important;height:42px !important;
    border-radius:12px !important;
    background:linear-gradient(135deg, var(--szd-pink, #F478A9), #FF8FBD) !important;
    color:#fff !important;
    display:flex !important;align-items:center;justify-content:center;
    text-decoration:none;
    position:relative;
    padding:0 !important;
    box-shadow:0 4px 10px rgba(244,120,169,.3);
  }
  .szd-hdr-m__cart svg{width:22px;height:22px;color:#fff}
  .szd-hdr-m__badge{
    position:absolute;top:-4px;left:-4px;
    background:var(--szd-yellow, #FFD96B) !important;
    color:var(--szd-ink, #3D2C2E) !important;
    font-size:10px;font-weight:900;
    min-width:18px;height:18px;border-radius:9px;
    display:flex;align-items:center;justify-content:center;
    border:2px solid #fff;
  }

  /* === FIX 3: Hide DESKTOP header on mobile === */
  .szd-hdr--desk,
  header.szd-hdr.szd-hdr--desk{
    display:none !important;
  }

  /* === FIX 4: Utility bar — compact on mobile, only show phone + shipping === */
  .szd-utility-bar{
    padding:5px 12px !important;
    background:linear-gradient(90deg, #FFF1DA 0%, #FFE5C4 100%) !important;
    font-size:11px !important;
  }
  .szd-utility-bar__row{
    display:flex !important;
    justify-content:space-between !important;
    align-items:center;
    flex-wrap:nowrap;
    overflow:hidden;
  }
  .szd-utility-bar__left,
  .szd-utility-bar__right{
    display:flex;
    gap:8px;
    align-items:center;
    overflow:hidden;
  }
  /* Hide non-essential items on mobile */
  .szd-utility-bar__guarantee,
  .szd-utility-bar__link:not(.szd-utility-bar__login),
  .szd-hide-md{display:none !important}

  /* Phone — compact */
  .szd-utility-bar__phone{font-size:11px;font-weight:700}
  .szd-utility-bar__phone svg{width:13px;height:13px}

  /* Shipping pill — compact */
  .szd-utility-bar__ship{
    background:rgba(255,255,255,.5);
    padding:2px 8px;
    border-radius:12px;
    font-size:10.5px;
    display:inline-flex;
    align-items:center;
    gap:4px;
  }
  .szd-utility-bar__ship svg{width:12px;height:12px}
  .szd-utility-bar__ship b{color:var(--szd-pink-dk, #E0568B);font-weight:800}

  /* === FIX 5: تومان symbol — ensure it renders properly on mobile === */
  .szd-utility-bar .ishop-currency-symbol,
  .szd-utility-bar .ishop-currency-irt{
    display:inline-block !important;
    width:1em !important;
    height:1em !important;
    vertical-align:-.15em !important;
    text-indent:-9999em !important;
    overflow:hidden !important;
    background-color:currentColor !important;
    color:var(--szd-pink-dk, #E0568B) !important;
    -webkit-mask-repeat:no-repeat !important;
    mask-repeat:no-repeat !important;
    -webkit-mask-position:center !important;
    mask-position:center !important;
    -webkit-mask-size:contain !important;
    mask-size:contain !important;
  }
}

/* === Hide DESKTOP mega-nav on mobile (only use drawer) === */
@media (max-width:1023px){
  .szd-nav,
  .szd-nav--desk{
    display:none !important;
  }
}
/* ================================================================================
   SHAZDEH — S2 Mobile fixes (after user feedback on screenshots)
   1. Cart badge: small + circular + yellow (matching v8 mockup)
   2. Logo: cream rounded card with fox character visible
   3. Drawer categories: LIST with small icons next to text (NOT big grid)
   ================================================================================ */

@media (max-width:1023px){

  /* === FIX 1: Cart badge — small CIRCULAR yellow with dark text === */
  .szd-hdr-m__badge,
  .szd-hdr-m__cart .szd-hdr-m__badge,
  .szd-hdr-m__cart .ajax_cart_quantity{
    position:absolute !important;
    top:-3px !important;
    left:-3px !important;
    right:auto !important;
    background:var(--szd-yellow, #FFD96B) !important;
    color:var(--szd-ink, #3D2C2E) !important;
    min-width:16px !important;
    width:16px !important;
    height:16px !important;
    border-radius:50% !important;
    font-size:9px !important;
    font-weight:900 !important;
    border:2px solid #fff !important;
    padding:0 !important;
    display:flex !important;
    align-items:center;
    justify-content:center;
    font-variant-numeric:tabular-nums;
    line-height:1;
  }

  /* === FIX 2: Mobile Logo — cream rounded card with fox character === */
  .szd-hdr-m__row{
    grid-template-columns:42px auto 1fr 42px !important;
    gap:8px !important;
  }
  .szd-hdr-m__logo{
    display:flex !important;
    align-items:center;
    gap:8px;
    background:var(--szd-cream, #FFF5F0) !important;
    border:1px solid var(--szd-line, #F2E7E3) !important;
    border-radius:12px !important;
    padding:4px 8px 4px 4px !important;
    min-height:42px;
    text-decoration:none;
  }
  .szd-hdr-m__mark{
    width:34px !important;height:34px !important;
    background:linear-gradient(135deg, #FFE3EC, #FFD96B) !important;
    border-radius:10px !important;
    padding:4px !important;
    display:flex !important;align-items:center;justify-content:center;
    flex-shrink:0;
    overflow:hidden;
  }
  .szd-hdr-m__mark img,
  .szd-hdr-m__logo-img{
    width:100% !important;height:100% !important;
    object-fit:contain;
    border-radius:0 !important;
  }
  /* Show the logo TEXT too on mobile, but compact */
  .szd-hdr-m__text{
    display:block !important;
    line-height:1.2;
    text-align:right;
  }
  .szd-hdr-m__text strong{
    display:block;
    font-size:12px !important;
    font-weight:900 !important;
    color:var(--szd-ink, #3D2C2E);
  }
  .szd-hdr-m__text small{
    display:block;
    font-size:9.5px !important;
    color:var(--szd-ink-3, #7B6B6D);
    font-weight:600;
    margin-top:1px;
  }

  /* === FIX 3: Drawer categories — LIST with small icons next to text === */
  .szd-drawer__cats-grid{
    display:flex !important;
    flex-direction:column !important;
    grid-template-columns:none !important;
    gap:2px !important;
    padding:0 !important;
  }
  .szd-drawer__cat{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:10px !important;
    padding:10px 12px !important;
    background:transparent !important;
    border:0 !important;
    border-bottom:1px solid var(--szd-line, #F2E7E3) !important;
    border-radius:0 !important;
    text-decoration:none !important;
    box-shadow:none !important;
    transform:none !important;
    min-height:48px;
  }
  .szd-drawer__cat:active,
  .szd-drawer__cat:hover{
    background:var(--szd-pink-soft, #FFE3EC) !important;
    border-radius:10px !important;
    transform:none !important;
    box-shadow:none !important;
    border-color:transparent !important;
  }
  /* Small icon container (right side in RTL) */
  .szd-drawer__cat-iconwrap{
    width:32px !important;
    height:32px !important;
    flex-shrink:0;
    display:flex !important;
    align-items:center;
    justify-content:center;
    background:var(--szd-cream, #FFF5F0);
    border-radius:8px;
    padding:3px;
  }
  .szd-drawer__cat-iconwrap svg,
  .szd-drawer__cat-iconwrap .szd-ic-svg{
    width:100% !important;
    height:100% !important;
    display:block;
  }
  /* Category name — inline next to icon */
  .szd-drawer__cat-name{
    font-size:13.5px !important;
    font-weight:700 !important;
    text-align:right !important;
    color:var(--szd-ink, #3D2C2E);
    line-height:1.3 !important;
    flex:1;
    display:block !important;
    -webkit-line-clamp:unset !important;
    max-height:none !important;
  }
  /* Right chevron indicating clickable */
  .szd-drawer__cat::after{
    content:"‹";
    font-size:18px;
    color:var(--szd-ink-3, #7B6B6D);
    margin-left:auto;
    flex-shrink:0;
  }

  /* Drawer section header — pink underline */
  .szd-drawer__sec-head{
    display:flex !important;
    justify-content:space-between;
    align-items:baseline;
    padding:14px 12px 8px !important;
    border-bottom:2px solid var(--szd-pink-soft, #FFE3EC);
    margin-bottom:6px;
  }
  .szd-drawer__section-title{
    font-size:14px;
    font-weight:900;
    color:var(--szd-ink, #3D2C2E);
  }
  .szd-drawer__sec-meta{
    font-size:11px;
    color:var(--szd-pink-dk, #E0568B);
    font-weight:700;
  }

  /* === FIX 4: Ensure تومان symbol displays in utility bar === */
  .szd-utility-bar .ishop-currency-symbol.ishop-currency-irt{
    display:inline-block !important;
    width:.9em !important;
    height:.9em !important;
    vertical-align:-.12em !important;
    text-indent:-9999em !important;
    overflow:hidden !important;
    background-color:currentColor !important;
    color:var(--szd-pink-dk, #E0568B) !important;
    margin-right:2px;
  }
  /* Inline mask in case external CSS file mask doesn't load */
  .szd-utility-bar .ishop-currency-irt{
    -webkit-mask-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 12'%3E%3Cpath fill='%23000' d='M2.32 6.12C2.64 5.96 2.87 5.81 3.11 5.58 3.27 5.35 3.42 5.12 3.58 4.89 3.66 4.58 3.74 4.27 3.74 3.96H11.23C11.71 3.96 12.1 3.81 12.41 3.58 12.65 3.27 12.81 2.89 12.81 2.35V0.5H11.78V2.27C11.78 2.65 11.55 2.89 11.15 2.89H3.74V2.5C3.74 2.12 3.66 1.89 3.58 1.58 3.58 1.35 3.42 1.12 3.27 0.96 3.11 0.81 2.95 0.73 2.79 0.65 2.56 0.58 2.32 0.5 2.16 0.5 1.85 0.5 1.61 0.58 1.37 0.65 1.22 0.81 0.98 0.88 0.9 1.12 0.74 1.27 0.58 1.42 0.58 1.65 0.51 1.89 0.43 2.12 0.43 2.35 0.43 2.58 0.43 2.81 0.51 3.04 0.58 3.27 0.66 3.42 0.74 3.58 0.9 3.66 1.06 3.81 1.29 3.89 1.53 3.96 1.77 3.96 2.16 3.96H2.79C2.79 4.12 2.71 4.27 2.71 4.42 2.64 4.58 2.48 4.73 2.4 4.89 2.32 4.96 2.16 5.04 1.93 5.12 1.77 5.19 1.53 5.27 1.29 5.27H0.27V6.35H1.29C1.69 6.27 2 6.19 2.32 6.12Z'/%3E%3Cpath fill='%23000' d='M10.44 0.5H7.45V1.42H10.44V0.5Z'/%3E%3Cpath fill='%23000' d='M12.73 8.5C12.65 8.27 12.57 8.12 12.41 7.97 12.26 7.81 12.1 7.66 11.86 7.58 11.7 7.5 11.47 7.43 11.23 7.43 10.99 7.43 10.76 7.5 10.52 7.58 10.29 7.66 10.13 7.81 9.97 7.97 9.81 8.12 9.73 8.27 9.65 8.5 9.58 8.73 9.58 8.97 9.58 9.2V9.43C9.58 9.66 9.5 9.74 9.42 9.89 9.26 9.97 9.1 10.04 8.87 10.04H8.55C8.39 10.04 8.23 9.97 8.16 9.89 8.08 9.74 8 9.58 8 9.43V5.73H6.97V9.58C6.97 9.89 6.97 10.12 7.05 10.27 7.13 10.43 7.21 10.58 7.37 10.74 7.52 10.81 7.6 10.97 7.84 10.97 7.99 11.04 8.16 11.04 8.39 11.04H8.94C9.1 11.04 9.34 10.97 9.5 10.89 9.65 10.81 9.89 10.66 9.97 10.43 10.13 10.66 10.29 10.81 10.52 10.89 10.76 10.97 10.99 11.04 11.31 11.04 11.78 11.04 12.26 10.89 12.49 10.58 12.81 10.27 12.97 9.81 12.97 9.27 12.89 8.97 12.81 8.73 12.73 8.5ZM11.23 9.97C10.99 9.97 10.84 9.89 10.76 9.81 10.52 9.66 10.52 9.5 10.52 9.27 10.52 9.04 10.6 8.89 10.68 8.73 10.76 8.58 10.99 8.5 11.23 8.5 11.47 8.5 11.7 8.58 11.78 8.73 11.86 8.89 11.94 9.04 11.94 9.27 11.86 9.74 11.63 9.97 11.23 9.97Z'/%3E%3Cpath fill='%23000' d='M4.92 8.5C4.92 8.73 4.92 8.89 4.84 9.12 4.76 9.27 4.69 9.43 4.61 9.58 4.45 9.73 4.29 9.81 4.13 9.89 3.98 9.97 3.74 10.04 3.42 10.04H2.71C2.48 10.04 2.24 10.04 2 9.97 1.85 9.81 1.69 9.73 1.61 9.58 1.53 9.43 1.37 9.27 1.37 9.12 1.29 8.97 1.29 8.73 1.29 8.5V7.66H0.27V8.58C0.27 9.35 0.51 9.97 0.9 10.43 1.29 10.89 1.85 11.12 2.64 11.12H3.42C3.82 11.12 4.13 11.04 4.45 10.89 4.76 10.74 5 10.58 5.24 10.35 5.47 10.12 5.63 9.81 5.71 9.5 5.79 9.2 5.87 8.89 5.87 8.5V5.73L4.84 5.66 4.92 8.5Z'/%3E%3Cpath fill='%23000' d='M3.74 7.43H2.56V8.5H3.74V7.43Z'/%3E%3C/svg%3E") !important;
    mask-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 12'%3E%3Cpath fill='%23000' d='M2.32 6.12C2.64 5.96 2.87 5.81 3.11 5.58 3.27 5.35 3.42 5.12 3.58 4.89 3.66 4.58 3.74 4.27 3.74 3.96H11.23C11.71 3.96 12.1 3.81 12.41 3.58 12.65 3.27 12.81 2.89 12.81 2.35V0.5H11.78V2.27C11.78 2.65 11.55 2.89 11.15 2.89H3.74V2.5C3.74 2.12 3.66 1.89 3.58 1.58Z'/%3E%3Cpath fill='%23000' d='M10.44 0.5H7.45V1.42H10.44V0.5Z'/%3E%3Cpath fill='%23000' d='M12.73 8.5C12.65 8.27 12.57 8.12 12.41 7.97Z'/%3E%3Cpath fill='%23000' d='M4.92 8.5V5.73L4.84 5.66 4.92 8.5Z'/%3E%3Cpath fill='%23000' d='M3.74 7.43H2.56V8.5H3.74V7.43Z'/%3E%3C/svg%3E") !important;
    -webkit-mask-size:contain !important;
    mask-size:contain !important;
    -webkit-mask-repeat:no-repeat !important;
    mask-repeat:no-repeat !important;
    -webkit-mask-position:center !important;
    mask-position:center !important;
  }
}
/* ================================================================================
   SHAZDEH — S3 Mobile fixes (per user feedback)
   1. Kill panda's #mobile_bar sticky scroll bar (we have our own header)
   2. Remove "دسته‌بندی‌ها / 13 دسته اصلی" header from drawer
   3. Add fox icon to logo card next to existing logo image
   4. Restore search bar full visibility (no collapse to icon)
   5. Make our own header sticky-friendly with rounded edges (no border)
   ================================================================================ */

@media (max-width:1023px){

  /* === FIX 1: Kill panda's own sticky mobile bar === */
  #mobile_bar,
  section#mobile_bar.animated,
  #mobile_bar.stuck,
  .mobile_bar,
  #st_top_breadcrumb_mobile{
    display:none !important;
  }
  /* But also kill any other sticky leftover bars while we're here */
  body > section.animated.stuck,
  body > div.animated.stuck{
    display:none !important;
  }

  /* === FIX 2: Hide drawer "دسته‌بندی‌ها / 13 دسته اصلی" section header === */
  .szd-drawer__section .szd-drawer__sec-head,
  .szd-drawer__section .szd-drawer__section-title,
  .szd-drawer__section .szd-drawer__sec-meta,
  .szd-drawer__section h4.szd-drawer__section-title{
    display:none !important;
  }

  /* === FIX 3: Fox icon next to logo (small accent) === */
  /* Add fox character via ::after on logo block */
  .szd-hdr-m__logo{
    position:relative;
  }
  .szd-hdr-m__logo::after{
    content:"";
    display:inline-block;
    width:22px;
    height:22px;
    margin-right:2px;
    flex-shrink:0;
    background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cellipse cx='32' cy='38' rx='22' ry='20' fill='%23FF9F4A'/%3E%3Cpath d='M14 26 L8 14 L18 22 Z' fill='%23FF9F4A'/%3E%3Cpath d='M50 26 L56 14 L46 22 Z' fill='%23FF9F4A'/%3E%3Cellipse cx='20' cy='48' rx='6' ry='4' fill='%23fff'/%3E%3Cellipse cx='44' cy='48' rx='6' ry='4' fill='%23fff'/%3E%3Cellipse cx='32' cy='52' rx='5' ry='3' fill='%23fff'/%3E%3Ccircle cx='24' cy='34' r='3' fill='%233D2C2E'/%3E%3Ccircle cx='40' cy='34' r='3' fill='%233D2C2E'/%3E%3Ccircle cx='25' cy='33' r='1' fill='%23fff'/%3E%3Ccircle cx='41' cy='33' r='1' fill='%23fff'/%3E%3Cellipse cx='32' cy='44' rx='2' ry='1.5' fill='%233D2C2E'/%3E%3C/svg%3E");
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
  }

  /* === FIX 4: Search bar — restore full visibility, no collapse === */
  .szd-hdr-m__row{
    grid-template-columns:42px auto 1fr 42px !important;
    gap:6px !important;  /* reduced gap to give search more room */
  }
  /* Make logo card more compact so search has room */
  .szd-hdr-m__logo{
    padding:3px 6px 3px 3px !important;
    max-width:130px;
  }
  .szd-hdr-m__text strong{font-size:11px !important}
  .szd-hdr-m__text small{font-size:9px !important}

  .szd-hdr-m__search,
  .szd-hdr-m__search.QuickSearchBox{
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    min-width:0 !important;
    width:100% !important;
  }
  .szd-hdr-m__search .QuickSearchForm{
    width:100% !important;
    margin:0 !important;
  }
  .szd-hdr-m__search .QuickSearchInput{
    background:var(--szd-cream, #FFF5F0) !important;
    border:1px solid var(--szd-line, #F2E7E3) !important;
    border-radius:12px !important;
    height:42px !important;
    padding:0 12px !important;
    display:flex !important;align-items:center;
    width:100% !important;
    box-sizing:border-box;
  }
  .szd-hdr-m__search .QuickSearchInputText{
    background:transparent !important;
    border:0 !important;
    outline:none !important;
    font-size:12px !important;
    width:100% !important;
    flex:1;
    padding:0 6px 0 0 !important;
    color:var(--szd-ink, #3D2C2E);
    font-family:inherit;
  }
  .szd-hdr-m__search .QuickSearchInputText::placeholder{
    color:var(--szd-ink-3, #7B6B6D);
    opacity:.8;
  }
  .szd-hdr-m__search .QuickSearchBtnSearch{
    color:var(--szd-pink, #F478A9) !important;
    font-size:16px !important;
    background:transparent !important;
    border:0 !important;
    width:auto !important;height:auto !important;
    flex-shrink:0;
    padding:0;
  }

  /* === FIX 5: Header sticky with rounded bottom corners (no border) === */
  .szd-hdr--mob{
    position:sticky !important;
    top:0 !important;
    z-index:50;
    background:#fff !important;
    border-bottom:0 !important;
    border-radius:0 0 18px 18px;
    box-shadow:0 2px 10px rgba(45,28,32,.06);
    padding:8px 0 !important;
  }
  /* Utility bar — also sticky above header */
  .szd-utility-bar{
    position:sticky;
    top:0;
    z-index:51;
  }
  .szd-hdr--mob{
    top:32px !important;  /* offset for utility bar above */
  }
}

/* ============= S6 MOBILE FIXES (logo box + full ����� symbol) ============= */
/* ================================================================================
   SHAZDEH — S6 Mobile fixes
   1. Logo box: text-only ("شازده کوچولو / خوشحالی فروشی") — no fox image
   2. تومان symbol — full SVG mask (complete shape)
   ================================================================================ */

@media (max-width:1023px){

  /* === Logo: text-only card === */
  .szd-hdr-m__logo{
    display:flex !important;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    background:var(--szd-cream, #FFF5F0) !important;
    border:1px solid var(--szd-line, #F2E7E3) !important;
    border-radius:12px !important;
    padding:6px 14px !important;
    min-height:42px;
    min-width:120px;
  }
  /* Hide any leftover mark/image elements (no more fox icon) */
  .szd-hdr-m__mark,
  .szd-hdr-m__logo-img,
  .szd-hdr-m__logo img,
  .szd-hdr-m__logo > svg{
    display:none !important;
  }
  .szd-hdr-m__text{
    display:block !important;
    line-height:1.2;
    text-align:center;
    margin:0;
  }
  .szd-hdr-m__text strong{
    display:block;
    font-size:13px !important;
    font-weight:900 !important;
    color:var(--szd-ink, #3D2C2E);
  }
  .szd-hdr-m__text small{
    display:block;
    font-size:10px !important;
    color:var(--szd-pink-dk, #E0568B);
    font-weight:700;
    margin-top:2px;
  }
}

/* === تومان symbol — full proper SVG (renders complete shape at any size) === */
.ishop-currency-symbol.ishop-currency-irt,
.szd-utility-bar .ishop-currency-symbol.ishop-currency-irt,
.szd-ticker-bar .ishop-currency-symbol.ishop-currency-irt{
  display:inline-block !important;
  width:1.2em !important;
  height:1em !important;
  vertical-align:-.15em !important;
  margin-right:3px !important;
  text-indent:-9999em !important;
  overflow:hidden !important;
  background-color:currentColor !important;
  -webkit-mask-repeat:no-repeat !important;
  mask-repeat:no-repeat !important;
  -webkit-mask-position:center !important;
  mask-position:center !important;
  -webkit-mask-size:contain !important;
  mask-size:contain !important;
  -webkit-mask-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 12'%3E%3Cpath fill='%23000' d='M2.32 6.12C2.64 5.96 2.87 5.81 3.11 5.58 3.27 5.35 3.42 5.12 3.58 4.89 3.66 4.58 3.74 4.27 3.74 3.96H11.23C11.71 3.96 12.1 3.81 12.41 3.58 12.65 3.27 12.81 2.89 12.81 2.35V0.5H11.78V2.27C11.78 2.65 11.55 2.89 11.15 2.89H3.74V2.5C3.74 2.12 3.66 1.89 3.58 1.58 3.58 1.35 3.42 1.12 3.27 0.96 3.11 0.81 2.95 0.73 2.79 0.65 2.56 0.58 2.32 0.5 2.16 0.5 1.85 0.5 1.61 0.58 1.37 0.65 1.22 0.81 0.98 0.88 0.9 1.12 0.74 1.27 0.58 1.42 0.58 1.65 0.51 1.89 0.43 2.12 0.43 2.35 0.43 2.58 0.43 2.81 0.51 3.04 0.58 3.27 0.66 3.42 0.74 3.58 0.9 3.66 1.06 3.81 1.29 3.89 1.53 3.96 1.77 3.96 2.16 3.96H2.79C2.79 4.12 2.71 4.27 2.71 4.42 2.64 4.58 2.48 4.73 2.4 4.89 2.32 4.96 2.16 5.04 1.93 5.12 1.77 5.19 1.53 5.27 1.29 5.27H0.27V6.35H1.29C1.69 6.27 2 6.19 2.32 6.12ZM2.16 2.89C1.85 2.89 1.69 2.89 1.53 2.73 1.45 2.65 1.37 2.5 1.37 2.27 1.37 2.04 1.45 1.81 1.53 1.73 1.69 1.65 1.85 1.58 2.08 1.58 2.32 1.58 2.48 1.65 2.64 1.81 2.79 1.96 2.79 2.19 2.79 2.5V2.96H2.16V2.89Z'/%3E%3Cpath fill='%23000' d='M10.44 0.5H7.45V1.42H10.44V0.5Z'/%3E%3Cpath fill='%23000' d='M12.73 8.5C12.65 8.27 12.57 8.12 12.41 7.97 12.26 7.81 12.1 7.66 11.86 7.58 11.7 7.5 11.47 7.43 11.23 7.43 10.99 7.43 10.76 7.5 10.52 7.58 10.29 7.66 10.13 7.81 9.97 7.97 9.81 8.12 9.73 8.27 9.65 8.5 9.58 8.73 9.58 8.97 9.58 9.2V9.43C9.58 9.66 9.5 9.74 9.42 9.89 9.26 9.97 9.1 10.04 8.87 10.04H8.55C8.39 10.04 8.23 9.97 8.16 9.89 8.08 9.74 8 9.58 8 9.43V5.73H6.97V9.58C6.97 9.89 6.97 10.12 7.05 10.27 7.13 10.43 7.21 10.58 7.37 10.74 7.52 10.81 7.6 10.97 7.84 10.97 7.99 11.04 8.16 11.04 8.39 11.04H8.94C9.1 11.04 9.34 10.97 9.5 10.89 9.65 10.81 9.89 10.66 9.97 10.43 10.13 10.66 10.29 10.81 10.52 10.89 10.76 10.97 10.99 11.04 11.31 11.04 11.78 11.04 12.26 10.89 12.49 10.58 12.81 10.27 12.97 9.81 12.97 9.27 12.89 8.97 12.81 8.73 12.73 8.5ZM11.23 9.97C10.99 9.97 10.84 9.89 10.76 9.81 10.52 9.66 10.52 9.5 10.52 9.27 10.52 9.04 10.6 8.89 10.68 8.73 10.76 8.58 10.99 8.5 11.23 8.5 11.47 8.5 11.7 8.58 11.78 8.73 11.86 8.89 11.94 9.04 11.94 9.27 11.86 9.74 11.63 9.97 11.23 9.97Z'/%3E%3Cpath fill='%23000' d='M4.92 8.5C4.92 8.73 4.92 8.89 4.84 9.12 4.76 9.27 4.69 9.43 4.61 9.58 4.45 9.73 4.29 9.81 4.13 9.89 3.98 9.97 3.74 10.04 3.42 10.04H2.71C2.48 10.04 2.24 10.04 2 9.97 1.85 9.81 1.69 9.73 1.61 9.58 1.53 9.43 1.37 9.27 1.37 9.12 1.29 8.97 1.29 8.73 1.29 8.5V7.66H0.27V8.58C0.27 9.35 0.51 9.97 0.9 10.43 1.29 10.89 1.85 11.12 2.64 11.12H3.42C3.82 11.12 4.13 11.04 4.45 10.89 4.76 10.74 5 10.58 5.24 10.35 5.47 10.12 5.63 9.81 5.71 9.5 5.79 9.2 5.87 8.89 5.87 8.5V5.73L4.84 5.66 4.92 8.5Z'/%3E%3Cpath fill='%23000' d='M3.74 7.43H2.56V8.5H3.74V7.43Z'/%3E%3C/svg%3E") !important;
  mask-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 12'%3E%3Cpath fill='%23000' d='M2.32 6.12C2.64 5.96 2.87 5.81 3.11 5.58 3.27 5.35 3.42 5.12 3.58 4.89 3.66 4.58 3.74 4.27 3.74 3.96H11.23C11.71 3.96 12.1 3.81 12.41 3.58 12.65 3.27 12.81 2.89 12.81 2.35V0.5H11.78V2.27C11.78 2.65 11.55 2.89 11.15 2.89H3.74V2.5C3.74 2.12 3.66 1.89 3.58 1.58 3.58 1.35 3.42 1.12 3.27 0.96 3.11 0.81 2.95 0.73 2.79 0.65 2.56 0.58 2.32 0.5 2.16 0.5 1.85 0.5 1.61 0.58 1.37 0.65 1.22 0.81 0.98 0.88 0.9 1.12 0.74 1.27 0.58 1.42 0.58 1.65 0.51 1.89 0.43 2.12 0.43 2.35 0.43 2.58 0.43 2.81 0.51 3.04 0.58 3.27 0.66 3.42 0.74 3.58 0.9 3.66 1.06 3.81 1.29 3.89 1.53 3.96 1.77 3.96 2.16 3.96H2.79C2.79 4.12 2.71 4.27 2.71 4.42 2.64 4.58 2.48 4.73 2.4 4.89 2.32 4.96 2.16 5.04 1.93 5.12 1.77 5.19 1.53 5.27 1.29 5.27H0.27V6.35H1.29C1.69 6.27 2 6.19 2.32 6.12ZM2.16 2.89C1.85 2.89 1.69 2.89 1.53 2.73 1.45 2.65 1.37 2.5 1.37 2.27 1.37 2.04 1.45 1.81 1.53 1.73 1.69 1.65 1.85 1.58 2.08 1.58 2.32 1.58 2.48 1.65 2.64 1.81 2.79 1.96 2.79 2.19 2.79 2.5V2.96H2.16V2.89Z'/%3E%3Cpath fill='%23000' d='M10.44 0.5H7.45V1.42H10.44V0.5Z'/%3E%3Cpath fill='%23000' d='M12.73 8.5C12.65 8.27 12.57 8.12 12.41 7.97 12.26 7.81 12.1 7.66 11.86 7.58 11.7 7.5 11.47 7.43 11.23 7.43 10.99 7.43 10.76 7.5 10.52 7.58 10.29 7.66 10.13 7.81 9.97 7.97 9.81 8.12 9.73 8.27 9.65 8.5 9.58 8.73 9.58 8.97 9.58 9.2V9.43C9.58 9.66 9.5 9.74 9.42 9.89 9.26 9.97 9.1 10.04 8.87 10.04H8.55C8.39 10.04 8.23 9.97 8.16 9.89 8.08 9.74 8 9.58 8 9.43V5.73H6.97V9.58C6.97 9.89 6.97 10.12 7.05 10.27 7.13 10.43 7.21 10.58 7.37 10.74 7.52 10.81 7.6 10.97 7.84 10.97 7.99 11.04 8.16 11.04 8.39 11.04H8.94C9.1 11.04 9.34 10.97 9.5 10.89 9.65 10.81 9.89 10.66 9.97 10.43 10.13 10.66 10.29 10.81 10.52 10.89 10.76 10.97 10.99 11.04 11.31 11.04 11.78 11.04 12.26 10.89 12.49 10.58 12.81 10.27 12.97 9.81 12.97 9.27 12.89 8.97 12.81 8.73 12.73 8.5ZM11.23 9.97C10.99 9.97 10.84 9.89 10.76 9.81 10.52 9.66 10.52 9.5 10.52 9.27 10.52 9.04 10.6 8.89 10.68 8.73 10.76 8.58 10.99 8.5 11.23 8.5 11.47 8.5 11.7 8.58 11.78 8.73 11.86 8.89 11.94 9.04 11.94 9.27 11.86 9.74 11.63 9.97 11.23 9.97Z'/%3E%3Cpath fill='%23000' d='M4.92 8.5C4.92 8.73 4.92 8.89 4.84 9.12 4.76 9.27 4.69 9.43 4.61 9.58 4.45 9.73 4.29 9.81 4.13 9.89 3.98 9.97 3.74 10.04 3.42 10.04H2.71C2.48 10.04 2.24 10.04 2 9.97 1.85 9.81 1.69 9.73 1.61 9.58 1.53 9.43 1.37 9.27 1.37 9.12 1.29 8.97 1.29 8.73 1.29 8.5V7.66H0.27V8.58C0.27 9.35 0.51 9.97 0.9 10.43 1.29 10.89 1.85 11.12 2.64 11.12H3.42C3.82 11.12 4.13 11.04 4.45 10.89 4.76 10.74 5 10.58 5.24 10.35 5.47 10.12 5.63 9.81 5.71 9.5 5.79 9.2 5.87 8.89 5.87 8.5V5.73L4.84 5.66 4.92 8.5Z'/%3E%3Cpath fill='%23000' d='M3.74 7.43H2.56V8.5H3.74V7.43Z'/%3E%3C/svg%3E") !important;
}

.szd-utility-bar .ishop-currency-symbol.ishop-currency-irt{
  color:var(--szd-pink-dk, #E0568B) !important;
}

/* ========= S6b PATCHES (fox icon + ticker stacking) ========= */
/* ================================================================================
   SHAZDEH — S6b Patches (hot fixes for stacking ticker + leftover fox icon)
   Applied AFTER S6 — overrides specific issues found after S6 deploy.
   ================================================================================ */

/* ----------------------------------------------------------------------
   FIX 1: Remove leftover ::after fox icon on mobile logo
   The previous fox-via-pseudo rule lives at szd-components.css:2751
   ---------------------------------------------------------------------- */
@media (max-width:1023px){
  .szd-hdr-m__logo::after,
  .szd-hdr-m__logo::before{
    content:none !important;
    display:none !important;
    background:none !important;
    width:0 !important;
    height:0 !important;
    margin:0 !important;
    padding:0 !important;
  }
  /* Force grid column layout for mobile row to give logo room (no fox column) */
  .szd-hdr-m__row{
    grid-template-columns:42px auto 1fr 42px 42px !important;
    gap:8px !important;
  }
}

/* ----------------------------------------------------------------------
   FIX 2: Ticker children — force inline-flex via child selector (higher
   specificity than .szd-tkr__item alone). Solves vertical-stack rendering.
   ---------------------------------------------------------------------- */
.szd-tkr{
  display:block !important;
  width:100% !important;
  overflow:hidden !important;
  position:relative !important;
  z-index:30 !important;
}
.szd-tkr > .szd-tkr__track{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  width:max-content !important;
  max-width:none !important;
  min-width:200% !important;
  white-space:nowrap !important;
}
/* CRITICAL: child-selector override forces every direct child to inline-flex
   (higher specificity 0,2,0 vs single-class 0,1,0) */
.szd-tkr__track > *,
.szd-tkr > .szd-tkr__track > span,
.szd-tkr > .szd-tkr__track > a{
  display:inline-flex !important;
  align-items:center !important;
  flex:0 0 auto !important;
  flex-shrink:0 !important;
  white-space:nowrap !important;
  float:none !important;
  clear:none !important;
  width:auto !important;
}
.szd-tkr__track > .szd-tkr__item{padding:0 14px !important;gap:6px}
.szd-tkr__track > .szd-tkr__sep{opacity:.35 !important;font-size:10px !important;padding:0 2px}
.szd-tkr__track > .szd-tkr__item > .szd-tkr__icon{
  display:inline-block !important;font-size:14px !important;line-height:1 !important;margin-left:4px
}
.szd-tkr__track > .szd-tkr__item > .szd-tkr__a,
.szd-tkr__track > .szd-tkr__item > span{
  display:inline !important;text-decoration:none !important;font-weight:800
}

/* ========= S6c FIX: restore animation-duration on .szd-tkr__track ========= */
.szd-tkr > .szd-tkr__track{
  will-change:transform !important;
  animation-name:szdTkrRtl !important;
  animation-duration:var(--szd-tkr-spd,30s) !important;
  animation-timing-function:linear !important;
  animation-iteration-count:infinite !important;
}
.szd-tkr > .szd-tkr__track.--ltr{animation-name:szdTkrLtr !important}
.szd-tkr:hover > .szd-tkr__track{animation-play-state:paused !important}

/* ========= S6d FIX: force LTR on .szd-tkr__track (RTL breaks marquee positioning) ========= */
.szd-tkr,
.szd-tkr > .szd-tkr__track{
  direction:ltr !important;
  text-align:left !important;
}
/* But text inside each item should still render RTL (it's Persian) */
.szd-tkr__item,
.szd-tkr__item *{
  direction:rtl !important;
  unicode-bidi:embed;
}

/* ========= S6e: Fox-logo box (mobile) ========= */
/* ================================================================================
   SHAZDEH — S6e: Fox-logo box (mobile)
   - Box layout: fox image on VISUAL RIGHT (RTL start), text stacked on LEFT
   - Fox matches box height; soft drop-shadow under fox; cream box bg + thin border
   ================================================================================ */

@media (max-width:1023px){

  /* Logo box — flex with fox on right (DOM order: text then fox)
     Page is dir=rtl so flex-direction:row places first child on the visual RIGHT.
     We want fox VISUALLY on right + text VISUALLY on left.
     → first DOM child = text → appears RIGHT in RTL
     → second DOM child = fox → appears LEFT in RTL
     Workaround: use flex-direction:row-reverse so DOM order matches visual L→R order */
  .szd-hdr-m__logo{
    display:flex !important;
    flex-direction:row-reverse !important;   /* visual: [text] [fox] in RTL */
    align-items:center !important;
    justify-content:flex-end !important;
    gap:8px !important;
    text-decoration:none !important;
    background:var(--szd-cream, #FFF5F0) !important;
    border:1px solid var(--szd-line, #F2E7E3) !important;
    border-radius:14px !important;
    padding:4px 8px 4px 12px !important;
    min-height:46px !important;
    height:46px !important;
    max-width:none !important;
    box-shadow:
      0 1px 2px rgba(220, 90, 30, 0.06),
      0 4px 12px rgba(220, 90, 30, 0.08) !important;
    overflow:hidden !important;
  }

  /* Hide any leftover legacy mark elements */
  .szd-hdr-m__mark,
  .szd-hdr-m__logo-img,
  .szd-hdr-m__logo > img:not(.szd-hdr-m__fox),
  .szd-hdr-m__logo > svg{
    display:none !important;
  }
  .szd-hdr-m__logo::after,
  .szd-hdr-m__logo::before{
    content:none !important;
    display:none !important;
    background:none !important;
  }

  /* Fox image — fills box height, with drop-shadow */
  .szd-hdr-m__fox{
    display:block !important;
    width:auto !important;
    height:38px !important;
    max-height:38px !important;
    object-fit:contain !important;
    object-position:center !important;
    flex-shrink:0 !important;
    margin:0 !important;
    filter:drop-shadow(0 2px 3px rgba(180, 60, 20, 0.28)) drop-shadow(0 1px 1px rgba(0,0,0,0.12)) !important;
  }

  /* Text block — two stacked lines next to fox */
  .szd-hdr-m__text{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    line-height:1.15 !important;
    text-align:right !important;
    margin:0 !important;
    flex-shrink:1 !important;
    min-width:0 !important;
  }
  .szd-hdr-m__text strong{
    display:block !important;
    font-size:13px !important;
    font-weight:900 !important;
    color:var(--szd-ink, #3D2C2E) !important;
    margin:0 !important;
    white-space:nowrap;
  }
  .szd-hdr-m__text small{
    display:block !important;
    font-size:10px !important;
    color:var(--szd-pink-dk, #E0568B) !important;
    font-weight:700 !important;
    margin-top:1px !important;
    white-space:nowrap;
  }
}

/* ========= S6f: bump specificity for fox img (old .szd-hdr-m__logo img display:none was winning) ========= */
.szd-hdr-m__logo img.szd-hdr-m__fox,
.szd-hdr--mob .szd-hdr-m__logo img.szd-hdr-m__fox,
.szd-hdr-m__row .szd-hdr-m__logo img.szd-hdr-m__fox{
  display:block !important;
  width:auto !important;
  height:38px !important;
  max-height:38px !important;
  max-width:42px !important;
  object-fit:contain !important;
  object-position:center !important;
  flex-shrink:0 !important;
  margin:0 !important;
  border-radius:0 !important;
  filter:drop-shadow(0 2px 3px rgba(180, 60, 20, 0.30)) drop-shadow(0 1px 1px rgba(0,0,0,0.12)) !important;
}

/* ========= S7: mobile-header polish (smaller fox, wider search, hide wallet, v8 mockup colors) ========= */
/* ================================================================================
   SHAZDEH — S7 mobile-header polish (match v8 mockup)
   - Smaller fox + lighter shadow
   - Hide wallet button on mobile (mockup has only [cart][search][logo][menu])
   - Wider search box (logo box more compact)
   - Cart icon visually anchored to far left (RTL: leftmost grid column)
   ================================================================================ */

@media (max-width:1023px){

  /* ── Hide mobile wallet (mockup uses only 4 items: cart, search, logo, menu) ── */
  .szd-hdr-m__wallet{
    display:none !important;
  }

  /* ── Grid: 4 columns — RTL visual order [cart | search | logo | menu] ──
       DOM order inside .szd-hdr-m__row is: [menu] [logo] [search] [cart]
       In RTL with grid: col1 is rightmost → menu, col4 is leftmost → cart */
  .szd-hdr-m__row{
    display:grid !important;
    grid-template-columns: 42px minmax(0, 1fr) auto 42px !important;
    grid-template-areas: "menu search logo cart" !important;
    gap:8px !important;
    align-items:center !important;
    padding:8px 12px !important;
  }
  .szd-hdr-m__menu  { grid-area: menu !important; }
  .szd-hdr-m__search{ grid-area: search !important; }
  .szd-hdr-m__logo  { grid-area: logo !important; }
  .szd-hdr-m__cart  { grid-area: cart !important; }

  /* ── Cart icon — solid pink rounded square per v8 mockup ── */
  .szd-hdr-m__btn.szd-hdr-m__cart{
    width:42px !important;
    height:42px !important;
    border-radius:12px !important;
    background:linear-gradient(135deg, #F478A9 0%, #EB5C95 100%) !important;
    border:0 !important;
    box-shadow:0 4px 10px rgba(235, 92, 149, 0.35) !important;
    color:#fff !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .szd-hdr-m__btn.szd-hdr-m__cart svg{
    width:22px !important;
    height:22px !important;
    stroke:#fff !important;
  }
  .szd-hdr-m__badge{
    position:absolute;
    top:-4px;
    right:-4px;
    background:#FFC233 !important;
    color:#3D2C2E !important;
    font-size:10px !important;
    font-weight:900 !important;
    min-width:18px;
    height:18px;
    border-radius:50%;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:2px solid #fff;
  }

  /* ── Menu hamburger — light cream rounded square per mockup ── */
  .szd-hdr-m__btn.szd-hdr-m__menu{
    width:42px !important;
    height:42px !important;
    border-radius:12px !important;
    background:#FFFFFF !important;
    border:1px solid #F2E7E3 !important;
    box-shadow:0 1px 3px rgba(0,0,0,0.05) !important;
    color:#3D2C2E !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .szd-hdr-m__btn.szd-hdr-m__menu svg{
    width:22px !important;
    height:22px !important;
    stroke:#3D2C2E !important;
  }

  /* ── Search — wider pill per mockup ── */
  .szd-hdr-m__search,
  .szd-hdr-m__search.QuickSearchBox{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
  }
  .szd-hdr-m__search .QuickSearchForm,
  .szd-hdr-m__search form{
    width:100% !important;
    margin:0 !important;
  }
  .szd-hdr-m__search .QuickSearchInput{
    width:100% !important;
    position:relative !important;
    background:#FFFFFF !important;
    border:1px solid #F2E7E3 !important;
    border-radius:14px !important;
    box-shadow:0 1px 3px rgba(0,0,0,0.04) !important;
    padding:0 !important;
    height:42px !important;
    display:flex !important;
    align-items:center !important;
  }
  .szd-hdr-m__search .QuickSearchInputText{
    width:100% !important;
    height:40px !important;
    padding:0 14px 0 40px !important;
    border:0 !important;
    background:transparent !important;
    font-size:12px !important;
    font-family:'Vazirmatn','Tahoma',sans-serif !important;
    color:#3D2C2E !important;
    outline:0 !important;
    text-align:right !important;
  }
  .szd-hdr-m__search .QuickSearchInputText::placeholder{
    color:#A89A98 !important;
    font-size:12px !important;
  }
  .szd-hdr-m__search .QuickSearchBtnSearch{
    position:absolute !important;
    left:8px !important;
    right:auto !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    width:28px !important;
    height:28px !important;
    background:transparent !important;
    color:#E0568B !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    cursor:pointer;
  }
  .szd-hdr-m__search .QuickSearchBtnSearch::before{
    content:"" !important;
    display:block !important;
    width:18px !important;
    height:18px !important;
    -webkit-mask-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
    -webkit-mask-size:contain !important;
    mask-size:contain !important;
    -webkit-mask-repeat:no-repeat !important;
    mask-repeat:no-repeat !important;
    -webkit-mask-position:center !important;
    mask-position:center !important;
    background-color:#E0568B !important;
  }

  /* ── Logo box — more compact so search has room; fox SMALLER + lighter shadow ── */
  .szd-hdr-m__logo{
    padding:3px 8px 3px 6px !important;
    min-height:42px !important;
    height:42px !important;
    max-width:128px !important;
    gap:6px !important;
    border-radius:12px !important;
    box-shadow:
      0 1px 2px rgba(220, 90, 30, 0.05),
      0 2px 6px rgba(220, 90, 30, 0.06) !important;
  }
  .szd-hdr-m__logo img.szd-hdr-m__fox,
  .szd-hdr--mob .szd-hdr-m__logo img.szd-hdr-m__fox,
  .szd-hdr-m__row .szd-hdr-m__logo img.szd-hdr-m__fox{
    height:28px !important;       /* was 38px */
    max-height:28px !important;
    max-width:32px !important;
    filter:drop-shadow(0 1px 1.5px rgba(180, 60, 20, 0.18)) !important;  /* lighter + smaller shadow */
  }
  .szd-hdr-m__text strong{
    font-size:12px !important;
    line-height:1.1 !important;
  }
  .szd-hdr-m__text small{
    font-size:9px !important;
    line-height:1.1 !important;
    margin-top:1px !important;
  }
}

/* ========= S7a: area swap (search?logo) ========= */
/* ================================================================================
   SHAZDEH — S7 mobile-header polish (match v8 mockup)
   - Smaller fox + lighter shadow
   - Hide wallet button on mobile (mockup has only [cart][search][logo][menu])
   - Wider search box (logo box more compact)
   - Cart icon visually anchored to far left (RTL: leftmost grid column)
   ================================================================================ */

@media (max-width:1023px){

  /* ── Hide mobile wallet (mockup uses only 4 items: cart, search, logo, menu) ── */
  .szd-hdr-m__wallet{
    display:none !important;
  }

  /* ── Grid: 4 columns — RTL visual order [cart | search | logo | menu] ──
       DOM order inside .szd-hdr-m__row is: [menu] [logo] [search] [cart]
       In RTL with grid: col1 is rightmost → menu, col4 is leftmost → cart */
  .szd-hdr-m__row{
    display:grid !important;
    grid-template-columns: 42px auto minmax(0, 1fr) 42px !important;
    /* RTL flips visually: source "menu logo search cart" → visual L→R "cart search logo menu" */
    grid-template-areas: "menu logo search cart" !important;
    gap:8px !important;
    align-items:center !important;
    padding:8px 12px !important;
  }
  .szd-hdr-m__menu  { grid-area: menu !important; }
  .szd-hdr-m__search{ grid-area: search !important; }
  .szd-hdr-m__logo  { grid-area: logo !important; }
  .szd-hdr-m__cart  { grid-area: cart !important; }

  /* ── Cart icon — solid pink rounded square per v8 mockup ── */
  .szd-hdr-m__btn.szd-hdr-m__cart{
    width:42px !important;
    height:42px !important;
    border-radius:12px !important;
    background:linear-gradient(135deg, #F478A9 0%, #EB5C95 100%) !important;
    border:0 !important;
    box-shadow:0 4px 10px rgba(235, 92, 149, 0.35) !important;
    color:#fff !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .szd-hdr-m__btn.szd-hdr-m__cart svg{
    width:22px !important;
    height:22px !important;
    stroke:#fff !important;
  }
  .szd-hdr-m__badge{
    position:absolute;
    top:-4px;
    right:-4px;
    background:#FFC233 !important;
    color:#3D2C2E !important;
    font-size:10px !important;
    font-weight:900 !important;
    min-width:18px;
    height:18px;
    border-radius:50%;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:2px solid #fff;
  }

  /* ── Menu hamburger — light cream rounded square per mockup ── */
  .szd-hdr-m__btn.szd-hdr-m__menu{
    width:42px !important;
    height:42px !important;
    border-radius:12px !important;
    background:#FFFFFF !important;
    border:1px solid #F2E7E3 !important;
    box-shadow:0 1px 3px rgba(0,0,0,0.05) !important;
    color:#3D2C2E !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .szd-hdr-m__btn.szd-hdr-m__menu svg{
    width:22px !important;
    height:22px !important;
    stroke:#3D2C2E !important;
  }

  /* ── Search — wider pill per mockup ── */
  .szd-hdr-m__search,
  .szd-hdr-m__search.QuickSearchBox{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
  }
  .szd-hdr-m__search .QuickSearchForm,
  .szd-hdr-m__search form{
    width:100% !important;
    margin:0 !important;
  }
  .szd-hdr-m__search .QuickSearchInput{
    width:100% !important;
    position:relative !important;
    background:#FFFFFF !important;
    border:1px solid #F2E7E3 !important;
    border-radius:14px !important;
    box-shadow:0 1px 3px rgba(0,0,0,0.04) !important;
    padding:0 !important;
    height:42px !important;
    display:flex !important;
    align-items:center !important;
  }
  .szd-hdr-m__search .QuickSearchInputText{
    width:100% !important;
    height:40px !important;
    padding:0 14px 0 40px !important;
    border:0 !important;
    background:transparent !important;
    font-size:12px !important;
    font-family:'Vazirmatn','Tahoma',sans-serif !important;
    color:#3D2C2E !important;
    outline:0 !important;
    text-align:right !important;
  }
  .szd-hdr-m__search .QuickSearchInputText::placeholder{
    color:#A89A98 !important;
    font-size:12px !important;
  }
  .szd-hdr-m__search .QuickSearchBtnSearch{
    position:absolute !important;
    left:8px !important;
    right:auto !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    width:28px !important;
    height:28px !important;
    background:transparent !important;
    color:#E0568B !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    cursor:pointer;
  }
  .szd-hdr-m__search .QuickSearchBtnSearch::before{
    content:"" !important;
    display:block !important;
    width:18px !important;
    height:18px !important;
    -webkit-mask-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
    mask-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
    -webkit-mask-size:contain !important;
    mask-size:contain !important;
    -webkit-mask-repeat:no-repeat !important;
    mask-repeat:no-repeat !important;
    -webkit-mask-position:center !important;
    mask-position:center !important;
    background-color:#E0568B !important;
  }

  /* ── Logo box — more compact so search has room; fox SMALLER + lighter shadow ── */
  .szd-hdr-m__logo{
    padding:3px 8px 3px 6px !important;
    min-height:42px !important;
    height:42px !important;
    max-width:128px !important;
    gap:6px !important;
    border-radius:12px !important;
    box-shadow:
      0 1px 2px rgba(220, 90, 30, 0.05),
      0 2px 6px rgba(220, 90, 30, 0.06) !important;
  }
  .szd-hdr-m__logo img.szd-hdr-m__fox,
  .szd-hdr--mob .szd-hdr-m__logo img.szd-hdr-m__fox,
  .szd-hdr-m__row .szd-hdr-m__logo img.szd-hdr-m__fox{
    height:28px !important;       /* was 38px */
    max-height:28px !important;
    max-width:32px !important;
    filter:drop-shadow(0 1px 1.5px rgba(180, 60, 20, 0.18)) !important;  /* lighter + smaller shadow */
  }
  .szd-hdr-m__text strong{
    font-size:12px !important;
    line-height:1.1 !important;
  }
  .szd-hdr-m__text small{
    font-size:9px !important;
    line-height:1.1 !important;
    margin-top:1px !important;
  }
}

/* ========= S7: mobile layout + sticky + ticker recolor + rotating pill ========= */
/* ================================================================================
   SHAZDEH — S7: Mobile header restructure + sticky + ticker recolor + rotating pill
   ============================================================================== */

/* ----------------------------------------------------------------------
   STICKY HEADERS — utility bar + main header stay pinned on scroll
   ---------------------------------------------------------------------- */
.szd-utility-bar,
.szd-hdr--mob,
.szd-hdr--desk{
  position:sticky !important;
  z-index:60 !important;
  background-clip:padding-box;
}
.szd-utility-bar{ top:0 !important; z-index:62 !important; }
.szd-hdr--mob{ top:36px !important; z-index:61 !important; }   /* below utility bar */
.szd-hdr--desk{ top:40px !important; z-index:61 !important; }
.szd-tkr{
  position:sticky !important;
  z-index:59 !important;
  top:96px !important;   /* below mobile utility + header */
}

/* Make sure no ancestor breaks sticky with overflow:hidden */
.header-container,
#st_header,
.header-container .row,
.st-pusher,
.st-container,
.st-content,
.st-content-inner,
#body_wrapper,
#page_wrapper{
  overflow:visible !important;
}

/* ----------------------------------------------------------------------
   MOBILE HEADER LAYOUT
   Order (visual RTL right→left): hamburger | logo (fox+text, no box) | search | cart
   ---------------------------------------------------------------------- */
@media (max-width:1023px){

  .szd-hdr--mob{
    background:#FFFFFF !important;
    border-bottom:1px solid rgba(0,0,0,0.05);
    box-shadow:0 2px 8px rgba(0,0,0,0.04);
  }
  .szd-hdr-m__row{
    display:grid !important;
    /* RTL: column 1 = right, column 5 = left
       hamburger(46) | logo(auto) | search(1fr) | cart(46) */
    grid-template-columns:46px auto 1fr 46px !important;
    gap:10px !important;
    padding:8px 10px !important;
    align-items:center !important;
  }

  /* HIDE the mobile wallet button (S7 — user wants only menu/logo/search/cart) */
  .szd-hdr-m__wallet{
    display:none !important;
  }

  /* HAMBURGER MENU — in a soft cream box */
  .szd-hdr-m__menu{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:46px !important;
    height:46px !important;
    background:#FFF5EC !important;
    border:1px solid #F2E3D6 !important;
    border-radius:14px !important;
    color:#3D2C2E !important;
    box-shadow:0 2px 6px rgba(220, 90, 30, 0.06) !important;
    padding:0 !important;
  }
  .szd-hdr-m__menu svg{
    width:24px !important;
    height:24px !important;
    stroke:#3D2C2E !important;
    stroke-width:2.5 !important;
  }

  /* LOGO — NO BOX. Just fox + text side-by-side. */
  .szd-hdr-m__logo{
    display:flex !important;
    flex-direction:row-reverse !important;  /* RTL: text left, fox right */
    align-items:center !important;
    gap:8px !important;
    text-decoration:none !important;
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    padding:0 !important;
    margin:0 !important;
    min-height:0 !important;
    height:auto !important;
    box-shadow:none !important;
    overflow:visible !important;
  }
  /* Hide any leftover ::after / mark / non-fox img */
  .szd-hdr-m__logo::after,
  .szd-hdr-m__logo::before{
    content:none !important;
    display:none !important;
    background:none !important;
  }
  .szd-hdr-m__mark,
  .szd-hdr-m__logo-img,
  .szd-hdr-m__logo > svg{
    display:none !important;
  }

  /* FOX — full size, with drop-shadow */
  .szd-hdr-m__logo img.szd-hdr-m__fox,
  .szd-hdr--mob .szd-hdr-m__logo img.szd-hdr-m__fox,
  .szd-hdr-m__row .szd-hdr-m__logo img.szd-hdr-m__fox{
    display:block !important;
    width:auto !important;
    height:42px !important;
    max-height:42px !important;
    max-width:44px !important;
    object-fit:contain !important;
    border:0 !important;
    border-radius:0 !important;
    margin:0 !important;
    padding:0 !important;
    flex-shrink:0 !important;
    background:transparent !important;
    filter:drop-shadow(0 2px 3px rgba(180, 60, 20, 0.30)) drop-shadow(0 1px 1px rgba(0,0,0,0.12)) !important;
  }

  /* TEXT — two lines next to fox */
  .szd-hdr-m__text{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    line-height:1.15 !important;
    text-align:right !important;
    margin:0 !important;
    padding:0 !important;
    min-width:0 !important;
  }
  .szd-hdr-m__text strong{
    display:block !important;
    font-size:13px !important;
    font-weight:900 !important;
    color:#3D2C2E !important;
    margin:0 !important;
    white-space:nowrap;
  }
  .szd-hdr-m__text small{
    display:block !important;
    font-size:10px !important;
    color:#E0568B !important;
    font-weight:700 !important;
    margin-top:1px !important;
    white-space:nowrap;
  }

  /* SEARCH BOX — soft shadow, no gray border */
  .szd-hdr-m__search,
  .szd-hdr-m__search.QuickSearchBox{
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    min-width:0 !important;
    width:100% !important;
  }
  .szd-hdr-m__search .QuickSearchInput{
    background:#FFFFFF !important;
    border:0 !important;
    border-radius:14px !important;
    box-shadow:
      0 1px 2px rgba(0,0,0,0.05),
      0 3px 10px rgba(220, 90, 30, 0.10) !important;
    padding:0 !important;
    height:42px !important;
    position:relative !important;
    overflow:hidden;
  }
  .szd-hdr-m__search .QuickSearchInputText{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    width:100% !important;
    height:42px !important;
    padding:0 38px 0 12px !important;
    font-size:13px !important;
    color:#3D2C2E !important;
    direction:rtl !important;
  }
  .szd-hdr-m__search .QuickSearchInputText::placeholder{
    color:#9B7A6E !important;
    font-size:12px !important;
  }
  .szd-hdr-m__search .QuickSearchBtnSearch{
    position:absolute !important;
    top:50% !important; transform:translateY(-50%) !important;
    right:6px !important; left:auto !important;
    width:32px !important; height:32px !important;
    background:#FFE3EC !important;
    border-radius:10px !important;
    border:0 !important;
    cursor:pointer;
    display:flex !important; align-items:center !important; justify-content:center !important;
  }
  .szd-hdr-m__search .QuickSearchBtnSearch::before{
    content:"" !important;
    width:14px; height:14px;
    background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E0568B' stroke-width='2.5'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
    background-size:contain;
    background-repeat:no-repeat;
  }

  /* CART — kept on visual LEFT (last child in RTL grid) */
  .szd-hdr-m__cart{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:46px !important;
    height:46px !important;
    background:linear-gradient(135deg, #FF6B9D, #E0568B) !important;
    border:0 !important;
    border-radius:14px !important;
    color:#FFFFFF !important;
    box-shadow:0 4px 12px rgba(224, 86, 139, 0.30) !important;
    position:relative;
    padding:0 !important;
  }
  .szd-hdr-m__cart svg{
    width:22px !important;
    height:22px !important;
    stroke:#FFFFFF !important;
    stroke-width:2.5 !important;
  }
  .szd-hdr-m__badge{
    position:absolute !important;
    top:-4px !important; left:-4px !important; right:auto !important;
    min-width:18px; height:18px;
    border-radius:9px;
    background:#FFD000;
    color:#3D2C2E;
    font-size:10px;
    font-weight:900;
    display:flex;
    align-items:center;
    justify-content:center;
    border:2px solid #FFFFFF;
    padding:0 4px;
  }
}

/* ----------------------------------------------------------------------
   TICKER COLOR — match main header (white/cream) so the bars feel unified
   ---------------------------------------------------------------------- */
.szd-tkr,
.szd-ticker-bar{
  background:#FFFFFF !important;
  background-image:linear-gradient(90deg, #FFFFFF 0%, #FFF8F0 100%) !important;
  color:#3D2C2E !important;
  border-top:1px solid rgba(0,0,0,0.05) !important;
  border-bottom:1px solid rgba(0,0,0,0.06) !important;
}
.szd-tkr__a{ color:#E0568B !important; }
.szd-tkr__sep{ color:#FF8C42 !important; opacity:0.5 !important; }

/* ----------------------------------------------------------------------
   ROTATING PILL (top utility bar) — slide+fade animation between messages
   ---------------------------------------------------------------------- */
.szd-rotpill{
  position:relative !important;
  display:inline-flex !important;
  align-items:center !important;
  min-height:24px;
  min-width:200px;
  overflow:hidden;
}
.szd-rotpill__slot{
  position:absolute !important;
  inset:0;
  display:inline-flex !important;
  align-items:center !important;
  gap:6px;
  white-space:nowrap;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .35s ease, transform .35s ease;
  pointer-events:none;
}
.szd-rotpill__slot.--on{
  opacity:1 !important;
  transform:translateY(0) !important;
  pointer-events:auto !important;
}
.szd-rotpill__slot.--off{
  opacity:0 !important;
  transform:translateY(-8px) !important;
}
.szd-rotpill__icon{
  font-size:14px;
  line-height:1;
  flex-shrink:0;
}
.szd-rotpill__text{
  color:inherit !important;
  text-decoration:none !important;
  font-weight:700;
}
.szd-rotpill__text:hover{
  text-decoration:underline !important;
  opacity:.85;
}

/* On mobile the rotating pill needs slightly different width */
@media (max-width:767px){
  .szd-rotpill{
    min-width:170px;
    font-size:11px;
  }
  .szd-rotpill__icon{ font-size:12px; }
}

/* ========= S7c: constrain logo width so search box gets more room ========= */
@media (max-width:1023px){
  .szd-hdr-m__row{
    grid-template-columns:46px 130px 1fr 46px !important;
  }
  .szd-hdr-m__logo{
    max-width:130px !important;
    overflow:hidden;
  }
  .szd-hdr-m__text strong{font-size:12px !important}
  .szd-hdr-m__text small{font-size:9px !important}
  .szd-hdr-m__logo img.szd-hdr-m__fox{
    height:38px !important;
    max-height:38px !important;
    max-width:40px !important;
  }
}

/* ========= S7d: tighter mobile-header sizes so everything fits 340px viewport ========= */
@media (max-width:1023px){
  .szd-hdr-m__row{
    grid-template-columns:42px 118px minmax(60px, 1fr) 42px !important;
    gap:6px !important;
    padding:6px 8px !important;
  }
  .szd-hdr-m__menu, .szd-hdr-m__cart{
    width:42px !important; height:42px !important;
    border-radius:12px !important;
  }
  .szd-hdr-m__logo{
    max-width:118px !important;
    gap:6px !important;
  }
  .szd-hdr-m__logo img.szd-hdr-m__fox{
    height:36px !important; max-height:36px !important; max-width:36px !important;
  }
  .szd-hdr-m__text strong{font-size:11px !important; letter-spacing:-0.2px}
  .szd-hdr-m__text small{font-size:9px !important}
  .szd-hdr-m__search .QuickSearchInput{
    height:38px !important;
  }
  .szd-hdr-m__search .QuickSearchInputText{
    height:38px !important;
    padding:0 34px 0 8px !important;
    font-size:12px !important;
  }
}

/* ========= S7e: ticker sticky (override inline-style position:relative) + tighter row ========= */
.szd-tkr,
.szd-hdr--mob ~ .szd-tkr,
body .szd-tkr{
  position:sticky !important;
  top:80px !important;     /* below utility(~36) + mobile header(~46) */
  z-index:59 !important;
}
@media (max-width:1023px){
  .szd-hdr-m__row{
    grid-template-columns:40px 108px minmax(50px, 1fr) 40px !important;
    gap:5px !important;
    padding:5px 6px !important;
  }
  .szd-hdr-m__menu, .szd-hdr-m__cart{
    width:40px !important; height:40px !important;
  }
  .szd-hdr-m__logo{ max-width:108px !important; }
  .szd-hdr-m__logo img.szd-hdr-m__fox{
    height:34px !important; max-height:34px !important; max-width:34px !important;
  }
  .szd-hdr--mob{ top:34px !important; }   /* below utility bar */
}

/* ========= S7f: TRUE sticky (position:fixed) + fade line below ticker + more spacing ========= */

/* ---- TRUE STICKY: use position:fixed on the WHOLE header wrapper so it never scrolls away ---- */
.header-container,
#st_header{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  z-index:9999 !important;
  background:transparent !important;
  margin:0 !important;
  overflow:visible !important;
}
/* Spacer so page content doesn't slide under fixed header */
#body_wrapper{
  padding-top:120px !important;   /* utility(36) + main(56) + ticker(28) = ~120px */
}
@media (max-width:1023px){
  #body_wrapper{ padding-top:152px !important; }
}
/* Make sure utility bar stays on top of the header stack */
.szd-utility-bar{
  position:relative !important;   /* inside fixed wrapper, no need to be sticky itself */
  top:auto !important;
  z-index:3 !important;
}
.szd-hdr--mob, .szd-hdr--desk{
  position:relative !important;
  top:auto !important;
  z-index:2 !important;
}
/* Ticker also part of the sticky stack � move it INTO the fixed header */
.szd-tkr{
  position:relative !important;
  top:auto !important;
  z-index:1 !important;
}

/* ---- TICKER: add fade-edge LINE below, dividing it from main content ---- */
.szd-tkr{
  border-bottom:0 !important;
  position:relative !important;
}
.szd-tkr::after{
  content:'' !important;
  position:absolute !important;
  left:0 !important; right:0 !important; bottom:-1px !important;
  height:1px !important;
  background:linear-gradient(to right,
    transparent 0%,
    rgba(220, 90, 30, 0.18) 20%,
    rgba(220, 90, 30, 0.28) 50%,
    rgba(220, 90, 30, 0.18) 80%,
    transparent 100%) !important;
  pointer-events:none !important;
  z-index:10 !important;
}

/* ---- MORE SPACING in mobile header ---- */
@media (max-width:1023px){
  .szd-hdr-m__row{
    grid-template-columns:42px 110px minmax(60px,1fr) 42px !important;
    gap:10px !important;     /* was 5px � much more breathing room */
    padding:8px 10px !important;
  }
  .szd-hdr-m__menu, .szd-hdr-m__cart{
    width:42px !important; height:42px !important;
  }
  .szd-hdr-m__logo{
    max-width:110px !important;
    gap:6px !important;
  }
  .szd-hdr-m__logo img.szd-hdr-m__fox{
    height:36px !important; max-height:36px !important; max-width:36px !important;
  }
}

/* ========= S7f: cart visibility + utility-bar overflow fix ========= */
/* ================================================================================
   SHAZDEH — S7f: Fix cart not visible + username overflowing utility-bar
   ================================================================================ */

/* ---------- UTILITY BAR: keep all items inside, prevent overflow ---------- */
.szd-utility-bar{
  overflow:hidden;
  white-space:nowrap;
}
.szd-utility-bar__row{
  display:flex !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:6px !important;
  width:100% !important;
  min-width:0 !important;
  padding:4px 8px !important;
  box-sizing:border-box;
}
.szd-utility-bar__left,
.szd-utility-bar__right{
  display:flex !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  gap:8px;
  min-width:0 !important;
  flex-shrink:1 !important;
}
/* Username link must stay on one line, truncate if needed */
.szd-utility-bar__login,
.szd-utility-bar__link{
  white-space:nowrap !important;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:120px;
  display:inline-block;
}
/* On mobile, hide some less-critical links */
@media (max-width:767px){
  .szd-utility-bar__link:not(.szd-utility-bar__login){
    display:none !important;   /* hide order-tracking, help links on narrow */
  }
  .szd-utility-bar__phone{ display:none !important; }   /* phone hidden, support is in rotating pill */
  .szd-utility-bar__guarantee{ display:none !important; }
  .szd-utility-bar__login{ max-width:110px; }
  .szd-rotpill{ min-width:140px !important; max-width:55vw; }
  .szd-rotpill__slot{ font-size:11px !important; }
}

/* ---------- MOBILE HEADER: guarantee cart is visible (override any prior display:none) ---------- */
@media (max-width:1023px){
  .szd-hdr--mob{
    display:block !important;
  }
  .szd-hdr-m__row{
    display:grid !important;
    /* RTL columns from right→left: hamburger | logo | search | cart */
    grid-template-columns: 40px minmax(96px, 108px) minmax(40px, 1fr) 40px !important;
    gap:5px !important;
    padding:5px 6px !important;
    width:100% !important;
    box-sizing:border-box !important;
    align-items:center;
  }
  /* Cart MUST be visible */
  .szd-hdr-m__cart{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
    width:40px !important;
    height:40px !important;
    background:linear-gradient(135deg, #FF6B9D, #E0568B) !important;
    border:0 !important;
    border-radius:12px !important;
    color:#FFFFFF !important;
    box-shadow:0 3px 10px rgba(224, 86, 139, 0.30) !important;
    align-items:center;
    justify-content:center;
    position:relative;
    padding:0 !important;
    margin:0 !important;
    text-decoration:none !important;
    flex-shrink:0;
  }
  .szd-hdr-m__cart svg{
    width:20px !important;
    height:20px !important;
    stroke:#FFFFFF !important;
    stroke-width:2.5 !important;
  }
}

/* ========= S7g: flex layout � keeps cart visible even at 200px viewport ========= */
@media (max-width:1023px){
  .szd-hdr-m__row{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:4px !important;
    padding:5px 6px !important;
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    overflow:hidden;
  }
  /* Fixed-width buttons � never shrink */
  .szd-hdr-m__menu,
  .szd-hdr-m__cart{
    flex:0 0 38px !important;
    width:38px !important;
    height:38px !important;
    border-radius:11px !important;
  }
  .szd-hdr-m__menu svg, .szd-hdr-m__cart svg{
    width:19px !important; height:19px !important;
  }
  /* Logo � can shrink if needed but caps at 110px */
  .szd-hdr-m__logo{
    flex:0 1 auto !important;
    max-width:115px !important;
    min-width:0 !important;
    overflow:hidden;
  }
  .szd-hdr-m__logo img.szd-hdr-m__fox{
    height:32px !important; max-height:32px !important; max-width:32px !important;
  }
  .szd-hdr-m__text strong{font-size:11px !important; letter-spacing:-0.3px}
  .szd-hdr-m__text small{font-size:9px !important}
  /* Search � grows to fill, shrinks to nothing */
  .szd-hdr-m__search,
  .szd-hdr-m__search.QuickSearchBox{
    flex:1 1 0 !important;
    min-width:36px !important;
    width:auto !important;
  }
  .szd-hdr-m__search .QuickSearchInput{ height:36px !important; }
  .szd-hdr-m__search .QuickSearchInputText{
    height:36px !important;
    padding:0 32px 0 6px !important;
    font-size:11px !important;
  }
  /* Hide wallet (already done but reinforce) */
  .szd-hdr-m__wallet{ display:none !important; }
}

/* ========= S7h: explicit RTL direction on header row � cart belongs on visual LEFT ========= */
@media (max-width:1023px){
  .szd-hdr-m__row{
    direction:rtl !important;
  }
  /* Make sure children DON'T inherit row-reverse from any old rules */
  .szd-hdr--mob .szd-hdr-m__row{
    flex-direction:row !important;
  }
}

/* ========= S7k: EXPLICIT ORDER lock � forces visual L?R: cart, search, logo, menu ========= */
@media (max-width:1023px){
  /* Force LTR layout on the row, lock each element by explicit order */
  .szd-hdr-m__row{
    direction:ltr !important;
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:5px !important;
    padding:5px 6px !important;
    width:100% !important;
    box-sizing:border-box !important;
  }
  /* Visual order L?R = cart(1), search(2), logo(3), menu(4) */
  .szd-hdr--mob .szd-hdr-m__cart{   order:1 !important; flex:0 0 38px !important; display:flex !important; }
  .szd-hdr--mob .szd-hdr-m__search{ order:2 !important; flex:1 1 auto !important; min-width:40px !important; }
  .szd-hdr--mob .szd-hdr-m__logo{   order:3 !important; flex:0 1 auto !important; max-width:115px !important; }
  .szd-hdr--mob .szd-hdr-m__wallet{ order:5 !important; display:none !important; }
  .szd-hdr--mob .szd-hdr-m__menu{   order:4 !important; flex:0 0 38px !important; display:flex !important; }

  /* Inside logo: text LEFT, fox RIGHT � use LTR + order */
  .szd-hdr-m__logo{
    direction:ltr !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:6px !important;
  }
  .szd-hdr-m__logo .szd-hdr-m__text{ order:1 !important; direction:rtl !important; text-align:right !important; }
  .szd-hdr-m__logo .szd-hdr-m__fox{  order:2 !important; }
}

/* TICKER: force white bg even when inline-style sets orange (DB defaults) */
.szd-tkr{
  background:#FFFFFF !important;
  background-image:linear-gradient(90deg, #FFFFFF 0%, #FFF8F0 100%) !important;
}

/* ========= S7m: fix 35px right-inset � html/body must fill full viewport ========= */
html, body{
  width:100% !important;
  min-width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  overflow-x:hidden !important;
}
#st-container, .st-pusher, .st-content, .st-content-inner,
#body_wrapper, #page_wrapper, .header-container{
  width:100% !important;
  max-width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
  padding-left:0 !important;
  padding-right:0 !important;
}
/* Sidebar (delivery options) must NEVER cause horizontal overflow */
.sidebar, #sidebar-right, .siderbar-container{
  right:-9999px !important;
  left:auto !important;
  position:fixed !important;
  top:0 !important;
  display:none !important;
}
.sidebar.active, #sidebar-right.active{
  display:block !important;
  right:0 !important;
}

/* ========= S8: bottom nav exact-port from v8 mockup ========= */
/* ================================================================================
   SHAZDEH — Bottom Nav (.szd-bnav) — exact port of v8 mockup
   Notched white pill, 4 items + center chat FAB with breathing animation.
   Visible on mobile only (<=1023px).
   ================================================================================ */

/* Hide on desktop */
@media (min-width:1024px){
  .szd-bnav{ display:none !important; }
}

/* Add bottom padding to body so content isn't covered by fixed nav */
@media (max-width:1023px){
  body{
    padding-bottom:calc(82px + 24px) !important;
  }
}

/* === NAV CONTAINER === */
.szd-bnav{
  position:fixed !important;
  bottom:14px !important;
  left:0 !important;
  right:0 !important;
  margin:0 auto !important;
  width:calc(100% - 28px) !important;
  max-width:402px !important;
  height:82px !important;
  z-index:60 !important;
  pointer-events:none !important;
  direction:ltr !important;  /* lock layout independent of page RTL */
}

/* === NOTCHED PILL SHAPE === */
.szd-bnav__shape{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  display:block !important;
  pointer-events:auto !important;
  filter: drop-shadow(0 8px 22px rgba(45,28,32,.18)) drop-shadow(0 2px 6px rgba(45,28,32,.08)) !important;
}
.szd-bnav__shape path{
  fill:rgba(255,255,255,.92) !important;
  stroke:rgba(255,255,255,.55) !important;
  stroke-width:.5 !important;
}

/* === ITEMS ROW (5-col grid: 1fr 1fr 96px 1fr 1fr — center is notch slot) === */
.szd-bnav__row{
  position:relative !important;
  z-index:2 !important;
  height:100% !important;
  display:grid !important;
  grid-template-columns: 1fr 1fr 96px 1fr 1fr !important;
  align-items:center !important;
  padding:20px 14px 10px !important;
  pointer-events:none !important;
}

/* === ITEM === */
.szd-bnav__item{
  pointer-events:auto !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  gap:4px !important;
  font-size:10.5px !important;
  font-weight:700 !important;
  font-family:'Vazirmatn','Tahoma',sans-serif !important;
  color:#7B6B6D !important;
  padding:4px 0 !important;
  cursor:pointer !important;
  transition:color .25s !important;
  text-decoration:none !important;
  background:transparent !important;
  border:0 !important;
}
.szd-bnav__item.on{ color:#E0568B !important; }
.szd-bnav__item:hover{ color:#E0568B !important; }
.szd-bnav__item span{
  font-family:'Vazirmatn','Tahoma',sans-serif !important;
  line-height:1 !important;
}

/* === ICON (with subtle bounce on tap) === */
.szd-bnav__icon{
  width:24px !important;
  height:24px !important;
  transition:transform .35s cubic-bezier(.34, 1.4, .6, 1) !important;
  transform-origin:center bottom !important;
  will-change:transform !important;
  flex-shrink:0 !important;
}
.szd-bnav__item:active .szd-bnav__icon{
  transform:translateY(-6px) scale(1.15) !important;
}

/* === NOTCH SLOT (center, empty — holds the chat FAB visually) === */
.szd-bnav__notch-slot{
  display:block !important;
}

/* === CHAT FAB (floats above the notch) === */
.szd-bnav__chat{
  pointer-events:auto !important;
  position:absolute !important;
  left:50% !important;
  top:0 !important;
  transform:translateX(-50%) !important;
  z-index:10 !important;
  width:68px !important;
  height:68px !important;
  border-radius:50% !important;
  background:linear-gradient(135deg, #3DA39B 0%, #6FD3CB 100%) !important;
  color:#FFFFFF !important;
  border:0 !important;
  cursor:pointer !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-shadow:
    0 8px 18px rgba(61,163,155,.38),
    0 3px 6px rgba(0,0,0,.06),
    inset 0 1px 0 rgba(255,255,255,.25) !important;
  animation:szd-chat-breath 5s ease-in-out infinite !important;
  padding:0 !important;
  margin:0 !important;
}
.szd-bnav__chat:active{
  animation:none !important;
  transform:translateX(-50%) scale(.92) !important;
}
.szd-bnav__chat svg{
  width:28px !important;
  height:28px !important;
  color:#FFFFFF !important;
  stroke:#FFFFFF !important;
}

/* Online indicator dot (top-right of chat button) */
.szd-bnav__chat-dot{
  position:absolute !important;
  top:5px !important;
  right:5px !important;
  width:10px !important;
  height:10px !important;
  border-radius:50% !important;
  background:#A8DFA8 !important;
  border:2px solid #FFFFFF !important;
  animation:szd-online-soft 3s ease-in-out infinite !important;
}

/* Pulse ring around chat button */
.szd-bnav__chat-ring{
  position:absolute !important;
  inset:-3px !important;
  border-radius:50% !important;
  border:2px solid #6FD3CB !important;
  opacity:0 !important;
  animation:szd-chat-ring-soft 4s ease-out infinite !important;
  pointer-events:none !important;
}

/* === ANIMATIONS === */
@keyframes szd-chat-breath{
  0%, 100% {
    transform:translateX(-50%) scale(1);
    box-shadow:0 8px 18px rgba(61,163,155,.38), 0 3px 6px rgba(0,0,0,.06), inset 0 1px 0 rgba(255,255,255,.25);
  }
  50% {
    transform:translateX(-50%) scale(1.018);
    box-shadow:0 10px 20px rgba(61,163,155,.42), 0 3px 6px rgba(0,0,0,.07), inset 0 1px 0 rgba(255,255,255,.3);
  }
}
@keyframes szd-chat-ring-soft{
  0%   { opacity:.28; transform:scale(1); }
  80%, 100% { opacity:0; transform:scale(1.35); }
}
@keyframes szd-online-soft{
  0%, 80%, 100% { opacity:1; }
  40% { opacity:.55; }
}

/* === Reduced motion === */
@media (prefers-reduced-motion: reduce){
  .szd-bnav__chat,
  .szd-bnav__chat-dot,
  .szd-bnav__chat-ring{
    animation:none !important;
  }
}

/* ========= S8b: GLASS bottom nav + Goftino integration + prompt bubble ========= */
/* ================================================================================
   SHAZDEH — Bottom Nav GLASS edition (.szd-bnav)
   Glassy notched pill + 4 items + center chat FAB with Goftino integration.
   Mobile only (<=1023px).
   ================================================================================ */

/* Hide native Goftino launcher (CSS fallback even before JS init) */
#goftino_w,
.goftino-chat-widget,
.goftino-widget-launcher,
iframe[src*="goftino.com"][src*="launcher"],
[id*="goftino"][id*="launcher"]:not(.szd-bnav__chat),
[class*="goftino"][class*="launcher"]:not(.szd-bnav__chat){
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}
/* Keep open chat window visible */
#goftino-w-chat[style*="display: block"],
.goftino-chat-window{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
}

/* Hide on desktop */
@media (min-width:1024px){
  .szd-bnav{ display:none !important; }
}

/* Add bottom padding to body on mobile (so content not covered by fixed nav) */
@media (max-width:1023px){
  body{ padding-bottom:calc(82px + 26px) !important; }
}

/* === NAV CONTAINER === */
.szd-bnav{
  position:fixed !important;
  bottom:14px !important;
  left:0 !important;
  right:0 !important;
  margin:0 auto !important;
  width:calc(100% - 28px) !important;
  max-width:402px !important;
  height:82px !important;
  z-index:60 !important;
  pointer-events:none !important;
  direction:ltr !important;
}

/* === GLASS BACKING (clipped to SVG shape via mask-image) === */
.szd-bnav__glass{
  position:absolute !important;
  inset:0 !important;
  pointer-events:auto !important;
  /* The mask uses the same notched path so the blur clips perfectly to the pill */
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 82' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M 24 16 L 140 16 C 160 16, 168 28, 178 42 C 188 58, 194 68, 200 68 C 206 68, 212 58, 222 42 C 232 28, 240 16, 260 16 L 376 16 Q 400 16, 400 40 L 400 58 Q 400 82, 376 82 L 24 82 Q 0 82, 0 58 L 0 40 Q 0 16, 24 16 Z'/%3E%3C/svg%3E") !important;
  -webkit-mask-size: 100% 100% !important;
  -webkit-mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 82' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M 24 16 L 140 16 C 160 16, 168 28, 178 42 C 188 58, 194 68, 200 68 C 206 68, 212 58, 222 42 C 232 28, 240 16, 260 16 L 376 16 Q 400 16, 400 40 L 400 58 Q 400 82, 376 82 L 24 82 Q 0 82, 0 58 L 0 40 Q 0 16, 24 16 Z'/%3E%3C/svg%3E") !important;
  mask-size: 100% 100% !important;
  mask-repeat: no-repeat !important;
  mask-position: center !important;
  background: rgba(255, 255, 255, 0.55) !important;
  -webkit-backdrop-filter: blur(18px) saturate(180%) !important;
  backdrop-filter: blur(18px) saturate(180%) !important;
  border-radius: 24px !important;
}

/* === SHAPE — thin border on top of glass for definition === */
.szd-bnav__shape{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  display:block !important;
  pointer-events:none !important;
  z-index:1 !important;
}
.szd-bnav__shape path{
  fill: rgba(255, 255, 255, 0.08) !important;  /* very subtle, glass needs to show through */
  stroke: rgba(255, 255, 255, 0.65) !important;
  stroke-width: 0.8 !important;
}

/* === ITEMS ROW === */
.szd-bnav__row{
  position:relative !important;
  z-index:2 !important;
  height:100% !important;
  display:grid !important;
  grid-template-columns: 1fr 1fr 96px 1fr 1fr !important;
  align-items:center !important;
  padding:20px 14px 10px !important;
  pointer-events:none !important;
}

.szd-bnav__item{
  pointer-events:auto !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  gap:4px !important;
  font-size:10.5px !important;
  font-weight:700 !important;
  font-family:'Vazirmatn','Tahoma',sans-serif !important;
  color:#5C4A4D !important;     /* darker for glass contrast */
  padding:4px 0 !important;
  cursor:pointer !important;
  transition:color .25s, transform .25s !important;
  text-decoration:none !important;
  background:transparent !important;
  border:0 !important;
  text-shadow: 0 1px 1px rgba(255,255,255,0.5);  /* readability on glass */
}
.szd-bnav__item.on{ color:#E0568B !important; }
.szd-bnav__item:hover{ color:#E0568B !important; }
.szd-bnav__item span{
  font-family:'Vazirmatn','Tahoma',sans-serif !important;
  line-height:1 !important;
}

.szd-bnav__icon{
  width:24px !important;
  height:24px !important;
  transition:transform .35s cubic-bezier(.34, 1.4, .6, 1) !important;
  transform-origin:center bottom !important;
  will-change:transform !important;
  flex-shrink:0 !important;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,0.4));
}
.szd-bnav__item:active .szd-bnav__icon{
  transform:translateY(-6px) scale(1.15) !important;
}

.szd-bnav__notch-slot{ display:block !important; }

/* === CHAT FAB === */
.szd-bnav__chat{
  pointer-events:auto !important;
  position:absolute !important;
  left:50% !important;
  top:0 !important;
  transform:translateX(-50%) !important;
  z-index:10 !important;
  width:68px !important;
  height:68px !important;
  border-radius:50% !important;
  background:linear-gradient(135deg, #3DA39B 0%, #6FD3CB 100%) !important;
  color:#FFFFFF !important;
  border:0 !important;
  cursor:pointer !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-shadow:
    0 8px 18px rgba(61,163,155,.42),
    0 3px 6px rgba(0,0,0,.08),
    inset 0 1px 0 rgba(255,255,255,.30) !important;
  animation:szd-chat-breath 5s ease-in-out infinite !important;
  padding:0 !important;
  margin:0 !important;
}
.szd-bnav__chat:active{
  animation:none !important;
  transform:translateX(-50%) scale(.92) !important;
}
.szd-bnav__chat svg{
  width:28px !important;
  height:28px !important;
  color:#FFFFFF !important;
  stroke:#FFFFFF !important;
}

.szd-bnav__chat-dot{
  position:absolute !important;
  top:5px !important;
  right:5px !important;
  width:10px !important;
  height:10px !important;
  border-radius:50% !important;
  background:#A8DFA8 !important;
  border:2px solid #FFFFFF !important;
  animation:szd-online-soft 3s ease-in-out infinite !important;
}

.szd-bnav__chat-ring{
  position:absolute !important;
  inset:-3px !important;
  border-radius:50% !important;
  border:2px solid #6FD3CB !important;
  opacity:0 !important;
  animation:szd-chat-ring-soft 4s ease-out infinite !important;
  pointer-events:none !important;
}

/* === QUICK-PROMPT BUBBLE (subtle invite above chat FAB) === */
.szd-bnav__prompt{
  position:absolute !important;
  left:50% !important;
  top:-46px !important;
  transform:translateX(-50%) translateY(8px) scale(.85) !important;
  z-index:11 !important;
  background: linear-gradient(135deg, #FFFFFF 0%, #FFF5F0 100%) !important;
  color: #3D2C2E !important;
  padding: 8px 14px !important;
  border-radius: 18px !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  font-family: 'Vazirmatn','Tahoma',sans-serif !important;
  white-space: nowrap !important;
  box-shadow:
    0 6px 16px rgba(61,163,155,.18),
    0 2px 4px rgba(0,0,0,.06),
    inset 0 1px 0 rgba(255,255,255,.6) !important;
  border: 1px solid rgba(111, 211, 203, 0.30) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity .35s ease, transform .4s cubic-bezier(.34, 1.4, .6, 1) !important;
  direction: rtl !important;
}
.szd-bnav__prompt.--show{
  opacity: 1 !important;
  transform: translateX(-50%) translateY(0) scale(1) !important;
  pointer-events: auto !important;
}
.szd-bnav__prompt-text{
  display: inline-block !important;
  transition: opacity .28s ease, transform .28s ease !important;
}
/* Tail pointing down to chat FAB */
.szd-bnav__prompt-tail{
  position:absolute !important;
  left:50% !important;
  bottom:-5px !important;
  transform:translateX(-50%) rotate(45deg) !important;
  width:10px !important;
  height:10px !important;
  background: linear-gradient(135deg, #FFFFFF 0%, #FFF5F0 100%) !important;
  border-right: 1px solid rgba(111, 211, 203, 0.30) !important;
  border-bottom: 1px solid rgba(111, 211, 203, 0.30) !important;
}

/* Optional: gentle wobble when shown to draw eye */
.szd-bnav__prompt.--show{
  animation: szd-prompt-wobble 3.2s ease-in-out 1 0.4s;
}
@keyframes szd-prompt-wobble{
  0%, 100% { transform: translateX(-50%) translateY(0) scale(1); }
  20%      { transform: translateX(-50%) translateY(-2px) scale(1.02); }
  40%      { transform: translateX(-50%) translateY(0) scale(1); }
}

/* === FAB ANIMATIONS === */
@keyframes szd-chat-breath{
  0%, 100% {
    transform:translateX(-50%) scale(1);
    box-shadow:0 8px 18px rgba(61,163,155,.42), 0 3px 6px rgba(0,0,0,.08), inset 0 1px 0 rgba(255,255,255,.30);
  }
  50% {
    transform:translateX(-50%) scale(1.018);
    box-shadow:0 10px 22px rgba(61,163,155,.48), 0 3px 6px rgba(0,0,0,.10), inset 0 1px 0 rgba(255,255,255,.35);
  }
}
@keyframes szd-chat-ring-soft{
  0%   { opacity:.30; transform:scale(1); }
  80%, 100% { opacity:0; transform:scale(1.40); }
}
@keyframes szd-online-soft{
  0%, 80%, 100% { opacity:1; }
  40% { opacity:.55; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .szd-bnav__chat,
  .szd-bnav__chat-dot,
  .szd-bnav__chat-ring,
  .szd-bnav__prompt{
    animation:none !important;
  }
}

/* Safari fallback: no backdrop-filter? use stronger background opacity */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
  .szd-bnav__glass{ background: rgba(255, 255, 255, 0.90) !important; }
}

/* ========= S8c: stronger glass + icon idle anim + soft pulse + Goftino styling ========= */
/* ================================================================================
   SHAZDEH — Bottom Nav GLASS v2 (.szd-bnav)
   • Stronger glass blur
   • Hide ONLY Goftino's launcher (NOT the iframe — chat needs it!)
   • Icon idle animations
   • Weak/soft pulse on FAB
   • Continuous prompt rotation
   ================================================================================ */

/* ============================================================
   GOFTINO: keep iframe alive (chat needs it). Use API to hide
   ONLY the launcher button (which lives INSIDE the iframe).
   Below CSS just nudges layering & adds nice styling when open.
   ============================================================ */

/* Default: keep Goftino iframe but make sure it's behind nothing important */
#goftino_w{
  z-index: 50 !important;
}

/* Hide on desktop */
@media (min-width:1024px){
  .szd-bnav{ display:none !important; }
}

/* Add bottom padding to body on mobile (so content not covered by fixed nav) */
@media (max-width:1023px){
  body{ padding-bottom:calc(82px + 26px) !important; }
}

/* === NAV CONTAINER === */
.szd-bnav{
  position:fixed !important;
  bottom:14px !important;
  left:0 !important;
  right:0 !important;
  margin:0 auto !important;
  width:calc(100% - 28px) !important;
  max-width:402px !important;
  height:82px !important;
  z-index:60 !important;
  pointer-events:none !important;
  direction:ltr !important;
}

/* === STRONGER GLASS BACKING === */
.szd-bnav__glass{
  position:absolute !important;
  inset:0 !important;
  pointer-events:auto !important;
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 82' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M 24 16 L 140 16 C 160 16, 168 28, 178 42 C 188 58, 194 68, 200 68 C 206 68, 212 58, 222 42 C 232 28, 240 16, 260 16 L 376 16 Q 400 16, 400 40 L 400 58 Q 400 82, 376 82 L 24 82 Q 0 82, 0 58 L 0 40 Q 0 16, 24 16 Z'/%3E%3C/svg%3E") !important;
  -webkit-mask-size: 100% 100% !important;
  -webkit-mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 82' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M 24 16 L 140 16 C 160 16, 168 28, 178 42 C 188 58, 194 68, 200 68 C 206 68, 212 58, 222 42 C 232 28, 240 16, 260 16 L 376 16 Q 400 16, 400 40 L 400 58 Q 400 82, 376 82 L 24 82 Q 0 82, 0 58 L 0 40 Q 0 16, 24 16 Z'/%3E%3C/svg%3E") !important;
  mask-size: 100% 100% !important;
  mask-repeat: no-repeat !important;
  mask-position: center !important;
  /* TRANSPARENT background → only backdrop blur shows */
  background: rgba(255, 255, 255, 0.28) !important;
  -webkit-backdrop-filter: blur(28px) saturate(220%) brightness(105%) !important;
  backdrop-filter: blur(28px) saturate(220%) brightness(105%) !important;
}

/* Outline path on top for definition */
.szd-bnav__shape{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  display:block !important;
  pointer-events:none !important;
  z-index:1 !important;
}
.szd-bnav__shape path{
  fill: rgba(255, 255, 255, 0.06) !important;
  stroke: rgba(255, 255, 255, 0.75) !important;
  stroke-width: 1 !important;
}

/* === ITEMS ROW === */
.szd-bnav__row{
  position:relative !important;
  z-index:2 !important;
  height:100% !important;
  display:grid !important;
  grid-template-columns: 1fr 1fr 96px 1fr 1fr !important;
  align-items:center !important;
  padding:20px 14px 10px !important;
  pointer-events:none !important;
}

.szd-bnav__item{
  pointer-events:auto !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  gap:4px !important;
  font-size:10.5px !important;
  font-weight:700 !important;
  font-family:'Vazirmatn','Tahoma',sans-serif !important;
  color:#5C4A4D !important;
  padding:4px 0 !important;
  cursor:pointer !important;
  transition: color .25s !important;
  text-decoration:none !important;
  background:transparent !important;
  border:0 !important;
  text-shadow: 0 1px 1px rgba(255,255,255,0.5);
}
.szd-bnav__item.on{ color:#E0568B !important; }
.szd-bnav__item:hover{ color:#E0568B !important; }
.szd-bnav__item span{
  font-family:'Vazirmatn','Tahoma',sans-serif !important;
  line-height:1 !important;
}

/* === ICON IDLE ANIMATIONS (each item icon gets a subtle different motion) === */
.szd-bnav__icon{
  width:24px !important;
  height:24px !important;
  transform-origin:center bottom !important;
  will-change:transform !important;
  flex-shrink:0 !important;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,0.4));
  transition: transform .35s cubic-bezier(.34, 1.4, .6, 1) !important;
}
.szd-bnav__item:active .szd-bnav__icon{
  transform: translateY(-6px) scale(1.15) !important;
}
.szd-bnav__item:hover .szd-bnav__icon{
  transform: translateY(-2px) scale(1.06) !important;
}

/* Per-item idle animations (gentle, attention-drawing) */
.szd-bnav__item:nth-child(1) .szd-bnav__icon{
  animation: szd-bnav-icon-wiggle 4.5s ease-in-out infinite;
  animation-delay: 0s;
}
.szd-bnav__item:nth-child(2) .szd-bnav__icon{
  animation: szd-bnav-icon-pop 5s ease-in-out infinite;
  animation-delay: 1.2s;
}
.szd-bnav__item:nth-child(4) .szd-bnav__icon{
  animation: szd-bnav-icon-bob 4s ease-in-out infinite;
  animation-delay: 0.6s;
}
.szd-bnav__item:nth-child(5) .szd-bnav__icon{
  animation: szd-bnav-icon-wiggle 5.5s ease-in-out infinite;
  animation-delay: 2s;
}

.szd-bnav__notch-slot{ display:block !important; }

/* === CHAT FAB === */
.szd-bnav__chat{
  pointer-events:auto !important;
  position:absolute !important;
  left:50% !important;
  top:0 !important;
  transform:translateX(-50%) !important;
  z-index:10 !important;
  width:68px !important;
  height:68px !important;
  border-radius:50% !important;
  background:linear-gradient(135deg, #3DA39B 0%, #6FD3CB 100%) !important;
  color:#FFFFFF !important;
  border:0 !important;
  cursor:pointer !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-shadow:
    0 8px 18px rgba(61,163,155,.42),
    0 3px 6px rgba(0,0,0,.08),
    inset 0 1px 0 rgba(255,255,255,.30) !important;
  animation:szd-chat-breath 5s ease-in-out infinite !important;
  padding:0 !important;
  margin:0 !important;
}
.szd-bnav__chat:active{
  animation:none !important;
  transform:translateX(-50%) scale(.92) !important;
}
.szd-bnav__chat svg{
  width:28px !important;
  height:28px !important;
  color:#FFFFFF !important;
  stroke:#FFFFFF !important;
  position:relative;
  z-index:3;
}

/* === WEAK SOFT PULSE LAYERS (per user request) === */
.szd-bnav__chat-pulse{
  position:absolute !important;
  inset:-4px !important;
  border-radius:50% !important;
  background: radial-gradient(circle, rgba(111,211,203,.30) 0%, rgba(111,211,203,0) 70%) !important;
  pointer-events:none !important;
  animation: szd-chat-soft-pulse 2.6s ease-in-out infinite !important;
  z-index:1;
}
.szd-bnav__chat-pulse--soft{
  inset:-8px !important;
  animation-delay: 1.3s !important;
  animation-duration: 3.2s !important;
}

.szd-bnav__chat-dot{
  position:absolute !important;
  top:5px !important;
  right:5px !important;
  width:10px !important;
  height:10px !important;
  border-radius:50% !important;
  background:#A8DFA8 !important;
  border:2px solid #FFFFFF !important;
  animation:szd-online-soft 3s ease-in-out infinite !important;
  z-index:4;
}

.szd-bnav__chat-ring{
  position:absolute !important;
  inset:-3px !important;
  border-radius:50% !important;
  border:2px solid rgba(111,211,203, 0.6) !important;
  opacity:0 !important;
  animation:szd-chat-ring-soft 4s ease-out infinite !important;
  pointer-events:none !important;
  z-index:2;
}

/* === QUICK-PROMPT BUBBLE === */
.szd-bnav__prompt{
  position:absolute !important;
  left:50% !important;
  top:-48px !important;
  transform:translateX(-50%) translateY(8px) scale(.85) !important;
  z-index:11 !important;
  background: linear-gradient(135deg, #FFFFFF 0%, #FFF5F0 100%) !important;
  color: #3D2C2E !important;
  padding: 8px 14px !important;
  border-radius: 18px !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  font-family: 'Vazirmatn','Tahoma',sans-serif !important;
  white-space: nowrap !important;
  box-shadow:
    0 6px 16px rgba(61,163,155,.22),
    0 2px 4px rgba(0,0,0,.06),
    inset 0 1px 0 rgba(255,255,255,.6) !important;
  border: 1px solid rgba(111, 211, 203, 0.30) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity .40s ease, transform .45s cubic-bezier(.34, 1.4, .6, 1) !important;
  direction: rtl !important;
}
.szd-bnav__prompt.--show{
  opacity: 1 !important;
  transform: translateX(-50%) translateY(0) scale(1) !important;
  pointer-events: auto !important;
}
.szd-bnav__prompt-text{
  display: inline-block !important;
  transition: opacity .28s ease, transform .28s ease !important;
}
.szd-bnav__prompt-tail{
  position:absolute !important;
  left:50% !important;
  bottom:-5px !important;
  transform:translateX(-50%) rotate(45deg) !important;
  width:10px !important;
  height:10px !important;
  background: linear-gradient(135deg, #FFFFFF 0%, #FFF5F0 100%) !important;
  border-right: 1px solid rgba(111, 211, 203, 0.30) !important;
  border-bottom: 1px solid rgba(111, 211, 203, 0.30) !important;
}

/* === GOFTINO IFRAME (chat window) — match site style === */
#goftino_w{
  border-radius: 20px !important;
  overflow: hidden !important;
  border: 2px solid rgba(224, 86, 139, 0.18) !important;
  box-shadow:
    0 12px 40px rgba(224, 86, 139, 0.25),
    0 4px 14px rgba(0, 0, 0, 0.10) !important;
  z-index: 1000 !important;
}

/* ============================================================
   ANIMATIONS
   ============================================================ */
@keyframes szd-chat-breath{
  0%, 100% { transform:translateX(-50%) scale(1); }
  50% { transform:translateX(-50%) scale(1.025); }
}
@keyframes szd-chat-ring-soft{
  0%   { opacity:.30; transform:scale(1); }
  80%, 100% { opacity:0; transform:scale(1.40); }
}
@keyframes szd-chat-soft-pulse{
  0%   { opacity: 0; transform: scale(0.95); }
  50%  { opacity: 1; transform: scale(1.10); }
  100% { opacity: 0; transform: scale(1.25); }
}
@keyframes szd-online-soft{
  0%, 80%, 100% { opacity:1; }
  40% { opacity:.55; }
}

/* Per-icon idle animations */
@keyframes szd-bnav-icon-wiggle{
  0%, 80%, 100% { transform: rotate(0deg) scale(1); }
  85% { transform: rotate(-6deg) scale(1.06); }
  90% { transform: rotate(6deg) scale(1.06); }
  95% { transform: rotate(-3deg) scale(1.03); }
}
@keyframes szd-bnav-icon-pop{
  0%, 75%, 100% { transform: scale(1); }
  85% { transform: scale(1.12); }
}
@keyframes szd-bnav-icon-bob{
  0%, 70%, 100% { transform: translateY(0); }
  80% { transform: translateY(-3px); }
  90% { transform: translateY(0); }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .szd-bnav__chat,
  .szd-bnav__chat-dot,
  .szd-bnav__chat-ring,
  .szd-bnav__chat-pulse,
  .szd-bnav__prompt,
  .szd-bnav__icon{
    animation:none !important;
  }
}

/* Safari fallback */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
  .szd-bnav__glass{ background: rgba(255, 255, 255, 0.86) !important; }
}

/* ========= S8d: icon animations with !important + higher specificity ========= */
.szd-bnav .szd-bnav__row > .szd-bnav__item:nth-child(1) > .szd-bnav__icon{
  animation: szd-bnav-icon-wiggle 4.5s ease-in-out infinite !important;
}
.szd-bnav .szd-bnav__row > .szd-bnav__item:nth-child(2) > .szd-bnav__icon{
  animation: szd-bnav-icon-pop 5s ease-in-out infinite !important;
  animation-delay: 1.2s !important;
}
.szd-bnav .szd-bnav__row > .szd-bnav__item:nth-child(4) > .szd-bnav__icon{
  animation: szd-bnav-icon-bob 4s ease-in-out infinite !important;
  animation-delay: 0.6s !important;
}
.szd-bnav .szd-bnav__row > .szd-bnav__item:nth-child(5) > .szd-bnav__icon{
  animation: szd-bnav-icon-wiggle 5.5s ease-in-out infinite !important;
  animation-delay: 2s !important;
}

/* ========= S8e: UN-HIDE Goftino iframe (rules from S8b were killing the chat window) ========= */
html body #goftino_w,
html body iframe#goftino_w,
html body iframe[id='goftino_w']{
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  /* Goftino sets its own position; just make sure it's not hidden */
}

/* ========= S9: visible pulse + hide goftino + bnav prompts via module ========= */
/* ================================================================================
   SHAZDEH — Bottom Nav v3 patches
   • Visible pulse rings on FAB (concentric, fade-out)
   • Goftino native launcher fully hidden via inline-style fallback
   • Reduce-motion respect
   ================================================================================ */

/* === Hide Goftino's native launcher button === */
/* The iframe stays in DOM (chat needs it) but visually invisible until OUR FAB opens it.
   JS sets opacity:0 / transform:scale(0.001) on the iframe by default. */
html body iframe#goftino_w[style*="opacity: 0"]{
  display: block !important;   /* keep in DOM */
  visibility: visible !important;
  /* but opacity:0 + pointer-events:none from JS keeps it invisible+inert */
}

/* === VISIBLE pulse rings on FAB === */
.szd-bnav__chat{
  isolation: isolate;   /* contain the pulses */
  position: absolute !important;
  overflow: visible !important;  /* allow pulses to extend beyond circle */
}

/* Common pulse base */
.szd-bnav__chat-pulse{
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 68px !important;
  height: 68px !important;
  margin: -34px 0 0 -34px !important;
  border-radius: 50% !important;
  pointer-events: none !important;
  z-index: 0 !important;
  background: transparent !important;
  border: 2px solid rgba(111, 211, 203, 0.65) !important;
  box-shadow: 0 0 0 0 rgba(111, 211, 203, 0.35);
  opacity: 0;
}

.szd-bnav__chat-pulse--p1{
  animation: szd-fab-pulse-ring 2.2s cubic-bezier(0, 0, 0.2, 1) infinite !important;
  animation-delay: 0s !important;
}
.szd-bnav__chat-pulse--p2{
  animation: szd-fab-pulse-ring 2.2s cubic-bezier(0, 0, 0.2, 1) infinite !important;
  animation-delay: 0.7s !important;
}
.szd-bnav__chat-pulse--p3{
  animation: szd-fab-pulse-ring 2.2s cubic-bezier(0, 0, 0.2, 1) infinite !important;
  animation-delay: 1.4s !important;
}

@keyframes szd-fab-pulse-ring{
  0%   { opacity: 0.70; transform: scale(0.95); border-color: rgba(111, 211, 203, 0.80); }
  50%  { opacity: 0.30; transform: scale(1.25); border-color: rgba(111, 211, 203, 0.40); }
  100% { opacity: 0;    transform: scale(1.65); border-color: rgba(111, 211, 203, 0); }
}

/* Make the SVG icon inside FAB sit ABOVE the pulses */
.szd-bnav__chat svg{
  z-index: 3 !important;
  position: relative;
}
.szd-bnav__chat-dot{
  z-index: 4 !important;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .szd-bnav__chat-pulse{ animation: none !important; opacity: 0 !important; }
}
/* SZD: nav chat FAB = footer AI orb (teal, white robot, green dot) + heartbeat + radar ring */
.szd-bnav__chat{ overflow:visible !important; animation: szd-fab-beat 1.9s ease-in-out infinite !important; }
.szd-bnav__chat svg,.szd-bnav__chat svg *{ stroke:#FFFFFF !important; }
.szd-bnav__chat svg circle{ fill:#FFFFFF !important; stroke:none !important; }
.szd-bnav__chat::before{ content:""; position:absolute; inset:0; border-radius:50%; border:2px solid rgba(61,163,155,.55); animation: szd-fab-radar 2.6s ease-out infinite; pointer-events:none; z-index:0; }
@keyframes szd-fab-radar{ 0%{ transform:scale(.85); opacity:.6 } 100%{ transform:scale(1.6); opacity:0 } }
@keyframes szd-fab-beat{ 0%,100%{ transform:translateX(-50%) scale(1) } 12%{ transform:translateX(-50%) scale(1.12) } 24%{ transform:translateX(-50%) scale(1) } 36%{ transform:translateX(-50%) scale(1.08) } 48%{ transform:translateX(-50%) scale(1) } }

/* ========= S9b: pulse must work even with prefers-reduced-motion (user explicitly wants it) ========= */
/* Override any prior reduce-motion rules for the FAB pulse specifically */
@media (prefers-reduced-motion: reduce){
  .szd-bnav__chat-pulse,
  .szd-bnav__chat-pulse--p1,
  .szd-bnav__chat-pulse--p2,
  .szd-bnav__chat-pulse--p3{
    animation: szd-fab-pulse-ring 2.4s cubic-bezier(0, 0, 0.2, 1) infinite !important;
    opacity: 1 !important;
  }
  .szd-bnav__chat-pulse--p2{ animation-delay: 0.8s !important; }
  .szd-bnav__chat-pulse--p3{ animation-delay: 1.6s !important; }
}

/* ========= S9c: center rotating-pill messages inside their narrow container ========= */
.szd-rotpill{
  justify-content: center !important;
  text-align: center !important;
}
.szd-rotpill__slot{
  justify-content: center !important;
  text-align: center !important;
  left: 0 !important;
  right: 0 !important;
}
.szd-rotpill__text{
  text-align: center !important;
}

/* ========= S10a: Thinking-bubble style for chat prompt (comic-style dots) ========= */
.szd-bnav__prompt{
  border-radius: 22px !important;   /* more cloud-like */
  padding: 10px 16px !important;
}
/* Hide the old triangular tail */
.szd-bnav__prompt-tail{
  display: none !important;
}
/* Two thinking dots between bubble and FAB (big ? small) */
.szd-bnav__prompt::before,
.szd-bnav__prompt::after{
  content: '' !important;
  position: absolute !important;
  left: 50% !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #FFFFFF 0%, #FFF5F0 100%) !important;
  border: 1px solid rgba(111, 211, 203, 0.30) !important;
  box-shadow: 0 2px 4px rgba(0,0,0,0.06) !important;
  pointer-events: none !important;
}
.szd-bnav__prompt::before{
  width: 13px !important;
  height: 13px !important;
  bottom: -10px !important;
  transform: translateX(-50%) !important;
  z-index: 1;
  animation: szd-thinking-dot 2.6s ease-in-out infinite !important;
}
.szd-bnav__prompt::after{
  width: 8px !important;
  height: 8px !important;
  bottom: -24px !important;
  transform: translateX(8px) !important;   /* slight offset, like a real thought stream */
  z-index: 1;
  animation: szd-thinking-dot 2.6s ease-in-out infinite !important;
  animation-delay: 0.4s !important;
}
@keyframes szd-thinking-dot{
  0%, 100% { opacity: 0.85; transform: translateX(-50%) scale(1); }
  50%      { opacity: 1;    transform: translateX(-50%) scale(1.15); }
}
.szd-bnav__prompt::after{
  /* override translateX for second dot only */
  animation-name: szd-thinking-dot-2 !important;
}
@keyframes szd-thinking-dot-2{
  0%, 100% { opacity: 0.75; transform: translateX(8px) scale(1); }
  50%      { opacity: 1;    transform: translateX(8px) scale(1.20); }
}

/* ========= S10b: Auto-size rotating pill to current message width ========= */
.szd-rotpill{
  min-width: 0 !important;       /* let JS set explicit width */
  transition: width .45s cubic-bezier(.34, 1.4, .6, 1) !important;
  position: relative;
  vertical-align: middle;
}
/* Slots should fill the pill so centered content stays centered during resize */
.szd-rotpill__slot{
  width: 100% !important;
  left: 0 !important;
  right: 0 !important;
}

/* ========= S11: Simpler FAB effect + modern prompt bubble ========= */

/* ============ FAB: remove 3-ring pulse, keep ONE subtle halo ============ */
.szd-bnav__chat-pulse,
.szd-bnav__chat-pulse--p1,
.szd-bnav__chat-pulse--p2,
.szd-bnav__chat-pulse--p3{
  display: none !important;
}
/* Single soft halo via box-shadow on the FAB itself */
.szd-bnav__chat{
  animation: szd-fab-soft 3.6s ease-in-out infinite !important;
}
@keyframes szd-fab-soft{
  0%, 100% {
    transform: translateX(-50%) scale(1);
    box-shadow:
      0 8px 18px rgba(61,163,155,.40),
      0 0 0 0 rgba(111,211,203,0.35),
      inset 0 1px 0 rgba(255,255,255,.30);
  }
  50% {
    transform: translateX(-50%) scale(1.025);
    box-shadow:
      0 10px 22px rgba(61,163,155,.48),
      0 0 0 8px rgba(111,211,203,0),
      inset 0 1px 0 rgba(255,255,255,.35);
  }
}
@media (prefers-reduced-motion: reduce){
  .szd-bnav__chat{ animation: szd-fab-soft 3.6s ease-in-out infinite !important; }
}

/* ============ MODERN PROMPT BUBBLE ============ */
.szd-bnav__prompt{
  /* Glassmorphism + modern shape */
  top: -50px !important;
  padding: 9px 16px 9px 14px !important;
  border-radius: 100px !important;     /* full pill */
  background: rgba(255, 255, 255, 0.78) !important;
  -webkit-backdrop-filter: blur(14px) saturate(180%) !important;
  backdrop-filter: blur(14px) saturate(180%) !important;
  border: 1px solid rgba(255, 255, 255, 0.85) !important;
  box-shadow:
    0 12px 28px rgba(61, 163, 155, 0.16),
    0 4px 10px rgba(45, 28, 32, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
  color: #2D1C20 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: -0.1px;
}
/* Reset thinking dots / triangular tail � modern look uses none */
.szd-bnav__prompt::before,
.szd-bnav__prompt::after,
.szd-bnav__prompt-tail{
  display: none !important;
  content: none !important;
}
/* Subtle pulse for the modern bubble itself (gentle breathing) */
.szd-bnav__prompt.--show{
  animation: szd-prompt-breath 4s ease-in-out infinite !important;
}
@keyframes szd-prompt-breath{
  0%, 100% { transform: translateX(-50%) translateY(0) scale(1); }
  50%      { transform: translateX(-50%) translateY(-1px) scale(1.012); }
}
/* ================================================================================
   SHAZDEH — psy_smartlogin (Wordyar) auth pages — site-themed override
   Login + Verify (OTP) + Register
   Persian numerals everywhere (no English digits)
   ================================================================================ */

/* Persian-number font-feature so any English digits show as Persian where possible */
.szd-auth-wrapper, .szd-auth-wrapper *{
  font-family: 'Vazirmatn','Tahoma',sans-serif !important;
  -webkit-font-feature-settings: "ss01";
  font-feature-settings: "ss01";
}

/* === Page background — soft gradient matching mockup === */
.szd-auth-wrapper{
  background: linear-gradient(180deg, #FFE3EC 0%, #FFF5F0 30%, #FFF5F0 100%) !important;
  min-height: 100vh !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
}

/* === Outer shell (mobile-first, max-width like mockup) === */
.szd-auth-shell{
  max-width: 480px !important;
  margin: 0 auto !important;
  padding: 14px 18px 30px !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 100vh !important;
  position: relative !important;
}

/* === Back button (top-right in RTL) === */
.szd-auth-back{
  align-self: flex-start !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 14px !important;
  background: #fff !important;
  border: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.06) !important;
  margin-top: 8px !important;
  cursor: pointer !important;
  color: #3D2C2E !important;
}
.szd-auth-back svg{
  width: 22px !important;
  height: 22px !important;
  color: #3D2C2E !important;
}

/* === Fox mascot (replaces emoji mockup mascot) === */
.szd-auth-mascot{
  align-self: center !important;
  margin: 16px auto 0 !important;
  width: 132px !important;
  height: 132px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  animation: szd-auth-bob 3s ease-in-out infinite !important;
  text-decoration: none !important;
}
.szd-auth-mascot img{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  filter: drop-shadow(0 8px 16px rgba(180, 60, 20, 0.18)) drop-shadow(0 2px 4px rgba(0,0,0,0.08)) !important;
}
@keyframes szd-auth-bob{
  0%, 100%{ transform: translateY(0) rotate(0deg); }
  50%     { transform: translateY(-6px) rotate(-1.5deg); }
}

/* === Brand text under mascot === */
.szd-auth-brand{
  text-align: center !important;
  margin: 4px 0 12px !important;
}
.szd-auth-brand strong{
  display: block !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  color: #3D2C2E !important;
  line-height: 1.2 !important;
}
.szd-auth-brand small{
  display: block !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #E0568B !important;
  margin-top: 2px !important;
}

/* === Title (h1) === */
.szd-auth-title{
  font-size: 20px !important;
  font-weight: 900 !important;
  color: #3D2C2E !important;
  text-align: center !important;
  margin: 8px 0 6px !important;
  line-height: 1.5 !important;
}
.szd-auth-title b{
  color: #E0568B !important;
  font-weight: 900 !important;
}

/* === Subtitle === */
.szd-auth-sub{
  text-align: center !important;
  color: #7B6B6D !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  margin: 0 auto 20px !important;
  max-width: 320px !important;
  line-height: 1.85 !important;
}

/* === Form card === */
.szd-auth-card{
  background: #fff !important;
  border-radius: 24px !important;
  padding: 22px 18px !important;
  box-shadow: 0 12px 28px rgba(244, 120, 169, 0.12), 0 2px 6px rgba(0,0,0,0.04) !important;
  margin-bottom: 14px !important;
}

/* === Form label === */
.szd-auth-lbl{
  display: block !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  color: #3D2C2E !important;
  margin-bottom: 8px !important;
}
.szd-auth-lbl b{
  color: #E0568B !important;
}

/* === Input row (cream pill with optional flag chip) === */
.szd-auth-input-row{
  display: flex !important;
  gap: 6px !important;
  align-items: center !important;
  background: #FFF5F0 !important;
  border-radius: 14px !important;
  padding: 0 10px !important;
  height: 54px !important;
  border: 2px solid transparent !important;
  transition: border-color .2s, box-shadow .2s !important;
}
.szd-auth-input-row:focus-within{
  border-color: #F478A9 !important;
  box-shadow: 0 0 0 4px rgba(244, 120, 169, 0.10) !important;
}
.szd-auth-flag-chip{
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #5A4A4C !important;
  padding: 0 8px 0 4px !important;
  border-left: 1px solid #F2E7E3 !important;
  height: 32px !important;
  font-variant-numeric: tabular-nums !important;
  direction: ltr !important;
}
.szd-auth-flag-chip .szd-auth-flag{
  font-size: 18px !important;
  line-height: 1 !important;
}
.szd-auth-input,
.szd-auth-input-row input{
  flex: 1 !important;
  border: 0 !important;
  background: transparent !important;
  outline: 0 !important;
  font-family: inherit !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #3D2C2E !important;
  direction: ltr !important;
  text-align: right !important;
  font-variant-numeric: tabular-nums !important;
  padding: 0 !important;
  height: 100% !important;
}
.szd-auth-input::placeholder{
  color: #7B6B6D !important;
  font-weight: 500 !important;
  font-size: 14px !important;
}

/* === CTA button (gradient pill) === */
.szd-auth-cta,
.szd-auth-btn-wrap .psy-btn-primary{
  width: 100% !important;
  background: linear-gradient(135deg, #F478A9 0%, #FF8FBD 100%) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 16px !important;
  padding: 16px !important;
  font-family: inherit !important;
  font-weight: 900 !important;
  font-size: 14px !important;
  margin-top: 18px !important;
  cursor: pointer !important;
  box-shadow: 0 8px 18px rgba(244, 120, 169, 0.40) !important;
  transition: transform .15s, box-shadow .15s !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
}
.szd-auth-cta:active,
.szd-auth-btn-wrap .psy-btn-primary:active{
  transform: scale(0.98) !important;
  box-shadow: 0 4px 12px rgba(244, 120, 169, 0.50) !important;
}
.szd-auth-cta svg{
  width: 18px !important;
  height: 18px !important;
  color: #fff !important;
  stroke: #fff !important;
}

/* === OTP input (single field for psy_smartlogin compat) === */
.szd-auth-otp-wrap{
  margin: 6px 0 4px !important;
}
.szd-auth-otp{
  width: 100% !important;
  background: #FFF5F0 !important;
  border: 2px solid #F2E7E3 !important;
  border-radius: 16px !important;
  padding: 18px 12px !important;
  font-family: inherit !important;
  font-size: 24px !important;
  font-weight: 900 !important;
  color: #E0568B !important;
  text-align: center !important;
  letter-spacing: 12px !important;
  outline: 0 !important;
  font-variant-numeric: tabular-nums !important;
  transition: border-color .2s, background .2s !important;
  direction: ltr !important;
}
.szd-auth-otp:focus{
  border-color: #F478A9 !important;
  background: #fff !important;
  box-shadow: 0 0 0 4px rgba(244, 120, 169, 0.12) !important;
}
.szd-auth-otp::placeholder{
  color: #C9B8B5 !important;
  letter-spacing: 8px !important;
  font-size: 20px !important;
}

/* === Phone display on verify step === */
.szd-auth-phone-display{
  text-align: center !important;
  margin: 0 0 6px !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #3D2C2E !important;
}
.szd-auth-otp-target{
  font-variant-numeric: tabular-nums !important;
  color: #3D2C2E !important;
  direction: ltr !important;
  display: inline-block !important;
  margin-left: 8px !important;
}
.szd-auth-change{
  background: transparent !important;
  border: 0 !important;
  color: #E0568B !important;
  font-family: inherit !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  margin-right: 8px !important;
  text-decoration: underline !important;
  padding: 0 !important;
}

/* === Resend row (verify step) === */
.szd-auth-resend{
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin: 14px 0 10px !important;
  font-size: 11px !important;
  color: #7B6B6D !important;
}
.szd-auth-resend__countdown{
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.szd-auth-resend__countdown #psy-countdown{
  position: relative !important;
  width: 30px !important;
  height: 30px !important;
}
.szd-auth-resend__countdown #psy-timer{
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  color: #3D2C2E !important;
  font-variant-numeric: tabular-nums !important;
}
.szd-auth-resend__btn{
  background: transparent !important;
  border: 0 !important;
  color: #E0568B !important;
  font-family: inherit !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  padding: 6px 0 !important;
  display: none !important;   /* shown by JS when timer ends */
}

/* === Terms (small print below form) === */
.szd-auth-terms{
  text-align: center !important;
  font-size: 11px !important;
  color: #7B6B6D !important;
  margin: 14px 14px 0 !important;
  line-height: 1.9 !important;
}
.szd-auth-terms a{
  color: #E0568B !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
.szd-auth-terms a:hover{
  text-decoration: underline !important;
}

/* === Alt link (e.g. "use password instead") === */
.szd-auth-altlink{
  text-align: center !important;
  margin: 12px 0 0 !important;
}
.szd-auth-altlink a{
  color: #E0568B !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
.szd-auth-altlink a:hover{
  text-decoration: underline !important;
}

/* === Error text === */
.szd-auth-errors{
  color: #D32F2F !important;
  font-size: 12px !important;
  text-align: center !important;
  margin-top: 8px !important;
  font-weight: 700 !important;
  min-height: 18px !important;
}

/* === Footer help (support phone) — Persian-numeral, RTL-aware === */
.szd-auth-footer{
  margin-top: auto !important;
  text-align: center !important;
  font-size: 12px !important;
  color: #7B6B6D !important;
  padding-top: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
}
.szd-auth-footer__label{
  color: #5A4A4C !important;
  font-weight: 700 !important;
}
.szd-auth-footer__phone{
  color: #3D2C2E !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums !important;
  text-decoration: none !important;
  direction: ltr !important;
  unicode-bidi: embed !important;
}

/* === Hide PrestaShop / panda native components that would clash === */
.content-loginyar .szd-bnav,
.content-loginyar .szd-utility-bar,
.content-loginyar .szd-hdr,
.content-loginyar .szd-tkr,
body.page-authentication .szd-bnav,
body.page-authentication .szd-tkr{
  display: none !important;
}

/* === Form-field overrides for register (per-field rows) === */
.szd-auth-step--register .psy-form-group{
  margin-bottom: 14px !important;
}
.szd-auth-step--register .psy-form-group label{
  display: block !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  color: #3D2C2E !important;
  margin-bottom: 6px !important;
}
.szd-auth-step--register .psy-form-group input[type="text"],
.szd-auth-step--register .psy-form-group input[type="email"],
.szd-auth-step--register .psy-form-group input[type="password"],
.szd-auth-step--register .psy-form-group select{
  width: 100% !important;
  background: #FFF5F0 !important;
  border: 2px solid transparent !important;
  border-radius: 14px !important;
  padding: 14px 12px !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #3D2C2E !important;
  outline: 0 !important;
  transition: border-color .2s !important;
  height: auto !important;
}
.szd-auth-step--register .psy-form-group input:focus,
.szd-auth-step--register .psy-form-group select:focus{
  border-color: #F478A9 !important;
  background: #fff !important;
}

/* ========= S12b: Hide psy_smartlogin auto-logo (we have our own fox mascot) ========= */
.content-loginyar #psy-logo,
.psy-smart-login #psy-logo{
  display: none !important;
}
/* Make sure psy_smartlogin auth pages use our wrapper background */
body.psy-smart-login,
body.auth-login,
.content-loginyar{
  background: linear-gradient(180deg, #FFE3EC 0%, #FFF5F0 30%, #FFF5F0 100%) !important;
}
/* Hide site header/footer/nav on auth pages to keep focus */
body.psy-smart-login .header-container,
body.psy-smart-login .szd-bnav,
body.psy-smart-login .szd-tkr,
body.psy-smart-login #footer,
body.psy-smart-login .footer-container{
  display: none !important;
}

/* ========= S12c: auth input fixes � flag LEFT, kill box-in-box, persian ========= */
.szd-auth-input-row--phone{ direction: ltr !important; }
.szd-auth-flag-chip{
  order: 0 !important;
  border-left: 0 !important;
  border-right: 1px solid #E6D5CF !important;
  padding: 0 8px !important;
}
.szd-auth-input--display{
  order: 1 !important;
  flex: 1 1 auto !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  text-align: left !important;
  direction: ltr !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #3D2C2E !important;
  padding: 0 8px !important;
  height: 100% !important;
  font-variant-numeric: tabular-nums !important;
}
.szd-auth-input--display:focus{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
}
.szd-auth-input--display::placeholder{
  color: #B9A6A2 !important;
  font-weight: 600 !important;
}
/* Belt-and-braces: any leftover bare input inside our row must be transparent */
.szd-auth-input-row .form-control:not([type=hidden]),
.szd-auth-input-row .form-control:not([type=hidden]):focus{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* Hide site chrome on auth pages � reinforce (covers all bodies) */
body.psy-smart-login .header-container,
body.psy-smart-login .wrapper_top_container,
body.psy-smart-login .wrapper_bottom_container,
body.psy-smart-login #st-content-inner-after,
body.psy-smart-login .st-menu-header,
body.psy-smart-login #footer,
body.psy-smart-login .footer-container,
body.psy-smart-login .szd-bnav,
body.psy-smart-login .szd-tkr,
body.psy-smart-login #psy-logo,
body.auth-login .header-container,
body.auth-login .wrapper_top_container,
body.auth-login .wrapper_bottom_container,
body.auth-login #st-content-inner-after,
body.auth-login .st-menu-header,
body.auth-login #footer{
  display: none !important;
}
body.psy-smart-login #wrapper,
body.psy-smart-login #columns,
body.auth-login #wrapper,
body.auth-login #columns{
  padding: 0 !important;
  margin: 0 !important;
}

/* ========= S12d: full-screen white auth box (kill empty top/bottom) + left-align input ========= */

/* Whole auth page = ONE white surface, edge to edge, full height */
body.psy-smart-login,
body.auth-login,
html:has(body.psy-smart-login){
  background: #FFFFFF !important;
  min-height: 100vh !important;
}
.szd-auth-wrapper,
.content-loginyar.szd-auth-wrapper{
  background: #FFFFFF !important;
  min-height: 100vh !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
}
/* Shell = full screen white, content anchored to top with comfy padding */
.szd-auth-shell{
  max-width: 480px !important;
  width: 100% !important;
  margin: 0 auto !important;
  min-height: 100vh !important;
  background: #FFFFFF !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  padding: 32px 22px 24px !important;
  box-shadow: 0 0 60px rgba(0,0,0,0.04) !important;  /* subtle edge on desktop */
  box-sizing: border-box !important;
}
/* The form "card" blends into the white surface � no separate floating box */
.szd-auth-card{
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 4px 0 0 !important;
  margin: 0 !important;
}
/* Fox mascot a touch smaller + top spacing tightened */
.szd-auth-mascot{
  margin: 4px auto 0 !important;
  width: 120px !important;
  height: 120px !important;
}
/* Push footer (support phone) to the very bottom of the white surface */
.szd-auth-footer{
  margin-top: auto !important;
  padding-top: 32px !important;
}

/* INPUT: left-align the typed text + placeholder */
.szd-auth-input--display,
.szd-auth-input-row--phone .szd-auth-input--display,
#szd-auth-display{
  text-align: left !important;
  direction: ltr !important;
}
.szd-auth-input--display::placeholder{
  text-align: left !important;
}

/* Reinforce: kill any residual chrome bands that create empty space */
body.psy-smart-login .header-container,
body.psy-smart-login header#st_header,
body.psy-smart-login .wrapper_top_container,
body.psy-smart-login .wrapper_bottom_container,
body.psy-smart-login #st-content-inner-after,
body.psy-smart-login .st-menu-header,
body.psy-smart-login .breadcrumb,
body.psy-smart-login #footer,
body.psy-smart-login .footer-container{
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
}
/* Remove padding/margins from PrestaShop column wrappers on auth */
body.psy-smart-login #wrapper,
body.psy-smart-login #columns,
body.psy-smart-login .columns-container,
body.psy-smart-login #content-wrapper,
body.psy-smart-login #page_wrapper,
body.psy-smart-login #body_wrapper,
body.psy-smart-login .st-content,
body.psy-smart-login .st-content-inner{
  padding: 0 !important;
  margin: 0 !important;
  background: #FFFFFF !important;
  min-height: auto !important;
}

/* ========= S12e: reduce bottom space + more side padding on phone box ========= */

/* Shell no longer forced to full 100vh � content height + white body fills rest.
   This removes the big empty gap below the footer. */
.szd-auth-shell{
  min-height: auto !important;
  padding: 28px 22px 22px !important;
}
/* Body stays white & full height so any area below content is clean white (not colored) */
body.psy-smart-login,
body.auth-login{
  background: #FFFFFF !important;
  min-height: 100vh !important;
}
/* Footer sits right after the form (normal gap), not glued to screen bottom */
.szd-auth-footer{
  margin-top: 24px !important;
  padding-top: 18px !important;
  padding-bottom: 4px !important;
  border-top: 1px solid #F6ECE8 !important;
}

/* Phone box: more breathing room from the sides */
.szd-auth-card{
  padding: 4px 6px 0 !important;
}
.szd-auth-input-row{
  margin: 0 6px !important;
  padding: 0 14px !important;
}
.szd-auth-btn-wrap{
  margin: 18px 6px 0 !important;
}
.szd-auth-lbl{
  padding: 0 8px !important;
}

/* ========= S12f: kill the empty white area BELOW footer (no forced 100vh) ========= */
/* Page height = content height. No element stretches to 100vh, so nothing
   creates empty space under the footer. */
.szd-auth-shell{
  min-height: 0 !important;
  height: auto !important;
  padding: 26px 22px 18px !important;
  box-shadow: none !important;     /* drop the card shadow so no "box" look */
}
body.psy-smart-login,
body.auth-login,
.szd-auth-wrapper,
.content-loginyar.szd-auth-wrapper{
  min-height: 0 !important;
  height: auto !important;
  background: #FFFFFF !important;
}
/* html stays white so anything below the (short) page is clean white */
html:has(body.psy-smart-login),
html:has(body.auth-login){
  background: #FFFFFF !important;
}
/* Footer: snug after content, no extra bottom padding */
.szd-auth-footer{
  margin-top: 22px !important;
  padding: 16px 0 6px !important;
  border-top: 1px solid #F6ECE8 !important;
}

/* S12f wrapper height reset (clean) */
body.psy-smart-login #wrapper,
body.psy-smart-login #columns,
body.psy-smart-login .columns-container,
body.psy-smart-login #content-wrapper,
body.psy-smart-login #page_wrapper,
body.psy-smart-login #body_wrapper,
body.psy-smart-login .st-content,
body.psy-smart-login .st-content-inner,
body.psy-smart-login .st-pusher,
body.psy-smart-login .st-container,
body.auth-login #wrapper,
body.auth-login #columns,
body.auth-login .columns-container{
  min-height: 0 !important;
  height: auto !important;
}

/* ========= S12g: remove body bottom-padding (bnav clearance) on auth pages ========= */
/* The mobile bottom-nav adds body{padding-bottom:108px}. Auth pages have no
   bottom-nav, so that padding was creating empty space below the footer. */
body.psy-smart-login,
body.auth-login{
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
/* Bottom-nav itself never shows on auth pages */
body.psy-smart-login .szd-bnav,
body.auth-login .szd-bnav{
  display: none !important;
}

/* ================================================================================
   SHAZDEH — S13: Universal auth styling for ALL psy_smartlogin pages
   (login, register, verify, password, forget, login-password,
    change-password, information, welcome) + iOS fox-glow fix.
   ================================================================================ */

/* ---- iOS fox glow (drop-shadow caused a hard border on Safari) ---- */
.szd-auth-mascot{
  position: relative !important;
}
.szd-auth-mascot img{
  filter: none !important;   /* kill drop-shadow border artifact on iOS */
  position: relative;
  z-index: 1;
}
.szd-auth-mascot__glow{
  position: absolute !important;
  left: 50%;
  top: 56%;
  width: 78%;
  height: 42%;
  transform: translate(-50%, -50%);
  background: radial-gradient(ellipse at center, rgba(224,86,139,0.22) 0%, rgba(255,159,90,0.12) 45%, rgba(255,159,90,0) 72%);
  filter: blur(10px);
  z-index: 0;
  pointer-events: none;
  border-radius: 50%;
}

/* ---- Generic section/title styling for pages that still use <h4> ---- */
#psy-step,
.psy-verifyOtp{
  text-align: center !important;
}
#psy-step > h4,
.psy-verifyOtp > h4{
  font-size: 20px !important;
  font-weight: 900 !important;
  color: #3D2C2E !important;
  text-align: center !important;
  margin: 6px 0 8px !important;
  line-height: 1.5 !important;
}
.psy-helpText{
  text-align: center !important;
  color: #7B6B6D !important;
  font-size: 13px !important;
  line-height: 1.85 !important;
  margin: 0 auto 16px !important;
  max-width: 340px !important;
}

/* ---- Form container ---- */
.psy-login-form,
.psy-verify-form{
  background: transparent !important;
  margin: 0 !important;
}

/* ---- Every input field = the cream pill box (no nested box) ---- */
#psy-step .psy-form-group,
.psy-verifyOtp .psy-form-group{
  margin: 0 6px 12px !important;
  text-align: right !important;
}
.psy-form-group > .form-control,
.psy-login-form input.form-control,
.psy-login-form input[type="text"],
.psy-login-form input[type="tel"],
.psy-login-form input[type="email"],
.psy-login-form input[type="password"],
.psy-verify-form input.form-control{
  width: 100% !important;
  background: #FFF5F0 !important;
  border: 2px solid transparent !important;
  border-radius: 14px !important;
  padding: 0 16px !important;
  height: 54px !important;
  font-family: 'Vazirmatn','Tahoma',sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #3D2C2E !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  transition: border-color .2s, background .2s !important;
  direction: rtl !important;
  text-align: right !important;
}
.psy-login-form input.form-control:focus,
.psy-login-form input:focus,
.psy-verify-form input.form-control:focus{
  border-color: #F478A9 !important;
  background: #fff !important;
  box-shadow: 0 0 0 4px rgba(244,120,169,0.10) !important;
  outline: 0 !important;
}
.psy-login-form input::placeholder,
.psy-verify-form input::placeholder{
  color: #B9A6A2 !important;
  font-weight: 600 !important;
}
/* Password / phone fields that should read LTR */
.psy-always-ltr,
input[name="password"]{
  direction: ltr !important;
  text-align: left !important;
}
.psy-always-center{ text-align: center !important; }

/* ---- Primary button (gradient pill) everywhere ---- */
.psy-btn-primary,
.psy-btn-smartlogin{
  width: 100% !important;
  background: linear-gradient(135deg, #F478A9 0%, #FF8FBD 100%) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 16px !important;
  padding: 16px !important;
  font-family: 'Vazirmatn','Tahoma',sans-serif !important;
  font-weight: 900 !important;
  font-size: 14px !important;
  cursor: pointer !important;
  box-shadow: 0 8px 18px rgba(244,120,169,0.40) !important;
  transition: transform .15s, box-shadow .15s !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  text-decoration: none !important;
}
.psy-btn-primary:active,
.psy-btn-smartlogin:active{
  transform: scale(0.98) !important;
  box-shadow: 0 4px 12px rgba(244,120,169,0.50) !important;
}
/* Button-group: stack the "forgot password" link above the button neatly */
.psy-form-btn{
  display: flex !important;
  flex-direction: column-reverse !important;
  gap: 12px !important;
  align-items: stretch !important;
  margin: 16px 6px 0 !important;
}
.psy-form-btn > a,
#psy-step .psy-form-btn a{
  text-align: center !important;
  color: #E0568B !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  padding: 4px !important;
}
.psy-form-btn > a:hover{ text-decoration: underline !important; }

/* ---- Secondary button ---- */
.psy-btn-secondary{
  background: #FFF0F5 !important;
  color: #E0568B !important;
  border: 1px solid #FAD3E3 !important;
  border-radius: 12px !important;
  padding: 10px 16px !important;
  font-family: inherit !important;
  font-weight: 800 !important;
  font-size: 12px !important;
  cursor: pointer !important;
}

/* ---- Alt links / messages (register prompt, otp prompt, etc.) ---- */
.psy-message-register,
.psy-message-login-otp,
.psy-message-login-password{
  text-align: center !important;
  margin: 16px 0 0 !important;
  font-size: 12.5px !important;
  color: #7B6B6D !important;
}
.psy-message-register a,
.psy-message-login-otp a,
.psy-message-login-password a,
#psy-show-form{
  color: #E0568B !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  cursor: pointer !important;
}
.psy-message-register a:hover,
.psy-message-login-otp a:hover,
.psy-message-login-password a:hover{ text-decoration: underline !important; }

/* "Change number/email" inline link */
.psy-change-username{
  color: #E0568B !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  cursor: pointer !important;
  text-decoration: underline !important;
}

/* ---- Error text ---- */
#psy-errors,
.psy-helpText#psy-errors{
  color: #D32F2F !important;
  font-size: 12px !important;
  text-align: center !important;
  margin-top: 8px !important;
  font-weight: 700 !important;
}

/* ---- Success / welcome icon header (login-password change-success) ---- */
.psy-welcome .icon-header,
.psy-change-password .icon-header{
  width: 64px !important;
  height: 64px !important;
  margin: 0 auto 12px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #6FD3CB, #3DA39B) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  font-size: 28px !important;
  box-shadow: 0 8px 18px rgba(61,163,155,0.30) !important;
}

/* ---- OTP countdown circle (verify) ---- */
#psy-countdown{ position: relative !important; width: 30px !important; height: 30px !important; }
#psy-countdown svg{ transform: rotate(-90deg); }
#psy-countdown .psy-circle{
  fill: none !important;
  stroke: #F478A9 !important;
  stroke-width: 2.5 !important;
  stroke-dasharray: 82 !important;
  stroke-linecap: round !important;
}
#psy-timer{
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  color: #3D2C2E !important;
  font-variant-numeric: tabular-nums !important;
}
#psy-resend{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  margin: 4px 0 8px !important;
  font-size: 12px !important;
  color: #7B6B6D !important;
}

/* ---- Register form fields (per-field rows from form-fields.tpl) ---- */
.szd-auth-step--register .psy-form-group label,
#psy-cutomer-form label{
  display: block !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  color: #3D2C2E !important;
  margin-bottom: 6px !important;
  text-align: right !important;
}
#psy-cutomer-form select{
  width: 100% !important;
  background: #FFF5F0 !important;
  border: 2px solid transparent !important;
  border-radius: 14px !important;
  padding: 14px 12px !important;
  font-family: inherit !important;
  font-size: 14px !important;
  color: #3D2C2E !important;
  outline: 0 !important;
}
#psy-cutomer-form select:focus{ border-color: #F478A9 !important; background:#fff !important; }

/* ================================================================================
   SHAZDEH — Customer Wallet page (wkcustomerwallet override)
   Gradient balance hero + add-money + transaction history.
   ================================================================================ */

.szd-wallet{
  max-width: 760px;
  margin: 0 auto;
  padding: 16px 14px 40px;
  font-family: 'Vazirmatn','Tahoma',sans-serif;
}
.szd-wallet *{ font-family: 'Vazirmatn','Tahoma',sans-serif; box-sizing: border-box; }

/* ---- HERO BALANCE CARD ---- */
.szd-wallet__hero{
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  padding: 22px 22px 24px;
  background: linear-gradient(135deg, #F478A9 0%, #E0568B 55%, #C9447A 100%);
  color: #fff;
  box-shadow: 0 16px 36px rgba(224,86,139,0.34), 0 4px 10px rgba(0,0,0,0.08);
  margin-bottom: 16px;
}
.szd-wallet__hero-bg{ position:absolute; inset:0; pointer-events:none; }
.szd-wallet__coin{
  position:absolute; border-radius:50%;
  background: rgba(255,255,255,0.12);
}
.szd-wallet__coin--1{ width:120px; height:120px; top:-40px; left:-30px; }
.szd-wallet__coin--2{ width:80px; height:80px; bottom:-30px; left:30%; background:rgba(255,255,255,0.08); }
.szd-wallet__coin--3{ width:160px; height:160px; top:-60px; right:-50px; background:rgba(255,255,255,0.07); }

.szd-wallet__hero-top{
  position:relative; z-index:2;
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom: 16px;
}
.szd-wallet__hero-label{
  display:flex; align-items:center; gap:8px;
  font-size:13px; font-weight:800; opacity:0.95;
}
.szd-wallet__hero-label svg{ width:20px; height:20px; }
.szd-wallet__hero-badge{
  font-size:10px; font-weight:700;
  background: rgba(255,255,255,0.18);
  padding:4px 10px; border-radius:100px;
  backdrop-filter: blur(4px);
}
.szd-wallet__balance{
  position:relative; z-index:2;
  font-size:34px; font-weight:900;
  letter-spacing:-0.5px;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 2px 8px rgba(0,0,0,0.12);
  display:flex; align-items:baseline; gap:6px;
}
.szd-wallet__balance .ishop-currency-symbol{
  font-size:0.5em; opacity:0.9; font-weight:700;
}
.szd-wallet__cashback{
  position:relative; z-index:2;
  margin-top:12px;
  display:inline-flex; align-items:center; gap:6px;
  background: rgba(255,255,255,0.20);
  padding:7px 12px; border-radius:12px;
  font-size:12px; font-weight:700;
}
.szd-wallet__cashback svg{ width:16px; height:16px; }

/* ---- GENERIC CARD ---- */
.szd-wallet__card{
  background:#fff;
  border-radius:20px;
  padding:18px 16px;
  box-shadow: 0 8px 22px rgba(244,120,169,0.10), 0 2px 6px rgba(0,0,0,0.04);
  margin-bottom:16px;
}
.szd-wallet__card-title{
  display:flex; align-items:center; gap:8px;
  font-size:15px; font-weight:900; color:#3D2C2E;
  margin:0 0 16px;
}
.szd-wallet__card-title svg{ width:20px; height:20px; color:#E0568B; }

/* ---- ADD MONEY ---- */
.szd-wallet__amount-row{
  display:flex; align-items:center;
  background:#FFF5F0; border:2px solid transparent;
  border-radius:14px; padding:0 14px; height:56px;
  transition:border-color .2s, box-shadow .2s;
}
.szd-wallet__amount-row:focus-within{
  border-color:#F478A9; box-shadow:0 0 0 4px rgba(244,120,169,0.10);
}
.szd-wallet__amount-input{
  flex:1; border:0; background:transparent; outline:0;
  font-size:18px; font-weight:800; color:#3D2C2E;
  direction:ltr; text-align:left;
  font-variant-numeric: tabular-nums;
}
.szd-wallet__amount-input::placeholder{ color:#B9A6A2; font-weight:600; font-size:15px; }
.szd-wallet__amount-cur{
  font-size:13px; font-weight:800; color:#E0568B;
  padding-right:10px; border-right:1px solid #E6D5CF; padding-left:2px;
  white-space:nowrap;
}
.szd-wallet__chips{
  display:grid; grid-template-columns:repeat(4,1fr); gap:8px;
  margin:14px 0;
}
.szd-wallet__chip{
  background:#FFF0F5; border:1px solid #FAD3E3; border-radius:12px;
  padding:10px 4px; font-family:inherit; font-size:12px; font-weight:800;
  color:#E0568B; cursor:pointer; transition:all .15s;
  font-variant-numeric: tabular-nums;
}
.szd-wallet__chip:hover{ background:#FFE3EC; }
.szd-wallet__chip.--on{ background:#F478A9; color:#fff; border-color:#F478A9; }

.szd-wallet__cta{
  width:100%; background:linear-gradient(135deg,#F478A9,#FF8FBD);
  color:#fff; border:0; border-radius:16px; padding:16px;
  font-family:inherit; font-weight:900; font-size:14px; cursor:pointer;
  box-shadow:0 8px 18px rgba(244,120,169,0.40);
  transition:transform .15s, box-shadow .15s;
  display:flex; align-items:center; justify-content:center; gap:6px;
}
.szd-wallet__cta:active{ transform:scale(0.98); box-shadow:0 4px 12px rgba(244,120,169,0.5); }
.szd-wallet__cta svg{ width:18px; height:18px; }

/* ---- FILTER ---- */
.szd-wallet__filter{
  display:flex; align-items:flex-end; gap:10px;
  margin-bottom:18px; flex-wrap:wrap;
}
.szd-wallet__filter-field{ flex:1; min-width:120px; }
.szd-wallet__filter-field label{
  display:block; font-size:11px; font-weight:800; color:#7B6B6D; margin-bottom:5px;
}
.szd-wallet__date{
  width:100%; background:#FFF5F0; border:2px solid transparent;
  border-radius:12px; padding:0 12px; height:46px;
  font-family:inherit; font-size:13px; font-weight:700; color:#3D2C2E;
  outline:0; transition:border-color .2s; text-align:center;
  font-variant-numeric: tabular-nums;
}
.szd-wallet__date:focus{ border-color:#F478A9; background:#fff; }
.szd-wallet__filter-btn{
  background:#FFF0F5; color:#E0568B; border:1px solid #FAD3E3;
  border-radius:12px; padding:0 18px; height:46px;
  font-family:inherit; font-weight:800; font-size:13px; cursor:pointer;
  white-space:nowrap; transition:background .15s;
}
.szd-wallet__filter-btn:hover{ background:#FFE3EC; }

/* ---- TRANSACTION ROWS ---- */
.szd-wallet__tx-list{ display:flex; flex-direction:column; gap:10px; }
.szd-wallet__tx-row{
  display:flex; align-items:center; gap:12px;
  background:#FCFAF9; border:1px solid #F2E7E3; border-radius:14px;
  padding:12px 14px;
}
.szd-wallet__tx-icon{
  width:40px; height:40px; border-radius:12px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
}
.szd-wallet__tx-icon svg{ width:20px; height:20px; }
.szd-wallet__tx-row.--credit .szd-wallet__tx-icon{ background:#E6F7EA; color:#2E9E4F; }
.szd-wallet__tx-row.--debit .szd-wallet__tx-icon{ background:#FDECEC; color:#D8576B; }
.szd-wallet__tx-main{ flex:1; min-width:0; }
.szd-wallet__tx-summary{
  font-size:13px; font-weight:800; color:#3D2C2E; line-height:1.5;
  margin-bottom:3px;
}
.szd-wallet__tx-summary a{ color:#E0568B; text-decoration:none; }
.szd-wallet__tx-meta{
  font-size:11px; color:#9B8B8D; display:flex; align-items:center;
  gap:5px; flex-wrap:wrap; font-variant-numeric: tabular-nums;
}
.szd-wallet__tx-order{ color:#7B6B6D; text-decoration:none; }
.szd-wallet__tx-dot{ opacity:0.5; }
.szd-wallet__tx-amount{
  font-size:15px; font-weight:900; white-space:nowrap;
  font-variant-numeric: tabular-nums; direction:ltr;
}
.szd-wallet__tx-amount.--plus{ color:#2E9E4F; }
.szd-wallet__tx-amount.--minus{ color:#D8576B; }

/* ---- EMPTY ---- */
.szd-wallet__empty{
  text-align:center; padding:36px 16px; color:#B9A6A2;
}
.szd-wallet__empty svg{ width:48px; height:48px; margin-bottom:10px; opacity:0.6; }
.szd-wallet__empty p{ font-size:13px; font-weight:700; margin:0; }

/* ---- PAGINATION ---- */
.szd-wallet__pager{
  display:flex; align-items:center; justify-content:space-between;
  margin-top:18px; gap:10px; flex-wrap:wrap;
}
.szd-wallet__pager-info{ font-size:12px; color:#7B6B6D; font-weight:600; }
.szd-wallet__pager-list{
  display:flex; gap:6px; list-style:none; margin:0; padding:0;
}
.szd-wallet__pager-link{
  display:flex; align-items:center; justify-content:center;
  min-width:36px; height:36px; padding:0 8px;
  border-radius:10px; background:#FFF5F0; color:#5A4A4C;
  font-weight:800; font-size:13px; text-decoration:none;
  transition:all .15s; font-variant-numeric: tabular-nums;
}
.szd-wallet__pager-link:hover{ background:#FFE3EC; color:#E0568B; }
.szd-wallet__pager-list li.--current .szd-wallet__pager-link{
  background:#F478A9; color:#fff;
}
.szd-wallet__pager-link.--disabled{ opacity:0.4; pointer-events:none; }
.szd-wallet__pager-spacer{ padding:0 6px; color:#B9A6A2; }

/* ---- Mobile: single column chips, stack filter ---- */
@media (max-width:520px){
  .szd-wallet__balance{ font-size:28px; }
  .szd-wallet__filter{ flex-direction:column; align-items:stretch; }
  .szd-wallet__filter-btn{ width:100%; }
  .szd-wallet__tx-amount{ font-size:14px; }
}

/* ---- Hide the bnav clearance issue isn't needed; wallet is a normal account page ---- */

/* ================================================================================
   SHAZDEH — S15: auth final polish
   full-height shell · footer near bottom · box-in-box fix · label right ·
   OTP center+persian · countdown · success icon · side spacing
   ================================================================================ */

/* ---- FULL-HEIGHT WHITE SHELL: fills phone, footer near bottom, no extra space ---- */
body.psy-smart-login,
body.auth-login{
  padding-bottom: 0 !important;     /* kill bnav clearance that added bottom gap */
  margin-bottom: 0 !important;
  min-height: 100vh !important;
}
.szd-auth-shell{
  min-height: 100vh !important;
  height: auto !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  padding: 28px 26px 18px !important;   /* more side spacing (register "فاصله از دیواره") */
  box-shadow: none !important;
}
/* Footer pinned a bit above the floor */
.szd-auth-footer{
  margin-top: auto !important;
  padding: 18px 0 10px !important;
  border-top: 1px solid #F6ECE8 !important;
}
/* bnav never on auth pages */
body.psy-smart-login .szd-bnav,
body.auth-login .szd-bnav{ display: none !important; }

/* ---- LOGIN: label right-aligned (was center) ---- */
.szd-auth-lbl,
.szd-auth-step--login .szd-auth-lbl{
  text-align: right !important;
  display: block !important;
}

/* ---- BOX-IN-BOX FIX: display input must stay transparent even on focus
        (S13's generic ".psy-login-form input:focus" was re-adding a box) ---- */
.szd-auth-input-row .szd-auth-input--display,
.szd-auth-input-row .szd-auth-input--display:focus,
.psy-login-form .szd-auth-input--display,
.psy-login-form .szd-auth-input--display:focus,
#szd-auth-display,
#szd-auth-display:focus{
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

/* ---- OTP FIELD: centered, big, persian-friendly ---- */
.szd-auth-otp-wrap{ margin: 6px 0 4px !important; }
.szd-auth-otp{
  width: 100% !important;
  background: #FFF5F0 !important;
  border: 2px solid #F2E7E3 !important;
  border-radius: 16px !important;
  padding: 18px 12px !important;
  font-family: 'Vazirmatn','Tahoma',sans-serif !important;
  font-size: 26px !important;
  font-weight: 900 !important;
  color: #E0568B !important;
  text-align: center !important;       /* center the code */
  letter-spacing: 14px !important;
  text-indent: 14px !important;        /* offset so letter-spacing stays visually centered */
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  direction: ltr !important;
  font-variant-numeric: tabular-nums !important;
}
.szd-auth-otp:focus{
  border-color: #F478A9 !important;
  background: #fff !important;
  box-shadow: 0 0 0 4px rgba(244,120,169,0.12) !important;
}
.szd-auth-otp::placeholder{
  color: #D9C6C2 !important;
  letter-spacing: 10px !important;
  text-indent: 10px !important;
  font-size: 22px !important;
}

/* ---- COUNTDOWN circle: clean ring + centered number ---- */
.szd-auth-resend-wrap{ margin: 14px 6px 4px !important; }
.szd-auth-resend{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}
.szd-auth-resend__countdown{
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: #7B6B6D !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}
.szd-auth-countdown{
  position: relative !important;
  width: 34px !important;
  height: 34px !important;
  flex-shrink: 0 !important;
}
.szd-auth-countdown svg{ transform: rotate(-90deg); display:block; }
.szd-auth-countdown__track{
  fill: none !important;
  stroke: #F2E7E3 !important;
  stroke-width: 3 !important;
}
.szd-auth-countdown__bar{
  fill: none !important;
  stroke: #F478A9 !important;
  stroke-width: 3 !important;
  stroke-linecap: round !important;
  stroke-dasharray: 94.2 !important;   /* 2πr = 2*π*15 */
  stroke-dashoffset: 0 !important;
}
#psy-timer{
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  color: #3D2C2E !important;
  font-variant-numeric: tabular-nums !important;
}
.szd-auth-resend__hint{ font-size: 11px !important; }
.szd-auth-resend__btn{
  display: none;   /* shown by module JS when timer ends */
  background: #FFF0F5 !important;
  color: #E0568B !important;
  border: 1px solid #FAD3E3 !important;
  border-radius: 12px !important;
  padding: 8px 14px !important;
  font-weight: 800 !important;
  font-size: 12px !important;
  cursor: pointer !important;
}

/* ---- WELCOME success icon (replaces broken fa-check) ---- */
.szd-auth-success-icon{
  width: 84px !important;
  height: 84px !important;
  margin: 8px auto 16px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #6FD3CB, #3DA39B) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  box-shadow: 0 12px 26px rgba(61,163,155,0.35) !important;
  animation: szd-auth-pop .5s cubic-bezier(.34,1.56,.64,1) 1 !important;
}
.szd-auth-success-icon svg{ width: 42px !important; height: 42px !important; }
@keyframes szd-auth-pop{
  0%{ transform: scale(0.4); opacity: 0; }
  100%{ transform: scale(1); opacity: 1; }
}
.szd-auth-step--welcome{ text-align: center !important; padding-top: 12vh; }
/* Hide any leftover broken icon-font glyphs in auth */
.psy-welcome .icon-header,
.szd-auth-step .fa,
.szd-auth-step .material-icons{ display: none !important; }

/* ---- REGISTER / information page: comfy field spacing ---- */
.szd-auth-step--register .szd-auth-card{ padding-top: 6px !important; }
.szd-auth-step--register .psy-form-group{ margin: 0 0 14px !important; text-align: right !important; }
.szd-auth-step--register .psy-form-group:last-of-type{ margin-bottom: 0 !important; }

/* ---- "change number" phone-display row ---- */
.szd-auth-phone-display{
  text-align: center !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  color: #3D2C2E !important;
  margin: 2px 0 14px !important;
}
.szd-auth-otp-target{
  direction: ltr !important;
  font-variant-numeric: tabular-nums !important;
  margin-left: 8px !important;
}
.szd-auth-change{
  background: transparent !important;
  border: 0 !important;
  color: #E0568B !important;
  font-family: inherit !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  text-decoration: underline !important;
  padding: 0 !important;
}

/* ================================================================================
   SHAZDEH — S16: Iran flag chip + support footer (icon + lifted above browser bar)
   ================================================================================ */

/* ---- Iran flag chip (replaces +۹۸ text) ---- */
.szd-auth-flag-chip{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 10px 0 8px !important;
  border-left: 0 !important;
  border-right: 1px solid #E6D5CF !important;
  height: 30px !important;
  flex-shrink: 0 !important;
  order: 0 !important;
}
.szd-auth-flag-ir{
  display: block !important;
  width: 26px !important;
  height: 18px !important;
  border-radius: 3px !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.12) !important;
}

/* ---- SUPPORT FOOTER: lifted above Android Chrome bottom bar, with icon ---- */
.szd-auth-footer{
  margin-top: auto !important;
  /* lift well above the browser chrome / safe-area on Android & iOS */
  margin-bottom: calc(28px + env(safe-area-inset-bottom, 0px)) !important;
  padding: 0 !important;
  border-top: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  background: #FFF5F0 !important;
  border: 1px solid #F2E7E3 !important;
  border-radius: 16px !important;
  padding: 11px 16px !important;
  box-shadow: 0 4px 14px rgba(244,120,169,0.10) !important;
  width: fit-content !important;
  margin-left: auto !important;
  margin-right: auto !important;
  transition: transform .15s, box-shadow .15s !important;
}
.szd-auth-footer:active{
  transform: scale(0.97) !important;
}
.szd-auth-footer__icon{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #F478A9, #E0568B) !important;
  color: #fff !important;
  flex-shrink: 0 !important;
  box-shadow: 0 4px 10px rgba(224,86,139,0.30) !important;
}
.szd-auth-footer__icon svg{
  width: 19px !important;
  height: 19px !important;
}
.szd-auth-footer__txt{
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  line-height: 1.35 !important;
}
.szd-auth-footer__label{
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #9B7A6E !important;
}
.szd-auth-footer__phone{
  font-size: 15px !important;
  font-weight: 900 !important;
  color: #3D2C2E !important;
  font-variant-numeric: tabular-nums !important;
  direction: ltr !important;
  letter-spacing: 0.3px !important;
}

/* ========= S17: wallet amount alignment + jalali date invalid state ========= */
/* Placeholder right-aligned, typed amount centered */
.szd-wallet__amount-input{ text-align: center !important; direction: ltr !important; }
.szd-wallet__amount-input:placeholder-shown{ text-align: right !important; direction: rtl !important; }
/* ����� vector symbol sizing inside the amount currency chip + balance */
.szd-wallet__amount-cur .ishop-currency-symbol.ishop-currency-irt{
  width: 1.3em !important; height: 1em !important; vertical-align: -0.15em !important;
}
.szd-wallet__balance .ishop-currency-symbol.ishop-currency-irt{
  width: 0.62em !important; height: 0.5em !important; vertical-align: 0.04em !important;
  margin-right: 4px !important; background-color: rgba(255,255,255,0.95) !important;
}
.szd-wallet__tx-amount .ishop-currency-symbol.ishop-currency-irt{
  width: 1.15em !important; height: 0.9em !important; vertical-align: -0.12em !important; margin-right: 2px !important;
}
/* invalid jalali date */
.szd-wallet__date.--invalid{ border-color: #E57373 !important; background: #FFF3F3 !important; }

/* ========= S18: auth shell uses svh (visible viewport) so footer never cut off ========= */
.szd-auth-shell{
  /* 100vh on mobile includes area behind the browser toolbar ? bottom gets hidden.
     svh = small viewport height = always-visible area. dvh as progressive enhancement. */
  min-height: 100vh !important;
  min-height: 100svh !important;
}
@supports (height: 100dvh){
  .szd-auth-shell{ min-height: 100dvh !important; }
}
/* Footer lifted clearly above the bottom edge / safe area */
.szd-auth-footer{
  margin-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
}
/* Iran flag emoji chip */
.szd-auth-flag-emoji{
  font-size: 20px !important;
  line-height: 1 !important;
  display: inline-block !important;
  /* emoji-capable font stack so it renders the flag (not "IR") on all devices */
  font-family: "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji","Twemoji Mozilla",sans-serif !important;
}

/* ========= S19: OTP center + amount font + bigger balance ����� ========= */
/* OTP dashes/code centered (was right-aligned) */
.szd-auth-otp,
.szd-auth-otp-wrap .szd-auth-otp,
#szd-otp-display{
  text-align: center !important;
  text-indent: 0 !important;
  direction: ltr !important;
}
.szd-auth-otp::placeholder{ text-align: center !important; text-indent: 0 !important; }

/* Add-money amount: smaller font so the ����� symbol fits fully in the box */
.szd-wallet__amount-input{
  font-size: 15px !important;
}
.szd-wallet__amount-row{ padding: 0 12px !important; }
.szd-wallet__amount-cur{
  font-size: 12px !important;
  padding-right: 8px !important;
  padding-left: 4px !important;
  flex-shrink: 0 !important;
}
.szd-wallet__amount-cur .ishop-currency-symbol.ishop-currency-irt{
  width: 1.5em !important; height: 1.05em !important; vertical-align: -0.18em !important;
}

/* Bigger ����� next to the wallet balance in the hero card */
.szd-wallet__balance{ font-size: 32px !important; }
.szd-wallet__balance .ishop-currency-symbol.ishop-currency-irt{
  width: 0.85em !important;
  height: 0.62em !important;
  vertical-align: 0.02em !important;
  margin-right: 6px !important;
  background-color: rgba(255,255,255,0.97) !important;
}

/* ================================================================================
   SHAZDEH — Customer Account Dashboard (.szd-acc)
   ================================================================================ */
.szd-acc{
  max-width: 640px;
  margin: 0 auto;
  padding: 38px 14px 40px;
  font-family: 'Vazirmatn','Tahoma',sans-serif;
}
.szd-acc *{ font-family:'Vazirmatn','Tahoma',sans-serif; box-sizing:border-box; }

/* ---- HERO / PROFILE ---- */
.szd-acc__hero{
  position: relative;
  margin: 0 -14px;
  padding: 22px 20px 56px;
  background: linear-gradient(135deg, #F478A9 0%, #E0568B 60%, #C9447A 100%);
  overflow: hidden;
}
.szd-acc__hero-bg{
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 85% -10%, rgba(255,255,255,0.18), transparent 45%),
    radial-gradient(circle at 10% 120%, rgba(255,255,255,0.10), transparent 40%);
  pointer-events:none;
}
.szd-acc__user{
  position:relative; z-index:2;
  display:flex; align-items:center; gap:14px;
}
.szd-acc__avatar{
  width:60px; height:60px; border-radius:50%;
  background: rgba(255,255,255,0.22);
  display:flex; align-items:center; justify-content:center;
  color:#fff; flex-shrink:0;
  border:2px solid rgba(255,255,255,0.35);
}
.szd-acc__avatar svg{ width:30px; height:30px; }
.szd-acc__name{ font-size:18px; font-weight:900; color:#fff; line-height:1.3; }
.szd-acc__edit{
  display:inline-block; margin-top:5px;
  font-size:12px; font-weight:700; color:#fff;
  background: rgba(255,255,255,0.2);
  padding:4px 12px; border-radius:100px; text-decoration:none;
}
.szd-acc__edit:hover{ background:rgba(255,255,255,0.3); }

/* ---- WALLET (overlaps hero) ---- */
.szd-acc__wallet{
  display:block;
  margin-top:-38px; position:relative; z-index:3;
  background:#fff; border-radius:20px; padding:16px 18px;
  box-shadow: 0 12px 30px rgba(244,120,169,0.20), 0 2px 6px rgba(0,0,0,0.05);
  text-decoration:none;
}
.szd-acc__wallet-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.szd-acc__wallet-label{ display:flex; align-items:center; gap:7px; font-size:12.5px; font-weight:800; color:#3D2C2E; }
.szd-acc__wallet-label svg{ width:18px; height:18px; color:#E0568B; }
.szd-acc__wallet-go{ font-size:11px; font-weight:800; color:#E0568B; }
.szd-acc__wallet-balance{ font-size:24px; font-weight:900; color:#3D2C2E; font-variant-numeric:tabular-nums; display:flex; align-items:baseline; gap:5px; }
.szd-acc__wallet-balance .ishop-currency-symbol.ishop-currency-irt{ width:0.85em; height:0.62em; vertical-align:0.02em; margin-right:4px; background-color:#E0568B; }

/* ---- STATS ---- */
.szd-acc__stats{
  display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:14px;
}
.szd-acc__stat{
  background:#fff; border-radius:16px; padding:14px 8px; text-align:center;
  box-shadow: 0 4px 14px rgba(244,120,169,0.08);
}
.szd-acc__stat-num{ display:block; font-size:22px; font-weight:900; color:#E0568B; font-variant-numeric:tabular-nums; }
.szd-acc__stat-lbl{ display:block; font-size:10.5px; font-weight:700; color:#7B6B6D; margin-top:3px; }

/* ---- SECTION TITLE ---- */
.szd-acc__sec-title{ display:flex; align-items:center; justify-content:space-between; margin:22px 2px 12px; }
.szd-acc__sec-title h3{ font-size:15px; font-weight:900; color:#3D2C2E; margin:0; }
.szd-acc__sec-title a{ font-size:12px; font-weight:700; color:#E0568B; text-decoration:none; }

/* ---- ORDER CARDS ---- */
.szd-acc__orders{ display:flex; flex-direction:column; gap:10px; }
.szd-acc__order{
  display:flex; align-items:center; gap:12px;
  background:#fff; border-radius:16px; padding:12px 14px;
  box-shadow:0 3px 12px rgba(0,0,0,0.04); text-decoration:none;
  border:1px solid #F2E7E3;
}
.szd-acc__order-icon{ width:42px; height:42px; border-radius:13px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.szd-acc__order-icon svg{ width:22px; height:22px; }
.szd-acc__order-icon--done{ background:#E6F7EA; color:#2E9E4F; }
.szd-acc__order-icon--ship{ background:#FFF3E0; color:#E08F1C; }
.szd-acc__order-icon--proc{ background:#FFF0F5; color:#E0568B; }
.szd-acc__order-body{ flex:1; min-width:0; }
.szd-acc__order-id{ font-size:13px; font-weight:800; color:#3D2C2E; }
.szd-acc__order-status{ font-size:11.5px; color:#9B8B8D; margin-top:2px; }
.szd-acc__order-price{ font-size:14px; font-weight:900; color:#3D2C2E; white-space:nowrap; font-variant-numeric:tabular-nums; }
.szd-acc__order-price .ishop-currency-symbol.ishop-currency-irt{ width:1.1em; height:0.85em; vertical-align:-0.1em; margin-right:2px; }

/* ---- MENU GRID ---- */
.szd-acc__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.szd-acc__tile{
  display:flex; flex-direction:column; gap:6px;
  background:#fff; border-radius:16px; padding:16px 14px;
  text-decoration:none; box-shadow:0 3px 12px rgba(0,0,0,0.04); border:1px solid #F2E7E3;
  transition:transform .15s, box-shadow .15s;
}
.szd-acc__tile:active{ transform:scale(0.98); }
.szd-acc__tile-icon{
  width:44px; height:44px; border-radius:13px;
  background:linear-gradient(135deg,#FFE3EC,#FFD6E6);
  display:flex; align-items:center; justify-content:center; color:#E0568B;
}
.szd-acc__tile-icon svg{ width:22px; height:22px; }
.szd-acc__tile-name{ font-size:13.5px; font-weight:800; color:#3D2C2E; }
.szd-acc__tile-sub{ font-size:11px; font-weight:600; color:#9B8B8D; font-variant-numeric:tabular-nums; }

/* ---- SETTINGS ROWS ---- */
.szd-acc__rows{ display:flex; flex-direction:column; background:#fff; border-radius:16px; overflow:hidden; box-shadow:0 3px 12px rgba(0,0,0,0.04); border:1px solid #F2E7E3; }
.szd-acc__row{
  display:flex; align-items:center; gap:12px; padding:14px 16px;
  text-decoration:none; border-bottom:1px solid #F6ECE8;
}
.szd-acc__row:last-child{ border-bottom:0; }
.szd-acc__row-icon{ width:32px; height:32px; border-radius:10px; background:#FFF5F0; display:flex; align-items:center; justify-content:center; color:#7B6B6D; flex-shrink:0; }
.szd-acc__row-icon svg{ width:18px; height:18px; }
.szd-acc__row-name{ flex:1; font-size:13px; font-weight:700; color:#3D2C2E; }
.szd-acc__row-arrow{ color:#C9B8B5; }
.szd-acc__row-arrow svg{ width:16px; height:16px; }
.szd-acc__row--danger .szd-acc__row-icon{ background:#FDECEC; color:#D8576B; }
.szd-acc__row--danger .szd-acc__row-name{ color:#D8576B; }

/* ---- hide the default plain account tiles + greeting (we replace them) ---- */
.szd-acc ~ .myacount_dashbord_list,
.page-customer-account .page_heading{ display:none !important; }

/* ---- module-injected displayCustomerAccount links: style minimally ---- */
.szd-acc .list-group-item{ list-style:none; }

@media (min-width:560px){
  .szd-acc__grid{ grid-template-columns:repeat(3,1fr); }
}

/* ========= S21: login phone input � authoritative left-align (id-specificity, last-wins) ========= */
#szd-auth-username.szd-auth-input--display,
.szd-auth-input-row--phone #szd-auth-username{
  text-align: left !important;
  direction: ltr !important;
}
#szd-auth-username.szd-auth-input--display::placeholder{
  text-align: left !important;
  direction: ltr !important;
}

/* ===== AI-chat FAB — REVERTED per user: calm button + pulsing line rings,
   NO rotating conic band, no float/glow/bob. Keeps the lively radar pulse the
   user preferred; base styling (gradient/breath/svg/dot) comes from the block above. ===== */
.szd-bnav__chat-pulse{
  inset:0 !important; border:2.5px solid rgba(111,211,203,.75) !important;
  background:transparent !important; opacity:0 !important; border-radius:50% !important;
  animation:szd-chat-radar 2.4s ease-out infinite !important;
}
.szd-bnav__chat-pulse--p2{ animation-delay:.8s !important; }
.szd-bnav__chat-pulse--p3{ animation-delay:1.6s !important; }
@keyframes szd-chat-radar{ 0%{transform:scale(1);opacity:.6} 100%{transform:scale(2);opacity:0} }

/* ============================================================================
   S27 — MOBILE HEADER cleanup (per user): contained cart shadow, clean search
   box (no ghost box behind it), magnifier on the LEFT (no pink chip) + animated,
   smart/responsive logo widths (no wrap under search), search dropdown above ticker.
   ============================================================================ */
@media (max-width:1023px){
  /* --- smart widths: logo text never wraps under the search --- */
  .szd-hdr--mob .szd-hdr-m__row{
    grid-template-columns:40px 128px minmax(46px,1fr) 40px !important;  /* logo col wide enough for fox+full name so it never overflows under search */
    overflow:visible !important;            /* so the cart's soft shadow isn't clipped into a hard edge */
    gap:8px !important;align-items:center !important;
    position:relative !important;z-index:40 !important;   /* lift the search row (and its dropdown) above the ticker */
  }
  .szd-hdr--mob .szd-hdr-m__logo{width:128px !important;min-width:128px !important;max-width:128px !important;overflow:visible !important;flex-wrap:nowrap !important;justify-content:flex-end !important;gap:6px !important}
  .szd-hdr--mob .szd-hdr-m__fox{width:38px !important;height:38px !important;flex:0 0 auto !important}
  /* hide the moving ticker while the search is active so it can't overlap the results */
  body.szd-search-on .szd-tkr{opacity:0 !important;visibility:hidden !important;pointer-events:none !important;transition:opacity .15s ease}
  .szd-hdr--mob .szd-hdr-m__text{min-width:0 !important;max-width:none !important;width:auto !important;flex:0 0 auto !important;overflow:visible !important}
  .szd-hdr--mob .szd-hdr-m__text strong{
    display:block !important;white-space:nowrap !important;overflow:visible !important;text-overflow:clip !important;
    font-size:clamp(11px,3.3vw,13.5px) !important;line-height:1.18 !important;
  }
  .szd-hdr--mob .szd-hdr-m__text small{
    display:block !important;white-space:nowrap !important;overflow:visible !important;text-overflow:clip !important;
    font-size:clamp(8px,2.5vw,10px) !important;line-height:1.1 !important;
  }

  /* --- contained, soft cart shadow (fully around the rounded chip) --- */
  .szd-hdr--mob .szd-hdr-m__cart{
    overflow:visible !important;
    box-shadow:0 3px 10px rgba(235,92,149,.34) !important;   /* even, follows the 12px radius — no clipped/sharp edge */
  }

  /* --- CLEAN search: kill the gray "ghost" form box + the stray orange shadow --- */
  .szd-hdr--mob .szd-hdr-m__search .QuickSearchForm,
  .szd-hdr--mob .szd-hdr-m__search .QuickSearchBox{
    background:transparent !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;padding:0 !important;
  }
  .szd-hdr--mob .szd-hdr-m__search .QuickSearchInput{
    background:#fff !important;border:1.5px solid var(--szd-line) !important;border-radius:13px !important;
    box-shadow:none !important;overflow:visible !important;
  }
  .szd-hdr--mob .szd-hdr-m__search .QuickSearchInput:focus-within{
    border-color:var(--szd-pink) !important;box-shadow:0 0 0 3px var(--szd-pink-soft) !important;
  }
  /* --- magnifier: LEFT side, no pink chip, just the pink icon, gently animated --- */
  .szd-hdr--mob .szd-hdr-m__search .QuickSearchInputText{padding:9px 12px 9px 38px !important}
  .szd-hdr--mob .szd-hdr-m__search .QuickSearchBtnSearch{
    left:5px !important;right:auto !important;
    width:26px !important;height:26px !important;border-radius:0 !important;
    background:transparent !important;background-image:none !important;box-shadow:none !important;border:0 !important;
    animation:szd-srch-pulse 2.4s ease-in-out infinite !important;
  }
  .szd-hdr--mob .szd-hdr-m__search .QuickSearchBtnSearch::before{
    content:"" !important;display:block !important;width:18px !important;height:18px !important;
    background:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E0568B' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.5' y2='16.5'/%3E%3C/svg%3E") center/contain no-repeat !important;
  }
  @keyframes szd-srch-pulse{0%,100%{transform:translateY(-50%) scale(1)}50%{transform:translateY(-50%) scale(1.16)}}

  /* --- search dropdown must sit ABOVE the moving ticker ---
     ticker is z:59 via the high-specificity group `.szd-hdr--mob ~ .szd-tkr` (3934);
     match that exact group + come later so we actually win, and drop it below the row. */
  .szd-tkr,
  .szd-hdr--mob ~ .szd-tkr,
  body .szd-tkr{z-index:6 !important}
  .szd-hdr--mob .szd-hdr-m__search .QuickSearchResults,
  .szd-hdr--mob .szd-hdr-m__search .autocomplete-suggestions,
  .QuickSearchResults,
  .autocomplete-suggestions{z-index:2147483600 !important}
}

/* ============================================================================
   S34 — BOTTOM-NAV icons OUTLINE (match mockup). They were rendering solid-filled
   (a fill was leaking onto the shapes); force line-art, and fill only the ACTIVE item.
   ============================================================================ */
.szd-bnav .szd-bnav__row .szd-bnav__item .szd-bnav__icon,
.szd-bnav .szd-bnav__row .szd-bnav__item .szd-bnav__icon path,
.szd-bnav .szd-bnav__row .szd-bnav__item .szd-bnav__icon rect,
.szd-bnav .szd-bnav__row .szd-bnav__item .szd-bnav__icon circle,
.szd-bnav .szd-bnav__row .szd-bnav__item .szd-bnav__icon line,
.szd-bnav .szd-bnav__row .szd-bnav__item .szd-bnav__icon polyline,
.szd-bnav .szd-bnav__row .szd-bnav__item .szd-bnav__icon polygon{
  fill:none !important;stroke:currentColor !important;stroke-width:2 !important;
  stroke-linecap:round !important;stroke-linejoin:round !important;
}
/* active page item = pink, filled (exactly like the mockup's highlighted item) */
.szd-bnav .szd-bnav__row .szd-bnav__item.on .szd-bnav__icon path,
.szd-bnav .szd-bnav__row .szd-bnav__item.on .szd-bnav__icon rect,
.szd-bnav .szd-bnav__row .szd-bnav__item.on .szd-bnav__icon circle{
  fill:currentColor !important;stroke:currentColor !important;
}

/* ============================================================================
   S34b — TICKER (3rd bar) as a FLOATING GLASSY rounded card (per user):
   detach from the side walls, round all 4 corners, gap from the top, frosted
   glass with a thin delicate border — like the bottom nav. Text scrolls inside.
   ============================================================================ */
.szd-tkr,
.szd-hdr--mob ~ .szd-tkr,
body .szd-tkr{
  width:auto !important;
  margin:8px 10px 2px !important;                 /* near-full length, small gap from edges */
  border-radius:13px !important;                  /* all four corners */
  background:rgba(255,255,255,.5) !important;
  -webkit-backdrop-filter:blur(14px) saturate(160%) !important;
  backdrop-filter:blur(14px) saturate(160%) !important;
  border:1px solid rgba(255,255,255,.7) !important;   /* thin, delicate */
  box-shadow:0 6px 16px rgba(45,28,32,.07), inset 0 1px 0 rgba(255,255,255,.5) !important;
  overflow:hidden !important;
}
/* thinner bar (less height) per user */
.szd-tkr > .szd-tkr__track{padding-top:3px !important;padding-bottom:3px !important}
.szd-tkr > .szd-tkr__track > span,.szd-tkr > .szd-tkr__track > a{font-size:11px !important}
/* Safari fallback (no backdrop-filter) → opaque-ish glass */
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .szd-tkr,body .szd-tkr{background:rgba(255,247,243,.94) !important}
}

/* ============================================================================
   S35 — CHAT FAB: (1) robot icon OUTLINE (was solid-filled white), (2) clear
   heartbeat pulse + prominent rings (user: "آیکون توپره / ضربان نداره").
   ============================================================================ */
/* (1) robot = line-art: body/strokes outline, eyes + antenna tip = white dots */
.szd-bnav__chat svg path,
.szd-bnav__chat svg rect,
.szd-bnav__chat svg line,
.szd-bnav__chat svg polyline{
  fill:none !important;stroke:#fff !important;stroke-width:1.8 !important;
  stroke-linecap:round !important;stroke-linejoin:round !important;
}
.szd-bnav__chat svg circle{ fill:#fff !important;stroke:none !important; }
/* (2) clear "lub-dub" heartbeat on the button + stronger expanding rings */
.szd-bnav__chat{ animation:szd-fab-beat 1.9s ease-in-out infinite !important; }
.szd-bnav__chat:active{ animation:none !important;transform:translateX(-50%) scale(.92) !important; }
@keyframes szd-fab-beat{
  0%,100%{ transform:translateX(-50%) scale(1); }
  12%{ transform:translateX(-50%) scale(1.085); }
  24%{ transform:translateX(-50%) scale(1); }
  38%{ transform:translateX(-50%) scale(1.05); }
  55%{ transform:translateX(-50%) scale(1); }
}
.szd-bnav__chat-pulse{
  border-width:3px !important;border-color:rgba(61,163,155,.85) !important;
  animation-duration:1.9s !important;
}svg[fill="none"]{fill:none !important}

/* ============================================================
   S43 — LISTING TOOLBAR THEME (sitewide: category/new/best/prices-drop/search/brand)
   The sort + per-page dropdowns, filter button, grid-list switch and pagers were
   still raw panda. One scoped block themes them all.
   ============================================================ */
#js-product-list-top.products-selection{background:#fff;border:1px solid #f0e2ea !important;border-radius:16px;padding:9px 10px !important;box-shadow:0 5px 14px rgba(45,28,32,.05);margin:6px 0 14px;gap:8px;align-items:center}
#js-product-list-top .dropdown_wrap{position:relative}
#js-product-list-top .dropdown_tri{display:inline-flex !important;align-items:center;gap:7px;background:#fdf6f9 !important;border:1.5px solid #f3d9e6 !important;border-radius:999px !important;padding:8px 14px !important;color:#b03a6e !important;font-size:12.5px !important;font-weight:800 !important;line-height:1.4 !important;text-decoration:none !important;box-shadow:none !important;white-space:nowrap}
#js-product-list-top .dropdown_tri .arrow{color:#cf6f99 !important;font-size:11px !important;margin:0 !important}
#js-product-list-top .dropdown_list{border:1px solid #f3d9e6 !important;border-radius:14px !important;box-shadow:0 14px 34px rgba(176,58,110,.16) !important;overflow:hidden;margin-top:6px !important;min-width:170px;background:#fff !important}
#js-product-list-top .dropdown_list_ul{padding:6px !important;margin:0 !important}
#js-product-list-top .dropdown_list_item{display:flex !important;align-items:center;border-radius:10px !important;padding:9px 12px !important;font-size:12.5px !important;font-weight:700 !important;color:#5A4A4C !important;text-decoration:none !important}
#js-product-list-top .dropdown_list_item .fto-angle-right{display:none !important}
#js-product-list-top .dropdown_list_item:hover,#js-product-list-top .dropdown_list_item.current{background:#fdeef5 !important;color:#b03a6e !important}
#js-product-list-top .dropdown_list_item.current::before{content:'';width:7px;height:7px;border-radius:50%;background:#e0518a;margin-left:8px;flex:0 0 7px}
#js-product-list-top .filter-button .btn,#js-product-list-top #search_filter_toggler{background:linear-gradient(135deg,#f478a9,#e0568b) !important;border:0 !important;border-radius:999px !important;color:#fff !important;font-size:12.5px !important;font-weight:800 !important;padding:9px 16px !important;box-shadow:0 5px 12px rgba(244,120,169,.3) !important}
#js-product-list-top .list_grid_switcher{display:flex;gap:4px;background:#fdf6f9;border:1.5px solid #f3d9e6;border-radius:999px;padding:3px}
#js-product-list-top .list_grid_switcher > div{width:30px;height:30px;border-radius:999px;display:flex;align-items:center;justify-content:center;color:#cf6f99;cursor:pointer;font-size:13px}
#js-product-list-top .list_grid_switcher > div.selected{background:#e0518a;color:#fff;box-shadow:0 3px 8px rgba(224,81,138,.35)}
/* the small top pager sample */
#js-product-list-top .pagination-sample,#js-product-list-top .pagination_sample{font-size:12px;color:#9a7184;font-weight:700}
/* ---- bottom pagination (all listings) ---- */
.bottom_pagination{background:transparent;align-items:center}
.bottom_pagination .showing,.bottom_pagination .pagination_summary{color:#9a7184;font-size:12px;font-weight:700}
.bottom_pagination ul.pagination{display:flex;gap:6px;align-items:center;margin:0;padding:0;list-style:none}
.bottom_pagination .page-item .page-link{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;border-radius:12px !important;border:1.5px solid #f3d9e6 !important;background:#fff !important;color:#b03a6e !important;font-size:13px;font-weight:800;text-decoration:none !important;box-shadow:0 3px 8px rgba(176,58,110,.06)}
.bottom_pagination .page-item.active .page-link{background:linear-gradient(135deg,#f478a9,#e0568b) !important;border-color:transparent !important;color:#fff !important;box-shadow:0 5px 12px rgba(244,120,169,.35)}
.bottom_pagination .page-item.disabled .page-link{opacity:.4;pointer-events:none}
.bottom_pagination .spacer{color:#cf6f99;font-weight:800;padding:0 2px}
.bottom_pagination .page-link i{font-size:12px}
#js-product-list-top .dropdown_box{border:0 !important;box-shadow:none !important;background:transparent !important}
#js-product-list-top .dropdown_list_item{background:#fff !important}
#js-product-list-top .dropdown_list_item:hover,#js-product-list-top .dropdown_list_item.current{background:#fdeef5 !important}

/* == S45 — out-of-stock products render BLACK & WHITE in every product list (user rule) == */
.js-product-miniature.szd-oos .pro_first_box img{filter:grayscale(1) !important;opacity:.88}
.js-product-miniature.szd-oos .product-price-and-shipping,
.js-product-miniature.szd-oos .price{filter:grayscale(1);opacity:.7}
.js-product-miniature.szd-oos .pro_second_box .product-title a{color:#8a8a8a !important}

/* ================================================================================
   S57 (دور ۱۰۸) — آیکون‌های هدر دسکتاپ: فیکسِ قطعیِ هاور + فلایاوتِ سبد/حساب به زبانِ v5
   ریشهٔ باگ: قانونِ قدیمیِ «FIX BATCH 2» (szd-hdr__icon-host:hover{background:#FFE3EC!important})
   شورتهند است و در هاور background-size/position را به auto/0%0% ریست می‌کرد →
   از PNGِ بزرگِ گواشی فقط گوشهٔ چپ-بالا رندر می‌شد (حبابِ صورتیِ سبد / غیب‌شدنِ حساب).
   فیکسِ دور ۱۰۳ فقط background-image را برگردانده بود، نه size/position را.
   همه چیز فقط دسکتاپ (min-width:992px)؛ موبایل دست‌نخورده.
   ================================================================================ */
@media (min-width:992px){

/* --- ۱) آیکونِ دوحالته: هنرِ گواشی در هر دو حالتِ rest و hover بماند --- */
body #st_header .szd-hdr--desk .szd-hdr__icon-host,
body #st_header .szd-hdr--desk .szd-hdr__icon-host:hover{
  background-color:transparent !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
  background-size:contain !important;
  border:0 !important; box-shadow:none !important; border-radius:0 !important;
}
body #st_header .szd-hdr--desk .szd-hdr__icon-host--wallet,
body #st_header .szd-hdr--desk .szd-hdr__icon-host--wallet:hover{ background-image:url('/img/szd-menu/ic-wallet.png') !important; }
body #st_header .szd-hdr--desk .szd-hdr__icon-host--cart,
body #st_header .szd-hdr--desk .szd-hdr__icon-host--cart:hover{ background-image:url('/img/szd-menu/ic-cart.png') !important; }
body #st_header .szd-hdr--desk .szd-hdr__icon-host--account,
body #st_header .szd-hdr--desk .szd-hdr__icon-host--account:hover{ background-image:url('/img/szd-menu/ic-account.png') !important; }
/* حالتِ خاموش (rest): کمی مات — حالتِ روشنِ هاورِ دور ۱۰۳ (saturate+glow+scale) سرِ جای خودش است */
body #st_header .szd-hdr--desk .szd-hdr__icon-host{
  filter:saturate(.94) drop-shadow(0 3px 5px rgba(150,90,110,.16)) !important;
}

/* --- ۲) کارتِ فلایاوت (سبد/حساب) — زبانِ پنل‌های مگامنو v5 --- */
body #st_header .szd-hdr--desk .szd-hdr__icon-host .dropdown_list{
  position:absolute !important; top:calc(100% + 10px) !important; left:-8px !important; right:auto !important;
  z-index:9999 !important; width:356px !important; max-width:min(92vw,380px) !important;
  background:#fff !important; border:1px solid #F6E9EF !important; border-radius:22px !important;
  box-shadow:0 24px 60px rgba(176,58,110,.16), 0 6px 16px rgba(0,0,0,.05) !important;
  padding:18px 18px 16px !important; direction:rtl !important; text-align:right !important;
  animation:szdDdIn .26s cubic-bezier(.22,.8,.36,1);
}
body #st_header .szd-hdr--desk .szd-hdr__icon-host--account .dropdown_list{ width:272px !important; }
/* پلِ نامرئیِ هاور: شکافِ ۱۰px بینِ آیکون و کارت نپراند */
body #st_header .szd-hdr--desk .szd-hdr__icon-host .dropdown_list::before{
  content:"" !important; position:absolute !important; top:-14px !important; left:0 !important; right:0 !important;
  height:14px !important; background:transparent !important; border:0 !important;
}

/* --- ۳) تیترِ کارتِ سبد با زیرخطِ گرادیانی (هم‌خانوادهٔ تیترِ ستون‌های مگامنو) --- */
body #st_header .szd-hdr__icon-host--cart .dropdown_list .shoppingcart-list::before{
  content:"سبد خرید تو" !important; display:block !important;
  font-family:'LalezarSZD',Vazirmatn,yekanbakh,Tahoma,sans-serif !important;
  font-size:17px !important; font-weight:400 !important; color:#3D2C2E !important;
  padding:0 2px 9px !important; margin-bottom:10px !important;
  background:linear-gradient(to left,#F7A8C4,rgba(253,225,236,0) 72%) no-repeat bottom right/58% 3px !important;
}

/* --- ۴) ردیف‌های محصولِ سبد --- */
body #st_header .szd-hdr__icon-host--cart .dropdown_list li.line_item{
  padding:10px 2px !important; border-bottom:1px dashed #F3D9E4 !important;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list ul li.line_item:last-child{ border-bottom:0 !important; }
body #st_header .szd-hdr__icon-host--cart .dropdown_list .small_cart_product_image{
  width:54px !important; height:54px !important; object-fit:contain !important;
  border-radius:12px !important; background:#FFF8F5 !important; border:1px solid #FBEAF1 !important; padding:3px !important;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list .product-name{
  flex:1 1 100% !important; display:block !important; white-space:normal !important; line-height:1.55 !important;
  max-height:3.1em !important; overflow:hidden !important; padding:0 !important; margin:0 !important;
  color:#3D2C2E !important; font-size:12.5px !important; font-weight:700 !important; text-decoration:none !important;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list .product-name:hover{ color:#E0568B !important; }
body #st_header .szd-hdr__icon-host--cart .dropdown_list .product-quantity{
  background:#FFE3EF !important; color:#C13C8A !important; border-radius:999px !important;
  padding:1px 8px !important; font-size:10.5px !important; font-weight:900 !important;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list .price{
  color:#5A4A4C !important; font-weight:800 !important; font-size:12.5px !important; padding:0 !important; margin:0 !important;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list .ajax_remove_button{
  margin-right:auto !important; opacity:.45 !important; color:#8B7B7D !important; transition:opacity .18s,color .18s;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list .ajax_remove_button:hover{ opacity:1 !important; color:#C0392B !important; }

/* --- ۵) جمع‌بندی + CTA --- */
body #st_header .szd-hdr__icon-host--cart .dropdown_list .small_cart_sumary{
  padding:10px 2px 0 !important; margin-top:2px !important; border-top:1px dashed #F3D9E4 !important;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list .small_cart_sumary .line_item{
  border:0 !important; padding:3px 2px !important; font-size:12.5px !important;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list .small_cart_sumary .cart-summary-k{ color:#8B7B7D !important; font-weight:700 !important; }
body #st_header .szd-hdr__icon-host--cart .dropdown_list .small_cart_sumary .cart-summary-v{ color:#3D2C2E !important; font-weight:800 !important; }
body #st_header .szd-hdr__icon-host--cart .dropdown_list .small_cart_sumary .line_item.last_one{
  margin-top:4px !important; padding-top:7px !important; border-top:1px dashed #F3D9E4 !important;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list .small_cart_sumary .line_item.last_one .cart-summary-k{
  color:#3D2C2E !important; font-weight:900 !important; font-size:13.5px !important;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list .small_cart_sumary .line_item.last_one .cart-summary-v{
  color:#E0568B !important; font-weight:900 !important; font-size:15px !important;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list a.small_cart_btn{
  display:flex !important; align-items:center !important; justify-content:center !important;
  width:100% !important; height:auto !important; margin-top:13px !important; padding:12px 14px !important;
  background:linear-gradient(135deg,#F478A9,#E0568B) !important; color:#fff !important;
  border:0 !important; border-radius:999px !important; font-size:14px !important; font-weight:900 !important;
  line-height:1 !important; white-space:nowrap !important; overflow:visible !important; text-decoration:none !important;
  box-shadow:0 10px 22px rgba(224,86,139,.35) !important; transition:transform .18s,filter .18s;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list a.small_cart_btn:hover{
  transform:translateY(-2px); filter:brightness(1.05); color:#fff !important;
}
/* سبدِ خالی: آیکونِ کم‌رنگ + متنِ مهربان */
body #st_header .szd-hdr__icon-host--cart .dropdown_list .cart_empty{
  color:#8a6b73 !important; font-size:13px !important; font-weight:700 !important; text-align:center !important; padding:8px 0 12px !important;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list .cart_empty::before{
  content:"" !important; display:block !important; width:62px !important; height:62px !important;
  margin:4px auto 10px !important; background:url('/img/szd-menu/ic-cart.png') center/contain no-repeat !important;
  filter:saturate(.55) opacity(.7) !important;
}

/* --- ۶) منوی حساب کاربری (لاگین‌شده): چیپِ نام + ردیف‌های v5 — پایانِ زردِ تمِ قدیم --- */
body #st_header .szd-hdr__icon-host--account .dropdown_list ul,
body #st_header .szd-hdr__icon-host--account .dropdown_list li{
  margin:0 !important; padding:0 !important; list-style:none !important; background:transparent !important; border:0 !important;
}
/* چیپِ نامِ مشتری (spanِ غیرلینک) */
body #st_header .szd-hdr__icon-host--account .dropdown_list span.dropdown_list_item{
  display:flex !important; align-items:center !important; gap:10px !important;
  background:linear-gradient(135deg,#FFF0F5,#FFF8EE) !important;
  color:#3D2C2E !important; font-size:14px !important; font-weight:900 !important;
  border-radius:14px !important; padding:10px 12px !important; margin-bottom:10px !important;
  border:1px solid #FBEAF1 !important;
}
body #st_header .szd-hdr__icon-host--account .dropdown_list span.dropdown_list_item::before{
  content:"" !important; flex:0 0 auto !important; width:34px !important; height:34px !important;
  background:url('/img/szd-menu/ic-account.png') center/contain no-repeat !important;
}
/* ردیف‌های لینک: نقطهٔ صورتیِ v5 + هاورِ نرم */
body #st_header .szd-hdr__icon-host--account .dropdown_list a.dropdown_list_item{
  display:flex !important; align-items:center !important; gap:9px !important;
  padding:10px 12px !important; border-radius:12px !important;
  color:#5A4A4C !important; font-size:13.5px !important; font-weight:700 !important;
  text-decoration:none !important; text-align:right !important; transition:background .18s,color .18s;
}
body #st_header .szd-hdr__icon-host--account .dropdown_list a.dropdown_list_item::before{
  content:"" !important; flex:0 0 auto !important; width:7px !important; height:7px !important;
  border-radius:50% !important; background:#F3C9DA !important; transition:background .18s,transform .18s;
}
body #st_header .szd-hdr__icon-host--account .dropdown_list a.dropdown_list_item:hover{
  background:#FFF0F5 !important; color:#E0568B !important;
}
body #st_header .szd-hdr__icon-host--account .dropdown_list a.dropdown_list_item:hover::before{
  background:#E0568B !important; transform:scale(1.3);
}
/* خروج: تهِ لیست، تنالیتهٔ قرمزِ ملایم */
body #st_header .szd-hdr__icon-host--account .dropdown_list li:last-child a.dropdown_list_item{
  margin-top:6px !important; color:#B0524E !important;
}
body #st_header .szd-hdr__icon-host--account .dropdown_list li:last-child a.dropdown_list_item:hover{
  background:#FDEEEC !important; color:#C0392B !important;
}
body #st_header .szd-hdr__icon-host--account .dropdown_list li:last-child a.dropdown_list_item:hover::before{
  background:#C0392B !important;
}

/* --- ۷) S57b: آزادسازیِ لینک‌های داخلِ فلایاوتِ سبد از قفلِ ۵۲px
   (قانونِ قدیمیِ خط ~۱۵۸۵ «.szd-hdr__icon-host--cart a{max-width:52px!important}»
   برای مهارِ متنِ SHOPPING CART بود ولی CTA و لینک‌های فلایاوت را هم می‌بست) --- */
body #st_header .szd-hdr__icon-host--cart .dropdown_list a{
  max-width:none !important; width:auto !important; overflow:visible !important;
}
body #st_header .szd-hdr__icon-host--cart .dropdown_list a.small_cart_btn{ width:100% !important; }
body #st_header .szd-hdr__icon-host--cart .dropdown_list a.product-name{ width:auto !important; overflow:hidden !important; }

@keyframes szdDdIn{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }
}
/* ================================================================ /S57 ============ */

/* ================================================================================
   S58 (دور ۱۱۳) — نفسِ هدرِ دسکتاپ: لوگو/جستجو/آیکون‌ها به کفِ هدر نچسبند
   (دور ۱۰۱ پدینگ را 14px 0 9px کرده بود؛ کاربر: «به کف چسبیده») ================= */
@media (min-width:992px){
  body #st_header .szd-hdr--desk{ padding:18px 0 16px !important; }
  body.szd-stuck #st_header .szd-hdr--desk{ padding:10px 0 9px !important; }
}

/* S59 — لوگوی جدید ۲۰۲۶: کله روباه در باکس لوگوی دسکتاپ */
.szd-hdr__logo-img--fox{max-width:52px;max-height:44px;object-fit:contain;padding:2px 0}

/* S60 — دور ۱۲۶: سرچ هدر پهن‌تر و دقیقا وسط صفحه + حذف خط ۱px بین هدر و مگامنو */
@media (min-width:992px){
  .szd-hdr--desk .szd-hdr__row{position:relative}
  .szd-hdr--desk .szd-hdr__search-wrap{
    position:absolute !important; left:50% !important; top:50% !important;
    transform:translate(-50%,-50%) !important;
    width:min(720px,46vw) !important; max-width:720px !important;
  }
  body .szd-hdr--desk{margin-bottom:-1px !important}
}
/* S60b: با absolute شدن سرچ، آیکون‌ها دنبال لوگو می‌آمدند → پین به انتهای چپ */
@media (min-width:992px){
  .szd-hdr--desk .szd-hdr__icons{margin-inline-start:auto !important}
}