/* ============================================================
   store-rose.css — هوية Rozvella على المتجر كله (قرار المالك 2026-10-04)
   ألوان الشعار: ورديّ الشعار على كريميّ دافئ. يُحمَّل بعد styles.css في كل
   الصفحات ويعلو عليه (كل محدِّد مسبوق بـ‎html‎). styles.css نفسه لم يُمسّ:
   القسم 1 مولَّد منه (scratchpad/store_rose.py)، وما بعده تنسيق الواجهة.
   ============================================================ */
html:root{
  --ink:#2A1820; --ink-soft:#5E4A52;
  --bg:#FFFFFF; --bg-dim:#FFFBF8; --line:#F1E2DF;
  --brand:#D42A68; --brand-ink:#fff; --brand-deep:#A81549; --brand-soft:#FCE8EF;
  --wine:#3A1226; --gold:#E9C58B;
  --radius:16px; --shadow:0 1px 2px rgba(58,18,38,.04),0 12px 32px -12px rgba(58,18,38,.16);
}

/* ── 1) ألوانٌ كانت مكتوبة داخل القواعد (مولَّد) ── */
html{--brand:#D42A68}
html input:focus,html select:focus,html button:focus-visible{outline:3px solid rgba(212,42,104,.35)}
html .pshot{background:radial-gradient(120% 120% at 20% 15%,#F9D5E1 0%,#EDA3BF 40%,#F08DB0 100%)}
html .pshot .ph{color:#5A1A3A}
html .chips button[aria-pressed="true"]{background:#FCE8EF}
html .pay label.sel{background:#FCE8EF}
html .track-hero{background:linear-gradient(135deg,#12151c,#5A1A3A)}
html .st.prep{background:#FCE8EF}
/* خلفية بيضاء: هامش الصورة غير المربّعة (contain) يكون نظيفًا لا ورديًّا */
html .gallery .gmain{background:#fff;box-shadow:inset 0 0 0 1px #F1E2DF}
html .chips.swatch button[aria-pressed="true"]{background:#FCE8EF}
html .p-checkout #payBtn{box-shadow:0 6px 16px rgba(212,42,104,.22)}
/* زرّ الدفع على الكمبيوتر بعرض نصّه: كان ‎.buybar .cta‎ يقلّصه بجوار سطر الضمانات فيُقصّ المبلغ
   («ادفع 00.00…») — صورة المالك 2026-10-14 بعد تحويل الزرّ لعملة البلد. */
@media(min-width:760px){html .p-checkout .buybar #payBtn{flex:0 0 auto;max-width:none;min-width:260px;padding-inline:26px}}
/* حتى يصل الإجمالي من الخادم (2–4 ثوانٍ على الحيّ): الزرّ بمقاسه ولونه، ونصّه مخفيّ، وفي وسطه
   دائرة تحميل — فلا يبدو معطّلًا ولا يومض برقمٍ مؤقّت (checkout.html) */
html .p-checkout #payBtn.pay-wait{color:transparent!important;position:relative}
html .p-checkout #payBtn.pay-wait::after{content:"";position:absolute;inset-inline-start:50%;top:50%;width:18px;height:18px;margin:-9px 0 0 -9px;
  border:2.5px solid rgba(142,15,60,.25);border-top-color:#8E0F3C;border-radius:50%;animation:sp .7s linear infinite}
html .p-checkout #payBtn:hover{background:#A81549}
html #buybar #buyBtn{box-shadow:0 6px 16px rgba(212,42,104,.22)}
html #buybar #buyBtn:hover{background:#A81549}
@media (min-width: 900px){html #buybar.inline-buy #buyBtn{box-shadow:0 6px 16px rgba(212,42,104,.22)}}
@media (min-width: 900px){html #buybar.inline-buy #buyBtn:hover{background:#A81549;box-shadow:0 8px 20px rgba(212,42,104,.30)}}
html .fclear{background:#FCE8EF}
html .lang-switch.on-light button.on{background:#FCE8EF}
html .viral.hot{background:#FCE8EF;color:#D42A68}
html .viral.hot .pulse{background:#D42A68}
html .dcat.on{background:#FCE8EF}
html .top.light .lang-switch button.on{background:#FCE8EF}
html .toolbar .fclear{background:#FCE8EF}
html .social a:hover{background:#FCE8EF;border-color:#F4C3D5}
html .lang-btn:hover{background:#FCE8EF}
html .lang-btn.open{background:#FCE8EF;border-color:#F4C3D5}
html .sugg .sg:hover,html .sugg .sg.on{background:#FFF5F8}
html .sg-all:hover{background:#FCE8EF}
html .sugg .qk:hover{background:#FFF5F8}
html .qs-chips button[aria-pressed="true"]{background:#FCE8EF}
html .sw-add{border:1px solid #D42A68;background:#D42A68}
html .cty-btn:focus-visible{outline:2px solid var(--go,#D42A68)}
html .cty-opt[aria-selected="true"]{background:var(--go,#D42A68)}
html .rz-ann{background:linear-gradient(90deg,#D42A68 0%,#E0457E 50%,#D42A68 100%)}
html .bar-search .sbtn{background:linear-gradient(90deg,#D42A68,#E0457E)}
html .bar-search .sbtn:focus-visible{outline:2px solid #D42A68}
html .bar-search input:focus{border-color:#D42A68}
html .toolbar .cart-btn.in-bar{background:linear-gradient(90deg,#D42A68,#E0457E)}
html .toolbar .cart-btn.in-bar:hover{background:linear-gradient(90deg,#D42A68,#E0457E)}
html .cat i{background:#FCE8EF}
html .cat[aria-pressed="true"] i{background:#F9D5E1}
html .card .im{background:radial-gradient(120% 120% at 20% 15%,#FCE8EF,#F4C3D5)}
html .band-tab[aria-pressed="true"]{background:#F9D5E1}

/* ── 2) تحسينات الواجهة ── */
html body{background:var(--bg-dim);font-family:"IBM Plex Sans Arabic","Inter",system-ui,sans-serif}
html[dir=ltr] body{font-family:"Inter","IBM Plex Sans Arabic",system-ui,sans-serif}
html ::selection{background:#F9D5E1}
html input:focus,html select:focus,html button:focus-visible{outline-color:rgba(212,42,104,.3)}

/* شريط الإعلان: خمريّ بدل الأزرق الفاقع */
html .rz-ann{background:linear-gradient(90deg,#3A1226,#6B1B43 50%,#3A1226);color:#fff}

/* الترويسة وشريط البحث */
html .top.light{background:rgba(255,251,248,.92);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line)}
html .top.light .tlink{color:var(--brand-deep);font-weight:600}
html .toolbar select,html .toolbar .cat-open,html .bar-search input{border-color:#E6D3D2;border-radius:12px;background:#fff}
html .bar-search .sbtn{background:var(--brand);border-radius:0 12px 12px 0;font-weight:600}
html[dir=rtl] .bar-search .sbtn{border-radius:12px 0 0 12px}
html .bar-search .sbtn:hover{background:var(--brand-deep)}
html .bar-search .sbtn:focus-visible{outline-color:var(--brand)}
html .bar-search input:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
html .toolbar .cart-btn.in-bar,html .toolbar .cart-btn.in-bar:hover{background:var(--wine);border-radius:12px;filter:none}
html .toolbar .cart-btn.in-bar:hover{background:#55193A}

/* عناوين الأقسام */
html .feat-h,html .trend-h h2{font-family:"IBM Plex Sans Arabic","Space Grotesk",sans-serif;font-size:1.15rem;color:var(--ink)}
html .feat-head a,html .trend-h a{color:var(--brand-deep);font-weight:600;text-decoration:none}

/* البطاقات */
html .card,html .feat-card.rowcard{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 1px 2px rgba(58,18,38,.04);
  transition:transform .18s,box-shadow .18s,border-color .18s}
html .card:hover,html .feat-card.rowcard:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#EBCFD4}
/* أبيض: هامش الصورة غير المربّعة (contain) يذوب في خلفية صور المنتجات البيضاء */
html .card .im,html .feat-im,html .trend-im,html .rel-im,html .sw-im{border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px #F4E8E5}
html .card .pr b,html .feat-pr b,html .trend-pr b,html .qs-pr b,html .sg-pr{color:#A81549}  /* السعر بورديّ الشعار الداكن (اعتمده المالك 2026-10-04) */
html .card .sv{color:var(--brand-deep)}
html .feat-badge{background:var(--brand);color:#fff;border-radius:99px}
/* زرّ السلة في البطاقات: ورديّ فاتح كباقي أزرار الموقع (اعتمده المالك 2026-10-04) */
html .qadd{border-color:#F0B3C6;border-radius:12px;color:#A81549;background:linear-gradient(180deg,#FCE3EA,#F8CEDB)}
html .qadd:hover{border-color:#E89AB4;color:#8E0F3C;background:linear-gradient(180deg,#FAD6E1,#F4BCCE)}
html .usb.fastb{background:#EEF8F1;color:#14653A;border-radius:99px;padding:3px 10px}

/* قائمة الأقسام الجانبية */
/* قائمة «كل الأقسام» بلون تذييل الموقع (طلب المالك 2026-10-14): وردي فاتح لا أبيض.
   على الوردي يصير المختار أبيض بإطارٍ وردي حتى يبقى ظاهرًا، والمرور أبيض شفاف. */
/* نافذة «اتضافت للسلة» في صفحة المنتج: من أسفل على الموبايل، وفي المنتصف على الكمبيوتر — بلون التذييل */
html .added-sheet{position:fixed;inset:0;z-index:90;background:rgba(58,18,38,.45);display:flex;align-items:flex-end;justify-content:center;opacity:0;transition:opacity .2s}
html .added-sheet.on{opacity:1}
html .added-sheet[hidden]{display:none}
html .as-box{background:linear-gradient(180deg,#FDF3F0 0%,#FBE4E8 100%);width:100%;max-width:440px;border-radius:18px 18px 0 0;padding:18px 18px calc(18px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px;transform:translateY(24px);transition:transform .2s}
html .added-sheet.on .as-box{transform:none}
@media(min-width:760px){html .added-sheet{align-items:center}html .as-box{border-radius:18px}}
html .as-head{display:flex;justify-content:space-between;align-items:center;color:var(--brand-deep);font-size:1.02rem}
html .as-x{border:0;background:none;font-size:1.6rem;line-height:1;color:#5E4A52;cursor:pointer;padding:0 6px}
html .as-item{display:flex;gap:12px;align-items:center;background:#fff;border:1px solid #F4D5DA;border-radius:12px;padding:10px}
html .as-item img{width:64px;height:64px;object-fit:contain;border-radius:8px;flex:none;background:#fff}
html .as-t{font-weight:600;font-size:.92rem;line-height:1.5}
html .as-item small{display:block;color:#5E4A52;font-size:.8rem;line-height:1.5}
html .as-p{font-weight:700;color:var(--brand-deep);margin-top:2px}
html .as-go,html .as-keep{width:100%;text-align:center;text-decoration:none;display:block;box-sizing:border-box}
html .as-cart{text-align:center;font-size:.86rem;color:#5E4A52}
html .drawer{border-radius:0;background:linear-gradient(180deg,#FDF3F0 0%,#FBE4E8 100%)}
html .drawer-head{border-bottom-color:#F4D5DA}
html .drawer .dcat:hover{background:rgba(255,255,255,.6)}
html .drawer .dsub{border-inline-start-color:#F4D5DA}
html .drawer-back{background:rgba(58,18,38,.45)}
html .drawer-body a.on,html .drawer-body button.on,html .drawer-body .on{background:#fff;color:var(--brand-deep);box-shadow:inset 0 0 0 1px #F0B3C6}

/* التذييل */
html .foot a:hover{color:var(--brand-deep)}

html #rzConsent .rzc-yes{background:var(--brand);border-color:var(--brand)}
html #rzConsent a{color:var(--brand-deep)}

/* ── 3) القوائم المنسدلة (الترتيب، السعر، التقييم) ──
   المتصفّحات الحديثة (Chrome/Edge) ترسم القائمة بألوان الهوية؛ غيرها يبقى
   على قائمة النظام كما كانت — بلا كسر. */
@supports (appearance: base-select) {
  html .toolbar select,
  html .toolbar select::picker(select){appearance:base-select}
  html .toolbar select{display:inline-flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;
    transition:border-color .15s,box-shadow .15s}
  html .toolbar select:hover,
  html .toolbar select:open{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
  html .toolbar select::picker-icon{color:var(--ink-soft);transition:rotate .2s}
  html .toolbar select:open::picker-icon{rotate:180deg;color:var(--brand-deep)}
  html .toolbar select::picker(select){border:1px solid var(--line);border-radius:14px;background:#fff;padding:6px;margin-top:6px;
    box-shadow:0 1px 2px rgba(58,18,38,.04),0 18px 40px -14px rgba(58,18,38,.28);min-width:anchor-size(width)}
  html .toolbar select option{padding:10px 14px;border-radius:10px;color:var(--ink);font-size:.9rem;cursor:pointer;outline:0}
  html .toolbar select option:hover,
  html .toolbar select option:focus-visible{background:var(--brand-soft);color:var(--brand-deep)}
  html .toolbar select option:checked{background:var(--brand);color:#fff;font-weight:600}
  html .toolbar select option::checkmark{display:none}
}

/* ── 4) التذييل: ورديّ فاتح بنصٍّ داكن (طلب المالك: «غامق أوي» — على ألوان إعلان Rozvella) ── */
html .site-foot{background:linear-gradient(180deg,#FDF3F0 0%,#FBE4E8 100%);color:#5E4A52;border-top:1px solid #F4D5DA}
html .site-foot .foot-col h4{color:#2A1820}
html .site-foot .foot-col a{color:#5E4A52}
html .site-foot .foot-col a:hover{color:var(--brand-deep);text-decoration:none}
html .site-foot .foot-about p,
html .site-foot .contact-line,
html .site-foot .pay-txt,
html .site-foot .foot-pay-txt,
html .site-foot .foot-bottom{color:#7A6269}
html .site-foot .foot-about .logo{color:#2A1820}
html .site-foot .contact-line a{color:var(--brand-deep)}
html .site-foot .social a{background:#fff;border-color:#F1CFD6;color:var(--brand-deep)}
html .site-foot .social a:hover{background:var(--brand);border-color:var(--brand);color:#fff}
html .site-foot .social{display:grid;grid-template-columns:repeat(4,38px);gap:9px;justify-content:start}
html .site-foot .social a{margin:0}
html .site-foot .foot-pay,
html .site-foot .foot-bottom{border-top-color:#F1CFD6}
html .site-foot .foot-bottom a{color:#5E4A52}
html .site-foot .foot-bottom a:hover{color:var(--brand-deep)}
html .site-foot .foot-pay-sep{background:#EBC3CB}
html .site-foot .foot-pay-more{background:#fff;color:#5E4A52}
html .site-foot .foot-col{border-bottom-color:#F1CFD6}
html .site-foot .fc-arrow{border-color:#A88A92}
html .to-top{border-color:#F1CFD6;color:var(--brand-deep)}
html .to-top:hover{background:var(--brand-soft);border-color:var(--brand);color:var(--brand-deep)}

/* ── 5) تفتيح ما بقي داكنًا (طلب المالك): شريط الإعلان وزرّ السلة بورديّ الشعار ── */
html .rz-ann{background:linear-gradient(90deg,#FBE4E8,#FDF1EE 50%,#FBE4E8);color:#A81549;border-bottom:1px solid #F4D5DA}
html .toolbar .cart-btn.in-bar{background:linear-gradient(90deg,#D42A68,#E0457E);color:#fff;border-color:transparent}
html .toolbar .cart-btn.in-bar:hover{background:linear-gradient(90deg,#C2245F,#D42A68);color:#fff}
html .page{background:transparent}
html .more{border-color:#E6D3D2;border-radius:12px;background:#fff;color:var(--ink);font-weight:600}
html .more:hover{border-color:var(--brand);color:var(--brand-deep);background:var(--brand-soft)}

/* ── 6) التذييل: تخطيطٌ أكثف — بلا مساحاتٍ فارغة ──
   • عمود التعريف أوّلًا وأعرض. • «كل الأقسام» على عمودين. • عمود «الدفع» يُخفى
   (وسائل الدفع نفسها في الشريط أسفله). • شريط الدفع والحقوق في صفٍّ واحد. */
html .site-foot{margin-top:28px;min-height:0}
@media (min-width:1000px){
  html .site-foot{padding:40px 28px 16px}
  html .foot-grid.six{max-width:1180px;grid-template-columns:1.5fr .9fr 1.8fr 1fr 1fr;gap:20px 40px;align-items:start}
  html .foot-grid.six > .foot-col:has(.pay-icons){display:none}
  html .foot-grid.six > .foot-about{order:-1}
  html .foot-grid.six > .foot-col:nth-child(2) .fc-body{columns:2;column-gap:28px}
  html .site-foot .foot-col a{break-inside:avoid;margin-bottom:9px;font-size:.88rem}
  html .site-foot .foot-col h4{font-size:.92rem;margin-bottom:14px}
  html .site-foot .foot-about .logo{font-size:1.35rem}
  html .site-foot .foot-about p{max-width:300px;font-size:.88rem}
  html .site-foot .social{grid-template-columns:repeat(4,34px);gap:8px}
  html .site-foot .social a{width:34px;height:34px}
  html .site-foot .foot-pay{max-width:1180px;margin:28px auto 0;padding-top:16px;display:flex;align-items:center;justify-content:space-between;gap:20px;text-align:start}
  html .site-foot .foot-pay-row{justify-content:flex-start}
  html .site-foot .foot-pay-txt{margin:0;white-space:nowrap}
  html .site-foot .foot-bottom{max-width:1180px;margin-top:14px;padding-top:14px}
}

/* ── 7) ما بقي داكنًا في الصفحات: يُفتَّح على ألوان الهوية ── */
html .track-hero{background:linear-gradient(135deg,#FDF3F0,#FBE4E8);color:var(--ink);border-bottom:1px solid #F4D5DA}
html .track-hero p{opacity:1;color:var(--ink-soft)}
html .track-form input{border:1px solid #E6D3D2;border-radius:12px;background:#fff}
html .track-form input:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
html .track-form button{border-radius:12px;box-shadow:0 8px 20px -10px rgba(212,42,104,.55)}
html .track-form button:hover{background:var(--brand-deep)}
@media(max-width:760px){
  html.rz-mobile .mhero{background:linear-gradient(135deg,#C2245F,#E0457E)}
  html.rz-mobile .card .qadd, html.rz-mobile .rowcard .qadd{background:var(--brand);color:#fff}
}
html .rz-ann .rz-ann-sep{color:#D98BA6;opacity:1}

/* ── 8) الأزرار الأساسية بورديّ فاتح على الموقع كله (طلب المالك 2026-10-04) ──
   خلفية وردية فاتحة ونصّ ورديّ داكن. زرّا الشراء («اشترِ الآن»، «ادفع») درجةٌ
   أعمق قليلًا من العائلة نفسها ليبقيا أوضح ما في الصفحة. */
html .bar-search .sbtn,
html .toolbar .cart-btn.in-bar,
html .track-form button,
html .cta:not(.alt),
html .wl-empty a,
html .nf-links a.main,
html #rzConsent .rzc-yes,
html .feat-badge,
html.rz-mobile .cart-bar .cta,
html.rz-mobile .card .qadd, html.rz-mobile .rowcard .qadd{
  background:linear-gradient(180deg,#FCE3EA,#F8CEDB);color:#A81549;border:1px solid #F0B3C6;
  box-shadow:0 6px 16px -10px rgba(212,42,104,.45);filter:none}
html .bar-search .sbtn:hover,
html .toolbar .cart-btn.in-bar:hover,
html .track-form button:hover,
html .cta:not(.alt):hover,
html .wl-empty a:hover,
html .nf-links a.main:hover,
html #rzConsent .rzc-yes:hover{
  background:linear-gradient(180deg,#F9D5E1,#F4BFD0);color:#8E0F3C;border-color:#E99AB4;filter:none}
html .bar-search .sbtn svg,html .toolbar .cart-btn.in-bar svg{color:#A81549;stroke:currentColor}
html .toolbar .cart-btn.in-bar .cart-count{background:var(--brand);color:#fff;border-color:#fff}
html .feat-badge{box-shadow:none;font-weight:700}
/* زرّا الشراء: الأوضح في الصفحة */
html #buybar #buyBtn,
html .p-checkout #payBtn,
html #buyBtn.cta,
html #payBtn.cta{
  background:linear-gradient(180deg,#F9D0DD,#F2A9C2);color:#8E0F3C;border:1px solid #E58FAD;
  box-shadow:0 10px 22px -12px rgba(212,42,104,.6)}
html #buybar #buyBtn:hover,
html .p-checkout #payBtn:hover,
html #buyBtn.cta:hover,
html #payBtn.cta:hover{background:linear-gradient(180deg,#F6C2D3,#EE98B6);color:#7A0B33}
html .cta:disabled,html #payBtn:disabled{background:#F6EEEB;color:#B9A5AA;border-color:#EADDD9;box-shadow:none}
html #buybar.inline-buy #buyBtn{background:linear-gradient(180deg,#F9D0DD,#F2A9C2);color:#8E0F3C;border:1px solid #E58FAD;box-shadow:0 10px 22px -12px rgba(212,42,104,.6)}
html #buybar.inline-buy #buyBtn:hover,html #buybar #buyBtn:hover{background:linear-gradient(180deg,#F6C2D3,#EE98B6);color:#7A0B33;box-shadow:0 10px 22px -12px rgba(212,42,104,.6)}
html #buybar #buyBtn:disabled,html #buybar.inline-buy #buyBtn:disabled,html #buybar .cta:disabled,html #buybar.inline-buy .cta:disabled{background:#F6EEEB;color:#B9A5AA;border-color:#EADDD9;box-shadow:none}

/* ── 9) شريط البحث قطعةٌ واحدة، وقوائم الفلاتر وزرّ «+» بالورديّ الفاتح ── */
/* الحقل والزرّ متلاصقان: الزوايا المستديرة على الطرفين الخارجيين فقط (بخصائص منطقية
   تعمل في العربية والإنجليزية)، وإطارٌ واحد متّصل. */
html .bar-search input{border:1px solid #F0B3C6;border-inline-end:0;border-radius:0;
  border-start-start-radius:12px;border-end-start-radius:12px;background:#fff}
html .bar-search .sbtn,html[dir=rtl] .bar-search .sbtn{border:1px solid #F0B3C6;border-radius:0;
  border-start-end-radius:12px;border-end-end-radius:12px;box-shadow:none;margin:0}
html .bar-search input:focus{border-color:#E58FAD;box-shadow:none;outline:0}
html .bar-search:focus-within .sbtn{border-color:#E58FAD}

@supports (appearance: base-select) {
  html .toolbar select:hover,html .toolbar select:open{border-color:#F0B3C6;box-shadow:0 0 0 3px #FCE8EF}
  html .toolbar select:open::picker-icon{color:#A81549}
  html .toolbar select option:checked{background:linear-gradient(180deg,#FCE3EA,#F8CEDB);color:#A81549;font-weight:600}
  html .toolbar select option:hover,html .toolbar select option:focus-visible{background:#FDF1EE;color:#A81549}
}

html .sw-add{background:linear-gradient(180deg,#FCE3EA,#F8CEDB);color:#A81549;border:1px solid #F0B3C6;box-shadow:none}
html .sw-add:hover{background:linear-gradient(180deg,#F9D5E1,#F4BFD0);color:#8E0F3C;border-color:#E99AB4}
html .sw-add.ok{background:#E9F8EF;color:#136c33;border-color:#BFE8CF}

/* ── 10) تصميم الموبايل (html.rz-mobile): بلا لونٍ صريح ولا رماديّ بارد ── */
@media(max-width:760px){
  html.rz-mobile .mhero{background:linear-gradient(135deg,#FDF3F0,#FBE4E8);color:var(--ink);border:1px solid #F4D5DA}
  html.rz-mobile .mhero::after{background:radial-gradient(closest-side,rgba(212,42,104,.14),transparent 70%)}
  html.rz-mobile .mhero h1{color:var(--ink)}
  html.rz-mobile .mhero p{opacity:1;color:var(--ink-soft)}
  html.rz-mobile .mhero a{background:linear-gradient(180deg,#FCE3EA,#F8CEDB);color:#A81549;border:1px solid #F0B3C6;box-shadow:0 6px 16px -10px rgba(212,42,104,.45)}
  html.rz-mobile .p-home .bar-search input{background:#fff;border:1px solid #F0B3C6;border-inline-end:0;border-radius:0;
    border-start-start-radius:14px;border-end-start-radius:14px}
  html.rz-mobile .p-home .bar-search .sbtn{border-radius:0;border-start-end-radius:14px;border-end-end-radius:14px}
}

/* ── 11) ترويسة الموبايل بلا قفز عند التحميل ──
   السلة واللغة تُحقنان بسكربتَين مؤجَّلَين، فكانت أيقونة القائمة تظهر أوّلًا ثم
   تُزاح مرّتين (وميض). لكل أيقونةٍ خانتها الثابتة في شبكة: ما لم يصل بعد يترك
   مكانه فارغًا، وما وصل لا يتحرّك. */
@media(max-width:760px){
  html.rz-mobile .top-row:has(> .hd-menu){display:grid;grid-template-columns:auto minmax(0,1fr) 40px 40px 40px;align-items:center;column-gap:14px}
  html.rz-mobile .top-row:has(> .hd-menu) > .logo{grid-column:1;grid-row:1}
  html.rz-mobile .top-row:has(> .hd-menu) > .spacer{grid-column:2;grid-row:1}
  html.rz-mobile .top-row:has(> .hd-menu) > .cart-btn.in-head{grid-column:3;grid-row:1}
  html.rz-mobile .top-row:has(> .hd-menu) > .hd-menu{grid-column:4;grid-row:1}
  html.rz-mobile .top-row:has(> .hd-menu) > .lang-btn.in-head{grid-column:5;grid-row:1}
}
@media(max-width:760px){
  html.rz-mobile .top-row:has(> .hd-menu) > .cart-btn.in-head,
  html.rz-mobile .top-row:has(> .hd-menu) > .hd-menu,
  html.rz-mobile .top-row:has(> .hd-menu) > .lang-btn.in-head{margin:0;justify-self:center;position:relative;inset:auto}
}

/* ── 12) بطاقة المنتج: صفّ السعر سطران على الأكثر (2026-10-04) ──
   السعر القديم المشطوب يقف بجوار السعر إن وسعه السطر؛ وإن لم يسعه (أرقام كبيرة) يُخفى
   كلّه بدل أن ينكسر «ج.م» لسطرٍ ثالث يطيل البطاقة ويترك فراغًا في جاراتها — وسطر
   «وفّرت» تحته يبقى دالًّا على الخصم. */
html .card .pr{display:flex;flex-wrap:wrap;align-items:baseline;line-height:1.75rem;max-height:1.75rem;overflow:hidden}
html .card .pr b,html .card .pr s,html .card .sv{white-space:nowrap}
html .card .bd{padding-bottom:6px}
/* النجوم تُزال من بطاقات المنتجات نهائيًّا (طلب المالك 2026-10-04): وجودها في بطاقةٍ دون
   جارتها يترك فراغًا تحت الصور. التقييم يبقى داخل صفحة المنتج. */
html .card .st{display:none}

/* ── 13) السلة على الموبايل: صفّ الصنف لا يتجاوز عرض الشاشة (2026-10-04) ──
   عمود ‎1fr‎ لا ينكمش دون محتواه؛ مع سعرٍ طويل (‎5,675.28 ج.م‎) كانت الصفحة كلها تتسع
   17px وتنزاح. ‎minmax(0,1fr)‎ يسمح بالانكماش فيلتفّ العنوان بدل أن تتسع الصفحة. */
html .citem{grid-template-columns:78px minmax(0,1fr) auto}
html .cart-grid{grid-template-columns:minmax(0,1fr)}
@media(min-width:860px){html .cart-grid{grid-template-columns:minmax(0,1fr) 320px}}

/* ── 14) نافذة الفلاتر على الموبايل: زرّ «عرض النتائج» ورديّ فاتح كباقي الأزرار (2026-10-04) ── */
html.rz-mobile .rzf-done{background:linear-gradient(180deg,#FCE3EA,#F8CEDB);color:#A81549;border:1px solid #F0B3C6;
  box-shadow:0 6px 16px -10px rgba(212,42,104,.45)}

/* ── 15) صفحة الدفع: خانة كود الخصم (كود الشريك) ── */
html .promo-row{display:flex;gap:8px;margin:10px 0 4px}
html .promo-row input{flex:1;min-width:0;height:42px;border:1px solid #E6D3D2;border-radius:12px;background:#fff;padding:0 12px;font:inherit;font-size:.9rem;text-transform:lowercase}
html .promo-row input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
html .promo-row button{flex:none;height:42px;padding:0 16px;border-radius:12px;font:inherit;font-weight:600;font-size:.86rem;cursor:pointer;
  background:linear-gradient(180deg,#FCE3EA,#F8CEDB);color:#A81549;border:1px solid #F0B3C6}
html .promo-msg{font-size:.8rem;margin:2px 0 8px}
html .promo-msg.ok{color:#14653A}
html .promo-msg.bad{color:#B3261E}

/* ── 16) الدفع: المحدَّد وحده مميَّز (فحص التصميم 2026-10-05) ──
   الخياران يحملان ‎.sel‎ دائمًا فكانا ورديَّين معًا — لا يُعرف أيّهما مختار. */
html .pay label.sel{background:#fff;border-color:var(--line)}
html .pay label.sel:has(input:checked){background:#FCE8EF;border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}

/* ── 17) إمكانية الوصول — أرقام فحص التصميم 2026-10-05 ── */
/* تبويب الأسعار المختار: كان الوردي على الوردي 3.61:1 (المطلوب 4.5:1) ⇒ 5.45:1 */
html .band-tab[aria-pressed="true"]{color:#A81549}
/* «نسخ الرقم» في صفحة الشكر: 4.14:1 ⇒ 6.25:1 */
html #cpBtn{color:#A81549}
/* نصوص شريط التنقل السفلي: 10.88px أصغر من المقروء على الهاتف ⇒ 12px */
html.rz-mobile .rztab{font-size:12px}

/* ── 18) سطر الثقة تحت أزرار الشراء (فحص التصميم 2026-10-05) ── */
html .rz-trust{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px;margin:14px 0 4px;font-size:.8rem;color:#5E4A52}
html .rz-trust > a,html .rz-trust > span{display:inline-flex;align-items:center;gap:6px;color:inherit;text-decoration:none;white-space:nowrap}
html .rz-trust > a:hover{color:var(--brand-deep)}
html .rz-trust svg{width:16px;height:16px;flex:none;color:var(--brand)}
html .p-product .rz-trust{justify-content:flex-start}
html .p-checkout #coTrust .rz-trust{margin-top:12px}

/* ── 19) أول زيارة على الموبايل: البانر + شريط الشراء + التبويبات كانت تغطّي 27% من الشاشة ──
   ما دام بانر الكوكيز ظاهرًا يُخفى سطر السعر المكرَّر من شريط الشراء (السعر ظاهر في الصفحة)،
   فيبقى اسم المنتج مرئيًّا. يعود السطر فور الإجابة على البانر. */
@media(max-width:760px){
  html.rz-consent-open.rz-mobile body.p-product .buybar > .p{display:none}
}

/* ── 20) الدفع: عنوان الصفحة ورسائل الخطأ تحت حقولها (فحص التصميم 2026-10-05) ── */
html .p-checkout .co-title{font-size:1.35rem;margin:0 0 14px;color:var(--ink)}
html .p-checkout .ferr{color:#B3261E;font-size:.8rem;margin:5px 2px 0;line-height:1.5}
html .p-checkout input.bad{border-color:#B3261E;box-shadow:0 0 0 3px rgba(179,38,30,.10)}

/* ── 22) الرئيسية: سطر «لماذا Rozvella» (فحص التصميم 2026-10-05) ── */
html .home-trust{max-width:1280px;margin:10px auto 0;padding:0 20px}
html .home-trust:empty{display:none}
html .home-trust .rz-trust{margin:0;padding:9px 14px;border:1px solid var(--line);border-radius:14px;background:#fff;gap:6px 22px;font-size:.84rem}
@media(max-width:760px){
  html.rz-mobile .home-trust{margin:10px 16px 0;padding:0}
  html.rz-mobile .home-trust .rz-trust{font-size:.76rem;gap:5px 12px;padding:9px 10px}
}

/* ── 23) المنتج: «اسأل عبر واتساب» تحت سطر الثقة (فحص التصميم 2026-10-05) ── */
html .ask-wa{display:inline-flex;align-items:center;gap:7px;margin:8px 0 2px;font-size:.84rem;color:#14653A;text-decoration:none;font-weight:600}
html .ask-wa:hover{text-decoration:underline}
html .ask-wa svg{flex:none;color:#1FA855}
/* صندوق الشحن + أزرار الشراء (كمبيوتر) + سطر الثقة + واتساب: مجموعة واحدة لا يفصلها شيء */
html .p-product .buy-info{min-width:0}
html .p-product .buy-info > .rz-trust{margin-top:14px}
@media (min-width:900px){ html .p-product .buy-info .buybar{margin-inline-start:0} }

/* ── 24) لا تقييمات في الموقع (قرار المالك 2026-10-05): فلتر التقييم مخفيّ أينما رُسم ── */
html #rateSel,html .toolbar #rateSel{display:none !important}

/* ── 25) الرئيسية (كمبيوتر): سطر المزايا في الترويسة بجوار اللغة بدل رابط «تتبع طلبك» — طلب المالك 2026-10-05 ──
   على الموبايل يبقى تحت البانر؛ وعلى الكمبيوتر لا يتكرّر تحت شريط البحث. */
html .head-trust{display:none}
@media(min-width:761px){
  html:not(.rz-mobile) .head-trust{display:block;min-width:0}
  html:not(.rz-mobile) .head-trust .rz-trust{margin:0;padding:7px 14px;border:1px solid var(--line);border-radius:12px;background:#fff;gap:4px 18px;font-size:.82rem;flex-wrap:nowrap}
  html:not(.rz-mobile) .home-trust{display:none}
}
/* جملة المتجر بجوار الشعار باقية دائمًا (طلب المالك 2026-10-05 — كنتُ أخفيها على الشاشات الأضيق).
   حين لا يسع الصفُّ الاثنين: السطر يُضغط أولًا، ثم ينزل تحت شريط البحث (‎#homeTrust‎) ولا تُمسّ الجملة. */
@media(min-width:761px) and (max-width:1320px){
  html:not(.rz-mobile) .head-trust .rz-trust{font-size:.76rem;gap:4px 12px;padding:6px 10px}
}
@media(min-width:761px) and (max-width:959px){
  html:not(.rz-mobile) .head-trust{display:none}
  html:not(.rz-mobile) .home-trust{display:block}
}

/* ── 26) سطر المزايا: بجوار جملة المتجر على الكمبيوتر، ولا يظهر على الموبايل (طلب المالك 2026-10-05) ── */
/* في منتصف المسافة بين جملة المتجر وزرّ اللغة (طلب المالك): الهامشان التلقائيان يقسمان الفراغ،
   والفاصل المرن يُلغى في هذا الصف وإلا ابتلع الفراغ كلّه */
@media(min-width:960px){
  html:not(.rz-mobile) .top.light .top-row > .head-trust{margin-inline:auto}
  html:not(.rz-mobile) .top.light .top-row:has(> .head-trust) > .spacer{display:none}
  /* زرّ قائمة الموبايل (عرضه صفر هنا) كان يأخذ فجوة 14px، ولزرّ اللغة هامش 10px: يُلغى الأول
     ويُعوَّض نصف الثاني ليقع السطر في المنتصف تمامًا */
  html:not(.rz-mobile) .top.light .top-row:has(> .head-trust) > .hd-menu{display:none}
  html:not(.rz-mobile) .top.light .top-row > .head-trust{position:relative;inset-inline-start:5px}
}
html.rz-mobile .home-trust{display:none !important}
@media(max-width:760px){ html .home-trust,html .head-trust{display:none !important} }

/* شاشة المالك ≈1020px: الصفّ يسع السطر مضغوطًا — كان ينزل تحت البحث حتى 1139px بلا داعٍ (2026-10-05) */
@media(min-width:960px) and (max-width:1139px){
  html:not(.rz-mobile) .head-trust .rz-trust{font-size:.74rem;gap:4px 10px;padding:6px 9px;white-space:nowrap}
  html:not(.rz-mobile) .head-trust .rz-trust svg{width:14px;height:14px}
}

/* ── 27) السطر لا يسعه صفّ الترويسة (لغةٌ جملتها أطول) ⇒ تحت شريط البحث، والصفّ يعود كما كان ── */
@media(min-width:761px){
  html.ht-below:not(.rz-mobile) .head-trust{display:none !important}
  html.ht-below:not(.rz-mobile) .home-trust{display:block}
  html.ht-below:not(.rz-mobile) .top.light .top-row:has(> .head-trust) > .spacer{display:block}
}

/* ── 28) التذييل لا يتجاوز عرض الصفحة في اللغات ذات الكلمات الطويلة (الألمانية على 1022px: +85px) ──
   أعمدة ‎fr‎ لا تنكمش دون أطول كلمة؛ ‎minmax(0,…)‎ يسمح بالانكماش والكلمة الطويلة تلتفّ. */
@media(min-width:1000px){
  html .foot-grid.six{grid-template-columns:minmax(0,1.5fr) minmax(0,.9fr) minmax(0,1.8fr) minmax(0,1fr) minmax(0,1fr)}
  html .foot-grid.six > .foot-col{min-width:0}
  html .foot-grid.six a,html .foot-grid.six h4,html .foot-grid.six p{overflow-wrap:anywhere}
}

/* ── 29) «إعدادات الكوكيز» في صفحة الخصوصية: زرّ بهيئة رابط ── */
html .ck-set{font:inherit;font-weight:600;color:var(--brand-deep,#A81549);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
html .ck-set:hover{color:#D42A68}

/* ── 30) فحص الوميض (2026-10-05) ──
   نصوص i18n تُملأ بعد أول رسم (DOMContentLoaded): يُحجز لكل عنصر سطرُه فلا تقفز الصفحة حين
   تُملأ — كانت ترويسة الصفحات الفرعية تزيد 9px وحقول الدفع تنزل 257px. */
[data-i18n]:empty::before{content:"\00a0"}
/* السلة: عرضها ثابت من أول رسم (كانت تنكمش على نص «جارٍ التحميل» ثم تتمدّد 711px) */
html .cart-wrap{width:100%}
/* شريط التمرير يُحجز مكانه دائمًا: في الصفحات القصيرة (التتبّع، المفضلة، التواصل) كان يظهر بعد رسم
   التذييل فيضيق عرض الصفحة 15px ويتحرّك كل ما فيها */
html{scrollbar-gutter:stable}
/* التذييل يُبنى بالجافاسكريبت (site.js يحوّل ‎footer.foot‎ إلى ‎.site-foot‎): مساحته تُحجز من أول رسم
   بالمقاس نفسه (‎.site-foot{min-height}‎ في styles.css)، فلا يظهر فجأة في الصفحات القصيرة */
/* ‎footer.foot‎ = التذييل قبل أن يبنيه site.js (بعدها يصير ‎.site-foot‎). المقاسات مقيسة من التذييل الفعلي:
   ≥1000px = 396، 760–999 = 980، أقل = 664. بعضها فيه روابط احتياطية فلا يُعتمد على ‎:empty‎. */
html footer.foot{display:block;min-height:396px;margin-top:28px;border-top:1px solid #F4D5DA;
  background:linear-gradient(180deg,#FDF3F0 0%,#FBE4E8 100%)}
@media(max-width:999px){html footer.foot{min-height:980px}}
@media(max-width:759px){html footer.foot{min-height:664px}}
html .p-track footer.foot{margin-top:auto}
/* المفضلة: مساحة المحتوى محجوزة فلا ينزل التذييل حين تُرسم القائمة أو رسالة «فارغة» */
html .wl-wrap #box{min-height:270px}
/* البحث: سطر «عدد النتائج» يُحجز مكانه من أول رسم (كان يظهر بعد وصول النتائج فتنزل الشبكة 30px) */
html.rz-q #fcount[hidden]{display:block !important;visibility:hidden}
html.rz-q #fcount:empty::before{content:"\00a0"}
/* عنوان «كل المنتجات» يُملأ بعد أول رسم: يُحجز سطره (كانت الشبكة تنزل 30px) */
#allTitle:empty::before{content:"\00a0"}
/* ترويسة صفحتي الشركاء والتجار: نصوصها تُملأ بعد أول رسم — يُحجز سطرها */
[data-rz]:empty::before,#tLogin:empty::before{content:"\00a0"}
/* ── 31) الدفع: سؤال «الهاتف من بلد والشحن إلى آخر» قبل إنشاء الطلب ── */
html .cty-ask{margin:0 0 12px;padding:12px 14px;border:1px solid #F0B3C6;border-radius:12px;background:#FFF4F7;color:#3B2A30;font-size:.9rem;line-height:1.7}
html .cty-ask p{margin:0 0 10px;font-weight:600}
html .cty-ask-btns{display:flex;gap:8px;flex-wrap:wrap}
html .cty-ask-b{flex:1 1 150px;padding:10px 12px;border-radius:10px;border:1px solid #F0B3C6;background:#fff;color:#A81549;font:inherit;font-weight:600;cursor:pointer}
html .cty-ask-b.go{background:linear-gradient(180deg,#FCE3EA,#F8CEDB)}