/* «بازار» — dense, deal- and campaign-driven. Warm orange on neutral zinc. Ported from
   design/storefront-prototype/assets/theme-bazar.css (the demo brand-colour swatch classes are not needed).
   Port fixes (doc 18 E4) are marked «E4». */
:root{
  --pf-primary:#C2410C;
  --pf-dark:#18181B;
  --pf-bg:#F7F7F8;--pf-surface:#fff;--pf-surface-2:#F4F4F5;
  --pf-ink:#18181B;--pf-ink-2:#3F3F46;--pf-muted:#52525B;
  --pf-line:#E4E4E7;--pf-line-strong:#D4D4D8;
  --pf-radius:18px;--pf-btn-radius:12px;
  --pf-focus:#2563EB;
  --pf-gap:26px;--pf-wrap:1320px;
  /* E4 contrast: orange text (selected sort tab on its soft background, links, filter titles) was 4.4:1;
     a darker ink of the same hue reaches 6.5:1. Dark mode keeps the base light ink. */
  --pf-primary-ink:color-mix(in srgb,var(--pf-primary) 78%,#000);
}
:root[data-mode="dark"]{--pf-bg:#0C0C0E;--pf-surface:#18181B;--pf-surface-2:#232327;--pf-line:#2E2E33;--pf-line-strong:#3F3F46;--pf-ink:#FAFAFA;--pf-ink-2:#D4D4D8;--pf-muted:#A1A1AA}
.hdr-bazar{box-shadow:0 1px 0 var(--pf-line);border-bottom:0}
.hdr-bazar .search{background:var(--pf-surface);border:2px solid var(--pf-primary);border-radius:999px;height:50px;padding-inline:18px 6px}
.hdr-bazar .search-btn{border-radius:999px;padding:0 20px;height:38px}
.hdr-bazar .logo-mark{border-radius:50%}
.hdr-bazar .mega>summary{border-bottom:0}
.hdr-bazar .catnav{gap:2px 22px}
.t-bazar .card-showcase,.t-bazar .card-compact{border-radius:18px}
.t-bazar .sec-head h2{font-size:20px;font-weight:900}
.t-bazar .slide{background:var(--pf-primary-soft)}
.t-bazar .slide .pill{background:var(--pf-primary);color:var(--pf-on-primary)}
.t-bazar .tabs-dots>.tablist{inset-inline-start:50%;transform:translateX(50%)}
.t-bazar .plp-side{border:0;box-shadow:0 1px 0 var(--pf-line)}
.t-bazar .plp-side .fgroup>summary{color:var(--pf-primary-ink)}
.t-bazar .pdp-buy .buybox{border:2px solid var(--pf-primary-mid)}
/* PDP «market»: the add-to-cart form spans the info and buy columns but must not become a grid item. */
.pdp-market>.pdp-form{display:contents}
/* PDP highlights: dense like the filter panel — no frame line, part titles in the brand ink, items as tags. */
.t-bazar .pdp-hl{border:0;box-shadow:0 1px 0 var(--pf-line);padding:16px;gap:10px}
.t-bazar .pdp-hl-part h3{color:var(--pf-primary-ink)}
.t-bazar .pdp-hl-specs>div{padding-block:7px}
.t-bazar .pdp-hl-box li{border-radius:8px;border:1px solid var(--pf-line);background:var(--pf-surface)}
.card-compact .card-add{margin-top:2px}
/* E4 link in text: a link inside running text is underlined, not told apart by colour alone (WCAG 1.4.1). */
.t-bazar p a:not([class*="btn"]){text-decoration:underline;text-underline-offset:4px}
/* E4 CLS: the mode toggle appears when its island runs; its place is kept so the header row never moves. */
.hdr-bazar .mode-btn[hidden]{display:inline-grid!important;visibility:hidden}
@media (max-width:899px){
  /* E4 CLS: the hero keeps one height whatever the slide text or the late font. */
  .t-bazar .hero-wide .slide{min-height:256px}
}
@media (max-width:359px){
  /* E4 320 px: the account link lives in the bottom navigation and the drawer on the smallest phones. */
  .hdr-bazar .account-link{display:none}
}