/* Apexfy storefront — الأساس (RTL، موبايل الأول). الألوان من --brand --accent --bg --ink --r (من layout.php) */
*,*::before,*::after{box-sizing:border-box}
:root{--brand:#111827;--accent:#f59e0b;--r:12px;--ink:#111827;--bg:#fff;--fh:Cairo;--fb:Cairo;
  --surface:#fff;--on-brand:#fff;--on-accent:#111;
  --muted:color-mix(in srgb,var(--ink) 56%,var(--bg));--ink2:color-mix(in srgb,var(--ink) 78%,var(--bg));
  --line:color-mix(in srgb,var(--ink) 10%,var(--bg));--soft:color-mix(in srgb,var(--ink) 4.5%,var(--bg));
  --tint:color-mix(in srgb,var(--brand) 8%,var(--bg));
  --ok:#16a34a;--bad:#dc2626;--sale:#e11d48;--on-sale:#fff;--wa:#25d366;
  --sh-sm:0 1px 2px rgba(16,24,40,.05),0 1px 3px rgba(16,24,40,.04);
  --sh:0 2px 6px rgba(16,24,40,.04),0 10px 30px -6px rgba(16,24,40,.10);
  --sh-lg:0 24px 60px -12px rgba(16,24,40,.28);
  --ease:cubic-bezier(.2,.75,.25,1);--sec:clamp(28px,4.5vw,52px);--gap:clamp(12px,1.6vw,20px)}
html{-webkit-text-size-adjust:100%;scroll-padding-top:80px}
[hidden]{display:none!important}
body{overflow-x:clip;margin:0;font-family:var(--fb),Cairo,system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;color:var(--ink);background:var(--bg);line-height:1.65;font-size:15px;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ic{width:20px;height:20px}
h1,h2,h3{line-height:1.3;text-wrap:balance}
.wrap{width:100%;max-width:1240px;margin-inline:auto;padding-inline:16px}
.narrow{max-width:780px}
.center{text-align:center}
.muted{color:var(--muted);font-size:13px}
.sec{padding-block:calc(var(--sec) / 2)}
.sec.tight{padding-block:14px 6px}
.sec-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.sec-head .sec-title{margin:0}
.sec-title{font-size:clamp(19px,1.4vw + 13px,26px);font-weight:800;margin:0 0 16px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.sec-title small{font-size:13px;color:var(--muted);font-weight:600}
.sec-ic{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:10px;background:color-mix(in srgb,var(--sale) 12%,var(--bg));color:var(--sale)}
.sec-ic svg{width:18px;height:18px}
.sec-more{display:inline-flex;align-items:center;gap:2px;color:var(--brand);font-weight:700;font-size:13.5px;white-space:nowrap;padding:6px 2px}
.sec-more svg{width:16px;height:16px;transition:transform .2s var(--ease)}
.sec-more:hover svg{transform:translateX(-3px)}
.price b,.pdp-price b,.deal-p,.row b,#mcTotal{font-variant-numeric:tabular-nums}

/* ---------------------------------------------------------------- أزرار */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--brand);color:var(--on-brand);border:0;border-radius:var(--r);padding:11px 20px;font-weight:700;cursor:pointer;min-height:46px;line-height:1.3;text-align:center;
  transition:transform .18s var(--ease),filter .18s,box-shadow .2s,background-color .2s;box-shadow:0 1px 2px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.12)}
.btn svg{width:18px;height:18px}
.btn:hover{filter:brightness(1.07)}
.btn:active{transform:scale(.97)}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}
.btn-lg{padding:14px 26px;font-size:16px;min-height:54px}
.btn-block{width:100%}
.btn-ghost{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn-ghost:hover{filter:none;box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn-wa{background:var(--wa);color:#fff}
.btn-wa-soft{background:color-mix(in srgb,var(--wa) 12%,var(--bg));color:#128c4b;box-shadow:none}
.icon-btn{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:12px;border:0;background:transparent;cursor:pointer;position:relative;transition:background-color .2s,transform .15s}
.icon-btn:hover{background:var(--soft)}
.icon-btn:active{transform:scale(.92)}

/* ---------------------------------------------------------------- الهيدر */
.announce{display:flex;align-items:center;justify-content:center;gap:8px;background:var(--brand);color:var(--on-brand);font-size:12.5px;font-weight:600;padding:7px 12px;text-align:center}
.announce svg{width:16px;height:16px}
.hdr{position:sticky;top:-8px;z-index:30;background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:saturate(1.8) blur(14px);backdrop-filter:saturate(1.8) blur(14px);border-bottom:1px solid var(--line);transition:box-shadow .3s,background-color .3s}
.hdr.scrolled{box-shadow:0 8px 24px -14px rgba(16,24,40,.25);background:color-mix(in srgb,var(--bg) 94%,transparent)}
.hdr-in{display:flex;align-items:center;gap:14px;height:76px;padding-top:8px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:19px;white-space:nowrap;font-family:var(--fh),var(--fb),Cairo,sans-serif;transition:transform .3s var(--ease);transform-origin:right center}
.hdr.scrolled .brand{transform:scale(.94)}
.brand img{height:38px;width:auto;border-radius:8px}
.brand img.wm{height:32px;border-radius:0}
.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:calc(var(--r) * .8);background:var(--brand);color:var(--on-brand);font-weight:900;font-size:18px}
.nav{display:flex;gap:4px;margin-inline-start:8px;font-weight:600;font-size:14px;color:var(--ink2)}
.nav a{padding:8px 10px;border-radius:10px;position:relative;transition:color .2s}
.nav a::after{content:"";position:absolute;inset-inline:10px;bottom:2px;height:2px;border-radius:2px;background:var(--brand);transform:scaleX(0);transition:transform .25s var(--ease)}
.nav a:hover,.nav a.on{color:var(--ink)}
.nav a:hover::after,.nav a.on::after{transform:none}
.search{margin-inline-start:auto;display:flex;align-items:center;background:var(--soft);border:1.5px solid transparent;border-radius:999px;padding-inline:16px 4px;height:44px;min-width:0;flex:0 1 300px;transition:border-color .2s,background-color .2s,box-shadow .2s}
.search:focus-within{border-color:var(--brand);background:var(--surface);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 12%,transparent)}
.search input{border:0;background:transparent;outline:0;flex:1;min-width:0;font-size:14px}
.search input::placeholder{color:var(--muted)}
.search button{border:0;background:transparent;cursor:pointer;display:grid;place-items:center;color:var(--muted);width:36px;height:36px;border-radius:50%}
.search svg{width:19px;height:19px}
.cart-count{position:absolute;top:3px;left:3px;min-width:19px;height:19px;border-radius:99px;background:var(--accent);color:var(--on-accent);font-size:11px;font-weight:800;display:grid;place-items:center;padding-inline:4px;line-height:1;box-shadow:0 0 0 2px var(--bg)}
.cart-count.bump{animation:bump .5s var(--ease)}
@keyframes bump{0%{transform:scale(1)}35%{transform:scale(1.45)}65%{transform:scale(.9)}100%{transform:scale(1)}}
[data-cart].bump>svg{animation:wig .5s var(--ease)}
@keyframes wig{30%{transform:rotate(-12deg) scale(1.1)}60%{transform:rotate(8deg)}}
.menu-btn{display:none}
.deliver{display:none}

/* ---------------------------------------------------------------- الأدراج (قايمة + سلة) */
.drawer{position:fixed;inset:0;z-index:60;background:rgba(10,12,20,.45);opacity:0;visibility:hidden;transition:opacity .3s var(--ease),visibility 0s .3s}
.drawer.open{opacity:1;visibility:visible;transition:opacity .3s var(--ease)}
.drawer-panel{position:absolute;inset-block:0;right:0;width:min(86vw,360px);background:var(--bg);color:var(--ink);display:flex;flex-direction:column;box-shadow:var(--sh-lg);transform:translateX(100%);transition:transform .38s var(--ease);overflow-y:auto;overscroll-behavior:contain}
.drawer-cart .drawer-panel{right:auto;left:0;width:min(92vw,420px);transform:translateX(-100%)}
.drawer.open .drawer-panel{transform:none}
.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 10px 10px 8px;padding-inline-start:18px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg);z-index:1}
.drawer-head b{font-size:17px;font-family:var(--fh),var(--fb),Cairo,sans-serif}
.drawer-head small{color:var(--muted);font-weight:600;font-size:13px}
.drawer-search{display:flex;align-items:center;gap:8px;margin:14px 16px 6px;background:var(--soft);border-radius:12px;padding:0 12px;height:46px;color:var(--muted)}
.drawer-search input{border:0;background:transparent;outline:0;flex:1;min-width:0;color:var(--ink)}
.drawer-nav{display:grid;padding:6px 8px}
.drawer-nav a{display:flex;align-items:center;justify-content:space-between;padding:13px 12px;border-radius:12px;font-weight:700;font-size:15.5px}
.drawer-nav a svg{width:16px;height:16px;color:var(--muted)}
.drawer-nav a:hover,.drawer-nav a:active{background:var(--soft)}
.drawer-foot{margin-top:auto;display:grid;gap:2px;padding:12px 8px 20px;border-top:1px solid var(--line)}
.drawer-foot a{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;font-size:14px;font-weight:600;color:var(--ink2)}
.drawer-foot a svg{width:19px;height:19px;color:var(--muted)}
.drawer-foot a:hover{background:var(--soft)}
.mc-list{display:grid;gap:2px;padding:6px 16px;flex:1;align-content:start}
.mc-item{display:grid;grid-template-columns:72px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);animation:fadeUp .35s var(--ease) both}
.mc-item img{width:72px;height:72px;border-radius:calc(var(--r) * .7);object-fit:cover;background:var(--soft)}
.mc-item b{display:block;font-size:14px;font-weight:700;line-height:1.45}
.mc-item small{display:block;color:var(--muted);font-size:12.5px}
.mc-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px}
.mc-row strong{font-size:14.5px;font-variant-numeric:tabular-nums}
.mc-foot{position:sticky;bottom:0;background:var(--bg);border-top:1px solid var(--line);padding:14px 16px calc(16px + env(safe-area-inset-bottom));display:grid;gap:8px}
.mc-foot .row{font-size:16px;padding:0}
.mc-foot .row b{font-size:19px}
.mc-note{display:flex;align-items:center;gap:6px;margin:0 0 4px;font-size:12.5px;color:var(--muted)}
.mc-note svg{width:16px;height:16px}
.drawer .empty-state{margin:auto 0;padding:40px 24px}
.ship-meter{margin:12px 16px 4px;padding:10px 12px;border-radius:12px;background:var(--soft);font-size:12.5px;font-weight:600;display:grid;gap:7px}
.ship-meter b{color:var(--ok)}
.ship-meter i{display:block;height:6px;border-radius:99px;background:var(--line);overflow:hidden}
.ship-meter i b{display:block;height:100%;width:var(--p,0%);background:linear-gradient(90deg,var(--ok),color-mix(in srgb,var(--ok) 70%,#a3e635));border-radius:inherit;transition:width .6s var(--ease)}
.ship-meter.full span{color:var(--ok)}
.qty-s{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:99px;height:32px;background:var(--surface)}
.qty-s button{width:32px;height:30px;border:0;background:none;cursor:pointer;font-size:17px;line-height:1;color:var(--ink)}
.qty-s span{min-width:22px;text-align:center;font-weight:700;font-size:14px;font-variant-numeric:tabular-nums}
.link-rm{border:0;background:none;color:var(--muted);cursor:pointer;font-size:12.5px;text-decoration:underline;text-underline-offset:3px;padding:4px 0}
.link-rm:hover{color:var(--bad)}

/* ---------------------------------------------------------------- هيرو */
.hero{background:radial-gradient(1100px 500px at 85% -10%,color-mix(in srgb,var(--brand) 14%,transparent),transparent 65%),var(--bg);overflow:hidden}
.hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(20px,4vw,48px);align-items:center;padding-block:clamp(28px,6vw,72px)}
.hero-in>*{min-width:0}
.hero h1{font-size:clamp(28px,4.4vw,52px);line-height:1.2;margin:0 0 14px;font-weight:900;overflow-wrap:anywhere}
.hero p{font-size:clamp(15px,1.4vw,18px);color:var(--ink2);margin:0 0 24px;overflow-wrap:anywhere;max-width:52ch}
.hero .btn svg{transition:transform .2s var(--ease)}
.hero .btn:hover svg{transform:translateX(-4px)}
.hero-img img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:calc(var(--r) * 1.6);box-shadow:var(--sh-lg)}

/* ---------------------------------------------------------------- السلايدر */
.slider{position:relative;padding-block:14px 4px}
.slides{display:flex;gap:12px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;padding-inline:max(16px,calc((100% - 1240px) / 2 + 16px));scroll-padding-inline:max(16px,calc((100% - 1240px) / 2 + 16px));overscroll-behavior-x:contain}
.slides::-webkit-scrollbar{display:none}
.slide{flex:0 0 min(1208px,calc(100% - 44px));scroll-snap-align:center;position:relative;border-radius:calc(var(--r) * 1.5);overflow:hidden;isolation:isolate;
  background:radial-gradient(120% 100% at 100% 0%,rgba(255,255,255,.2),transparent 55%),var(--sbg,linear-gradient(135deg,var(--brand),color-mix(in srgb,var(--brand) 55%,var(--accent))));
  color:#fff;display:grid;grid-template-rows:auto 1fr;transition:transform .3s var(--ease)}
.slide::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;left:-140px;bottom:-200px;background:rgba(255,255,255,.08);z-index:-1}
.slide::after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;left:30%;top:-90px;border:1.5px solid rgba(255,255,255,.14);z-index:-1}
.slide:active{transform:scale(.99)}
.slide-txt{display:grid;gap:6px;align-content:start;justify-items:start;padding:22px 20px 16px}
.slide-txt b{font-family:var(--fh),var(--fb),Cairo,sans-serif;font-size:clamp(24px,3.6vw,48px);line-height:1.2;font-weight:800;text-wrap:balance;text-shadow:0 2px 18px rgba(0,0,0,.12)}
.slide-txt span{font-size:clamp(14px,1.5vw,19px);opacity:.92}
.slide-txt em{display:inline-flex;align-items:center;gap:6px;font-style:normal;font-weight:800;font-size:14px;margin-top:8px;background:#fff;color:color-mix(in srgb,var(--sbg,var(--brand)) 85%,#000);border-radius:99px;padding:9px 18px;box-shadow:0 6px 18px -6px rgba(0,0,0,.35);transition:gap .2s var(--ease)}
.slide-txt em svg{width:16px;height:16px}
.slide:hover em{gap:10px}
.slide-media{margin:0 16px 16px;border-radius:calc(var(--r) * 1.1);overflow:hidden;aspect-ratio:16/10;background:rgba(255,255,255,.12);box-shadow:0 18px 40px -16px rgba(0,0,0,.45)}
.slide-media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.slide:hover .slide-media img{transform:scale(1.04)}
.sl-nav{display:none}
.dots{display:flex;gap:6px;justify-content:center;margin-top:12px}
.dots button{width:8px;height:8px;padding:0;border:0;border-radius:99px;background:var(--line);cursor:pointer;transition:width .35s var(--ease),background-color .3s}
.dots button.on{width:24px;background:var(--brand)}

/* ---------------------------------------------------------------- بلاطات الأقسام */
.tiles{display:flex;gap:14px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;padding:4px 2px 6px;scroll-snap-type:x proximity}
.tiles::-webkit-scrollbar{display:none}
.tile{flex:0 0 auto;width:78px;display:grid;justify-items:center;gap:7px;text-align:center;scroll-snap-align:start}
.tile-img{width:72px;height:72px;border-radius:calc(var(--r) * 1.5);background:var(--tint);overflow:hidden;display:grid;place-items:center;transition:transform .3s var(--ease),box-shadow .3s;box-shadow:0 0 0 1px var(--line)}
.tile-img>b{font-size:26px;color:var(--brand)}
.tile-img img{width:100%;height:100%;object-fit:cover}
.tile-name{font-size:12.5px;font-weight:700;line-height:1.35;color:var(--ink2)}
.tile:hover .tile-img{transform:translateY(-3px);box-shadow:0 0 0 2px var(--brand),var(--sh)}
.tile:active .tile-img{transform:scale(.94)}

/* ---------------------------------------------------------------- كروت الأقسام */
.ccards{display:flex;gap:var(--gap);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;scroll-snap-type:x proximity;padding-bottom:4px}
.ccards::-webkit-scrollbar{display:none}
.ccard{flex:0 0 min(44%,270px);scroll-snap-align:start;position:relative;aspect-ratio:3/4;border-radius:calc(var(--r) * 1.2);overflow:hidden;background:var(--soft);isolation:isolate;transition:transform .3s var(--ease),box-shadow .3s}
.ccard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease);z-index:-2}
.ccard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.62));z-index:-1}
.ccard-txt{position:absolute;inset:auto 0 0;padding:14px;color:#fff;display:grid;gap:0}
.ccard-txt b{font-family:var(--fh),var(--fb),Cairo,sans-serif;font-size:clamp(18px,2vw,24px);font-weight:800;line-height:1.25}
.ccard-txt small{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;opacity:.9;font-weight:600}
.ccard-txt small svg{width:14px;height:14px}
.ccard:active{transform:scale(.98)}

/* ---------------------------------------------------------------- كوبون */
.cpn{display:grid;grid-template-columns:1fr auto;background:linear-gradient(135deg,var(--brand),color-mix(in srgb,var(--brand) 70%,#000));color:var(--on-brand);border-radius:calc(var(--r) * 1.4);overflow:hidden;position:relative;box-shadow:var(--sh)}
.cpn-main{padding:20px;display:grid;gap:2px;align-content:center;position:relative;isolation:isolate}
.cpn-main::before{content:"";position:absolute;width:200px;height:200px;border-radius:50%;right:-80px;bottom:-110px;background:rgba(255,255,255,.08);z-index:-1}
.cpn-kicker{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:14px;opacity:.95}
.cpn-kicker svg{width:18px;height:18px}
.cpn-big{font-size:clamp(40px,7vw,64px);font-weight:900;line-height:1.05;font-family:var(--fh),var(--fb),Cairo,sans-serif;font-variant-numeric:tabular-nums}
.cpn p{margin:4px 0 0;font-size:12.5px;opacity:.85}
.cpn-code{position:relative;display:grid;gap:6px;align-content:center;justify-items:center;padding:18px;border-inline-start:2px dashed color-mix(in srgb,var(--on-brand) 35%,transparent)}
.cpn-code::before,.cpn-code::after{content:"";position:absolute;inset-inline-start:-12px;width:22px;height:22px;border-radius:50%;background:var(--bg)}
.cpn-code::before{top:-12px}.cpn-code::after{bottom:-12px}
.cpn-code small{font-size:12px;font-weight:700;opacity:.85}
.cpn-code button{display:inline-flex;align-items:center;gap:8px;border:0;background:var(--on-brand);color:var(--brand);font-weight:900;font-size:16px;border-radius:10px;padding:9px 14px;cursor:pointer;letter-spacing:1px;transition:transform .15s var(--ease),box-shadow .2s;box-shadow:0 6px 16px -6px rgba(0,0,0,.35)}
.cpn-code button svg{width:17px;height:17px}
.cpn-code button:active{transform:scale(.95)}
.cpn-code button.copied{background:var(--ok);color:#fff}

/* ---------------------------------------------------------------- 2×2 */
.cgrid-panel{background:var(--surface);border:1px solid var(--line);border-radius:calc(var(--r) * 1.3);padding:16px;box-shadow:var(--sh-sm)}
.cgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.cgrid a{display:grid;gap:6px;align-content:start}
.cg-img{aspect-ratio:1;border-radius:var(--r);background:var(--soft);overflow:hidden;display:block}
.cg-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.cgrid b{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink2)}

/* ---------------------------------------------------------------- لوحات الأقسام (ستايل الماركت بليس) + بانرات صغيرة */
.cpanels{display:flex;gap:var(--gap);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 2px 8px;margin-inline:-2px}
.cpanels::-webkit-scrollbar{display:none}
.cpanel{flex:0 0 min(84%,340px);scroll-snap-align:start;display:flex;flex-direction:column;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:calc(var(--r) * 1.3);padding:16px;box-shadow:var(--sh-sm)}
.cpanel h3{margin:0;font-size:18px;font-weight:800;line-height:1.3}
.cp-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 10px;flex:1}
.cp-grid a{display:grid;gap:5px;align-content:start;min-width:0}
.cp-img{aspect-ratio:1;border-radius:calc(var(--r) * .8);background:var(--soft);overflow:hidden;display:block}
.cp-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease),opacity .45s ease,filter .45s ease}
.cp-grid small{font-size:12.5px;font-weight:600;color:var(--ink2);line-height:1.35;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.cp-more{display:inline-flex;align-items:center;gap:2px;align-self:flex-start;color:var(--brand);font-weight:700;font-size:13.5px}
.cp-more svg{width:16px;height:16px;transition:transform .2s var(--ease)}
.js .cp-img img:not(.ld),.js .pt-img img:not(.ld){opacity:0;filter:blur(8px)}
.ptiles{display:grid;grid-template-columns:1fr;gap:var(--gap)}
.ptile{--sbg:var(--brand);position:relative;display:grid;grid-template-columns:1fr minmax(0,42%);align-items:center;gap:12px;min-height:150px;padding-block:18px;padding-inline:18px 0;border-radius:calc(var(--r) * 1.3);overflow:hidden;isolation:isolate;background:var(--sbg);color:#fff;transition:transform .25s var(--ease),box-shadow .25s}
.ptile::before{content:"";position:absolute;width:220px;height:220px;border-radius:50%;inset-inline-end:-60px;bottom:-110px;background:rgba(255,255,255,.1);z-index:-1}
.ptile.no-img{grid-template-columns:1fr;padding-inline-end:18px}
.pt-txt{display:grid;gap:4px;justify-items:start;align-content:center}
.pt-txt b{font-family:var(--fh),var(--fb),Cairo,sans-serif;font-size:clamp(19px,1.6vw + 10px,25px);font-weight:800;line-height:1.2;text-wrap:balance}
.pt-txt>span{font-size:13.5px;opacity:.9;line-height:1.45}
.pt-txt em{display:inline-flex;align-items:center;gap:4px;margin-top:8px;font-style:normal;font-weight:800;font-size:13px;background:#fff;color:color-mix(in srgb,var(--sbg) 85%,#000);border-radius:99px;padding:7px 14px}
.pt-txt em svg{width:15px;height:15px}
.pt-img{align-self:stretch;margin-block:-18px;display:block;overflow:hidden}
.pt-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease),opacity .45s ease,filter .45s ease}
.ptile:active{transform:scale(.985)}
.ov.has-sw{display:inline-flex;align-items:center;gap:8px;padding-block:4px;padding-inline:4px 12px}
.ov.has-sw img{width:34px;height:34px;border-radius:calc(var(--r) * .55);object-fit:cover;background:var(--soft)}
.ov.has-sw.on img{box-shadow:0 0 0 2px var(--on-brand)}
@media (min-width:641px){
  .ptiles.n2,.ptiles.n4{grid-template-columns:repeat(2,1fr)}
  .ptiles.n3{grid-template-columns:repeat(3,1fr)}
  .ptiles.n3 .ptile{grid-template-columns:1fr;grid-template-rows:auto 150px;padding:20px 20px 0;gap:14px}
  .ptiles.n3 .pt-img{margin:0 -20px;border-radius:0}
}
@media (min-width:900px){
  .cpanels{display:grid;overflow:visible;grid-template-columns:repeat(4,minmax(0,1fr))}
  .cpanels.n1{grid-template-columns:minmax(0,420px)}
  .cpanels.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cpanels.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cpanel{padding:18px}
  .ptile{min-height:190px}
  .ptiles.n3 .ptile{grid-template-rows:auto 190px}
}
@media (hover:hover){
  .cp-grid a:hover .cp-img img,.ptile:hover .pt-img img{transform:scale(1.06)}
  .cp-grid a:hover small{color:var(--brand)}
  .cp-more:hover svg{transform:translateX(-3px)}
  [dir=ltr] .cp-more:hover svg{transform:translateX(3px)}
  .ptile:hover{transform:translateY(-3px);box-shadow:var(--sh)}
}

/* ---------------------------------------------------------------- صف الأقسام تحت الهيدر + أسهم الصفوف */
.subnav{background:var(--surface);border-bottom:1px solid var(--line)}
.subnav-in{display:flex;gap:2px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;white-space:nowrap;padding-block:6px;scroll-snap-type:x proximity}
.subnav-in::-webkit-scrollbar{display:none}
.subnav a{flex:none;scroll-snap-align:start;padding:6px 12px;border-radius:99px;font-size:13.5px;font-weight:600;color:var(--ink2);transition:background-color .2s,color .2s}
.subnav a:hover{background:var(--soft);color:var(--ink)}
.subnav a.on{background:var(--tint);color:var(--brand)}
.hdr.has-sub .nav{display:none}
.rs-wrap{position:relative}
.rs-nav{position:absolute;top:calc(50% - 40px);width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);box-shadow:var(--sh);display:grid;place-items:center;cursor:pointer;z-index:3;opacity:0;transition:opacity .25s,transform .2s var(--ease)}
.rs-wrap:hover .rs-nav,.rs-nav:focus-visible{opacity:1}
.rs-nav:active{transform:scale(.92)}
.rs-prev{inset-inline-start:-16px}
.rs-next{inset-inline-end:-16px}
[dir=ltr] .rs-next svg,[dir=rtl] .rs-prev svg{transform:scaleX(-1)}
.ftr-links.many{grid-template-columns:1fr 1fr;column-gap:20px}
.ftr-links.many b{grid-column:1/-1}
@media (max-width:1060px){.ftr-links.many{grid-column:1/-1}}
@media (min-width:1061px){.ftr-in:has(.ftr-links.many){grid-template-columns:1.3fr 1.7fr 1fr 1fr}}
@media (min-width:900px){.subnav-in{gap:0;justify-content:safe center}.subnav a{padding:6px 9px;font-size:13px}}
/* الشاشات الواسعة: الروابط كانت لازقة في بعض في نص صف عريض — مسافة وخط أكبر سنة، بس لو 8 روابط أو أقل (الأكتر بيفضل مضغوط علشان مايتسحبش) */
@media (min-width:1200px){.subnav-in:not(:has(>a:nth-child(9))){gap:6px}.subnav-in:not(:has(>a:nth-child(9)))>a{padding:7px 14px;font-size:14px}}

/* ---------------------------------------------------------------- عروض + صفوف */
.row-scroll{display:flex;gap:var(--gap);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:none;padding:2px 2px 8px;margin-inline:-2px}
.row-scroll::-webkit-scrollbar{display:none}
.row-scroll.cards>.card{flex:0 0 min(44%,232px);scroll-snap-align:start}
.deal{flex:0 0 min(44%,220px);scroll-snap-align:start;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:transform .25s var(--ease),box-shadow .25s}
.deal-img{position:relative;aspect-ratio:1;background:var(--soft);overflow:hidden;display:block}
.deal-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.deal-off{position:absolute;top:8px;inset-inline-start:8px;background:var(--sale);color:var(--on-sale);font-weight:800;font-size:12px;border-radius:7px;padding:2px 8px;direction:ltr}
.deal-body{display:grid;gap:2px;padding:10px 12px 12px}
.deal-t{font-size:13.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink2)}
.deal-pr{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.deal-p{font-weight:800;font-size:17px;color:var(--sale)}
.deal s{color:var(--muted);font-size:12.5px}
.deal:active{transform:scale(.98)}
.countdown{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--sale)}
.countdown svg{width:17px;height:17px}
.countdown b{font-variant-numeric:tabular-nums;background:var(--sale);color:var(--on-sale);border-radius:8px;padding:2px 9px;direction:ltr}

/* ---------------------------------------------------------------- أقسام كحبوب */
.cats,.chips{display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;padding-bottom:4px;scrollbar-width:none}
.cats::-webkit-scrollbar,.chips::-webkit-scrollbar{display:none}
.cat{flex:0 0 auto;padding:11px 22px;border-radius:999px;background:var(--soft);font-weight:700;border:1.5px solid transparent;transition:border-color .2s,color .2s}
.cat:hover{border-color:var(--brand);color:var(--brand)}
.chip{flex:0 0 auto;padding:7px 16px;border-radius:999px;border:1.5px solid var(--line);font-weight:600;font-size:13.5px;transition:background-color .2s,border-color .2s,color .2s}
.chip:hover{border-color:var(--ink)}
.chip.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}

/* ---------------------------------------------------------------- كارت المنتج */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,2vw,28px) var(--gap)}
.card{display:flex;flex-direction:column;border-radius:var(--r);position:relative;transition:transform .25s var(--ease)}
.card-img{position:relative;aspect-ratio:1;background:var(--soft);border-radius:var(--r);overflow:hidden;isolation:isolate}
.card-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease),opacity .45s ease,filter .45s ease}
.card-img .alt{position:absolute;inset:0;opacity:0}
/* السعر التقريبي بعملة الزائر في الكارت */
.card-approx{display:block;font-size:12px;line-height:1.3;color:var(--muted);margin-top:2px}
/* فيديو في خلفية البانر الرئيسي */
.hero.hero-vid{position:relative;overflow:hidden;isolation:isolate;min-height:clamp(420px,62vh,640px);display:flex;align-items:center;color:#fff;background:#0b0b0b}
.hero.hero-vid .hero-bgv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero.hero-vid .hero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(0,0,0,.62),rgba(0,0,0,.18) 60%,rgba(0,0,0,.08))}
html[dir=rtl] .hero.hero-vid .hero-shade{background:linear-gradient(270deg,rgba(0,0,0,.62),rgba(0,0,0,.18) 60%,rgba(0,0,0,.08))}
/* قصة بالفيديو: الطول = مسافة السكرول، والفيديو sticky، والجملة الحالية بس ظاهرة */
.vstory{position:relative;height:calc(100vh + (var(--n,1) - 1)*85vh);background:#0b0b0b}
.vs-stick{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;isolation:isolate;display:flex;align-items:center;color:#fff}
.vs-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.vs-shade{position:absolute;inset:0;z-index:-1;background:rgba(0,0,0,.22)}
.vs-in{position:relative;width:100%;display:grid;justify-items:start;gap:20px;padding-block:32px}
.vs-cap{grid-area:1/1;margin:0;max-width:17em;font-size:clamp(30px,4.4vw,60px);font-weight:800;line-height:1.32;opacity:0;transform:translateY(22px);transition:opacity .4s,transform .4s}
.vs-cap.on{opacity:1;transform:none}
.vs-cap mark{background:var(--brand);color:var(--on-brand);padding:.04em .28em;border-radius:.16em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.vs-cta{grid-area:2/1;opacity:0;visibility:hidden;transition:opacity .3s}
.vstory.vs-end .vs-cta{opacity:1;visibility:visible}
@media (prefers-reduced-motion:reduce){.vstory{height:auto}.vs-stick{position:relative;height:auto;min-height:70vh}.vs-cap{grid-area:auto;opacity:1;transform:none;transition:none}.vs-cta{grid-area:auto;opacity:1;visibility:visible}}
.hero.hero-vid .hero-in{width:100%}
.hero.hero-vid .hero-txt{max-width:560px}
.hero.hero-vid h1,.hero.hero-vid p{color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.35)}
@media (max-width:700px){.hero.hero-vid{min-height:70vh;align-items:flex-end;padding-bottom:28px}.hero.hero-vid .hero-shade{background:linear-gradient(0deg,rgba(0,0,0,.72),rgba(0,0,0,.15) 65%)}}
/* فيديو المنتج في الكارت (0119): مخفي لحد ما يشتغل فعلًا */
.card-img .card-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 22%;opacity:0;transition:opacity .45s ease;z-index:1;pointer-events:none}
.card-img .card-vid.on{opacity:1}
.card-vid-ic{position:absolute;inset-inline-start:8px;bottom:8px;z-index:2;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;transition:opacity .3s}
.card-vid-ic svg{width:12px;height:12px;fill:currentColor;stroke:none}
.card.has-vid:has(.card-vid.on) .card-vid-ic{opacity:0}
/* فيديو المنتج في صفحة المنتج */
.g-video video{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 22%;background:var(--soft)}
.g-th-video{position:relative}
.g-play{position:absolute;inset:0;display:grid;place-items:center;color:#fff;background:rgba(0,0,0,.28)}
.g-play svg{width:18px;height:18px;fill:currentColor;stroke:none}
.card.is-out .card-img img{filter:grayscale(.6);opacity:.75}
.badge-off{position:absolute;top:10px;inset-inline-start:10px;z-index:1;background:var(--sale);color:var(--on-sale);font-size:12px;font-weight:800;padding:2px 8px;border-radius:7px;direction:ltr;box-shadow:0 4px 10px -4px rgba(0,0,0,.3)}
.badge-out{position:absolute;inset-inline:10px;bottom:10px;z-index:1;background:color-mix(in srgb,var(--ink) 82%,transparent);color:var(--bg);text-align:center;font-size:12px;font-weight:700;border-radius:8px;padding:4px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.card-body{padding:10px 2px 2px;display:grid;gap:3px}
.card-body h3{font-size:14px;font-weight:600;margin:0;line-height:1.5;min-height:3em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--ink2);text-wrap:pretty}
.price{display:flex;align-items:baseline;gap:4px 8px;flex-wrap:wrap}
.price b{font-size:16px;font-weight:800;color:var(--ink)}
.price s,.pdp-price s{color:var(--muted);font-size:12.5px}
.price small{color:var(--muted);font-size:12px}
.card .save,.card-go{display:none}
.card:active{transform:scale(.975)}
@media (hover:hover){
  .card:hover .card-img img{transform:scale(1.05)}
  .card.has-alt:hover .card-img img:not(.alt){opacity:0}
  .card.has-alt:hover .card-img .alt{opacity:1}
  .card:hover h3{color:var(--ink)}
  .deal:hover{transform:translateY(-3px);box-shadow:var(--sh)}
  .deal:hover .deal-img img,.cgrid a:hover .cg-img img{transform:scale(1.06)}
  .ccard:hover{transform:translateY(-4px);box-shadow:var(--sh)}
  .ccard:hover img{transform:scale(1.07)}
}

/* تحميل الصور: هيكل لامع → ظهور ناعم (من غير ما الصفحة تتحرك) */
.js .card-img img:not(.ld),.js .deal-img img:not(.ld),.js .cg-img img:not(.ld),.js .tile-img img:not(.ld),.js .ccard img:not(.ld),.js .g-slide img:not(.ld),.js .slide-media img:not(.ld),.js .hero-img img:not(.ld){opacity:0;filter:blur(8px)}
.js .card-img:has(img:not(.ld)),.js .deal-img:has(img:not(.ld)),.js .cg-img:has(img:not(.ld)),.js .ccard:has(img:not(.ld)),.js .g-slide:has(img:not(.ld)){background:linear-gradient(100deg,var(--soft) 30%,color-mix(in srgb,var(--soft) 40%,var(--bg)) 50%,var(--soft) 70%) var(--soft);background-size:250% 100%;animation:shim 1.3s linear infinite}
@keyframes shim{from{background-position:120% 0}to{background-position:-120% 0}}
.tile-img img,.ccard img,.g-slide img,.slide-media img,.hero-img img,.deal-img img,.cg-img img{transition:transform .7s var(--ease),opacity .45s ease,filter .45s ease}

/* ---------------------------------------------------------------- بانر، ثقة، واتساب */
.banner{display:flex;align-items:flex-end;min-height:clamp(220px,28vw,340px);border-radius:calc(var(--r) * 1.5);padding:clamp(20px,3vw,40px);color:#fff;overflow:hidden;
  background:linear-gradient(0deg,rgba(0,0,0,.6),rgba(0,0,0,.05) 70%),var(--img,linear-gradient(135deg,var(--brand),var(--accent)));background-size:cover;background-position:center;transition:background-size .8s var(--ease)}
.banner h2{margin:0;font-size:clamp(22px,3vw,34px);font-weight:900}
.banner p{margin:4px 0 0;opacity:.9}
.banner-cta{display:inline-flex;align-items:center;gap:4px;margin-top:12px;font-weight:800;font-size:14px;border-bottom:1.5px solid rgba(255,255,255,.6);padding-bottom:2px}
.banner-cta svg{width:16px;height:16px}
.trust{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.trust-i{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.trust-i b{font-size:14px;font-weight:700}
.trust-ic{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--tint);color:var(--brand);flex:none}
.trust-ic svg{width:22px;height:22px}
.wa-cta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:color-mix(in srgb,var(--wa) 9%,var(--bg));border:1px solid color-mix(in srgb,var(--wa) 25%,var(--bg));border-radius:calc(var(--r) * 1.2);padding:18px 20px}
.wa-cta>div{flex:1;min-width:180px;display:grid}
.wa-cta b{font-size:16px}
.wa-cta small{color:var(--muted);font-size:13px}
.wa-ic{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--wa);color:#fff;flex:none}
.prose p{color:var(--ink2);line-height:1.9}
.prose h1,.prose h2{font-family:var(--fh),var(--fb),Cairo,sans-serif}

/* ---------------------------------------------------------------- القوايم */
.crumbs{display:flex;align-items:center;gap:4px;font-size:12.5px;color:var(--muted);margin-bottom:14px;white-space:nowrap;overflow:hidden}
.crumbs svg{width:13px;height:13px;opacity:.6}
.crumbs span{overflow:hidden;text-overflow:ellipsis;color:var(--ink2)}
.crumbs a:hover{color:var(--brand)}
.col-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:6px}
.col-head .sec-title{margin:0}
.sort select{border:1.5px solid var(--line);border-radius:10px;padding:8px 10px;background:var(--surface);color:var(--ink);font-size:13.5px;font-weight:600;cursor:pointer}
.chips{margin:10px 0 22px}
.pager{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:28px;flex-wrap:wrap}
.pager span{color:var(--muted);font-size:14px}
.empty-state{display:grid;justify-items:center;gap:6px;text-align:center;padding:48px 16px}
.empty-state b{font-size:18px}
.empty-state p{margin:0 0 10px;color:var(--muted)}
.empty-ic{display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:var(--tint);color:var(--brand);margin-bottom:8px;position:relative}
.empty-ic::after{content:"";position:absolute;inset:-8px;border-radius:50%;border:1.5px dashed color-mix(in srgb,var(--brand) 30%,transparent)}
.empty-ic svg{width:36px;height:36px;stroke-width:1.5}

/* ---------------------------------------------------------------- صفحة المنتج */
.pdp{padding-top:16px}
.pdp-grid{display:grid;grid-template-columns:1.08fr 1fr;gap:clamp(24px,4vw,56px);align-items:start}
.gallery{position:sticky;top:84px;min-width:0}
.g-main{position:relative;border-radius:calc(var(--r) * 1.3);overflow:hidden;background:var(--soft)}
.g-track{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.g-track::-webkit-scrollbar{display:none}
.g-slide{flex:0 0 100%;aspect-ratio:1;scroll-snap-align:center;scroll-snap-stop:always}
.g-slide img{width:100%;height:100%;object-fit:cover}
.g-none{display:grid;place-items:center;color:var(--muted)}
.g-none svg{width:56px;height:56px}
.g-main .badge-off{top:14px;inset-inline-start:14px;font-size:13px;padding:3px 10px}
.g-dots{position:absolute;bottom:12px;inset-inline:0;display:flex;justify-content:center;gap:6px;pointer-events:none}
.g-dots i{width:7px;height:7px;border-radius:99px;background:rgba(255,255,255,.65);box-shadow:0 0 0 1px rgba(0,0,0,.08);transition:width .3s var(--ease),background-color .3s}
.g-dots i.on{width:20px;background:#fff}
.g-3d-btn{position:absolute;bottom:14px;inset-inline-end:14px;z-index:2;display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.94);color:#111;border:0;border-radius:99px;padding:7px 13px 7px 11px;font:inherit;font-size:13px;font-weight:700;cursor:pointer;box-shadow:0 6px 18px -8px rgba(0,0,0,.45)}
.g-3d-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.g-3d-btn:hover{background:#fff}
.g-3d{position:absolute;inset:0;z-index:3;background:var(--soft)}
.g-3d model-viewer{width:100%;height:100%;--poster-color:transparent;--progress-bar-color:var(--accent,#111)}
.g-3d-x{position:absolute;top:12px;inset-inline-end:12px;width:38px;height:38px;border-radius:99px;border:0;background:rgba(255,255,255,.94);color:#111;display:grid;place-items:center;cursor:pointer;box-shadow:0 4px 12px -6px rgba(0,0,0,.4)}
.g-3d-x svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.g-3d-ar{position:absolute;bottom:14px;inset-inline-start:50%;transform:translateX(-50%);border:0;border-radius:99px;background:#111;color:#fff;font:inherit;font-size:14px;font-weight:700;padding:10px 18px;cursor:pointer;white-space:nowrap}
[dir=rtl] .g-3d-ar{transform:translateX(50%)}
.g-3d-hint{position:absolute;top:18px;inset-inline-start:14px;font-size:12px;color:var(--muted);pointer-events:none}
.g-thumbs{display:flex;gap:10px;margin-top:12px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.g-thumbs button{flex:0 0 74px;height:74px;border-radius:calc(var(--r) * .8);overflow:hidden;border:0;padding:0;cursor:pointer;background:var(--soft);box-shadow:inset 0 0 0 1px var(--line);opacity:.7;transition:opacity .2s,box-shadow .2s}
.g-thumbs button.on,.g-thumbs button:hover{opacity:1;box-shadow:0 0 0 2px var(--brand)}
.g-thumbs img{width:100%;height:100%;object-fit:cover}
.pdp-info{min-width:0}
.pdp-info h1{font-size:clamp(22px,2.4vw,32px);line-height:1.35;margin:0 0 10px;font-weight:800}
.pdp-price{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.pdp-price b{font-size:clamp(24px,2.4vw,30px);font-weight:900;color:var(--brand)}
.save{background:color-mix(in srgb,var(--sale) 10%,var(--bg));color:var(--sale);font-weight:700;font-size:12.5px;padding:3px 10px;border-radius:99px}
.stock-line{display:flex;align-items:center;gap:8px;margin:0 0 16px;font-size:13px;font-weight:700;color:var(--ok)}
.stock-line i{width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 0 0 currentColor;animation:pulse 2s infinite}
.stock-line.out{color:var(--bad)}.stock-line.out i{animation:none}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--ok) 50%,transparent)}70%{box-shadow:0 0 0 7px transparent}100%{box-shadow:0 0 0 0 transparent}}
.hl{margin:0 0 18px;padding:14px 16px;list-style:none;display:grid;gap:8px;background:var(--soft);border-radius:var(--r)}
.hl li{display:flex;align-items:flex-start;gap:8px;font-size:14px;color:var(--ink2)}
.hl svg{width:18px;height:18px;color:var(--ok);margin-top:3px;stroke-width:2.4}
.opt{margin-bottom:16px}
.opt-name{font-weight:600;margin-bottom:8px;font-size:14px;color:var(--ink2)}
.opt-name b{color:var(--ink)}
.opt-vals{display:flex;flex-wrap:wrap;gap:8px}
.ov{min-width:50px;min-height:44px;padding:8px 14px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);border-radius:calc(var(--r) * .75);cursor:pointer;font-weight:700;transition:border-color .15s,background-color .15s,color .15s,transform .12s}
.ov:hover{border-color:var(--ink)}
.ov:active{transform:scale(.94)}
.ov.on{border-color:var(--brand);background:var(--brand);color:var(--on-brand)}
.ov.na{opacity:.4;text-decoration:line-through}
.qty-row{display:flex;gap:10px;margin:20px 0 10px}
.qty-row .btn{flex:1}
.qty{display:flex;align-items:center;border:1.5px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--surface)}
.qty button{width:42px;height:50px;border:0;background:transparent;font-size:20px;cursor:pointer;color:var(--ink)}
.qty button:active{background:var(--soft)}
.qty input{width:40px;text-align:center;border:0;outline:0;font-weight:800;background:transparent;font-variant-numeric:tabular-nums}
.pdp-err{color:var(--bad);font-weight:700;margin:8px 0 0;animation:shake .4s}
@keyframes shake{25%{transform:translateX(6px)}50%{transform:translateX(-5px)}75%{transform:translateX(3px)}}
.pdp-ship{display:flex;align-items:center;gap:6px;margin:12px 0 0;font-size:13px;font-weight:600;color:var(--ink2)}
.pdp-ship svg{width:17px;height:17px;color:var(--brand)}
.assure{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0}
.assure>div{display:grid;justify-items:center;gap:6px;text-align:center;padding:12px 6px;border:1px solid var(--line);border-radius:var(--r);font-size:12px;font-weight:600;line-height:1.45;color:var(--ink2);background:var(--surface)}
.assure svg{width:24px;height:24px;color:var(--brand);stroke-width:1.6}
.desc{margin-top:26px;border-top:1px solid var(--line);padding-top:20px}
.desc h2{font-size:17px;margin:0 0 8px}
.sticky-buy{display:none}

/* ---------------------------------------------------------------- السلة */
.cart-grid{display:grid;grid-template-columns:1fr 360px;gap:28px;align-items:start}
.cart-list{display:grid;gap:12px;align-content:start}
.ci{display:grid;grid-template-columns:96px 1fr;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:calc(var(--r) * 1.1);padding:12px;animation:fadeUp .35s var(--ease) both}
.ci img{width:96px;height:96px;object-fit:cover;border-radius:calc(var(--r) * .8);background:var(--soft)}
.ci b{display:block;font-size:14.5px;line-height:1.5}
.ci small{color:var(--muted);display:block;font-size:12.5px}
.cart-foot{position:sticky;top:84px;background:var(--surface);border:1px solid var(--line);border-radius:calc(var(--r) * 1.2);padding:18px;display:grid;gap:8px;box-shadow:var(--sh-sm)}
.cart-foot .ship-meter{margin:0 0 4px}
.mini-trust{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:4px}
.mini-trust span{display:inline-flex;align-items:center;gap:5px}
.mini-trust svg{width:16px;height:16px}
.row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:6px 0}
.row.total{border-top:1px solid var(--line);margin-top:6px;padding-top:12px;font-size:16px;font-weight:700}
.row.total b{color:var(--brand);font-size:21px}

/* ---------------------------------------------------------------- إتمام الطلب */
.co-steps{display:flex;list-style:none;padding:0;margin:0 auto 22px;max-width:520px;counter-reset:s}
.co-steps li{flex:1;display:grid;justify-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--muted);position:relative;text-align:center}
.co-steps li span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--soft);border:1.5px solid var(--line);font-size:13px;position:relative;z-index:1;color:var(--muted)}
.co-steps li span svg{width:16px;height:16px;stroke-width:2.6}
.co-steps li::before{content:"";position:absolute;top:15px;left:50%;width:100%;height:2px;background:var(--line)}
.co-steps li:first-child::before{display:none}
.co-steps li.done,.co-steps li.on{color:var(--ink)}
.co-steps li.done span{background:var(--ok);border-color:var(--ok);color:#fff}
.co-steps li.on span{background:var(--brand);border-color:var(--brand);color:var(--on-brand);box-shadow:0 0 0 5px color-mix(in srgb,var(--brand) 16%,transparent)}
.co-steps li.done::before,.co-steps li.on::before{background:var(--ok)}
.co-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:28px;align-items:start}
.co-form{display:grid;gap:14px}
.co-box{border:1px solid var(--line);border-radius:calc(var(--r) * 1.2);padding:16px;margin:0;min-width:0;display:grid;gap:12px;background:var(--surface)}
.co-box legend{float:right;width:100%;padding:0;margin:0 0 2px;display:flex;align-items:center;gap:10px;font-weight:800;font-size:16px;font-family:var(--fh),var(--fb),Cairo,sans-serif}
.co-box legend span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:var(--bg);font-size:13px;font-family:var(--fb),Cairo,sans-serif}
.co-box legend+*{clear:both}
.co-form label{display:grid;gap:5px;font-weight:600;font-size:13.5px;color:var(--ink2)}
.co-form label small{font-weight:500;color:var(--muted);font-size:12px}
.co-form input,.co-form select,.co-form textarea{border:1.5px solid var(--line);border-radius:calc(var(--r) * .75);padding:11px 13px;background:var(--bg);color:var(--ink);outline:0;min-height:50px;width:100%;font-size:16px;transition:border-color .2s,box-shadow .2s}
.co-form textarea{min-height:76px;resize:vertical}
.co-form input:focus,.co-form select:focus,.co-form textarea:focus{border-color:var(--brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 14%,transparent)}
.co-form .two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pay-box{display:flex;align-items:center;gap:12px;border:2px solid var(--brand);border-radius:var(--r);padding:14px;background:var(--tint)}
.pay-box>svg{width:30px;height:30px;color:var(--brand);stroke-width:1.5}
.pay-box div{display:grid}
.pay-agree{display:flex;align-items:flex-start;gap:8px;margin-top:10px;font-size:.88rem}.pay-agree input{width:auto;margin-top:3px}.pay-agree a{text-decoration:underline}
.pay-box b{font-size:15px}
.pay-box span{font-size:12.5px;color:var(--muted)}
.pay-dot{width:20px;height:20px;border-radius:50%;border:2px solid var(--brand);display:grid;place-items:center;flex:none}
.pay-dot::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--brand)}
.co-trust{display:flex;justify-content:center;gap:8px 16px;flex-wrap:wrap;font-size:12px;color:var(--muted);font-weight:600}
.co-trust span{display:inline-flex;align-items:center;gap:5px}
.co-trust svg{width:16px;height:16px}
.co-sum{position:sticky;top:84px;background:var(--surface);border:1px solid var(--line);border-radius:calc(var(--r) * 1.2);padding:18px;box-shadow:var(--sh-sm)}
.co-sum h2{font-size:16px;margin:0 0 6px}
.co-line{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:8px 0}
.co-line>span{position:relative}
.co-line img{width:56px;height:56px;border-radius:calc(var(--r) * .7);object-fit:cover;background:var(--soft);border:1px solid var(--line)}
.co-line i{position:absolute;top:-6px;left:-6px;min-width:20px;height:20px;border-radius:99px;background:var(--muted);color:var(--bg);font-size:11px;font-style:normal;font-weight:800;display:grid;place-items:center;padding-inline:4px}
.co-line b{font-size:13.5px;line-height:1.45}
.co-line small{display:block;color:var(--muted);font-size:12px}
.co-cod{display:flex;align-items:center;gap:6px;margin:10px 0 0;font-size:12.5px;color:var(--ok);font-weight:700;justify-content:center}
.co-cod svg{width:17px;height:17px}
.coupon{display:flex;align-items:center;gap:8px;margin:12px 0 4px;border:1.5px dashed var(--line);border-radius:calc(var(--r) * .8);padding:4px 4px 4px 4px;padding-inline-start:12px;background:var(--bg)}
.coupon>svg{width:18px;height:18px;color:var(--muted)}
.coupon input{flex:1;min-width:0;border:0;background:transparent;text-transform:uppercase;outline:0;padding:8px 0;color:var(--ink)}
.coupon:focus-within{border-color:var(--brand)}
.coupon .btn{min-height:40px;padding-inline:16px}
.coupon-msg{margin:4px 0 8px;font-size:13px;font-weight:700}
.coupon-msg.ok{color:var(--ok)}.coupon-msg.bad{color:var(--bad)}
.row.disc b{color:var(--ok)}
.offer-chip{display:inline-flex;align-items:center;gap:6px;background:color-mix(in srgb,var(--accent) 20%,var(--bg));color:var(--ink);border-radius:99px;padding:5px 12px;font-size:12.5px;font-weight:800;margin-bottom:10px}
.offer-chip svg{width:16px;height:16px}
.alert{background:color-mix(in srgb,var(--bad) 8%,var(--bg));color:var(--bad);border:1px solid color-mix(in srgb,var(--bad) 25%,var(--bg));border-radius:10px;padding:10px 14px;font-weight:700}

/* ---------------------------------------------------------------- متابعة الطلب */
.done{text-align:center;padding:10px 0 22px}
.done-ic{width:76px;height:76px;border-radius:50%;background:var(--ok);color:#fff;display:grid;place-items:center;margin:0 auto 14px;box-shadow:0 0 0 10px color-mix(in srgb,var(--ok) 14%,transparent);animation:pop .6s var(--ease) both}
.done-ic svg{width:38px;height:38px;stroke-width:2.6;stroke-dasharray:24;stroke-dashoffset:24;animation:draw .5s .35s ease forwards}
@keyframes pop{from{transform:scale(.4);opacity:0}}
@keyframes draw{to{stroke-dashoffset:0}}
.done h1{font-size:clamp(20px,2.4vw,26px);margin:0 0 6px}
.done p{color:var(--muted);margin:0}
.track-card{background:var(--surface);border:1px solid var(--line);border-radius:calc(var(--r) * 1.2);padding:18px;margin-bottom:14px;box-shadow:var(--sh-sm)}
.code{font-size:18px;letter-spacing:1.5px;font-variant-numeric:tabular-nums}
.steps{display:flex;list-style:none;padding:0;margin:18px 0}
.steps li{flex:1;text-align:center;font-size:12px;color:var(--muted);position:relative;font-weight:700}
.steps li span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--soft);border:1.5px solid var(--line);margin:0 auto 6px;position:relative;z-index:1;color:transparent}
.steps li span svg{width:14px;height:14px;stroke-width:3}
.steps li::before{content:"";position:absolute;top:12px;left:50%;width:100%;height:2px;background:var(--line)}
.steps li:first-child::before{display:none}
.steps li.on{color:var(--ink)}
.steps li.on span{background:var(--ok);border-color:var(--ok);color:#fff}
.steps li.on::before{background:var(--ok)}
.steps li.cur span{box-shadow:0 0 0 5px color-mix(in srgb,var(--ok) 18%,transparent)}
.t-items{display:grid;gap:10px;margin:12px 0;border-block:1px solid var(--line);padding-block:12px}
.t-item{display:flex;gap:12px;align-items:center}
.t-item img{width:52px;height:52px;border-radius:10px;object-fit:cover;background:var(--soft)}
.t-item small{display:block;color:var(--muted)}
.track .btn{margin-top:10px}
.panel-center{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:4px;padding:28px 0}
.panel-center .sec-title{margin:6px 0 0;justify-content:center}
.panel-center .alert{margin-top:14px}
.track-form{display:flex;gap:8px;width:100%;max-width:440px;margin:16px auto 0}
.track-form input{flex:1;border:1.5px solid var(--line);border-radius:var(--r);padding:11px 14px;font-size:16px;font-weight:700;letter-spacing:1px;outline:0;min-width:0;background:var(--surface);color:var(--ink);min-height:50px}
.track-form input:focus{border-color:var(--brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 14%,transparent)}
.track-form .btn{min-height:50px}
.nf-code{font-family:var(--fh),var(--fb),Cairo,sans-serif;font-size:clamp(84px,16vw,140px);font-weight:900;line-height:1;background:linear-gradient(135deg,var(--brand),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:4px}
.nf-links{display:flex;gap:10px;margin-top:18px}
.policy{background:var(--surface);border:1px solid var(--line);border-radius:calc(var(--r) * 1.2);padding:clamp(18px,3vw,32px)}
.policy h1{margin:0 0 10px;font-size:clamp(22px,2.4vw,28px)}
.policy h2{font-size:17px;margin:26px 0 6px}
.policy ul{margin:0 0 10px;padding-inline-start:20px;display:grid;gap:6px;color:var(--ink2);line-height:1.8}
.policy p{margin:0 0 10px}
.policy-nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.policy-nav a{padding:7px 14px;border-radius:99px;border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--ink2)}
.policy-nav a.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}

/* ---------------------------------------------------------------- الفوتر */
.ftr{background:#0c1018;color:#a3acbd;margin-top:var(--sec)}
.ftr-in{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.1fr;gap:28px;padding-block:44px 32px}
.ftr-name{color:#fff;font-size:19px;font-family:var(--fh),var(--fb),Cairo,sans-serif}
.ftr p{font-size:13.5px;margin:8px 0 0;max-width:40ch;line-height:1.8}
.ftr-links,.ftr-pay{display:grid;gap:9px;font-size:13.5px;align-content:start}
.ftr-links b{color:#fff;font-size:14px;margin-bottom:2px}
.ftr-pay span,.ftr-pay a{display:inline-flex;align-items:center;gap:8px}
.ftr-pay svg{width:18px;height:18px;color:#e5e7eb}
.ftr a{transition:color .2s}
.ftr a:hover{color:#fff}
.powered{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.08);padding-block:16px;font-size:12px;color:#6b7280}
.powered a{color:#c7d2fe;font-weight:700}
.wa-float{position:fixed;bottom:22px;left:22px;width:56px;height:56px;border-radius:50%;background:var(--wa);display:grid;place-items:center;box-shadow:0 10px 26px -6px rgba(37,211,102,.55);z-index:40;transition:transform .2s var(--ease)}
.wa-float:hover{transform:scale(1.07)}
.wa-float svg{width:30px;height:30px;fill:#fff;stroke:none}
.toast{position:fixed;bottom:28px;left:50%;z-index:80;display:flex;align-items:center;gap:8px;max-width:calc(100% - 32px);background:color-mix(in srgb,var(--ink) 94%,transparent);color:var(--bg);padding:11px 18px;border-radius:14px;font-weight:700;font-size:14px;box-shadow:var(--sh-lg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  opacity:0;visibility:hidden;transform:translate(-50%,16px) scale(.96);transition:opacity .25s var(--ease),transform .3s var(--ease),visibility 0s .3s;pointer-events:none}
.toast.show{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .25s var(--ease),transform .3s var(--ease)}
.toast svg{width:18px;height:18px;color:var(--ok);stroke-width:2.6}
.fly{position:fixed;z-index:90;border-radius:12px;object-fit:cover;pointer-events:none;box-shadow:var(--sh-lg)}
.tabbar{display:none}

/* ---------------------------------------------------------------- صفحات المنصة البسيطة */
.bare{display:grid;place-items:center;min-height:100vh;background:#f5f6f8;padding:16px;font-family:Cairo,system-ui,sans-serif}
.bare-box{background:#fff;border-radius:20px;padding:36px 28px;text-align:center;max-width:440px;box-shadow:var(--sh)}
.bare-box h1{margin:0 0 8px;font-size:22px}
.bare-box p{color:#6b7280;margin:0 0 20px}
.bare .btn{--brand:#111827}

/* ---------------------------------------------------------------- حركة الظهور */
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}}
.js .rv{opacity:0;transform:translateY(18px)}
.js .rv.in{opacity:1;transform:none;transition:opacity .7s var(--ease) var(--d,0s),transform .7s var(--ease) var(--d,0s)}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .js .rv{opacity:1;transform:none}
}

/* ---------------------------------------------------------------- مقاسات */
@media (min-width:900px){
  .slides{max-width:1208px;margin-inline:auto;padding-inline:0;scroll-padding-inline:0;border-radius:calc(var(--r) * 1.5)}
  .slide{flex-basis:100%;grid-template-columns:1.05fr .95fr;grid-template-rows:none;align-items:stretch;min-height:clamp(380px,32vw,440px)}
  .slide-txt{padding:48px clamp(32px,5vw,64px);gap:10px;align-content:center}
  .slide-txt em{font-size:15px;padding:11px 22px;margin-top:14px}
  .slide-media{position:relative;margin:28px;margin-inline-start:0;aspect-ratio:auto}
  .slide-media img{position:absolute;inset:0}
  .tiles{justify-content:safe center}
  .cgrid-panel{display:grid;grid-template-columns:minmax(200px,260px) 1fr;gap:28px;align-items:center}
  .cgrid-panel .sec-head{flex-direction:column;align-items:flex-start;gap:12px;margin:0}
  .cgrid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
  .trust-i{justify-content:center}
  .sl-nav{display:grid;place-items:center;position:absolute;top:calc(50% - 22px);width:46px;height:46px;border-radius:50%;border:0;background:color-mix(in srgb,var(--bg) 92%,transparent);color:var(--ink);box-shadow:var(--sh);cursor:pointer;z-index:2;opacity:0;transition:opacity .3s,transform .2s var(--ease)}
  .slider:hover .sl-nav{opacity:1}
  .sl-nav:active{transform:scale(.92)}
  .sl-prev{right:max(24px,calc((100% - 1240px) / 2 + 24px))}
  .sl-prev svg{transform:scaleX(-1)}
  .sl-next{left:max(24px,calc((100% - 1240px) / 2 + 24px))}
  .tile{width:104px}
  .tile-img{width:96px;height:96px}
  .tile-name{font-size:13.5px}
  .tiles{gap:20px}
  .ccards{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));overflow:visible}
  .cpn-main{padding:28px 36px}
  .cpn-code{padding:24px 40px}
  .cpn-code button{font-size:20px;padding:12px 20px}
  .cgrid-panel{padding:22px}
}
@media (max-width:1060px){
  .nav{display:none}
  .menu-btn{display:inline-grid}
  .ftr-in{grid-template-columns:1fr 1fr}
}
@media (max-width:960px){
  .grid{grid-template-columns:repeat(3,1fr)}
  .pdp-grid,.co-grid,.cart-grid{grid-template-columns:1fr;gap:20px}
  .gallery,.co-sum,.cart-foot{position:static}
  .co-sum{order:-1}
}
@media (max-width:640px){
  body{font-size:14.5px;padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  .hdr{top:-6px}
  .hdr-in{height:64px;padding-top:6px;gap:4px}
  .menu-btn{margin-inline-start:-8px}
  .brand{font-size:17px}
  .brand-name{max-width:46vw;overflow:hidden;text-overflow:ellipsis}
  .brand-mark{width:34px;height:34px;font-size:16px}
  .search{display:none}
  .cart-btn{margin-inline-start:auto;margin-inline-end:-8px}
  .deliver{display:flex;align-items:center;gap:6px;padding:8px 16px;background:var(--tint);font-size:12.5px;font-weight:700;color:var(--ink2);border-bottom:1px solid var(--line)}
  .deliver svg{width:16px;height:16px;color:var(--brand)}
  .deliver select{border:0;background:transparent;font-weight:800;color:var(--brand);max-width:46%;padding:0;cursor:pointer;font-size:12.5px}
  .deliver small{color:var(--muted);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hero-in{grid-template-columns:1fr;padding-block:22px 30px;gap:20px}
  .hero-img{order:-1}
  .hero-img img{aspect-ratio:16/11}
  .grid{grid-template-columns:repeat(2,1fr);gap:22px 12px}
  .cgrid{grid-template-columns:1fr 1fr}
  .cgrid-panel{padding:14px}
  .cpn-main{padding:18px 16px}
  .cpn-code{padding:16px 14px}
  .cpn-code button{font-size:14px;padding:8px 10px;letter-spacing:.5px}
  .ftr-in{grid-template-columns:1fr 1fr;gap:24px 16px;padding-block:32px 20px}
  .ftr-about,.ftr-pay{grid-column:1/-1}
  .co-form .two{grid-template-columns:1fr}
  .co-box{padding:14px}
  .tile{width:74px}.tile-img{width:68px;height:68px}.tiles{gap:10px}
  .trust{grid-template-columns:repeat(3,1fr);gap:8px}
  .trust-i{flex-direction:column;text-align:center;gap:8px;padding:14px 6px}
  .trust-i b{font-size:12px;line-height:1.45}
  .pdp{padding-top:0}
  .pdp .crumbs{display:none}
  .gallery{margin-inline:-16px}
  .g-main{border-radius:0}
  .g-thumbs{display:none}
  .pdp-grid{gap:16px}
  .ci{grid-template-columns:80px 1fr;padding:10px}
  .ci img{width:80px;height:80px}
  .sticky-buy{display:flex;position:fixed;inset-inline:0;bottom:calc(60px + env(safe-area-inset-bottom));z-index:35;background:color-mix(in srgb,var(--bg) 94%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:8px 16px;align-items:center;gap:10px;transform:translateY(calc(100% + 70px));transition:transform .35s var(--ease);box-shadow:0 -10px 30px -16px rgba(0,0,0,.25)}
  .sticky-buy.show{transform:none}
  .sticky-buy img{width:44px;height:44px;border-radius:10px;object-fit:cover;background:var(--soft)}
  .sb-txt{flex:1;min-width:0;display:grid;line-height:1.3}
  .sb-txt small{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sb-txt b{font-size:16px;color:var(--brand)}
  .sticky-buy .btn{padding-inline:22px}
  .wa-float{bottom:calc(76px + env(safe-area-inset-bottom));left:14px;width:50px;height:50px}
  /* لما شريط «اطلب دلوقتي» يظهر، زرار واتساب يطلع فوقه بدل ما يغطي الزرار */
  .wa-float{transition:transform .2s var(--ease),bottom .25s var(--ease)}
  body:has(.sticky-buy.show:not(.lp-sticky)) .wa-float{bottom:calc(140px + env(safe-area-inset-bottom))}
  .wa-float svg{width:27px;height:27px}
  .tabbar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;inset-inline:0;bottom:0;z-index:36;background:color-mix(in srgb,var(--bg) 92%,transparent);-webkit-backdrop-filter:saturate(1.8) blur(16px);backdrop-filter:saturate(1.8) blur(16px);border-top:1px solid var(--line);padding:6px 0 calc(6px + env(safe-area-inset-bottom))}
  .tabbar a,.tabbar button{display:grid;justify-items:center;gap:1px;font-size:10.5px;font-weight:700;color:var(--muted);background:none;border:0;position:relative;padding:2px 0;cursor:pointer;transition:color .2s}
  .tabbar a::before{content:"";position:absolute;top:-7px;width:22px;height:3px;border-radius:0 0 3px 3px;background:var(--brand);transform:scaleX(0);transition:transform .25s var(--ease)}
  .tabbar .on{color:var(--brand)}
  .tabbar .on::before{transform:none}
  .tabbar svg{width:24px;height:24px}
  .tabbar a:active svg,.tabbar button:active svg{transform:scale(.88)}
  .tabbar b{position:absolute;top:-3px;left:calc(50% - 22px);min-width:18px;height:18px;border-radius:99px;background:var(--accent);color:var(--on-accent);font-size:10.5px;font-weight:800;display:grid;place-items:center;padding-inline:4px;box-shadow:0 0 0 2px var(--bg)}
  .toast{bottom:calc(80px + env(safe-area-inset-bottom))}
  .powered{padding-bottom:20px}
}
@media (max-width:370px){
  .grid{gap:18px 10px}
  .cpn{grid-template-columns:1fr}
  .cpn-code{border-inline-start:0;border-top:2px dashed color-mix(in srgb,var(--on-brand) 35%,transparent)}
  .cpn-code::before{top:-12px;inset-inline-start:-12px}.cpn-code::after{top:-12px;bottom:auto;inset-inline-start:auto;inset-inline-end:-12px}
  .assure>div{font-size:11px}
}

/* ---------------------------------------------------------------- تطبيقات Apexfy */
/* شريط الإعلانات: رسايل بتلف (fade + حركة خفيفة) */
.an-m{display:flex;align-items:center;justify-content:center;gap:8px;margin:0;min-width:0}
.announce.rot{display:grid;grid-template-areas:"m";position:relative;padding-inline:40px;overflow:hidden}
.announce.rot .an-m{grid-area:m;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .4s var(--ease),transform .5s var(--ease),visibility 0s .5s}
.announce.rot .an-m.was{transform:translateY(-8px)}
.announce.rot .an-m.on{opacity:1;visibility:visible;transform:none;transition:opacity .45s var(--ease) .1s,transform .55s var(--ease) .1s}
.an-dots{position:absolute;inset-inline-end:14px;top:50%;transform:translateY(-50%);display:flex;gap:4px}
.an-dots i{width:5px;height:5px;border-radius:99px;background:currentColor;opacity:.3;transition:width .3s var(--ease),opacity .3s}
.an-dots i.on{width:14px;opacity:.85}

/* ندرة حقيقية */
.scarce{margin:0 0 16px;padding:10px 12px;display:grid;gap:8px;border-radius:calc(var(--r) * .8);background:color-mix(in srgb,var(--sale) 6%,var(--bg));border:1px solid color-mix(in srgb,var(--sale) 18%,var(--bg))}
.scarce p{margin:0;display:flex;align-items:center;gap:7px;font-size:13.5px;font-weight:700;color:var(--ink)}
.scarce p svg{width:18px;height:18px;color:var(--sale)}
.scarce p b{color:var(--sale);font-size:15.5px;font-variant-numeric:tabular-nums}
.scarce i{display:block;height:5px;border-radius:99px;background:color-mix(in srgb,var(--sale) 13%,var(--bg));overflow:hidden}
.scarce i b{display:block;height:100%;width:var(--p,20%);border-radius:inherit;background:linear-gradient(90deg,var(--sale),color-mix(in srgb,var(--sale) 55%,var(--accent)))}

/* جدول المقاسات: رابط + bottom sheet (موبايل) / نافذة في النص (ديسكتوب) */
.opt-name{display:flex;align-items:center;justify-content:space-between;gap:6px 12px;flex-wrap:wrap}
.sc-link{display:inline-flex;align-items:center;gap:5px;border:0;background:none;padding:4px 0;color:var(--ink);font-weight:700;font-size:13px;cursor:pointer;text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--ink) 28%,transparent);text-underline-offset:5px}
.sc-link:hover{text-decoration-color:currentColor}
.sc-link svg{width:17px;height:17px;color:var(--brand)}
.sc-link.solo{margin:0 0 14px}
.sheet .drawer-panel{inset:auto 0 0 0;width:auto;max-height:86vh;border-radius:22px 22px 0 0;transform:translateY(100%)}
.sheet .drawer-panel::before{content:"";position:sticky;top:0;display:block;width:40px;height:4px;flex:none;border-radius:99px;background:var(--line);margin:8px auto -4px;z-index:2}
#scTitle{display:flex;align-items:center;gap:8px}
#scTitle svg{width:20px;height:20px;color:var(--brand)}
.sc-body{padding:14px 16px calc(22px + env(safe-area-inset-bottom))}
.sc-prod{margin:0 0 10px;color:var(--muted);font-size:13px;font-weight:600}
.sc-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:calc(var(--r) * .8);overscroll-behavior-x:contain}
.sc-scroll:focus-visible{outline-offset:-2px}
.sc-table{width:100%;border-collapse:collapse;font-size:13.5px;text-align:center;font-variant-numeric:tabular-nums}
.sc-table th,.sc-table td{padding:11px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.sc-table thead th{background:var(--soft);font-weight:800;font-size:12.5px;color:var(--ink2)}
.sc-table tbody th{font-weight:800;color:var(--brand)}
.sc-table tbody tr:nth-child(even){background:color-mix(in srgb,var(--soft) 55%,transparent)}
.sc-table tbody tr:last-child>*{border-bottom:0}
.sc-note{display:flex;align-items:flex-start;gap:7px;margin:12px 0 0;padding:10px 12px;font-size:13px;color:var(--ink2);background:var(--tint);border-radius:calc(var(--r) * .7)}
.sc-note svg{width:17px;height:17px;color:var(--brand);margin-top:2px}
@media (min-width:641px){
  .sheet .drawer-panel{inset:50% auto auto 50%;width:min(92vw,620px);max-height:min(82vh,640px);border-radius:calc(var(--r) * 1.3);transform:translate(-50%,-46%) scale(.97);opacity:0;transition:transform .32s var(--ease),opacity .25s}
  .drawer.sheet.open .drawer-panel{transform:translate(-50%,-50%);opacity:1}
  .sheet .drawer-panel::before{display:none}
}

/* عروض الكمية */
.tiers{margin:2px 0 4px}
.tiers-h{display:flex;align-items:center;gap:7px;font-size:14px;margin-bottom:12px}
.tiers-h svg{width:18px;height:18px;color:var(--brand)}
.tiers-l{display:grid;grid-template-columns:repeat(auto-fit,minmax(94px,1fr));gap:8px}
.tier{position:relative;display:grid;justify-items:center;align-content:center;gap:1px;min-width:0;padding:13px 6px 10px;border:1.5px solid var(--line);border-radius:calc(var(--r) * .85);background:var(--surface);color:var(--ink);cursor:pointer;text-align:center;line-height:1.4;transition:border-color .15s,background-color .15s,box-shadow .2s,transform .12s}
.tier:hover{border-color:color-mix(in srgb,var(--brand) 55%,var(--line))}
.tier:active{transform:scale(.97)}
.tier.on{border-color:var(--brand);background:var(--tint);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 13%,transparent)}
.tier-q{font-weight:800;font-size:14px}
.tier-d{font-size:12px;font-weight:800;color:var(--sale)}
.tier:first-child .tier-d{color:var(--muted);font-weight:600}
.tier-p{font-size:14.5px;font-weight:800;margin-top:5px;font-variant-numeric:tabular-nums}
.tier s{font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.tier em{position:absolute;top:-10px;inset-inline:0;margin-inline:auto;width:max-content;font-style:normal;font-size:10.5px;font-weight:800;line-height:1.7;background:var(--sale);color:var(--on-sale);padding:0 9px;border-radius:99px}
.tiers-n{display:block;margin-top:8px;color:var(--muted);font-size:12px}

/* اطلب على واتساب */
.btn-wa-order{margin-top:10px}
.btn-wa-order svg{width:21px;height:21px;fill:currentColor;stroke:none}

/* شارات الثقة (صفحة المنتج + تحت زرار الطلب) */
ul.assure,ul.co-trust{list-style:none;padding:0}
.assure>li{display:grid;justify-items:center;align-content:start;gap:6px;text-align:center;padding:12px 6px;border:1px solid var(--line);border-radius:var(--r);font-size:12px;font-weight:600;line-height:1.45;color:var(--ink2);background:var(--surface);min-width:0;overflow-wrap:anywhere}
.assure.n1{grid-template-columns:1fr}
.assure.n2,.assure.n4{grid-template-columns:repeat(2,1fr)}
@media (min-width:480px) and (max-width:960px),(min-width:1100px){.assure.n4{grid-template-columns:repeat(4,1fr)}}
.co-trust.tb{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0}
.co-trust.tb li{display:flex;align-items:center;justify-content:center;gap:6px;padding:9px 8px;border-radius:calc(var(--r) * .7);background:var(--soft);color:var(--ink2);text-align:center;line-height:1.4;min-width:0;overflow-wrap:anywhere}
.co-trust.tb svg{color:var(--brand)}
.co-trust.tb li:only-child,.co-trust.tb li:last-child:nth-child(odd){grid-column:1/-1}

/* الطلبات المتروكة: إفصاح صريح تحت خانة الرقم */
.co-form label .draft-note{display:flex;align-items:center;gap:5px;font-size:11.5px}
.draft-note svg{width:14px;height:14px;color:var(--ok)}

@media (max-width:640px){
  .announce.rot{padding-inline:14px}
  .an-dots{display:none}
}

/* ================================================================ تطبيقات Apexfy — المرحلة التانية */
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* النجوم: صف باهت + صف ملوّن مقصوص بنسبة المتوسط (بيبدأ من اليمين في RTL) */
.stars{position:relative;display:inline-flex;vertical-align:middle;line-height:0}
.stars>span{display:inline-flex;gap:1px}
.stars svg{width:16px;height:16px;fill:currentColor;stroke:none}
.st-bg{color:color-mix(in srgb,var(--ink) 16%,var(--bg))}
.st-fg{position:absolute;inset-block:0;inset-inline-start:0;width:var(--v,0%);overflow:hidden;color:#f5a524}
.stars.sm svg{width:14px;height:14px}
.stars.lg svg{width:22px;height:22px}
.rv-mini{display:inline-flex;align-items:center;gap:6px;margin:-2px 0 10px;font-size:13px;color:var(--muted);font-weight:600}
.rv-mini b{color:var(--ink);font-weight:800;font-variant-numeric:tabular-nums}
.rv-mini:hover>span:last-child{text-decoration:underline}

/* قسم التقييمات */
.rv-sec{scroll-margin-top:84px}
.rv-grid{display:grid;grid-template-columns:minmax(240px,320px) 1fr;gap:clamp(18px,3vw,36px);align-items:start}
.rv-sum{position:sticky;top:90px;display:grid;gap:14px;padding:18px;border:1px solid var(--line);border-radius:calc(var(--r) * 1.2);background:var(--surface)}
.rv-avg{display:flex;align-items:center;gap:14px}
.rv-avg>b{font-size:44px;line-height:1;font-weight:900;font-family:var(--fh),var(--fb),Cairo,sans-serif;font-variant-numeric:tabular-nums}
.rv-avg>div{display:grid;gap:4px}
.rv-avg>div>span:last-child{font-size:13px;color:var(--muted);font-weight:600}
.rv-dist{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.rv-dist li{display:grid;grid-template-columns:34px 1fr 26px;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--ink2)}
.rv-dist li>span:first-child{display:inline-flex;align-items:center;gap:3px}
.rv-dist li>span svg{width:13px;height:13px;fill:#f5a524;stroke:none}
.rv-dist i{display:block;height:7px;border-radius:99px;background:var(--soft);overflow:hidden}
.rv-dist i b{display:block;height:100%;width:var(--p,0%);border-radius:inherit;background:#f5a524}
.rv-dist small{color:var(--muted);font-variant-numeric:tabular-nums;text-align:end}
.rv-note{display:flex;align-items:center;gap:6px;margin:0;font-size:12px;color:var(--muted);font-weight:600}
.rv-note svg{width:16px;height:16px;color:var(--ok)}
.rv-list{display:grid;gap:12px;min-width:0}
.rv-card{padding:16px;border:1px solid var(--line);border-radius:calc(var(--r) * 1.1);background:var(--surface);min-width:0}
.rv-card header{display:flex;align-items:flex-start;gap:10px}
.rv-av{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:50%;background:var(--tint);color:var(--brand);font-weight:800}
.rv-who{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;line-height:1.4}
.rv-who b{font-size:14.5px}
.rv-who small{flex-basis:100%;color:var(--muted);font-size:12px}
.rv-ver{display:inline-flex;align-items:center;gap:3px;font-size:11.5px;font-weight:800;color:var(--ok);background:color-mix(in srgb,var(--ok) 11%,var(--bg));padding:1px 9px;border-radius:99px}
.rv-ver svg{width:12px;height:12px;stroke-width:3}
.rv-card header .stars{margin-top:4px}
.rv-title{margin:10px 0 0;font-size:14.5px;font-weight:800;line-height:1.5;overflow-wrap:anywhere}
.rv-title+.rv-body{margin-top:4px}
.rv-flag{font-weight:400;font-size:13px;margin-inline-start:2px}
.rv-body{margin:10px 0 0;color:var(--ink2);line-height:1.85;font-size:14px;overflow-wrap:anywhere}
.rv-ph{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.rv-ph img{width:72px;height:72px;object-fit:cover;border-radius:calc(var(--r) * .7);background:var(--soft);border:1px solid var(--line)}
.rv-reply{margin-top:12px;padding:10px 12px;border-inline-start:3px solid var(--brand);background:var(--tint);border-radius:calc(var(--r) * .6)}
.rv-reply b{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--brand)}
.rv-reply b svg{width:15px;height:15px}
.rv-reply p{margin:4px 0 0;font-size:13.5px;color:var(--ink2);overflow-wrap:anywhere}
.rv-empty{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:18px;border:1px dashed var(--line);border-radius:calc(var(--r) * 1.1);background:var(--surface)}
.rv-empty p{margin:0;display:grid;gap:2px;flex:1;min-width:200px}
.rv-empty span{font-size:13px;color:var(--muted)}
.rv-empty a{color:var(--brand);font-weight:700;text-decoration:underline}

/* الباقة «اشتري معاه وفّر» */
.bndl{margin:18px 0;padding:16px;border:1.5px solid color-mix(in srgb,var(--brand) 30%,var(--line));border-radius:calc(var(--r) * 1.2);background:linear-gradient(180deg,var(--tint),var(--surface) 70%);display:grid;gap:12px;min-width:0}
.bndl-h{display:flex;align-items:center;gap:8px;font-size:15.5px}
.bndl-h svg{width:20px;height:20px;color:var(--brand)}
.bndl-pc{margin-inline-start:auto;background:var(--sale);color:var(--on-sale);font-size:12px;font-weight:800;padding:2px 10px;border-radius:99px;white-space:nowrap}
.bndl-t{margin:-6px 0 0;font-size:13px;color:var(--muted);font-weight:600}
.bndl-row{display:flex;align-items:center;gap:6px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.bndl-row::-webkit-scrollbar{display:none}
.bndl-img{flex:0 1 92px;min-width:64px;aspect-ratio:1;border-radius:calc(var(--r) * .8);overflow:hidden;background:var(--soft);border:1px solid var(--line)}
.bndl-img img{width:100%;height:100%;object-fit:cover}
.bndl-plus{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--brand);color:var(--on-brand);font-weight:800;font-size:16px;line-height:1}
.bndl-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.bndl-list li{display:grid;gap:6px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.bndl-list li:last-child{border-bottom:0;padding-bottom:0}
.bndl-li{display:flex;align-items:center;gap:8px;font-size:13.5px;min-width:0}
.bndl-li b{font-weight:700;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bndl-li a{flex:1;min-width:0;display:flex}
.bndl-li a:hover b{text-decoration:underline}
.bndl-li small{color:var(--muted);font-weight:600}
.bndl-n{flex:none;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--soft);font-size:11px;font-weight:800;color:var(--ink2)}
.bndl-p{flex:none;font-weight:800;font-size:13.5px;font-variant-numeric:tabular-nums}
.bndl-sel{width:100%;min-height:42px;border:1.5px solid var(--line);border-radius:calc(var(--r) * .7);padding:6px 10px;background:var(--bg);color:var(--ink);font-size:14px}
.bndl-sel:focus{outline:0;border-color:var(--brand)}
.bndl-sel.bad{border-color:var(--bad)}
.bndl-tot{display:flex;align-items:center;gap:6px 12px;flex-wrap:wrap;padding-top:4px}
.bndl-tot>span{font-weight:700;font-size:13.5px;color:var(--ink2)}
.bndl-tot>div{display:flex;align-items:baseline;gap:8px}
.bndl-tot b{font-size:20px;font-weight:900;color:var(--brand);font-variant-numeric:tabular-nums}
.bndl-tot s{color:var(--muted);font-size:13px}
.bndl-tot em{font-style:normal;margin-inline-start:auto;background:color-mix(in srgb,var(--ok) 13%,var(--bg));color:var(--ok);font-weight:800;font-size:12.5px;padding:3px 10px;border-radius:99px}
.bndl-hint,.bndl-n2{margin:0;font-size:12px;color:var(--muted)}

/* «بلّغني لما يرجع» */
.restock{margin:12px 0;padding:14px;border:1px solid var(--line);border-radius:calc(var(--r) * 1.1);background:var(--surface);display:grid;gap:10px}
.restock-h{margin:0;display:flex;align-items:flex-start;gap:8px;font-size:13.5px;color:var(--ink2)}
.restock-h svg{width:19px;height:19px;color:var(--brand);margin-top:2px}
.restock-f{display:flex;gap:8px}
.restock-f input,.pop-form input,.rate-phone input{flex:1;min-width:0;width:100%;border:1.5px solid var(--line);border-radius:calc(var(--r) * .75);padding:10px 13px;background:var(--bg);color:var(--ink);font-size:16px;min-height:48px;outline:0;transition:border-color .2s,box-shadow .2s}
.restock-f input:focus,.pop-form input:focus,.rate-phone input:focus{border-color:var(--brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 14%,transparent)}
.restock-f .btn{white-space:nowrap;min-height:48px}
.restock-msg,.ri-msg{margin:0;font-size:13px;font-weight:700}
.restock-msg.bad,.ri-msg.bad{color:var(--bad)}
.restock-msg.ok,.ri-msg.ok{color:var(--ok)}
.restock-ok,.ri-done{margin:0;display:flex;align-items:center;gap:8px;font-weight:700;color:var(--ok);font-size:14px}
.restock-ok svg,.ri-done svg{width:20px;height:20px;stroke-width:2.6}

/* العرض الإضافي (السلة الجانبية + صفحة الطلب) */
.upsell{display:grid;gap:8px;margin:10px 0 6px}
.mc-up{margin:4px 16px 12px}
.up-k{margin:0;display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:800;color:var(--sale)}
.up-k svg{width:16px;height:16px}
.up-card{display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:10px;padding:10px;border:1.5px dashed color-mix(in srgb,var(--sale) 45%,var(--line));border-radius:calc(var(--r) * .9);background:color-mix(in srgb,var(--sale) 4%,var(--surface));animation:fadeUp .35s var(--ease) both}
.up-card img{width:52px;height:52px;border-radius:calc(var(--r) * .6);object-fit:cover;background:var(--soft)}
.up-txt{display:grid;min-width:0;line-height:1.4}
.up-txt b{font-size:13px;overflow-wrap:anywhere}
.up-txt span{display:flex;align-items:baseline;gap:6px;font-variant-numeric:tabular-nums}
.up-txt strong{color:var(--sale);font-size:14px}
.up-txt s{color:var(--muted);font-size:12px}
.up-btn{min-height:38px;padding:6px 12px;font-size:13px;gap:4px}
.up-btn svg{width:16px;height:16px;stroke-width:2.4}

/* البوب أب (bottom sheet على الموبايل / نافذة في النص على الديسكتوب) */
@media (min-width:641px){.pop .drawer-panel{width:min(92vw,440px)}}
.pop-x{position:absolute;top:8px;inset-inline-end:8px;z-index:3}
.pop-body{display:grid;justify-items:center;text-align:center;gap:10px;padding:26px 20px calc(20px + env(safe-area-inset-bottom))}
.pop-ic{display:grid;place-items:center;width:62px;height:62px;border-radius:50%;background:var(--tint);color:var(--brand);box-shadow:0 0 0 8px color-mix(in srgb,var(--brand) 6%,transparent)}
.pop-ic svg{width:30px;height:30px;stroke-width:1.6}
.pop-body h2{margin:4px 0 0;font-size:clamp(19px,2vw + 10px,24px);font-weight:800;font-family:var(--fh),var(--fb),Cairo,sans-serif}
.pop-txt{margin:0;color:var(--muted);font-size:14px;max-width:34ch}
.pop-form{display:grid;gap:8px;width:100%;margin-top:4px}
.pop-err{margin:0;color:var(--bad);font-weight:700;font-size:13px}
.pop-done{display:grid;gap:12px;width:100%}
.pop-code{display:grid;gap:6px;justify-items:center;padding:14px;border:2px dashed color-mix(in srgb,var(--brand) 45%,var(--line));border-radius:calc(var(--r) * 1.1);background:var(--tint)}
.pop-code small{font-size:12px;color:var(--muted);font-weight:700}
.pop-code>div{display:flex;align-items:center;gap:10px}
.pop-code b{font-size:24px;letter-spacing:2px;font-weight:900;color:var(--brand)}
.pop-copy{display:inline-flex;align-items:center;gap:5px;border:0;border-radius:10px;padding:7px 12px;background:var(--brand);color:var(--on-brand);font-weight:800;cursor:pointer}
.pop-copy svg{width:16px;height:16px}
.pop-copy.copied{background:var(--ok);color:#fff}
.pop-thx{margin:0;display:flex;align-items:center;justify-content:center;gap:8px;font-weight:700;color:var(--ok)}
.pop-thx svg{width:20px;height:20px;stroke-width:2.6}
.pop-note{margin:2px 0 0;display:flex;align-items:center;justify-content:center;gap:5px;font-size:11.5px;color:var(--muted)}
.pop-note svg{width:14px;height:14px}

/* تقييم الطلب (صفحة المتابعة) */
.rate-box{scroll-margin-top:84px;display:grid;gap:12px;padding:18px;margin-bottom:14px;border:1px solid var(--line);border-radius:calc(var(--r) * 1.2);background:var(--surface)}
.rate-box h2{margin:0;display:flex;align-items:center;gap:10px;font-size:18px}
.rate-ic{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:color-mix(in srgb,#f5a524 16%,var(--bg));color:#f5a524}
.rate-ic svg{width:19px;height:19px;fill:currentColor;stroke:none}
.rate-box>.muted{margin:-6px 0 0}
.rate-phone{display:grid;gap:5px;font-weight:700;font-size:13.5px;color:var(--ink2)}
.rate-phone small{font-weight:500;color:var(--muted);font-size:12px}
.rate-phone input.bad{border-color:var(--bad)}
.rate-item{display:grid;gap:10px;padding:14px;border:1px solid var(--line);border-radius:var(--r);background:var(--bg);min-width:0}
.ri-head{display:flex;align-items:center;gap:10px;min-width:0}
.ri-head img{width:48px;height:48px;border-radius:10px;object-fit:cover;background:var(--soft);flex:none}
.ri-head b{font-size:14px;overflow-wrap:anywhere}
.ri-stars{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.rate-stars{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;gap:2px;position:relative}
.rate-stars input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.rate-stars label{display:grid;place-items:center;width:40px;height:40px;cursor:pointer;border-radius:10px;color:color-mix(in srgb,var(--ink) 18%,var(--bg));transition:color .15s,transform .15s var(--ease)}
.rate-stars label svg{width:30px;height:30px;fill:currentColor;stroke:none}
.rate-stars label:active{transform:scale(.88)}
.rate-stars input:checked~label,.rate-stars label:hover,.rate-stars label:hover~label{color:#f5a524}
.rate-stars input:focus-visible+label{outline:2px solid var(--brand);outline-offset:1px}
.rate-lbl{font-weight:800;font-size:13.5px;color:var(--ink2)}
.rate-item textarea{width:100%;border:1.5px solid var(--line);border-radius:calc(var(--r) * .75);padding:10px 12px;background:var(--surface);color:var(--ink);font-size:15px;resize:vertical;min-height:72px;outline:0}
.rate-item textarea:focus{border-color:var(--brand)}
.track .rate-item .btn{justify-self:start;margin-top:0}
.track-rate{display:inline-flex;align-items:center;gap:6px;margin-top:18px;font-size:14px;color:var(--ink2)}
.track-rate svg{width:18px;height:18px;fill:#f5a524;stroke:none}
.track-rate b{color:var(--brand);text-decoration:underline;text-underline-offset:3px}

/* صفحة الهبوط */
.hdr-min .hdr-in{justify-content:space-between;height:64px}
.hdr-cod{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--ok);background:color-mix(in srgb,var(--ok) 10%,var(--bg));padding:5px 12px;border-radius:99px;white-space:nowrap}
.hdr-cod svg{width:17px;height:17px}
.lp-hero .qty-row .btn{flex:1}
.lp-order{scroll-margin-top:12px}
.lp-box{max-width:720px;margin-inline:auto;padding:clamp(16px,3vw,26px);border:1.5px solid color-mix(in srgb,var(--brand) 28%,var(--line));border-radius:calc(var(--r) * 1.4);background:var(--surface);box-shadow:var(--sh);display:grid;gap:14px;min-width:0}
.lp-box h2{margin:0;display:flex;align-items:center;gap:8px;font-size:clamp(18px,1.4vw + 12px,23px);font-weight:800}
.lp-box h2 svg{color:var(--brand)}
.lp-pick{display:flex;align-items:center;gap:12px;padding:10px;border-radius:var(--r);background:var(--soft);min-width:0}
.lp-pick img{width:56px;height:56px;border-radius:calc(var(--r) * .7);object-fit:cover;flex:none;background:var(--bg)}
.lp-pick>div{flex:1;min-width:0;display:grid;line-height:1.45}
.lp-pick b{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lp-pick small{color:var(--muted);font-size:12.5px;font-weight:600}
.lp-q{font-weight:800;white-space:nowrap}
.lp-edit{font-size:13px;font-weight:800;color:var(--brand);text-decoration:underline;padding:6px 2px}
.lp-sum{border-top:1px dashed var(--line);padding-top:4px}
.lp-form .co-cod{color:var(--muted)}
.lp-desc .desc{margin:0}
.faq{display:grid;gap:8px}
.faq details{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);overflow:hidden}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;font-weight:700;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary svg{width:18px;height:18px;color:var(--muted);transform:rotate(-90deg);transition:transform .25s var(--ease)}
.faq details[open] summary svg{transform:rotate(90deg)}
.faq p{margin:0;padding:0 16px 14px;color:var(--ink2);font-size:14px;line-height:1.85}
.sticky-buy.lp-sticky{display:flex;position:fixed;inset-inline:0;bottom:0;z-index:35;align-items:center;gap:10px;padding:10px max(16px,calc((100% - 1240px) / 2 + 16px)) calc(10px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--bg) 94%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--line);box-shadow:0 -10px 30px -18px rgba(0,0,0,.3);transform:translateY(110%);transition:transform .3s var(--ease)}
.sticky-buy.lp-sticky.show{transform:none}
.lp-sticky img{width:44px;height:44px;border-radius:10px;object-fit:cover;background:var(--soft)}
.lp-sticky .sb-txt{flex:1;min-width:0;display:grid;line-height:1.3}
.lp-sticky .sb-txt small{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-sticky .sb-txt b{font-size:16px;color:var(--brand)}
.lp-sticky .btn{padding-inline:22px}
.ftr-min{padding:0;margin-top:20px}
body.lp{padding-bottom:76px}

@media (max-width:960px){
  .rv-grid{grid-template-columns:1fr}
  .rv-sum{position:static}
}
@media (max-width:640px){
  body.lp{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  .sticky-buy.lp-sticky{bottom:0}
  .lp .wa-float{bottom:calc(84px + env(safe-area-inset-bottom))}
  .lp .toast{bottom:calc(88px + env(safe-area-inset-bottom))}
  .hdr-min .hdr-in{height:58px;padding-top:0}
  .hdr-min .brand-name{max-width:42vw}
  .rv-avg>b{font-size:38px}
  .restock-f{flex-direction:column}
  .lp-box{border-radius:calc(var(--r) * 1.1)}
  .lp-hero .qty-row .btn{padding-inline:14px}
}
@media (max-width:370px){
  .hdr-cod{font-size:11px;padding:4px 9px}
  .rate-stars label{width:36px;height:36px}
  .rate-stars label svg{width:27px;height:27px}
  .up-card{grid-template-columns:44px 1fr}
  .up-card img{width:44px;height:44px}
  .up-btn{grid-column:1/-1}
}
.pop-lbl{justify-self:start;font-size:12.5px;font-weight:700;color:var(--ink2);margin-bottom:-2px}
.pop-form input[dir=ltr]{text-align:left}
@media (max-width:640px){.lp .ftr-min .powered{padding-inline-end:72px}}

/* ---------------------------------------------------------------- عالمي: اللغات، الموبايل الدولي، طرق الدفع، السعر التقريبي */
.lang-sw{display:flex;gap:4px}
.lang-sw a{display:inline-flex;align-items:center;gap:6px;height:40px;padding-inline:12px;border-radius:999px;font-size:13px;font-weight:700;color:var(--ink2);white-space:nowrap}
.lang-sw a:hover{background:var(--soft)}
.lang-sw svg{width:17px;height:17px}
.drawer-lang{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:10px 12px;margin:4px 8px 0;border-top:1px solid var(--line)}
.drawer-lang>svg{width:19px;height:19px;color:var(--muted);margin-inline-end:4px}
.drawer-lang a{padding:6px 12px;border-radius:999px;border:1.5px solid var(--line);font-size:13px;font-weight:700}
.drawer-lang a.on{border-color:var(--brand);color:var(--brand);background:var(--tint)}
.tel{display:flex;align-items:stretch;direction:ltr}
.tel input{flex:1;min-width:0}
.tel-dial{display:grid;place-items:center;padding-inline:12px;border:1.5px solid var(--line);border-inline-end:0;border-radius:10px 0 0 10px;background:var(--soft);font-weight:700;font-size:14px;font-variant-numeric:tabular-nums;color:var(--ink2)}
.tel-dial:not([hidden])+input{border-start-start-radius:0;border-end-start-radius:0}
.tel-dial[hidden]{display:none}
.pay-list{display:grid;gap:10px}
.co-form .pay-box{display:flex;flex-direction:row;align-items:center;gap:12px;position:relative}
.pay-list .pay-box{border-color:var(--line);background:var(--bg);cursor:pointer;transition:border-color .2s,background-color .2s;font-weight:500;color:var(--ink)}
.pay-list .pay-box.on,.pay-list .pay-box:has(input:checked){border-color:var(--brand);background:var(--tint)}
.pay-box input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.pay-box:focus-within{outline:2px solid var(--brand);outline-offset:2px}
.pay-list .pay-dot::after{transform:scale(0);transition:transform .15s}
.pay-list .pay-box.on .pay-dot::after,.pay-list .pay-box:has(input:checked) .pay-dot::after{transform:scale(1)}
.pay-box b{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pay-tag{font-style:normal;font-size:11px;font-weight:800;padding:1px 8px;border-radius:999px;background:color-mix(in srgb,var(--accent) 20%,var(--bg));color:var(--ink)}
.lp-pay{display:grid;gap:8px}
.lp-pay>b{font-size:14px}
.approx{margin:2px 0 0;font-size:12px;color:var(--muted);font-weight:600;font-variant-numeric:tabular-nums;text-align:end;cursor:help}
.pdp-price .approx{flex-basis:100%;text-align:start;margin:0}
@media (max-width:640px){.lang-sw{display:none}}

/* ---------------------------------------------------------------- LTR (الإنجليزي وغيره): عكس الاتجاهات اللي كانت مكتوبة لليمين */
[dir=ltr] .ic-chev{scale:-1 1}
[dir=ltr] .faq .ic-chev{scale:none}
[dir=ltr] .brand{transform-origin:left center}
[dir=ltr] .cart-count{left:auto;right:3px}
[dir=ltr] .drawer-panel{right:auto;left:0;transform:translateX(-100%)}
[dir=ltr] .drawer-cart .drawer-panel{left:auto;right:0;transform:translateX(100%)}
[dir=ltr] .drawer.open .drawer-panel{transform:none}
[dir=ltr] .co-steps li::before,[dir=ltr] .steps li::before{left:auto;right:50%}
[dir=ltr] .co-box legend{float:left}
[dir=ltr] .co-line i{left:auto;right:-6px}
[dir=ltr] .wa-float{left:auto;right:22px}
[dir=ltr] .slide::before{left:auto;right:-140px}
[dir=ltr] .slide::after{left:auto;right:30%}
[dir=ltr] .cpn-main::before{right:auto;left:-80px}
[dir=ltr] .pop-form input[dir=ltr]{text-align:left}
@media (min-width:900px){
  [dir=ltr] .sl-prev{right:auto;left:max(24px,calc((100% - 1240px) / 2 + 24px))}
  [dir=ltr] .sl-next{left:auto;right:max(24px,calc((100% - 1240px) / 2 + 24px))}
}
@media (max-width:640px){[dir=ltr] .wa-float{left:auto;right:14px}}
.paid-online{display:flex;align-items:center;justify-content:center;gap:6px;margin:10px 0 0;font-weight:800;font-size:13.5px;color:var(--ok)}
.paid-online svg{width:17px;height:17px}
/* التحويل البنكي في صفحة الطلب */
.transfer-box{display:grid;gap:12px;padding:18px;margin-bottom:14px;border:1.5px solid color-mix(in srgb,var(--accent) 45%,var(--line));border-radius:calc(var(--r) * 1.2);background:color-mix(in srgb,var(--accent) 7%,var(--surface));box-shadow:var(--sh-sm)}
.transfer-box p{margin:0}
.tr-head{display:flex;gap:12px;align-items:center}
.tr-head h2{margin:0 0 4px;font-size:18px;line-height:1.35}
.tr-ic{display:grid;place-items:center;flex:none;width:44px;height:44px;border-radius:12px;background:var(--accent);color:var(--on-accent)}
.tr-ic svg{width:24px;height:24px}
.tr-pill,.tr-await{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:800;color:color-mix(in srgb,var(--accent) 70%,var(--ink))}
.tr-pill{padding:3px 10px;border-radius:99px;background:color-mix(in srgb,var(--accent) 16%,var(--surface))}
.tr-pill svg,.tr-await svg{width:15px;height:15px}
.tr-await{justify-content:center;width:100%;margin:10px 0 0}
.tr-list{display:grid;gap:0;margin:0;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);overflow:hidden}
.tr-list>div{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-top:1px solid var(--line);min-width:0}
.tr-list>div:first-child{border-top:0}
.tr-list dt{color:var(--muted);font-size:13px;flex:none}
.tr-list dd{display:flex;align-items:center;gap:6px;margin:0;min-width:0;text-align:end}
.tr-list dd b{overflow-wrap:anywhere;font-size:15px}
.tr-amt dd b{font-size:19px}
.tr-copy{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:var(--bg);color:var(--ink);cursor:pointer}
.tr-copy svg{width:16px;height:16px}
.tr-copy.copied{border-color:var(--ok);color:var(--ok)}
.tr-copy:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.tr-note{padding:10px 12px;border-radius:var(--r);background:var(--surface);border:1px dashed var(--line);white-space:normal}
@media (max-width:480px){.tr-list>div{flex-direction:column;align-items:flex-start}.tr-list dd{width:100%;justify-content:space-between;text-align:start}}
/* طريقة الدفع المختارة ماتتخباش تحت الهيدر الثابت */
.pay-list .pay-box,.pay-list{scroll-margin-top:calc(var(--hdr-h, 72px) + 12px);scroll-margin-bottom:16px}
/* أسهم الجاليري + سحب بالماوس */
.g-main{position:relative}
.g-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:42px;height:42px;border-radius:50%;border:0;background:color-mix(in srgb,var(--bg) 88%,transparent);box-shadow:0 6px 18px rgba(0,0,0,.14);display:grid;place-items:center;cursor:pointer;opacity:0;transition:opacity .2s}
.g-nav svg{width:20px;height:20px;fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.g-prev{inset-inline-start:12px}
.g-next{inset-inline-end:12px}
.g-next svg{transform:scaleX(-1)}
[dir=rtl] .g-nav svg{transform:scaleX(-1)}
[dir=rtl] .g-next svg{transform:none}
.gallery:hover .g-nav,.g-nav:focus-visible{opacity:1}
@media (hover:none){.g-nav{opacity:.92;width:36px;height:36px}}
.g-track.drag{scroll-snap-type:none;cursor:grabbing;user-select:none}
.g-track.drag img{pointer-events:none}
.g-dots i{cursor:pointer}
/* متجر العرض: دفع تجريبي بالبطاقة + صفحة «تم الدفع» */
.demo-card{display:grid;gap:10px;border:1px solid var(--line);border-radius:var(--r);padding:14px;background:var(--bg)}
.demo-card[hidden]{display:none}
.demo-card label{display:grid;gap:4px;font-size:13px;color:var(--muted);margin:0}
.demo-card input{background:var(--tint);color:var(--ink);cursor:default}
.demo-card-num input,.demo-card-row input{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em}
.demo-card-note{display:flex;gap:8px;align-items:flex-start;margin:0;font-size:13px;color:var(--muted)}
.demo-card-note svg{width:18px;height:18px;flex:none;color:var(--ok)}
.demo-card-num{position:relative}
.demo-card-num input{padding-right:64px}
.demo-card-brand{position:absolute;right:10px;bottom:10px;font:800 13px/1 system-ui,sans-serif;font-style:italic;letter-spacing:.06em;color:#1a1f71;background:#fff;border-radius:4px;padding:3px 6px}
.demo-card-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.demo-paid .done{padding-bottom:12px}
.demo-badge{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--brand);background:var(--tint);border:1px solid var(--line);border-radius:999px;padding:3px 10px;margin-bottom:8px}
.demo-paid-list{display:grid;gap:0;border:1px solid var(--line);border-radius:var(--r);margin:0 0 16px;overflow:hidden}
.demo-paid-list>div{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px}
.demo-paid-list>div+div{border-top:1px solid var(--line)}
.demo-paid-list dt{color:var(--muted)}
.demo-paid-list dd{margin:0}
.demo-paid-txt{display:flex;gap:10px;align-items:flex-start;background:var(--tint);border-radius:var(--r);padding:12px 14px;margin:0 0 20px;font-size:14px;line-height:1.7}
.demo-paid-txt svg{width:20px;height:20px;flex:none;color:var(--brand);margin-top:2px}
.demo-paid-back{text-align:center}
.demo-count{margin:0 0 8px;color:var(--muted)}
.demo-count b{color:var(--ink);font-variant-numeric:tabular-nums}
.demo-count-bar{height:4px;border-radius:4px;background:var(--line);overflow:hidden;margin:0 auto 16px;max-width:320px}
.demo-count-bar i{display:block;height:100%;background:var(--brand);transform-origin:var(--bar-origin,left);transition:transform linear}
[dir=rtl] .demo-count-bar i{--bar-origin:right}
.demo-paid-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
@media (prefers-reduced-motion:reduce){.demo-count-bar i{transition:none}}
/* إضافة سريعة من الكارت — مخفية في كل القوالب ما عدا ميجا (themes.css) */
.card-add{display:none}
/* ترتيب الهيدر اللي التاجر اختاره من المحرر (.hdr-z): 3 مناطق — بداية / وسط / نهاية. قواعد أقوى من الثيمات علشان اختياره يكسب */
.hdr.hdr-z .hdr-in{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px;position:relative}
.hdr.hdr-z .hz{display:flex;align-items:center;gap:12px;min-width:0;grid-row:1}
.hdr.hdr-z .hz-start{grid-column:1;justify-content:flex-start}
.hdr.hdr-z .hz-center{grid-column:2;justify-content:center}
.hdr.hdr-z .hz-end{grid-column:3;justify-content:flex-end}
.hdr.hdr-z .hz .brand{position:static;transform:none;left:auto;margin:0;grid-column:auto}
.hdr.hdr-z.scrolled .hz .brand{transform:scale(.94)}
.hdr.hdr-z .hz .search{margin:0;flex:1 1 280px;max-width:420px;min-width:0}
.hdr.hdr-z .hz-center .search{flex-basis:420px;width:min(420px,40vw)}
.hdr.hdr-z .hz .cart-btn,.hdr.hdr-z .hz .lang-sw{grid-column:auto;justify-self:auto;margin:0}
.hdr.hdr-z .hz .menu-btn{display:inline-grid}
.hdr.hdr-z .hz .nav{margin:0}
.hdr.hdr-z.hdr-nav-inline .hz .nav{display:flex}
.hdr.hdr-z.hdr-nav-below .hz .nav,.hdr.hdr-z.hdr-nav-menu .hz .nav{display:none}
@media (max-width:640px){
  .hdr.hdr-z .hdr-in{gap:8px}
  .hdr.hdr-z .hz .search,.hdr.hdr-z .hz .nav{display:none}
}
/* الشعار دايماً للداخل (ناحية النص) واسم المتجر للطرف: في ناحية البداية بنعكس الترتيب، وفي ناحية النهاية هو كده أصلاً */
.hdr.hdr-z .hz-start .brand{flex-direction:row-reverse}

/* قوائم التاجر (0043): منسدلة في الهيدر، مجموعات في القائمة الجانبية، صفحات خاصة، أسئلة شائعة */
.nav .dd{position:relative;display:inline-flex;align-items:center}
.nav .dd-top{display:inline-flex;align-items:center;gap:3px;white-space:nowrap}
.nav .dd-top svg{width:12px;height:12px;transform:rotate(-90deg);opacity:.6;flex:0 0 auto}
.hdr .nav .dd-menu{position:absolute;top:100%;inset-inline-start:0;min-width:200px;display:grid;gap:2px;padding:8px;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:calc(var(--r) * .9);box-shadow:var(--sh-lg);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .18s,transform .18s,visibility .18s;z-index:40}
.hdr .nav .dd:hover .dd-menu,.hdr .nav .dd:focus-within .dd-menu{opacity:1;visibility:visible;transform:none}
.hdr .nav .dd-menu a{color:var(--ink2);padding:8px 12px;border-radius:8px;font-weight:600;font-size:14px;white-space:nowrap}
.hdr .nav .dd-menu a::after{display:none}
.hdr .nav .dd-menu a:hover,.hdr .nav .dd-menu a.on{background:var(--soft);color:var(--ink)}
.drawer-sub summary{display:flex;align-items:center;justify-content:space-between;padding:13px 12px;border-radius:12px;font-weight:700;font-size:15.5px;cursor:pointer;list-style:none}
.drawer-sub summary::-webkit-details-marker{display:none}
.drawer-sub summary svg{width:16px;height:16px;color:var(--muted);transition:transform .2s;transform:rotate(90deg)}
.drawer-sub[open] summary svg{transform:rotate(-90deg)}
.drawer-sub summary:hover{background:var(--soft)}
.drawer-sub a{display:block;padding:10px 12px;padding-inline-start:26px;border-radius:10px;font-weight:600;font-size:14.5px;color:var(--ink2)}
.drawer-sub a.drawer-all{font-weight:700;color:var(--brand)}
.drawer-sub a:hover{background:var(--soft)}
.chips-sub{margin:-12px 0 22px}
.chips-sub .chip{font-size:13px;padding:5px 13px}
/* فلاتر صفحات الأقسام (0097) */
.flt{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:-6px 0 14px}
.flt-lbl{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:13.5px;color:var(--muted)}
.flt-lbl svg{width:16px;height:16px}
.flt-g{position:relative}
.flt-g>summary,.flt-stock{display:inline-flex;align-items:center;gap:6px;list-style:none;cursor:pointer;padding:7px 12px;border:1.5px solid var(--line);border-radius:10px;background:var(--surface);font-weight:600;font-size:13.5px;user-select:none}
.flt-g>summary::-webkit-details-marker{display:none}
.flt-g>summary svg{width:14px;height:14px;transform:rotate(-90deg);transition:transform .2s}
.flt-g[open]>summary svg{transform:rotate(90deg)}
.flt-g>summary b{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--brand);color:#fff;font-size:11px;display:inline-grid;place-items:center}
.flt-g.on>summary,.flt-stock.on{border-color:var(--ink)}
.flt-stock input{accent-color:var(--brand);margin:0}
.flt-pop{position:absolute;inset-inline-start:0;top:calc(100% + 6px);z-index:30;min-width:220px;max-height:320px;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.12);padding:8px}
.flt-opt{display:flex;align-items:center;gap:10px;padding:8px;border-radius:8px;cursor:pointer;font-size:14px}
.flt-opt:hover{background:var(--soft)}
.flt-opt input{accent-color:var(--brand);width:16px;height:16px;margin:0}
.flt-opt span{flex:1}
.flt-opt small{color:var(--muted);font-size:12px}
.flt-price{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px;min-width:260px}
.flt-price label{display:grid;gap:4px;font-size:12px;color:var(--muted);font-weight:600}
.flt-price input{width:100%;border:1.5px solid var(--line);border-radius:8px;padding:8px;background:var(--surface);color:var(--ink);font-size:14px}
.flt-price .btn{grid-column:1/-1}
.flt-on{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 18px}
.flt-on .chip{display:inline-flex;align-items:center;gap:6px;font-size:13px;padding:5px 12px;border-color:var(--ink)}
.flt-on .chip svg{width:13px;height:13px}
.flt-clear{font-size:13px;font-weight:700;color:var(--brand);text-decoration:underline}
@media (max-width:640px){
  .flt{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
  .flt::-webkit-scrollbar{display:none}
  .flt-g{position:static}
  .flt-g>summary,.flt-stock{white-space:nowrap}
  .flt-pop{position:fixed;inset:auto 0 0 0;top:auto;max-height:65vh;border-radius:16px 16px 0 0;padding:12px 12px calc(12px + env(safe-area-inset-bottom));min-width:0}
}
.page-head{padding-bottom:0}
.page-title{font-size:clamp(24px,2vw + 14px,36px);font-weight:800;margin:0;line-height:1.3}
.faq{display:grid;gap:10px}
.faq-i{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);overflow:hidden}
.faq-i summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px;font-weight:700;cursor:pointer;list-style:none}
.faq-i summary::-webkit-details-marker{display:none}
.faq-i summary svg{width:16px;height:16px;flex:0 0 auto;color:var(--muted);transform:rotate(90deg);transition:transform .2s}
.faq-i[open] summary svg{transform:rotate(-90deg)}
.faq-a{padding:0 18px 16px;color:var(--ink2);line-height:1.8}
/* حساب العميل (0053): الدخول بكود، صفحة الحساب، المفضلة */
.acct-form input{letter-spacing:0;font-weight:600}
.acct-form .acct-code{letter-spacing:8px;text-align:center;font-size:22px;font-weight:800}
.acct-links{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:14px;font-size:14px}
.acct-links a,.link-btn{color:var(--brand);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.link-btn{background:none;border:0;padding:0;cursor:pointer;font:inherit;font-size:14px}
.link-btn.danger{color:var(--bad)}
.acct-spam{margin-top:6px;font-size:12.5px}
.acct-dev{margin:10px 0 0;padding:8px 14px;border-radius:10px;background:var(--tint);color:var(--ink);font-weight:800;font-family:Menlo,Consolas,monospace}
.acct-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.acct-head .sec-title{margin:0}
.acct-head p{margin:4px 0 0;text-align:start}
.acct-tabs{display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;margin:18px 0 6px;padding-bottom:4px;scrollbar-width:none}
.acct-tabs::-webkit-scrollbar{display:none}
.acct-tabs a{display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border:1px solid var(--line);border-radius:99px;font-weight:700;font-size:14px;white-space:nowrap;background:var(--surface)}
.acct-tabs a:hover{border-color:var(--brand);color:var(--brand)}
.acct-tabs svg{width:18px;height:18px}
.acct-tabs small{color:var(--muted);font-weight:700}
.acct-ok{display:flex;align-items:center;gap:8px;color:var(--ok);font-weight:700;margin:10px 0 0}
.acct-ok svg{width:18px;height:18px}
.acct-sec{padding:26px 0;border-top:1px solid var(--line);scroll-margin-top:90px}
.acct-sec:first-of-type{border-top:0}
.acct-sec h2{margin:0 0 14px;font-size:19px;font-family:var(--fh),var(--fb),Cairo,sans-serif}
.acct-empty{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.acct-empty p{margin:0}
.acct-orders{display:grid;gap:10px}
.acct-order{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:calc(var(--r) * 1.1);background:var(--surface)}
.acct-order-img{display:grid;place-items:center;width:64px;height:64px;border-radius:calc(var(--r) * .7);overflow:hidden;background:var(--soft);color:var(--muted)}
.acct-order-img img{width:100%;height:100%;object-fit:cover}
.acct-order-img svg{width:26px;height:26px}
.acct-order-main{display:grid;gap:3px;min-width:0;justify-items:start}
.acct-order-main small{color:var(--muted);font-size:12.5px}
.acct-st{font-size:12px;font-weight:800;padding:2px 9px;border-radius:99px;background:var(--soft);color:var(--ink2)}
.acct-st-delivered{background:color-mix(in srgb,var(--ok) 14%,var(--bg));color:var(--ok)}
.acct-st-cancelled,.acct-st-returned{background:color-mix(in srgb,var(--bad) 10%,var(--bg));color:var(--bad)}
.acct-st-shipped{background:var(--tint);color:var(--brand)}
.acct-order-side{display:grid;gap:8px;justify-items:end}
.acct-order-btns{display:flex;gap:6px}
.btn-sm{min-height:36px;padding:7px 12px;font-size:13px}
.acct-addrs{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;align-items:start}
.acct-addr{border:1px solid var(--line);border-radius:calc(var(--r) * 1.1);padding:14px;background:var(--surface);min-width:0}
.acct-addr-view{display:grid;gap:4px;font-size:14px}
.acct-addr-view>span{color:var(--ink2)}
.acct-addr-btns{display:flex;gap:16px;margin-top:6px}
.acct-addr-btns form{margin:0}
.acct-badge{font-size:11px;font-weight:800;padding:2px 8px;border-radius:99px;background:var(--tint);color:var(--brand);vertical-align:middle}
.acct-addr-new{border-style:dashed;display:grid}
.acct-addr-new>.acct-addr-view{display:inline-flex;width:100%;min-height:52px}
.acct-addr:has(.acct-addr-edit:not([hidden])){grid-column:1/-1}
.acct-addr-form,.acct-profile{display:grid;gap:12px;max-width:640px}
.acct-check{display:flex!important;align-items:center;gap:8px;font-weight:600}
.acct-check input{width:18px!important;height:18px;min-height:0!important}
.acct-actions{display:flex;gap:8px;flex-wrap:wrap}
.acct-profile input:disabled{opacity:.7}
.wish-btn{display:inline-grid;place-items:center;flex:none;width:50px;min-height:50px;border:1.5px solid var(--line);border-radius:var(--r);background:var(--surface);color:var(--ink2);cursor:pointer;transition:color .2s,border-color .2s,transform .15s}
.wish-btn svg{width:22px;height:22px}
.wish-btn:hover{border-color:var(--brand);color:var(--brand)}
.wish-btn.on{color:#e0245e;border-color:color-mix(in srgb,#e0245e 40%,var(--line))}
.wish-btn.on svg{fill:currentColor}
.wish-btn.pop{animation:wishPop .35s var(--ease,ease)}
@keyframes wishPop{40%{transform:scale(1.18)}}
@media (max-width:640px){
  .hdr .acct-btn{display:none}
  .acct-order{grid-template-columns:52px 1fr}
  .acct-order-img{width:52px;height:52px}
  .acct-order-side{grid-column:1/-1;grid-template-columns:1fr auto;align-items:center;justify-items:stretch}
  .acct-order-btns{justify-content:flex-end}
  .acct-addr-form .two,.acct-profile .two{grid-template-columns:1fr}
}
.acct-guest{display:inline-flex;align-items:center;gap:6px;margin-top:16px;font-size:13.5px;font-weight:700;color:var(--ink2)}
.acct-guest svg{width:18px;height:18px}
.acct-guest:hover{color:var(--brand)}
/* كارت هدية في صفحة الطلب (0061) */
.gift-box{margin:8px 0 0}.gift-box summary{cursor:pointer;display:flex;align-items:center;gap:6px;font-size:14px;color:var(--muted,#666);list-style:none}
.gift-box summary::-webkit-details-marker{display:none}.gift-box summary .ic{width:16px;height:16px}.gift-box[open] summary{margin-bottom:8px}
/* الإرجاع والاستبدال (0062) */
.acct-return h1{font-size:22px}.ret-items,.ret-want{border:0;padding:0;margin:0 0 12px;display:grid;gap:8px}.ret-items legend,.ret-want legend{font-weight:700;margin-bottom:6px}
.ret-item{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:10px;align-items:center;border:1px solid var(--line,#e5e5e5);border-radius:12px;padding:8px}
.ret-item img{border-radius:8px;object-fit:cover}.ret-item span{display:grid;min-width:0}.ret-item small{color:var(--muted,#777)}
.ret-want .radio{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line,#e5e5e5);border-radius:12px;padding:10px;cursor:pointer}.ret-want .radio span{display:grid}.ret-want .radio small{color:var(--muted,#777)}
.acct-ret{background:#fff7ed;color:#9a3412}
/* توصيل / استلام من الفرع (0077) */
.dl-pick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 12px}@media (max-width:480px){.dl-pick{grid-template-columns:1fr}}
.pk-info{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line,#e5e5e5);border-radius:12px;padding:12px;margin:8px 0}.pk-info svg{flex:none;width:22px;height:22px}.pk-info div{display:grid;gap:2px}.pk-info small{color:var(--muted,#777)}
/* المدونة (0078) */
.blog-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}.blog-tags .chip{display:inline-flex;padding:6px 12px;border:1px solid var(--line,#e5e5e5);border-radius:999px;font-size:13px;color:inherit;text-decoration:none}.blog-tags .chip.on{background:var(--ink,#111);color:var(--bg,#fff);border-color:transparent}
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}.blog-card{display:flex;flex-direction:column;border:1px solid var(--line,#e5e5e5);border-radius:var(--rad,14px);overflow:hidden;background:var(--card,#fff)}
.bc-img img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}.bc-body{display:grid;gap:8px;padding:16px}.bc-body time{font-size:12px;color:var(--muted,#777)}.bc-body h2{font-size:18px;margin:0;line-height:1.4}.bc-body h2 a{color:inherit;text-decoration:none}.bc-body p{margin:0;color:var(--muted,#555);font-size:14px}.bc-more{font-weight:700;font-size:14px}
.pager{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:24px}
.blog-post h1{font-size:clamp(26px,4vw,36px);line-height:1.3;margin:8px 0}.bp-back a{color:var(--muted,#777);text-decoration:none;font-size:14px}.bp-cover{display:block;width:100%;border-radius:var(--rad,14px);margin:16px 0;aspect-ratio:16/9;object-fit:cover}
.bp-body{font-size:17px;line-height:1.9}.bp-body img{max-width:100%;border-radius:12px}.bp-body figure{margin:18px 0}.bp-body figcaption{font-size:13px;color:var(--muted,#777);text-align:center}.bp-body blockquote{margin:16px 0;padding:8px 16px;border-inline-start:4px solid var(--primary,#111);color:var(--muted,#555)}
.bp-nav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:28px}.bp-nav a{display:grid;gap:4px;padding:14px;border:1px solid var(--line,#e5e5e5);border-radius:12px;color:inherit;text-decoration:none}.bp-nav a:last-child{text-align:end}.bp-nav small{color:var(--muted,#777)}
/* النشرة البريدية (0088) */
.ftr-nl{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;align-content:start;min-width:0}.ftr-nl p{margin:0;opacity:.8;font-size:13.5px}.ftr-nl-row{display:flex;gap:6px}.ftr-nl-row input{flex:1;min-width:0;padding:10px 12px;border:1px solid currentColor;border-radius:var(--radius,10px);background:transparent;color:inherit;opacity:.9}.ftr-nl-row .btn{white-space:nowrap}.ftr-nl-msg.ok{color:#16a34a;font-weight:600}.ftr-nl-msg.bad{color:#dc2626}
.co-mkt{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;margin-top:-4px;cursor:pointer}.co-mkt input{margin-top:3px;width:auto}
/* حقول التاجر الإضافية (0108) */
.co-cf{display:grid;gap:12px}.co-cf-help{display:block;margin-top:4px;color:var(--muted,#6b7280);font-size:12.5px;font-weight:400}
.co-cf .co-cf-check{display:flex;align-items:flex-start;gap:8px;margin-top:0;font-size:14px;font-weight:600}.co-cf .co-cf-check input{width:18px;height:18px;min-height:0;padding:0;flex:none;margin-top:2px}

/* أسعار شركة الشحن الحيّة في صفحة الدفع (0089) */
.co-rates{display:grid;gap:8px;margin-top:4px}.co-rates-t{font-weight:600;font-size:14px}.co-rates-list{display:grid;gap:8px}
.co-form .co-rate{cursor:pointer}.co-rate>span{flex:1;display:grid;gap:2px;min-width:0}.co-rate>span b{color:var(--ink)}.co-rate>span small{color:var(--muted,#6b7280);font-size:12.5px}.co-rate-fee{white-space:nowrap}
.co-rates-msg{color:var(--muted,#6b7280);font-size:13px}.co-rates-msg:empty{display:none}
/* الضريبة المضمّنة (0090) */
.tax-incl{margin:4px 0 0;font-size:12.5px;color:var(--muted,#6b7280);text-align:end}
/* حماية الدفع عند الاستلام (0093) */
.oc-box{border:2px solid var(--brand);border-radius:var(--r);padding:16px 18px;margin:0 0 18px;background:var(--tint);display:grid;gap:8px}
.oc-box h1,.oc-box h2{margin:0;font-size:18px;display:flex;align-items:center;gap:8px}.oc-box h1 svg,.oc-box h2 svg{width:22px;height:22px;color:var(--brand)}.oc-box p{margin:0}
.oc-acts{display:flex;gap:8px;flex-wrap:wrap}.oc-acts .btn{flex:1;min-width:140px}
.oc-sum{display:grid;gap:6px;margin:4px 0}.oc-sum>div{display:flex;justify-content:space-between;gap:12px}.oc-sum dt{color:var(--muted,#6b7280)}.oc-sum dd{margin:0}
.oc-flash{margin:0 0 14px;padding:10px 14px;border-radius:var(--r);background:var(--soft,#f3f4f6);font-weight:600}.oc-flash.ok{background:#e8f7ee;color:#166534}.oc-flash.bad{background:#fdecec;color:#b42318}
.cod-nudge{display:flex;align-items:center;gap:8px;margin:8px 0 0;font-size:13.5px;color:var(--brand)}.cod-nudge svg{width:18px;height:18px;flex:none}
/* صفحة «قريبًا» بكلمة سر (0101) */
.lock{min-height:calc(100vh - 180px);display:grid;place-items:center;padding:40px 16px}
.lock-box{width:100%;max-width:680px;text-align:center}
.lock-box h1{font-family:var(--fh);font-size:clamp(28px,3vw + 16px,44px);line-height:1.25;margin:0 0 12px}
.lock-sub{color:var(--muted);font-size:16px;margin:0 0 26px}
.lock-nl{margin:0 auto 28px;max-width:440px;text-align:start}
.lock-nl label{display:block;font-weight:700;font-size:14px;margin-bottom:8px}
.lock-pw{margin:8px auto 0;max-width:440px;text-align:start;border-top:1px solid var(--line);padding-top:14px}
.lock-pw summary{cursor:pointer;color:var(--muted);font-weight:600;font-size:14px;text-align:center;list-style:none}
.lock-pw summary::-webkit-details-marker{display:none}
.lock-pw form{margin-top:14px}
.lock-pw label{display:block;font-weight:700;font-size:14px;margin-bottom:8px}
.lock-row{display:flex;gap:8px}
.lock-row input{flex:1;min-width:0;border:1.5px solid var(--line);border-radius:10px;padding:11px 12px;font-size:15px;background:var(--surface);color:var(--ink)}
.lock-err{color:#dc2626;font-weight:600;font-size:14px;margin:10px 0 0}
.lock-owner{display:block;color:var(--muted);font-size:12.5px;margin-top:12px}
/* رابط دفع من التاجر (0102) */
.paylink{display:grid;place-items:center}
.pl-box{width:100%;max-width:520px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:26px 22px}
.pl-box h1{font-family:var(--fh);font-size:22px;margin:0 0 8px}
.pl-lead{color:var(--muted);margin:0 0 18px;line-height:1.7}
.pl-state{display:flex;align-items:center;gap:8px;font-weight:700;border-radius:12px;padding:12px 14px;margin:6px 0 18px}
.pl-state svg{width:18px;height:18px;flex:none}
.pl-state.ok{background:#ecfdf3;color:#067647}
.pl-state.bad{background:#fef3f2;color:#b42318}
.pl-items{list-style:none;margin:0 0 6px;padding:0}
.pl-items li{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}
.pl-items img,.pl-noimg{width:52px;height:52px;border-radius:10px;object-fit:cover;flex:none;background:var(--soft);display:grid;place-items:center}
.pl-noimg svg{width:22px;height:22px;color:var(--muted)}
.pl-t{flex:1;min-width:0;display:grid}
.pl-t b{font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-t small{color:var(--muted);font-size:12.5px}
.pl-q{color:var(--muted);font-size:13.5px}
.pl-p{font-weight:700;font-size:14.5px;white-space:nowrap}
.pl-row{display:flex;justify-content:space-between;padding:8px 0;font-size:14.5px}
.pl-total{font-weight:800;font-size:17px;border-top:1.5px solid var(--ink);margin-top:4px;padding-top:12px}
.pl-btn{margin-top:16px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:16px;padding:14px}
.pl-btn svg{width:18px;height:18px}
.pl-secure{color:var(--muted);font-size:12.5px;text-align:center;margin:10px 0 0}
/* منتجات رقمية (0103) */
.dg-badge{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:700;color:var(--brand);background:color-mix(in srgb,var(--brand) 10%,transparent);border-radius:999px;padding:5px 12px;margin:4px 0 8px}
.dg-badge svg,.co-digital svg,.dg-box h1 svg,.dg-files .btn svg{width:16px;height:16px}
.co-digital{display:flex;align-items:center;gap:8px;background:var(--soft);border-radius:12px;padding:12px 14px;font-size:14px;margin:0 0 12px}
.dg-box h1{display:flex;align-items:center;gap:8px}
.dg-sec{margin-top:18px}
.dg-sec h2{font-size:15px;margin:0 0 8px}
.dg-files,.dg-keys{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.dg-files li,.dg-keys li{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.dg-fn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;font-size:14px}
.dg-fn small{color:var(--muted);font-weight:500}
.dg-files .btn{display:inline-flex;align-items:center;gap:6px;flex:none}
.dg-keys code{font-size:14px;background:var(--soft);padding:4px 10px;border-radius:8px;cursor:pointer;user-select:all}
/* الطلب المسبق ومدة التجهيز (0109) */
.po-box{display:grid;gap:2px;margin:6px 0 12px;padding:10px 12px;border-radius:var(--r,12px);background:color-mix(in srgb,var(--brand,#e8461a) 9%,transparent);border:1px solid color-mix(in srgb,var(--brand,#e8461a) 25%,transparent);font-size:14px}
.po-box[hidden]{display:none}.po-box b{color:var(--brand,#e8461a);font-size:13px}.po-box small{color:var(--muted,#6b7280)}
.proc-line{display:flex;align-items:center;gap:6px;margin:4px 0 12px;font-size:13.5px;color:var(--muted,#6b7280)}.proc-line svg{width:16px;height:16px;flex:none}
.badge-out.badge-po{background:var(--brand,#e8461a);color:#fff}
/* جاهز للاستلام (0112) */
.pk-track{display:flex;gap:10px;align-items:flex-start;margin:12px 0;padding:12px 14px;border:1px solid var(--line,#e5e7eb);border-radius:var(--r,12px)}.pk-track svg{width:20px;height:20px;flex:none;margin-top:2px}
.pk-track div{display:grid;gap:2px}.pk-track small{color:var(--muted,#6b7280)}.pk-track.ready{border-color:var(--brand,#e8461a);background:color-mix(in srgb,var(--brand,#e8461a) 8%,transparent)}