@media (min-width: 1024px) {
    .lg\:grid-cols-6 {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}


footer.store-footer,span.text-sm.copyright-text *{color:#fff!important}.banner-entry h3,.s-slider-thumbs .s-slider-thumbs-container .swiper-slide{height:auto!important}.banner-entry h3,a.s-slider-block__display-all{position:absolute;left:50%;transform:translateX(-50%)}section:first-of-type .container{max-width:100%;padding:0}[src="https://cdn.files.salla.network/homepage/1980400401/4896a097-f192-4896-9f9b-97b068f94d16-original.webp"]{max-width:45%!important;margin:auto}.main-nav-container.fixed-pinned .navbar-brand img{max-height:72px}body{background:#faf7f2}section.s-block.s-block--banners.container{margin-top:0;padding-bottom:0}.feature-title{font-size:13px}@media (min-width:768px){.md\:grid-cols-3{grid-template-columns:repeat(5,minmax(0,1fr))}.grid.md\:grid-cols-2.grid-flow-row.gap-3.sm\:gap-8 .banner-entry{height:349px;background-size:contain}.two-row .banner-entry:first-child{height:200px}}.s-block__title,.s-slider-block__title{justify-content:center}.right-side{padding-left:0!important;display:none}button.s-button-element.s-button-btn.s-button-outline.s-button-wide.s-button-primary-outline.s-button-loader-center{background:#c68a8a;color:#fff}.store-footer__inner{background-color:#c68a8a!important;color:#fff}footer.store-footer{background:#000!important}a.s-slider-block__display-all{background:#c68a8a;padding:11px 20px;color:#fff;border-radius:10px;bottom:-50px}section#best-offers-2-slider{padding-bottom:62px}.s-block__title h2,.s-slider-block__title-right h2{padding-left:0;color:#000;font-weight:700!important;font-size:33px;padding-bottom:7px;border-bottom:3px solid #c68a8a}section:first-of-type{margin-top:0}.s-slider-block__title-nav{position:absolute;top:50%;width:100%;left:0;padding:0 10px;justify-content:space-between}.s-slider-nav-arrow{background:#c68a8a;color:#fff;opacity:1;z-index:99999}.s-slider-nav-arrow svg{fill:#fff}.apple-pay-btn{min-width:122px}a.banner-entry.square-photos.has-overlay.with-hover{background-size:contain;overflow:visible}.has-overlay:hover:after{background:0 0;border:none!important}.banner-entry h3{border:none!important;color:#000;width:100%;bottom:-54px;opacity:1}.lazy__bg.lazy.bg-no-repeat.entered.loaded{background-size:contain!important}.two-row .banner-entry:first-child h3{line-height:38px;font-size:1.25rem}@media (max-width:768px){.grid.md\:grid-cols-2.grid-flow-row.gap-3.sm\:gap-8,.md\:grid-cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}.s-products-slider-card{max-width:214px}.s-slider-block__title-right h2{font-size:22px}.banner-entry{height:148px}.banner-entry h3.text-with-border,.two-row .banner-entry:first-child h3{font-size:12px!important;bottom:-27px}section:nth-of-type(2) .md\:grid-cols-3{gap:24px;grid-template-columns:repeat(3,minmax(0,1fr))}section:nth-of-type(2) .banner-entry{height:122px}[src="https://cdn.files.salla.network/homepage/1980400401/4896a097-f192-4896-9f9b-97b068f94d16-original.webp"]{max-width:67%!important;margin:auto}.feature-title{font-size:12px}.feature-item{border-left:0!important}.s-block__title h2{display:none}section.s-block.s-block--banners.container{margin-top:0}a.navbar-brand{position:absolute;left:56%;transform:translateX(-50%)}.navbar-brand img{max-height:5rem}}

#roseland-map-column::before {
    content: "العنوان: 3554 الفردوس، الراشدية، مكة 24269";
    display: block;
    margin-bottom: 12px;
    color: #ffffff;
    font-size: 15px;
    line-height: 1.8;
    text-align: right;
    direction: rtl;
    font-weight: 500;
}
/* ▼▼▼ البحث مخفي — امسح من هنا لحد نهاية البلوك لو عايزه يرجع ▼▼▼ */
.header-search,
salla-search,
.s-search-modal {
    display: none !important;
}
/* ▲▲▲ نهاية بلوك إخفاء البحث ▲▲▲ */

/* Top bar is now empty — hide it too, otherwise it leaves a blank 48px strip */
.top-navbar {
    display: none !important;
}

.rl-acc{
  border:1px solid var(--color-primary-light,#EBEBEB);
  border-radius:14px;margin:10px 0;overflow:hidden;background:#fff;
}
.rl-acc>summary{
  list-style:none;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 16px;font-weight:700;font-size:15px;
  color:var(--color-primary-dark,#334746);
}
.rl-acc>summary::-webkit-details-marker{display:none}
.rl-acc .rl-sign{
  flex:0 0 auto;width:26px;height:26px;border-radius:50%;
  background:var(--color-primary,#334746);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;line-height:1;transition:transform .25s ease;
}
.rl-acc[open] .rl-sign{transform:rotate(45deg)}
.rl-acc .rl-body{
  padding:0 16px 16px;color:#516260;font-size:14px;line-height:1.9;
}
.rl-acc .rl-body ul{margin:0;padding-inline-start:18px}
.rl-acc .rl-body li{margin-bottom:6px}


/* ============================================================
   أرض الورد — بقايا البينك · RL-2026-08 · ربحني ماركتنج إيجنسي
   ألوان بس — مفيش قاعدة ليّاوت ولا إخفاء
   ============================================================ */

:root{
  --rl-deep-teal:  #334746;
  --rl-soft-teal:  #516260;
  --rl-grey-sage:  #798581;
  --rl-soft-grey:  #EBEBEB;
  --rl-soft-white: #F7F7F7;
  --rl-surface:    #FFFFFF;
  --rl-text:       #2F302F;
  --rl-sale:       #9E2B1B;
  --rl-success:    #256B45;
  --rl-star:       #C0964A;
}

/* 1 · خلفية الصفحة: كريمي دافي #faf7f2 → الأبيض السائد */
body{ background:#F7F7F7 !important; }

/* 2 · زرار «أضف إلى السلة» — 16 موضع */
button.s-button-element.s-button-btn.s-button-outline.s-button-wide.s-button-primary-outline.s-button-loader-center{
  background:var(--color-primary) !important;
  color:var(--color-primary-reverse,#fff) !important;
}

/* 3 · الخط تحت عناوين الأقسام — 5 مواضع */
.s-block__title h2,
.s-slider-block__title-right h2{
  border-bottom-color:var(--color-primary) !important;
  color:#2F302F !important;
}

/* 4 · أسهم السلايدرات — 8 مواضع */
.s-slider-nav-arrow{ background:var(--color-primary) !important; }

/* 5 · الفوتر: برّه أغمق لون في البالت · جوّه لون الهوية */
footer.store-footer{ background:#2F302F !important; }
.store-footer__inner{ background-color:var(--color-primary) !important; }

/* 6 · نص الأكورديون: رمادي وردي #6b5555 → Soft Teal */
.rl-acc .rl-body{ color:#516260 !important; }

/* زرار «عرض الكل» */
a.s-slider-block__display-all{
  background:var(--color-primary) !important;
  color:var(--color-primary-reverse,#fff) !important;
}

/* أرض الورد — ترتيب صفحة المنتج */
.main-content:has(form.product-form){ display:flex; flex-direction:column }
.main-content:has(form.product-form) > div.flex.whitespace-nowrap{ order:1; margin-bottom:2px }
.main-content:has(form.product-form) > h1{ order:2 }
.main-content:has(form.product-form) > h2.product-entry__sub-title{ order:3 }
.main-content:has(form.product-form) > form.product-form{ order:4 }
.main-content:has(form.product-form) > .product__description{ order:5; margin-top:18px }
.main-content:has(form.product-form) > salla-installment{ order:6 }
.main-content:has(form.product-form) > div.flex[class*="space-x-reverse"]{ order:7 }
form.product-form > section.flex.bg-white.p-5{ display:none !important }
.rl-trust{
  display:flex; flex-direction:column; gap:9px;
  background:#fff; border:1px solid #EBEBEB;
  border-radius:8px; padding:14px 16px; margin-top:10px;
  font-size:13.5px; color:#516260;
}
.rl-trust span{ display:flex; align-items:center; gap:9px }
.rl-trust span::before{
  content:""; flex:none; width:7px; height:7px; border-radius:50%;
  background:#334746;
}

/* ============================================================
   أرض الورد — نافذة الإضافات · RL-2026-08
   ============================================================ */
#rl-addons{ position:fixed; inset:0; z-index:99999; direction:rtl }
.rl-ad__veil{ position:absolute; inset:0; background:rgba(47,48,47,.55); animation:rlFade .18s ease }
.rl-ad__box{
  position:absolute; inset-inline:0; bottom:0; max-width:520px; margin:0 auto;
  background:var(--rl-soft-white,#F7F7F7); border-radius:18px 18px 0 0;
  padding:22px 20px 20px; max-height:88vh; overflow-y:auto;
  box-shadow:0 -8px 40px rgba(47,48,47,.22); animation:rlUp .22s ease;
}
@media (min-width:640px){
  .rl-ad__box{ top:50%; bottom:auto; transform:translateY(-50%); border-radius:16px; animation:rlFade .2s ease }
}
.rl-ad__x{
  position:absolute; inset-inline-start:14px; top:12px; width:32px; height:32px;
  border:0; border-radius:50%; background:var(--rl-soft-grey,#EBEBEB);
  color:var(--rl-text,#2F302F); font-size:20px; line-height:1; cursor:pointer;
}
.rl-ad__ttl{ margin:0 0 4px; font-size:18px; font-weight:700; color:var(--color-primary,#334746) }
.rl-ad__sub{ margin:0 0 14px; font-size:14px; color:var(--rl-soft-teal,#516260) }
.rl-ad__sub b{ color:var(--rl-text,#2F302F) }
.rl-ad__ship{
  background:var(--rl-surface,#fff); border:1px solid var(--rl-soft-grey,#EBEBEB);
  border-radius:10px; padding:12px 14px; margin-bottom:16px;
  font-size:13.5px; color:var(--rl-soft-teal,#516260);
}
.rl-ad__ship b{ color:var(--color-primary,#334746) }
.rl-ad__track{
  display:block; height:6px; margin-top:9px; border-radius:99px;
  background:var(--rl-soft-grey,#EBEBEB); overflow:hidden;
}
.rl-ad__track i{ display:block; height:100%; border-radius:99px; background:var(--color-primary,#334746); transition:width .4s ease }
.rl-ad__h{ margin:0 0 12px; font-size:15px; font-weight:600; color:var(--rl-text,#2F302F) }
.rl-ad__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-bottom:18px }
.rl-ad__card{
  background:var(--rl-surface,#fff); border:1px solid var(--rl-soft-grey,#EBEBEB);
  border-radius:10px; padding:14px 13px; display:flex; flex-direction:column; gap:6px;
}
.rl-ad__name{ margin:0; font-size:13.5px; font-weight:600; line-height:1.5; color:var(--rl-text,#2F302F) }
.rl-ad__price{ margin:0 0 4px; font-size:15px; font-weight:700; color:var(--color-primary,#334746) }
.rl-ad__add{
  margin-top:auto; border:1px solid var(--color-primary,#334746); background:transparent;
  color:var(--color-primary,#334746); border-radius:8px; padding:8px 10px;
  font:inherit; font-size:13px; font-weight:600; cursor:pointer;
  transition:background .18s, color .18s;
}
.rl-ad__add:hover:not(:disabled){ background:var(--color-primary,#334746); color:var(--rl-soft-white,#F7F7F7) }
.rl-ad__add:disabled{ cursor:default; opacity:.75 }
.rl-ad__add--done{ background:var(--rl-success,#256B45); border-color:var(--rl-success,#256B45); color:#fff }
.rl-ad__foot{ display:grid; grid-template-columns:1fr 1fr; gap:10px }
.rl-ad__ghost,.rl-ad__cta{
  border-radius:9px; padding:13px 14px; font:inherit; font-size:14.5px; font-weight:600;
  text-align:center; cursor:pointer; text-decoration:none;
}
.rl-ad__ghost{ border:1px solid var(--rl-soft-grey,#EBEBEB); background:transparent; color:var(--rl-soft-teal,#516260) }
.rl-ad__cta{
  border:0; background:var(--color-primary,#334746); color:var(--color-primary-reverse,#F7F7F7);
  display:flex; align-items:center; justify-content:center;
}
@keyframes rlFade{ from{opacity:0} to{opacity:1} }
@keyframes rlUp{ from{transform:translateY(14px); opacity:0} to{transform:translateY(0); opacity:1} }
@media (prefers-reduced-motion:reduce){
  .rl-ad__veil,.rl-ad__box{ animation:none }
  .rl-ad__track i{ transition:none }
}

/* ============================================================
   أرض الورد — التوصيل من صفحة المنتج للسلة · RL-2026-08
   ============================================================ */

/* صفحة المنتج: صفر أسئلة. الجافاسكريبت بيحدّد مكة أوتوماتيك
   عشان الإضافة للسلة تنجح والتوصيل ما يضيعش. */
.main-content:has(form.product-form) .s-product-options-option-container{ display:none !important }
.main-content:has(form.product-form) .s-product-options-wrapper{ display:none !important }

/* السلة: اختيار طريقة التوصيل — بند واحد على الطلب */
.rl-deliv{
  background:var(--rl-surface,#fff);
  border:1px solid var(--rl-soft-grey,#EBEBEB);
  border-inline-start:4px solid var(--color-primary,#334746);
  border-radius:10px; padding:14px 16px; margin:0 0 14px;
}
.rl-deliv__ttl{ margin:0 0 3px; font-size:15px; font-weight:700; color:var(--color-primary,#334746) }
.rl-deliv__hint{ margin:0 0 12px; font-size:12.5px; color:var(--rl-grey-sage,#798581) }
.rl-deliv__opts{ display:grid; gap:8px }
.rl-deliv__opt{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  width:100%; text-align:start; cursor:pointer;
  background:var(--rl-soft-white,#F7F7F7);
  border:1.5px solid var(--rl-soft-grey,#EBEBEB); border-radius:9px;
  padding:11px 14px; font:inherit;
  transition:border-color .16s, background .16s;
}
.rl-deliv__opt:hover:not(:disabled){ border-color:var(--rl-soft-teal,#516260) }
.rl-deliv__opt:disabled{ opacity:.6; cursor:default }
.rl-deliv__opt--on{
  border-color:var(--color-primary,#334746);
  background:var(--color-primary,#334746);
}
.rl-deliv__opt--on .rl-deliv__l{ color:var(--rl-soft-white,#F7F7F7) }
.rl-deliv__opt--on .rl-deliv__l i{ color:rgba(247,247,247,.78) }
.rl-deliv__opt--on .rl-deliv__p{ color:var(--rl-soft-white,#F7F7F7) }
.rl-deliv__l{ display:flex; flex-direction:column; gap:2px; font-size:14px; font-weight:600; color:var(--rl-text,#2F302F) }
.rl-deliv__l i{ font-style:normal; font-size:12px; font-weight:400; color:var(--rl-grey-sage,#798581) }
.rl-deliv__p{ font-size:14.5px; font-weight:700; color:var(--color-primary,#334746); white-space:nowrap }

/* زرار إتمام الطلب وهو مقفول */
.rl-blocked{ opacity:.55; cursor:not-allowed }

/* نافذة الإضافات v2 — الكمية وعبارة الكرت */
.rl-ad__qty{
  display:flex; align-items:center; justify-content:space-between;
  border:1px solid var(--rl-soft-grey,#EBEBEB); border-radius:8px;
  background:var(--rl-soft-white,#F7F7F7); padding:3px; margin-bottom:2px;
}
.rl-ad__q{
  width:28px; height:28px; border:0; border-radius:6px; cursor:pointer;
  background:transparent; color:var(--color-primary,#334746);
  font:inherit; font-size:17px; font-weight:700; line-height:1;
}
.rl-ad__q:hover{ background:var(--rl-soft-grey,#EBEBEB) }
.rl-ad__n{
  min-width:26px; text-align:center; font-size:14.5px; font-weight:700;
  color:var(--rl-text,#2F302F); font-variant-numeric:tabular-nums;
}

.rl-ad__gift{
  background:var(--rl-surface,#fff); border:1px solid var(--rl-soft-grey,#EBEBEB);
  border-radius:10px; padding:13px 14px; margin-bottom:16px;
}
.rl-ad__giftl{
  display:block; margin-bottom:7px; font-size:14px; font-weight:600;
  color:var(--rl-text,#2F302F);
}
.rl-ad__giftl b{ color:var(--rl-success,#256B45); font-weight:700 }
.rl-ad__gifti{
  width:100%; box-sizing:border-box; resize:vertical;
  border:1px solid var(--rl-soft-grey,#EBEBEB); border-radius:8px;
  padding:9px 11px; font:inherit; font-size:14px; color:var(--rl-text,#2F302F);
  background:var(--rl-soft-white,#F7F7F7);
}
.rl-ad__gifti:focus{ outline:2px solid var(--color-primary,#334746); outline-offset:1px }
.rl-ad__gifts{
  margin-top:8px; width:100%; border:1px solid var(--color-primary,#334746);
  background:transparent; color:var(--color-primary,#334746);
  border-radius:8px; padding:9px 12px; font:inherit; font-size:13.5px; font-weight:600; cursor:pointer;
}
.rl-ad__gifts:hover:not(:disabled){ background:var(--color-primary,#334746); color:var(--rl-soft-white,#F7F7F7) }
.rl-ad__gifts:disabled{ cursor:default; opacity:.8 }
.rl-ad__gifts--done{
  background:var(--rl-success,#256B45); border-color:var(--rl-success,#256B45); color:#fff;
}

/* أيقونة الإضافة — بديل مؤقت مقصود لحد ما الصور تترفع */
.rl-ad__ic{
  display:grid; place-items:center;
  width:100%; aspect-ratio:16/9; margin-bottom:8px;
  border-radius:8px;
  background:var(--rl-soft-white,#F7F7F7);
  border:1px solid var(--rl-soft-grey,#EBEBEB);
  color:var(--color-primary,#334746);
}
.rl-ad__ic svg{ width:34px; height:34px; display:block }
.rl-ad__card img{ width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:8px; margin-bottom:8px; display:block }
/* ============================================================
   أرض الورد — اسم المتجر نص بدل صورة اللوجو في الهيدر · ١٣ سبتمبر ٢٠٢٦
   الخط: IBM Plex Sans Arabic (بديل مجاني لـ Fedra Sans Arabic بتاع فلاورد — مدفوع). بيتحمّل من Google Fonts في الـ JS.
   طلب التاجر («كبير زي فلاورد»: 40 ديسكتوب · 28 موبايل، اتقاس من غير تداخل). الـ h1 المخفي «أرض الورد» موجود في الرئيسية بس، فبنكتب
   الاسم بـ ::after عشان يظهر في كل الصفحات. الصورة بتتخفي من غير ما تتشال.
   ============================================================ */
.store-header .navbar-brand img{ display:none !important }
.store-header .navbar-brand::after{
  content:"أرض الورد"; display:block; white-space:nowrap;
  font-family:"IBM Plex Sans Arabic", var(--font-main, sans-serif);
  font-size:40px; font-weight:700; line-height:1.1; letter-spacing:.5px;
  color:var(--color-primary,#334746);
}
@media (max-width:768px){
  .store-header .navbar-brand::after{ font-size:28px }
}

/* ============================================================
   أرض الورد — هيدر على طريقة فلاورد · ١٣ سبتمبر ٢٠٢٦
   طلب التاجر: الاسم في نص الهيدر + شريط مميزات فوقه (زي فلاورد).
   اتقاس في متصفح معزول قبل النشر:
   - ديسكتوب 1512: الشريط 34 · الاسم في النص بالظبط (756) · روابط الأقسام صف واحد تحته
     في النص · أيقونات الحساب والسلة ما بتلمسش الاسم · الهيدر 185 والمحتوى بيبدأ بعده.
   - موبايل 390: الشريط 30 بنص أقصر · الاسم في النص بالظبط · 24px (عند 28px كان بيلمس
     أيقونة الحساب بـ ١px) · أقرب أيقونة 7px · مفيش overflow.
   ليه main-nav-container height:auto: الثيم مثبّت ارتفاعه 84 وموسّط اللي جوّاه، فالصفين
   كانوا بيطلعوا لفوق ويغطّوا الشريط.
   ============================================================ */
.store-header::before{
  /* v16 (١٥ سبتمبر): «بدون عنوان — ناخذ الموقع من المستلم» اتشالت — العميل بقى بيحدد عنوانه
     في صفحة الدفع (شحن سلّة الحقيقي). جدة في نفس اليوم (تأكيد عمر). */
  content:"توصيل خلال ساعتين داخل مكة   ·   توصيل جدة في نفس اليوم";
  display:block; white-space:pre; overflow:hidden; text-align:center;
  background:var(--color-primary,#334746); color:#fff;
  font-size:13px; font-weight:500; line-height:34px; padding:0 12px;
}
@media (min-width:1024px){
  .store-header .main-nav-container{ height:auto !important; min-height:0 !important; align-items:stretch }
  .store-header .main-nav-container > .inner{ height:auto !important }
  .store-header .main-nav-container .container > .flex.items-stretch.justify-between.relative{ flex-wrap:wrap; height:auto !important }
  .store-header .main-nav-container .container > .flex.items-stretch.justify-between.relative > .flex.items-center:first-child{ flex-basis:100%; flex-wrap:wrap }
  .store-header .main-nav-container .navbar-brand{ order:1; margin:12px auto 10px }
  .store-header .main-nav-container custom-main-menu{ order:2; flex-basis:100%; display:flex; justify-content:center; border-top:1px solid #EFEFEF }
  .store-header .main-nav-container .container > .flex.items-stretch.justify-between.relative > .flex.items-center:last-child{ position:absolute; top:16px; left:0 }
}
@media (max-width:768px){
  .store-header::before{
    content:"توصيل خلال ساعتين داخل مكة   ·   نفس اليوم لجدة"; /* v21: المجاني فوق 300 وقف ١٩ سبتمبر */
    font-size:12px; line-height:30px; padding:0 10px;
  }
  .store-header a.navbar-brand{ left:50% !important }
  .store-header .navbar-brand::after{ font-size:24px !important }
}

/* ============================================================
   أرض الورد — هوية البراند لجزء التوصيل في السلة · ١٣ سبتمبر ٢٠٢٦
   على كل جزء التوصيل: «التوصيل إلى» + بيانات العميل (رقم الجوال وعبارة الكرت) + التاريخ والأيام.
   الألوان من البالت الرسمية بس (brand/HANDOFF-palette.md):
   تيل #334746 (زراير وروابط) · أبيض #FFFFFF (كروت) · #F7F7F7 (أرضية) · #EBEBEB (حدود)
   · نص #2F302F · نص ثانوي #516260 · بليسهولدر #798581 · نجاح #256B45.
   ليه مفيش وردي: البينك #C68A8A اتشال من الهوية في ٦ سبتمبر — التاجر أكّد إنه مش لون البراند.
   ليه الألوان هنا مش جوّه الـ JS: الـ inline بيغلب أي CSS؛ الـ JS بيحط كلاسات بس (rl-day--on وغيره).
   الـ !important على الخانات بس: سلّة بتلوّن input/textarea بكلاسات Tailwind.
   ============================================================ */

/* ── الكارت: «التوصيل إلى» ── */
.rl-deliv{
  background:#FFFFFF !important;
  border:1px solid #EBEBEB !important;
  border-inline-start:4px solid var(--color-primary,#334746) !important;
  border-radius:14px !important;
  padding:16px 18px !important;
  margin:0 0 14px !important;
}
.rl-deliv__ttl{ display:block !important; margin:0 0 4px !important; font-size:15.5px !important; font-weight:700 !important; color:var(--color-primary,#334746) !important }
.rl-deliv__hint{ margin:0 0 12px !important; font-size:13px !important; color:#516260 !important }

/* شريط التوصيل المجاني */
.rl-deliv__free{ margin:0 0 12px; font-size:13px; color:#2F302F }
.rl-deliv__free b{ color:var(--color-primary,#334746) }
.rl-deliv__track{ display:block; height:6px; margin-top:8px; border-radius:999px; background:#EBEBEB; overflow:hidden }
.rl-deliv__track i{ display:block; height:100%; border-radius:999px; background:var(--color-primary,#334746); transition:width .4s ease }
.rl-deliv__free--ok .rl-deliv__track i{ background:#256B45 }

/* القايمة + السهم */
.rl-deliv__field{ position:relative }
.rl-deliv__sel{
  width:100%; min-height:50px; box-sizing:border-box;
  padding:12px 16px 12px 44px;
  border:1px solid #EBEBEB; border-radius:12px;
  background:#F7F7F7; color:#2F302F;
  font:inherit; font-size:15px; font-weight:600; cursor:pointer;
  -webkit-appearance:none; -moz-appearance:none; appearance:none;
  transition:border-color .15s, box-shadow .15s;
}
.rl-deliv__arrow{
  position:absolute; left:16px; top:50%; transform:translateY(-50%);
  pointer-events:none; display:flex; color:var(--color-primary,#334746);
}

/* ── بيانات العميل (رقم الجوال + عبارة الكرت) اللي اتنقلت تحت «التوصيل إلى» ── */
.rl-recip{
  background:#FFFFFF !important;
  border:1px solid #EBEBEB !important;
  border-radius:14px !important;
  padding:6px 18px 14px !important;
  margin:0 0 14px !important;
}
.rl-recip .s-product-options-option-label,
.rl-recip .s-product-options-option-label b{ color:var(--color-primary,#334746) !important; font-size:14.5px !important; font-weight:700 !important }
.rl-recip .s-product-options-option-label small,
.rl-recip .s-product-options-option-label p{ color:#516260 !important; font-size:12.5px !important }

/* ── التاريخ ── */
.rl-date-box .s-product-options-option-label,
.rl-date-box .s-product-options-option-label b{ color:var(--color-primary,#334746) !important; font-size:14.5px !important; font-weight:700 !important }

/* ── الخانات كلها بنفس الشكل: القايمة · الجوال · العبارة · التاريخ ── */
.rl-recip input[name^="options["],
.rl-recip textarea[name^="options["],
.rl-date-box input.flatpickr-input{
  min-height:48px !important; box-sizing:border-box !important;
  padding:11px 14px !important;
  border:1px solid #EBEBEB !important; border-radius:12px !important;
  background:#F7F7F7 !important; color:#2F302F !important;
  font-family:inherit !important; font-size:15px !important;
  transition:border-color .15s, box-shadow .15s, background-color .15s;
}
.rl-recip textarea[name^="options["]{ line-height:1.6 !important }
.rl-recip input[name^="options["]::placeholder,
.rl-recip textarea[name^="options["]::placeholder,
.rl-date-box input.flatpickr-input::placeholder{ color:#798581 !important }

/* حلقة التركيز بلون الهوية على كل الخانات */
.rl-deliv__sel:focus,
.rl-recip input[name^="options["]:focus,
.rl-recip textarea[name^="options["]:focus,
.rl-date-box input.flatpickr-input:focus{
  outline:none !important;
  background:#FFFFFF !important;
  border-color:var(--color-primary,#334746) !important;
  box-shadow:0 0 0 3px rgba(51,71,70,.15) !important;
}

/* ── أزرار الأيام: كبسولة ── */
.rl-days{
  display:flex; gap:8px; overflow-x:auto;
  padding:10px 2px 4px; scrollbar-width:none; -webkit-overflow-scrolling:touch;
}
.rl-days::-webkit-scrollbar{ display:none }
.rl-day{
  flex:0 0 auto; min-width:78px;
  padding:8px 14px; border-radius:999px;
  border:1px solid #EBEBEB; background:#FFFFFF;
  color:#2F302F;
  font:inherit; line-height:1.3; text-align:center; cursor:pointer;
  transition:background .15s, color .15s, border-color .15s, transform .1s;
}
.rl-day__name{ display:block; font-size:13.5px; font-weight:700 }
.rl-day__date{ display:block; font-size:12px; color:#516260 }
.rl-day:hover:not(:disabled){ border-color:var(--color-primary,#334746); background:#F7F7F7 }
.rl-day:active:not(:disabled){ transform:scale(.97) }
.rl-day--on,
.rl-day--on:hover:not(:disabled){
  background:var(--color-primary,#334746); border-color:var(--color-primary,#334746); color:#fff;
}
.rl-day--on .rl-day__date{ color:rgba(255,255,255,.82) }
.rl-day:disabled{ opacity:.45; cursor:not-allowed }
.rl-day:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(51,71,70,.25) }

@media (max-width:768px){
  .rl-deliv, .rl-recip{ padding-inline:14px !important }
  .rl-day{ min-width:72px; padding:8px 12px }
}
@media (prefers-reduced-motion:reduce){
  .rl-day, .rl-deliv__sel, .rl-deliv__track i{ transition:none }
}

/* ============================================================
   أرض الورد — قسم «تفاصيل الطلب» في السلة (v15) · ١٣ سبتمبر ٢٠٢٦
   التاجر: «مش مرتب» — بيانات الطلب كانت جوّه كارت أول منتج. الرسمة المتفق عليها:
   المنتجات ← كارت واحد «تفاصيل الطلب» ← الملخص. جوّاه ① التوصيل إلى ② التاريخ ③ الجوال ④ العبارة.
   الأرقام CSS counter بترتيب الـ DOM (الـ JS هو اللي بيرتّب)، والحقل المخفي مابياخدش رقم.
   كروت v14 (.rl-deliv / .rl-recip) جوّه القسم بتتفرد من غير إطار عشان يبقى كارت واحد.
   ألوان البالت بس (brand/HANDOFF-palette.md).
   ============================================================ */
.rl-checkout{
  counter-reset:rlstep;
  background:#FFFFFF; border:1px solid #EBEBEB; border-radius:14px;
  padding:18px 20px 6px; margin:0 0 20px;
}
.rl-checkout__ttl{
  margin:0 0 16px; padding:0 0 12px; border-bottom:1px solid #EBEBEB;
  font-size:17px; font-weight:700; line-height:1.4; color:#2F302F;
}
.rl-checkout .rl-deliv,
.rl-checkout .rl-recip{
  background:transparent !important; border:0 !important; border-radius:0 !important;
  padding:0 !important; margin:0 0 18px !important;
}
.rl-checkout .rl-recip > form:first-child{ padding-top:0 !important }
.rl-checkout .rl-deliv__ttl{ font-size:14.5px !important }
.rl-checkout .rl-odate{ margin:0 0 18px }
.rl-odate__ttl{ display:block; margin:0 0 4px; font-size:14.5px; font-weight:700; color:var(--color-primary,#334746) }
.rl-odate__hint{ margin:0 0 8px; font-size:12.5px; color:#516260 }
.rl-odate__in{ width:100%; cursor:pointer }

/* الأرقام: دايرة تيل قبل عنوان كل خطوة */
.rl-checkout .rl-deliv__ttl::before,
.rl-checkout .rl-odate__ttl::before,
.rl-checkout .rl-recip > form .s-product-options-option-label > b:first-child::before{
  counter-increment:rlstep; content:counter(rlstep, arabic-indic);
  display:inline-flex; align-items:center; justify-content:center;
  width:22px; height:22px; margin-inline-end:8px; border-radius:50%;
  background:var(--color-primary,#334746); color:#FFFFFF;
  font-size:12.5px; font-weight:700; line-height:1; vertical-align:1px;
}

@media (max-width:768px){
  .rl-checkout{ padding:16px 14px 4px }
  .rl-checkout .rl-deliv, .rl-checkout .rl-recip{ padding-inline:0 !important }
}
/* v15: salla-product-options جوّه خيارات الطلب عليه padding 20px من الثيم — كان بيخلي خانات الجوال والعبارة أضيق من قايمة «التوصيل إلى» (اتقاس موبايل 390: 45..345 مقابل 25..365). */
.rl-checkout .rl-recip salla-product-options.s-product-options-wrapper{ padding-inline:0 !important }

/* ============================================================
   أرض الورد — تثبيت الصفحة الرئيسية وقت التحميل (CLS) · ١٨ سبتمبر ٢٠٢٦
   الشكوى (عمر): «الصور بتنزل وتطلع مكانها كأنها بتعمل ريلود».
   اتقاس على كاش بارد: موبايل 390 → CLS 0.64 (جوجل: فوق 0.25 = سيئ).
   السبب من ثيم سلّة نفسه مش من كودنا (الـ CSS ده مكانش فيه ولا قاعدة للسلايدرز):
   ١) صور البانرات عليها width=1200 height=300 (٤:١) والصور الحقيقية ١:٢ على الموبايل
      و1440×575 على الديسكتوب — فالمتصفح بيحجز 97px والصورة تتمد لـ 700.
   ٢) بين تشغيل salla-slider وبداية Swiper الشرايح الست بتترص تحت بعض (القسم وصل 4680px)
      وبعدين تتلم لـ 740 — ده «بتنزل وترجع مكانها».
   ٣) شريط الإعلانات و«هدايا لكل لحظة» بندلات بتترسم متأخر من 0 وتزق اللي تحتها.
   ⚠️ نسب الصور تحت متقاسة من البانرات الحالية — لو اتغيرت مقاساتها لازم تتحدث
   (الصورة مش هتبوظ، بس هيبقى حواليها فراغ لإن object-contain).
   ============================================================ */

/* ٢) شريحة واحدة بس لحد ما Swiper يشتغل — قبل التشغيل وبعده لحد swiper-initialized */
salla-slider.photos-slider:not(.hydrated) .swiper-slide:not(:first-child),
salla-slider.photos-slider .swiper:not(.swiper-initialized) .swiper-slide:not(:first-child){ display:none !important }

/* ١) نسبة الصورة الحقيقية بدل ٤:١ اللي سلّة كاتباها في الـ HTML */
#photos-1-slider .swiper-slide img{ aspect-ratio:1440/575; height:auto }
#photos-2-slider .swiper-slide img{ aspect-ratio:1/2; height:auto }

/* ٣) حجز مكان البندلات. المحدد من غير اللاحقة العشوائية (-23owva) لإنها بتتغير.
      الشريط: حجز دايم — اتقاس إن :not(:defined) بيفك الحجز فريم بدري والمكوّن بيترسم
      لحظة بـ 23px قبل ما يكمل (48 → 23 → 48) فالبانر بينط 26px. الشريط سطر واحد
      ارتفاعه ثابت، فالحجز الدايم مابيعملش فراغ.
      «هدايا لكل لحظة»: بالبوابة بس — ارتفاعه بيتغير مع العرض، وحجز دايم كان هيسيب
      فراغ على الموبايلات الأصغر؛ وعلى الموبايل هو تحت الشاشة أصلًا. */
section.s-block--bundle-announcement-ticker > *{ display:block; min-height:60px }
section.s-block--bundle-gifts-moments > :not(:defined){ display:block; min-height:274px }
@media (max-width:768px){
  section.s-block--bundle-announcement-ticker > *{ min-height:48px }
  section.s-block--bundle-gifts-moments > :not(:defined){ min-height:222px }
}

/* ============================================================
   أرض الورد — صفوف صندوق «التوصيل أو الاستلام» في السلة عرض بس · ١٨ سبتمبر ٢٠٢٦
   عمر (سكرين): «الأزرار دي ميتة». الصفوف كانت واخدة شكل .rl-deliv__opt بتاع v15
   (إطار مدوّر + خلفية + cursor:pointer + hover) — ده كان زرار اختيار حقيقي وقتها،
   لكن من v16 الاختيار بقى في صفحة الدفع حسب العنوان، فالصف بقى عرض أسعار بس.
   هنا بنخليها قايمة أسعار: مفيش إطار ولا خلفية ولا إيد، وخط رفيع بين الصفوف.
   [data-rl-info] بيحصرها في صندوق العرض بس، مش أي .rl-deliv تاني.
   ============================================================ */
.rl-deliv[data-rl-info] .rl-deliv__opts{ gap:0 }
.rl-deliv[data-rl-info] .rl-deliv__opt{
  cursor:default; pointer-events:none;
  background:transparent; border:0; border-bottom:1px solid #EBEBEB; border-radius:0;
  padding:10px 2px;
}
.rl-deliv[data-rl-info] .rl-deliv__opt:last-child{ border-bottom:0; padding-bottom:0 }

/* ============================================================
   أرض الورد — شيل صفوف الأسعار من صندوق «التوصيل أو الاستلام» · ١٨ سبتمبر ٢٠٢٦
   عمر: «شيله خالص» — صفوف مكة/جدة/استلام بأسعارها. حتى بعد ما بقت قايمة (v18)
   العميل كان بيفهمها اختيار، والاختيار الحقيقي في صفحة الدفع حسب العنوان.
   بنخفيها بـ CSS بدل ما نلمس buildInfoBlock في الـ JS — الـ JS بتتعدّل من جلسة تانية.
   بيفضل: العنوان + جملة «تختار في صفحة الدفع…» + شريط التوصيل المجاني.
   ============================================================ */
.rl-deliv[data-rl-info] .rl-deliv__opts{ display:none !important }
/* ============================================================
   أرض الورد — صفحة المنتج ما بقتش «تتنطط» وقت التحميل · ١٨ سبتمبر ٢٠٢٦
   القياس (موبايل 390، Fast 4G، CPU ×4، متصفح نضيف): CLS بيلادور ~0.40 ·
   دوار الشمس 0.21–0.89 · مسكة عروسة 0.82. الحد المقبول من جوجل 0.1.
   الأسباب كلها من ثيم سلّة:
   1. قبل ما salla-slider يشتغل كل صور المنتج بتترص تحت بعض (2480px)
      وبعدين بتتلم — اسم المنتج والسعر وزرار السلة بيطلعوا من تحت لفوق.
   2. الصورة الأولى من غير width/height، والمعرض auto-height: ارتفاعه بيتغير
      لما الصورة تحمّل وتاني وهو بيتشغل (368 → 302 → 368).
   3. مسار التنقل (salla-breadcrumb) بيترسم متأخر فبيزق الصفحة 20px.
   ليه إطار ثابت مش «نسيب كل صورة بمقاسها»: جربناها (v1) ونزلت CLS للنص بس —
   الارتفاع مش معروف غير بعد ما الصورة تحمّل، فالقفزة بتفضل.
   ليه 1:1: صور المنتجات 20 مربعة (منهم بيلادور الأكثر مبيعًا) و 25 أطول
   (1.24 → 1.78). المربع بيسيب المربعة زي ما هي بالبكسل؛ والطويلة بتتعرض كاملة
   (contain، مفيش قص للباقة) في النص — وده كمان بيرجّع الاسم والسعر لأول الشاشة
   بعد ما صورة 1.78 كانت واخدة الشاشة كلها (657px). جربنا 4:5 وسابت شريط أبيض
   فوق وتحت المربعة ونزّلت السعر تحت الشاشة.
   ⚠️ لو اتغيرت مقاسات صور المنتجات كلها، راجع النسبة هنا.
   ============================================================ */

/* ١) المعرض الكبير: إطار 1:1 ثابت قبل وبعد التشغيل. */
.container--product-details salla-slider.details-slider:not(.hydrated) [slot="items"] > a:not(:first-child){ display:none }
.container--product-details salla-slider.details-slider:not(.hydrated) [slot="items"] > a:first-child,
.container--product-details salla-slider.details-slider .s-slider-container{
  display:block; aspect-ratio:1/1; height:auto !important; background:#FFFFFF; overflow:hidden;
  contain:size; /* زرار المفضلة جوّه الإطار كان بيكبّره 25px لحظة التشغيل — الإطار ياخد مقاسه من النسبة بس */
}
.container--product-details salla-slider.details-slider .s-slider-container:not(.swiper-initialized) .swiper-slide:not(:first-child){ display:none }
.container--product-details salla-slider.details-slider .s-slider-container .swiper-wrapper,
.container--product-details salla-slider.details-slider .s-slider-container .swiper-slide{ height:100% !important }
.container--product-details salla-slider.details-slider [slot="items"] > a:first-child img,
.container--product-details salla-slider.details-slider .s-slider-container .swiper-slide img{
  display:block; width:100%; height:100%; object-fit:contain;
}

/* لحظة التشغيل، CSS السلايدر العام في الثيم (بتاع سلايدرز الرئيسية) بيدّي الأجزاء
   margin -10px و padding 48px/5px لفريم واحد: الإطار بيبقى 390 بدل 370 (طوله 488
   بدل 463) والصورة تتزق يمين — شكلها النهائي في صفحة المنتج 0 في الاتنين. */
.container--product-details salla-slider.details-slider > .s-slider-block__title,
.container--product-details salla-slider.details-slider > .s-slider-container,
.container--product-details salla-slider.details-slider > .s-slider-thumbs{
  margin-left:0 !important; margin-right:0 !important; padding-left:0 !important; padding-right:0 !important;
}
.container--product-details salla-slider.details-slider > .s-slider-container > .swiper-wrapper{ padding-left:0 !important; padding-right:0 !important }

/* ٢) الصور المصغرة: صف واحد، كل صورة مربعة ومقصوصة (cover) زي ما الثيم عاملها.
      النسبة على الصورة نفسها مش الشريحة: الشرايح جوّه flex بيمطّها (stretch)
      فكان بيلغي aspect-ratio ويرجع لمقاس الصورة الطبيعي (279 → 134 → 94). */
.container--product-details salla-slider.details-slider:not(.hydrated) [slot="thumbs"],
.container--product-details salla-slider.details-slider .s-slider-thumbs-container:not(.swiper-initialized) .swiper-wrapper{
  display:flex; gap:10px; overflow:hidden; align-items:flex-start;
}
.container--product-details salla-slider.details-slider:not(.hydrated) [slot="thumbs"]{ margin-top:16px }
.container--product-details salla-slider.details-slider:not(.hydrated) [slot="thumbs"] > *,
.container--product-details salla-slider.details-slider .s-slider-thumbs-container:not(.swiper-initialized) .swiper-wrapper > *{ flex:0 0 calc((100cqw - 68px) / 4) }
@media (min-width:768px){
  .container--product-details salla-slider.details-slider:not(.hydrated) [slot="thumbs"] > *,
  .container--product-details salla-slider.details-slider .s-slider-thumbs-container:not(.swiper-initialized) .swiper-wrapper > *{ flex-basis:calc((100cqw - 86px) / 4) }
}
@media (min-width:1024px){
  .container--product-details salla-slider.details-slider:not(.hydrated) [slot="thumbs"] > *,
  .container--product-details salla-slider.details-slider .s-slider-thumbs-container:not(.swiper-initialized) .swiper-wrapper > *{ flex-basis:calc((100cqw - 38px) / 4) }
}
.container--product-details salla-slider.details-slider [slot="thumbs"] > *,
.container--product-details salla-slider.details-slider .s-slider-thumbs .swiper-wrapper > *{ height:auto !important; align-self:flex-start }
.container--product-details salla-slider.details-slider [slot="thumbs"] img,
.container--product-details salla-slider.details-slider .s-slider-thumbs img{
  display:block; width:100%; height:auto !important; aspect-ratio:1/1; object-fit:cover;
}

/* ارتفاع صف المصغرات مقفول على عرض المعرض نفسه (cqw = 1% من عرض salla-slider):
   لحظة التشغيل Swiper بيحسب عرض الشرايح متأخر فالصف كان بيتهز 94 → 32 → 85 → 94.
   المصغرة مربعة، وعرضها اتقاس على 7 مقاسات = (عرض المعرض − ثابت) ÷ 4:
   68px للموبايل (360→600) · 86px من 768 · 38px من 1024 (502 و 630). */
.container--product-details salla-slider.details-slider{ container-type:inline-size }
.container--product-details salla-slider.details-slider > .s-slider-thumbs,
.container--product-details salla-slider.details-slider:not(.hydrated) [slot="thumbs"]{
  height:calc((100cqw - 68px) / 4) !important; overflow:hidden;
}
@media (min-width:768px){
  .container--product-details salla-slider.details-slider > .s-slider-thumbs,
  .container--product-details salla-slider.details-slider:not(.hydrated) [slot="thumbs"]{ height:calc((100cqw - 86px) / 4) !important }
}
@media (min-width:1024px){
  .container--product-details salla-slider.details-slider > .s-slider-thumbs,
  .container--product-details salla-slider.details-slider:not(.hydrated) [slot="thumbs"]{ height:calc((100cqw - 38px) / 4) !important }
}

/* ٣) مسار التنقل: سطر 20px محجوز قبل ما المكوّن يترسم (60 = 20 + py-5). */
.container--breadcrumbs salla-breadcrumb:not(.hydrated){ display:block; min-height:20px }

/* ٤) «يُشترى معاً» (salla-bought-together): بيرسم هيكل تحميل 442px فوق اسم المنتج
      وبعدين بيختفي لإن مفيش منتج عنده باقة مرتبطة — الاسم والسعر وزرار السلة كانوا
      بينزلوا 504px ويرجعوا (0.09–0.17 CLS لوحده، موجودة قبل أي تعديل).
      بنخفي الهيكل بس: لو اتضافت باقة حقيقية بعدين المكوّن نفسه هيظهر عادي. */
salla-bought-together .s-bought-together-skeleton{ display:none !important }