/* Jibli Gold Luxe — design layer for the customer app */
:root{--gold1:#F3DB85;--gold2:#C9A227;--gold3:#8A6D12;--glass:rgba(255,255,255,.04);--glassb:rgba(243,219,133,.16);--r:22px;--sh:0 10px 30px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.05)}
body{background:radial-gradient(900px 420px at 50% -120px,color-mix(in srgb,var(--gold2) 22%,transparent),transparent 70%),var(--bg);background-attachment:fixed}
h1,.sb h2{background:linear-gradient(90deg,var(--gold1),var(--gold2) 55%,var(--gold1));-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:.2px}
header{background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 92%,transparent),transparent);backdrop-filter:blur(10px);position:sticky;top:0;z-index:4}
.srch{background:var(--glass);border:1px solid var(--glassb);backdrop-filter:blur(12px);transition:.2s}
.srch:focus{outline:0;border-color:var(--gold2);box-shadow:0 0 0 4px rgba(201,162,39,.18)}
.cat{background:var(--glass);border:1px solid var(--glassb);transition:.2s}
.cat.on{background:linear-gradient(135deg,var(--gold1),var(--gold2));color:#0A0A0A;box-shadow:0 6px 18px rgba(201,162,39,.35);transform:translateY(-1px)}
.sc,.pr,.sh,.otp{background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02));border:1px solid var(--glassb);border-radius:var(--r);box-shadow:var(--sh)}
.sc{transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s;animation:rise .5s both}
.sc:hover{transform:translateY(-3px);box-shadow:0 16px 40px rgba(201,162,39,.18)}
.sc:active{transform:scale(.985)}
.sc:nth-child(2){animation-delay:.06s}.sc:nth-child(3){animation-delay:.12s}.sc:nth-child(4){animation-delay:.18s}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.cv{background:linear-gradient(135deg,#3b2f0a,#C9A227)}
.cv.g{background:linear-gradient(135deg,#C9A227,#6b4f08)}
.pi{background:linear-gradient(135deg,#3b2f0a,#8A6D12)}.hero{background:linear-gradient(135deg,#3b2f0a,#C9A227)}
.cv::before{background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.78))}
.tag{background:rgba(10,10,10,.6);backdrop-filter:blur(8px);border:1px solid var(--glassb);color:var(--gold1)}
.si b{font-size:18px}
.sb{border-top:1px solid var(--glassb);box-shadow:0 -12px 30px rgba(0,0,0,.4)}
.price{color:var(--gold1)}
.ad{background:linear-gradient(135deg,var(--gold1),var(--gold2));box-shadow:0 6px 16px rgba(201,162,39,.4)}
.btn{background:linear-gradient(135deg,var(--gold1),var(--gold2) 60%,var(--gold3));box-shadow:0 10px 28px rgba(201,162,39,.4);transition:transform .15s,filter .15s;position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);transform:translateX(-120%);animation:shine 3.5s infinite}
.btn:disabled::after{display:none}
@keyframes shine{to{transform:translateX(120%)}}
.btn:active{transform:scale(.97)}
.bar{background:linear-gradient(0deg,#080808 55%,transparent);backdrop-filter:blur(6px)}
.ov{background:rgba(0,0,0,.72);backdrop-filter:blur(6px)}
.sh{animation:sheet .3s cubic-bezier(.2,.8,.2,1)}
@keyframes sheet{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
input.f{background:var(--glass);border-color:var(--glassb);transition:.2s}
input.f:focus{outline:0;border-color:var(--gold2);box-shadow:0 0 0 4px rgba(201,162,39,.16)}
.act{background:linear-gradient(135deg,var(--gold1),var(--gold2));color:#0A0A0A;box-shadow:0 8px 22px rgba(201,162,39,.3)}
.stp li.n::before{background:var(--gold1);box-shadow:0 0 0 6px rgba(243,219,133,.25);animation:pulse 1.6s infinite}
@keyframes pulse{50%{box-shadow:0 0 0 10px rgba(243,219,133,.05)}}
.otp b{background:linear-gradient(90deg,var(--gold1),var(--gold2));-webkit-background-clip:text;background-clip:text;color:transparent}
.row.t{border-top:2px solid var(--gold2);color:var(--gold1)}
::-webkit-scrollbar{display:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* رمز التسليم: تباين عالٍ */
.otp3{background:linear-gradient(160deg,#E7C45A,#C9A227);color:#0B0B0B;border-radius:20px;padding:20px 16px;text-align:center;display:flex;flex-direction:column;gap:8px;margin:14px 0}
.otp3t{font-weight:700;font-size:17px}
.otp3n{font-size:clamp(64px,24vw,100px);font-weight:900;line-height:1.05;letter-spacing:6px;font-variant-numeric:tabular-nums;color:#0B0B0B}
.otp3m{font-size:14px;line-height:1.7}
.otp3b{background:#0B0B0B;color:#F4EFE2;border:0;border-radius:14px;min-height:44px;font:800 15px inherit;font-family:inherit;margin-top:6px;cursor:pointer}

/* header actions + account sheet */
.hbs{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}
.hb{background:var(--surf);border:1px solid var(--glassb,#2E2A1E);color:var(--ink);border-radius:20px;padding:4px 12px;font-size:14px;font-weight:700;position:relative;cursor:pointer}
.hb b{font-size:12px;color:#E3C45A}.hb.on{border-color:#C9A227}.hb.on::after{content:"";position:absolute;top:2px;inset-inline-end:3px;width:9px;height:9px;border-radius:50%;background:#5DE0A5;border:2px solid var(--bg)}
.ac{text-align:center}.ac h2{margin:2px 0 4px;font-size:22px}.ac-sub{margin:0 0 14px}
.ac-lg{display:flex;flex-direction:column;align-items:center;gap:6px;margin:2px 0 10px}.ac-lg svg{width:64px;height:64px;border-radius:18px;box-shadow:0 8px 24px rgba(201,162,39,.35)}.ac-lg b{font-size:18px;font-weight:800;letter-spacing:.3px;color:var(--gold2,#C9A227)}
.ac-f{display:block;text-align:start;margin:8px 0 0}.ac-f>span{display:block;font-size:13px;font-weight:700;color:var(--mut);margin:0 2px 2px}
.ac input:focus{outline:2px solid var(--gold2,#C9A227);outline-offset:1px;border-color:transparent}
.ac-pw{position:relative}.ac-pw input{padding-inline-end:46px}.ac-eye{position:absolute;inset-inline-end:6px;top:50%;transform:translateY(-50%);width:36px;height:36px;border:0;background:transparent;color:#000;display:grid;place-items:center;cursor:pointer}.ac-eye svg{width:20px;height:20px}
.ac input{width:100%;box-sizing:border-box;margin:6px 0;padding:14px;border:1.5px solid #D9D2BE;border-radius:14px;font-size:16px;background:#fff;color:#000;font-weight:600;-webkit-text-fill-color:#000;caret-color:#000}
.ac input::placeholder{color:#5C5C5C;opacity:1;font-weight:400;-webkit-text-fill-color:#5C5C5C}
.ac input:-webkit-autofill{-webkit-text-fill-color:#000;box-shadow:0 0 0 40px #fff inset}
.ac-t,.ac-v,.ac-l{display:flex;gap:6px;margin:8px 0;align-items:center}
.ac-t button,.ac-v button,.ac-l button{flex:1;padding:11px 6px;border-radius:12px;border:1.5px solid var(--line);background:var(--surf);color:var(--ink);font-weight:700;font-size:14px}
.ac-t button.on,.ac-v button.on,.ac-l button.on{background:#C9A227;color:#0A0A0A;border-color:#C9A227}
.ac-l{margin-top:16px}.ac-l .m{flex:none;margin-inline-end:4px}
.ac-e{min-height:22px;text-align:start;color:#FF9C8F;font-weight:700;font-size:14px;margin:4px 0}
.ac-or{display:flex;align-items:center;gap:10px;margin:14px 0 10px;color:var(--mut)}.ac-or::before,.ac-or::after{content:"";flex:1;height:1px;background:var(--line)}
.ac-g{justify-content:center;gap:10px}.ac-g b{background:#fff;color:#4285F4;width:24px;height:24px;border-radius:50%;display:inline-grid;place-items:center;font-size:15px}
.ac-sw{display:block;margin:16px auto 0;font-weight:700;font-size:15px}.ac-sw u{color:var(--gold2,#C9A227);text-underline-offset:3px}
.ac-guest{display:block;margin:12px auto 0}.ac-me{background:var(--surf);border:1px solid var(--line);border-radius:14px;padding:14px;margin:10px 0;display:grid;gap:4px}
.ltr body{text-align:left}.ltr .sh,.ltr .sc{text-align:left}

/* performance + effects */
.bar.bump{animation:bump .35s ease}
@keyframes bump{40%{filter:brightness(1.25);scale:1.04}}
.sfx{position:fixed;inset:0;z-index:99;display:grid;place-content:center;justify-items:center;gap:14px;background:rgba(8,8,8,.9);backdrop-filter:blur(8px);animation:fin .2s both}
.sfx svg{width:96px;height:96px;fill:none;stroke:#C9A227;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.sfx circle{stroke-dasharray:151;stroke-dashoffset:151;animation:dr .6s .1s forwards}
.sfx path{stroke:#F3DB85;stroke-dasharray:40;stroke-dashoffset:40;animation:dr .4s .55s forwards}
.sfx b{color:#F3DB85;font-size:20px;opacity:0;animation:fin .3s .7s forwards}
@keyframes dr{to{stroke-dashoffset:0}}@keyframes fin{from{opacity:0}to{opacity:1}}
button:active,.pr:active{transform:scale(.97)}
.sc:nth-child(n+5){animation-delay:.24s}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* قائمة اللغة */
.lgw{position:relative;display:inline-block}
.lgbtn{display:inline-flex;align-items:center;gap:6px}
.lgm{position:absolute;top:calc(100% + 8px);inset-inline-end:0;min-width:150px;background:var(--surf);border:1px solid var(--line);border-radius:14px;padding:6px;box-shadow:0 12px 32px rgba(0,0,0,.6);z-index:60}
.lgm[hidden]{display:none}
.lgm button{display:flex;width:100%;justify-content:space-between;align-items:center;gap:10px;background:none;border:0;color:var(--ink);font:inherit;padding:10px 12px;border-radius:10px;cursor:pointer;text-align:start}
.lgm button.on{color:var(--sun);background:color-mix(in srgb,var(--gold2) 14%,transparent)}
.lgm button.on::after{content:"✓"}

/* ===== الرأس الجديد + شريط الميزات ===== */
.lg{background:var(--blue)}.lg b,.lg b::after{color:var(--on)}.lg b::after{background:var(--sun)}
.top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px}
.tg{display:flex;gap:8px;align-items:center}
.ib{height:42px;min-width:42px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 12px;border-radius:14px;background:var(--surf);border:1px solid var(--line);color:var(--ink);font-weight:700;font-size:14px;position:relative}
.ib svg{width:20px;height:20px;flex:none}
.ib.pri{background:linear-gradient(135deg,var(--gold1),var(--gold2));color:var(--on);border-color:transparent;box-shadow:0 6px 16px color-mix(in srgb,var(--gold2) 35%,transparent)}
.ib.on{border-color:var(--ok);color:var(--ok)}
.bdg{position:absolute;top:-6px;left:-6px;min-width:20px;height:20px;padding:0 4px;border-radius:10px;background:#E5484D;color:#fff;font-style:normal;font-size:12px;display:grid;place-items:center;border:2px solid var(--bg);font-weight:800}
.bdg[hidden]{display:none}
.thm{min-width:150px}.thm button{justify-content:flex-start}.thm button.on::after{margin-inline-start:auto}
.sw{width:18px;height:18px;border-radius:50%;flex:none;border:1px solid rgba(128,128,128,.4)}
.perks{display:flex;gap:8px;padding:2px 16px 10px;overflow-x:auto;scrollbar-width:none}.perks::-webkit-scrollbar{display:none}
.pk{flex:none;display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:14px;background:var(--surf);border:1px solid var(--line);font-size:12.5px;font-weight:700}
.pk svg{width:22px;height:22px;color:var(--blue);flex:none}
.pk small{display:block;font-weight:500;color:var(--mut);font-size:11px;line-height:1.3}
/* ===== الألوان القابلة للتبديل ===== */
html[data-theme=emerald]{--bg:#07110E;--surf:#0F1D18;--paper:#0F1D18;--ink:#EAF7F1;--mut:#9DB8AD;--line:rgba(46,204,160,.28);--blue:#14B88A;--on:#03120C;--sun:#7CF2C4;--gold1:#9AF5D2;--gold2:#14B88A;--gold3:#0B7A5A;--glass:rgba(255,255,255,.04);--glassb:rgba(124,242,196,.16)}
html[data-theme=royal]{--bg:#070B16;--surf:#0F1629;--paper:#0F1629;--ink:#EAF1FF;--mut:#9DAAC8;--line:rgba(77,163,255,.30);--blue:#3B8CFF;--on:#04101F;--sun:#8CC4FF;--gold1:#A5D1FF;--gold2:#3B8CFF;--gold3:#1D5FC4;--glass:rgba(255,255,255,.04);--glassb:rgba(140,196,255,.16)}
html[data-theme=light]{--bg:#FBF7F0;--surf:#FFFFFF;--paper:#FFFFFF;--ink:#221C14;--mut:#6F675B;--line:rgba(0,0,0,.10);--blue:#D9480F;--on:#FFFFFF;--sun:#C2410C;--ok:#1F9D63;--bad:#D6453D;--gold1:#FF8A3D;--gold2:#D9480F;--gold3:#A53A08;--glass:rgba(0,0,0,.03);--glassb:rgba(0,0,0,.09);--sh:0 6px 18px rgba(60,40,10,.10)}
html[data-theme=light] .sc,html[data-theme=light] .pr,html[data-theme=light] .sh,html[data-theme=light] .otp,html[data-theme=light] .srch,html[data-theme=light] .cat,html[data-theme=light] .ib,html[data-theme=light] .pk{background:var(--surf)!important;border-color:var(--line)!important}
html[data-theme=light] .cat.on{background:var(--blue)!important;color:var(--on)!important;border-color:var(--blue)!important}
html[data-theme=light] .ib.pri{background:linear-gradient(135deg,var(--gold1),var(--gold2))!important;color:#fff!important;border-color:transparent!important}
html[data-theme=light] .sb{background:var(--surf)}
html[data-theme=light] a{color:var(--blue)}

/* شاشة الدخول: الألوان تتبع ثيم الصفحة وتبقى واضحة في كل الثيمات */
.ac,.ac h2{color:var(--ink)}
.ac-sub,.ac .m{color:var(--mut)}
.ac-f>span{color:var(--ink);font-weight:700}
.ac-e{color:#FF9C8F}
html[data-theme=light] .ac-e{color:#B3261E}
.ac-lg b{color:var(--blue)}
.ac-sw u,.ac-guest,.ac-sw{color:var(--blue)}
.ac-or{color:var(--mut)}
.ac-l button{color:var(--ink);background:var(--surf);border-color:var(--line)}
.ac-l button.on{background:var(--blue);color:var(--on);border-color:var(--blue)}
.ac input{border-color:var(--line)}
.ac input:focus{outline:2px solid var(--blue);border-color:transparent}

.pmc{background:var(--surf);border:1px solid var(--line);border-radius:16px;padding:12px;margin:14px 0;color:var(--ink)}
.pmc.ok{border-color:#2E9B5B}.pmc.bad{border-color:#D6453D}
.pmo{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line)}.pmo input{width:auto;margin-top:4px}
.pmc input[type=text],.pmc input:not([type]){width:100%;box-sizing:border-box;margin:8px 0 0;padding:12px;border-radius:12px;border:1.5px solid var(--line);background:#fff;color:#000;font-size:16px}

.pbns{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 16px 10px;-webkit-overflow-scrolling:touch}
.pbn{position:relative;flex:0 0 86%;scroll-snap-align:center;min-height:104px;border-radius:18px;overflow:hidden;display:flex;align-items:center;cursor:pointer;color:#fff}
.pbn img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.35}
.pbn .bt{position:relative;padding:14px 16px;display:flex;flex-direction:column;gap:4px}.pbn b{font-size:19px}.pbn small{font-size:14px;opacity:.95}.pbn .be{font-size:28px}
.pbn.gold{background:linear-gradient(135deg,#E3C45A,#9A7B14);color:#0A0A0A}.pbn.green{background:linear-gradient(135deg,#1E8E5A,#0B4D32)}
.pbn.blue{background:linear-gradient(135deg,#2C5DD8,#14307A)}.pbn.red{background:linear-gradient(135deg,#D6453D,#7E1E19)}.pbn.dark{background:linear-gradient(135deg,#2A2A2A,#0A0A0A)}
.fv{position:absolute;top:8px;inset-inline-start:8px;width:38px;height:38px;border-radius:50%;border:0;background:rgba(0,0,0,.55);color:#FF6B6B;font-size:22px;line-height:1;display:grid;place-items:center;cursor:pointer}

.top .ib.pri,#acb{display:none}
.top{margin-bottom:6px}
.lgbtn{padding:0 10px}
.bn{position:fixed;bottom:0;left:0;right:0;max-width:480px;margin:auto;display:flex;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px));z-index:6}
.bn[hidden]{display:none}
.bn button{flex:1;background:none;border:0;color:var(--mut);display:flex;flex-direction:column;align-items:center;gap:3px;font:inherit;font-size:11px;font-weight:700;padding:6px 0;cursor:pointer}
.bn button.on{color:var(--blue)}
.bn svg{width:46px;height:30px;padding:3px 11px;box-sizing:border-box;border-radius:15px;transition:background .2s}
.bn button.on svg{background:color-mix(in srgb,var(--blue) 18%,transparent)}
body.hasnav{padding-bottom:76px}
body.hasnav .bar{bottom:64px}
.sh{font-size:17px;font-weight:800;margin:6px 0 10px;color:var(--ink)}
.cp{display:flex;gap:12px;padding:10px;align-items:center;border-radius:18px;margin-bottom:10px}
.cp .th{position:relative;width:80px;height:80px;border-radius:14px;overflow:hidden;flex:none;background:linear-gradient(135deg,#3b2f0a,#8A6D12)}
.cp .th img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cp .th .art{position:absolute;inset:0;width:100%;height:100%;padding:14px;object-fit:contain}
.cp .si{padding:0;flex:1;min-width:0}
.cp .si b{font-size:16px}
.cp .cl2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cpt{display:flex;justify-content:space-between;align-items:center;gap:8px}
.fv2{background:none;border:0;color:var(--blue);font-size:20px;line-height:1;padding:2px 4px;cursor:pointer}
.cp .mt{font-size:12px;margin-top:6px}
.oc .on{font-size:19px}

/* cancel sheet */
.cx{text-align:center}.cxi{width:56px;height:56px;border-radius:50%;border:2px solid #FF9C8F;color:#FF9C8F;display:grid;place-items:center;font-size:26px;margin:0 auto 8px}
.cxr{display:flex;align-items:center;gap:10px;padding:12px;margin:6px 0;border:1px solid var(--line);border-radius:12px;text-align:start;cursor:pointer}
.cxr input{width:20px;height:20px;accent-color:#C9A227;margin:0}.cxr:has(input:checked){border-color:#C9A227;background:rgba(201,162,39,.08)}
.cxb{background:rgba(255,156,143,.16)!important;color:#FF9C8F!important;box-shadow:none!important;border:1px solid #FF9C8F!important;margin-top:8px;justify-content:center}

/* ===== تحسينات التصميم v2: الرئيسية، السلة، التتبّع ===== */
.hr{flex-direction:row;justify-content:space-between;align-items:center;text-align:start;gap:10px;padding:2px 0 4px}
.lg{padding:6px 14px 6px 10px;border-radius:16px;gap:8px;box-shadow:0 6px 18px color-mix(in srgb,var(--blue) 30%,transparent)}
.lg svg{width:30px;height:30px}.lg b{font-size:22px}.lg b::after{height:3px;margin-top:1px}
.hbs .chip{display:inline-flex;align-items:center;gap:4px;padding:8px 12px;border-radius:20px;font-weight:700;font-size:13px}
.srch{margin-top:6px;padding:14px 16px;border-radius:18px}
.pk{padding:7px 12px;border-radius:14px}.pk small{display:none}.pk svg{width:20px;height:20px}
.cat{padding:9px 16px;font-weight:700;white-space:nowrap}
.cv{height:178px}
.cv .tag{top:10px;right:10px;left:auto;padding:4px 10px}
.cv .tag.tm{top:auto;bottom:10px;right:10px}
.fv{inset-inline-start:auto;inset-inline-end:auto;left:10px;right:auto;top:10px}
.nrow{display:flex;align-items:center;justify-content:space-between;gap:8px}
.opn{flex:none;font-size:12px;font-weight:700;padding:3px 10px;border-radius:12px}
.opn.y{color:var(--ok,#2E9B5B);background:color-mix(in srgb,var(--ok,#2E9B5B) 16%,transparent)}
.opn.n{color:var(--bad,#D6453D);background:color-mix(in srgb,var(--bad,#D6453D) 16%,transparent)}
body.hasnav .bar{bottom:calc(64px + env(safe-area-inset-bottom,0px))}
/* السلة */
.cs{background:var(--surf);border:1px solid var(--line);border-radius:18px;padding:12px 14px;margin:12px 0}
.cs .ch3{margin:0 0 8px}
.cs input.f{margin:6px 0}
.sumc .row{padding:7px 0;color:var(--mut)}.sumc .row b{color:var(--ink)}.sumc .row.t{color:var(--gold1);font-size:19px}.sumc .row.t span{color:inherit}
.okc{color:var(--ok,#2E9B5B)!important}
.pm{align-items:center;gap:10px;padding:13px 14px}
.pm::before{content:"";flex:none;width:18px;height:18px;border-radius:50%;border:2px solid var(--mut)}
.pm.on{background:color-mix(in srgb,var(--blue) 10%,transparent);border-color:var(--blue)}
.pm.on::before{border-color:var(--blue);background:radial-gradient(var(--blue) 42%,transparent 46%)}
.pm span{flex:1}.pm small{text-align:end}
.btn.stk{position:sticky;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:3}
/* التتبّع */
.trh{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.stc{flex:0 1 55%;text-align:center;font-weight:800;font-size:14px;line-height:1.5;padding:8px 14px;border-radius:16px;color:var(--on);background:linear-gradient(135deg,var(--gold1),var(--gold2))}
.stc.ok{background:var(--ok,#2E9B5B);color:#fff}.stc.bad{background:var(--bad,#D6453D);color:#fff}
.tlc{background:var(--surf);border:1px solid var(--line);border-radius:18px;padding:14px 10px;margin:8px 0 12px}
.rcp{background:var(--surf);border:1px solid var(--line);border-radius:18px;padding:14px;margin:14px 0}
.rcp b:first-child{display:block;margin-bottom:6px;font-size:16px}

/* ===== v3: ستايل ذهبي داكن مسطّح (التصميم المعتمد) ===== */
h3.sh{background:none;border:0;box-shadow:none;animation:none;border-radius:0;padding:0;margin:20px 2px 8px;font-size:18px;color:var(--ink)}
.btn::after{display:none}
.btn{background:var(--blue);color:var(--on);box-shadow:0 6px 18px color-mix(in srgb,var(--blue) 28%,transparent)}
.cat.on{background:var(--blue);box-shadow:none;transform:none}
.sc,.pr{background:var(--surf);box-shadow:none}
.sc:hover{transform:none;box-shadow:none}
.cv .tag{background:rgba(10,10,10,.72);backdrop-filter:none}
.sc .si{padding:12px 14px 14px}
.sc .mt span,.sb .mt span{padding:3px 10px;border-radius:14px;background:color-mix(in srgb,var(--blue) 10%,transparent);border:1px solid var(--line);font-size:12.5px}
.sb .mt{gap:8px;margin-top:10px}
/* المتجر */
.hs{background:linear-gradient(180deg,rgba(0,0,0,.4),transparent 38%,rgba(10,10,10,.92))}
.hero .fv{left:12px;right:auto;top:calc(12px + env(safe-area-inset-top,0px));z-index:2;font-size:20px}
.sb h2{background:none;color:var(--ink);-webkit-text-fill-color:currentColor}
.cn{gap:22px;padding:4px 0 0;border-bottom:1px solid var(--line);margin-top:10px}
.cn button{background:none;border:0;border-bottom:2.5px solid transparent;border-radius:0;padding:10px 2px;color:var(--mut);font-weight:700;font-size:15px}
.cn button.on{color:var(--blue);border-bottom-color:var(--blue)}
.gh{scroll-margin-top:56px;font-size:18px;margin:20px 2px 0}
/* بطاقة المنتج */
.pr{padding:10px 12px;border-radius:18px;gap:14px}
.pi{width:92px;height:92px;border-radius:14px;background:#2a2410;align-self:center}
.pi img{border-radius:14px}
.ad{bottom:6px;left:6px;transform:none;font-size:15px;border-radius:16px;box-shadow:0 4px 12px rgba(0,0,0,.5)}
.ad button{width:30px;height:30px;font-size:19px;line-height:1;padding:0}
.ad span{min-width:14px;font-size:15px}
/* ورقة المنتج */
.pd .pdq{justify-content:space-between;margin:12px 0 4px;gap:10px}
.pdq .qs{display:flex;align-items:center;gap:6px;border:1.5px solid var(--line);border-radius:16px;padding:4px}
.pdq .qs button{width:40px;height:40px;border:0;background:none;color:var(--blue);font-size:24px;border-radius:12px}
.pdq .qs b{font-size:19px;min-width:26px;text-align:center}
.pdq .btn{flex:1;margin:0;justify-content:center;gap:10px;min-height:52px}
.pd .price.big{font-size:22px}
.pdq button.btn{width:auto;height:auto;min-height:52px;border:0;border-radius:16px;font-size:16px;color:var(--on);background:var(--blue);display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 18px;white-space:nowrap}
.pdq .qs button{width:40px;height:40px;border:0;border-radius:12px;font-size:24px;color:var(--blue)}
/* رأس الرئيسية: شعار + اللغة/الألوان في صف واحد، ثم الموقع، ثم البحث */
header:has(.hr){display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding-bottom:6px}
header:has(.hr) .hr{display:contents}
header:has(.hr) h1{order:1;margin:0}
header:has(.hr) .top{order:2;margin:0;flex:1;justify-content:flex-end}
header:has(.hr) .hbs{order:3;flex:0 0 100%;justify-content:flex-start}
header:has(.hr) .srch{order:4;flex:0 0 100%;margin:0}

.ac-h{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px}
.ac-h a{padding:8px 14px;border-radius:18px;border:1px solid var(--line);background:var(--surf);color:var(--ink);font-weight:700;font-size:14px;text-decoration:none}
