/* ============================================================
   HARVEST & CRATE — RTL (Right-to-Left) Styles
   Applied when <html dir="rtl"> is set.
   ============================================================ */

/* ---------- Utilities & badges ---------- */
html[dir="rtl"] .icon-btn .badge{ right:auto; left:-6px; }

/* ---------- Announcement bar ---------- */
html[dir="rtl"] .announcement-track{ animation-name:marquee-rtl; }

/* ---------- Header / nav drawer ---------- */
html[dir="rtl"] .main-nav{ left:auto; right:0; }

/* ---------- Hero floating tags ---------- */
html[dir="rtl"] .tag-a{ left:auto; right:-4%; }
html[dir="rtl"] .tag-b{ right:auto; left:-6%; }

/* ---------- Hero slider ---------- */
html[dir="rtl"] .hero-scrim{
  background:
    linear-gradient(270deg, rgba(12,20,13,.88) 0%, rgba(12,20,13,.66) 44%, rgba(12,20,13,.24) 76%, rgba(12,20,13,.06) 100%),
    linear-gradient(to top, rgba(8,14,9,.6), transparent 42%);
}
html[dir="rtl"] .hero-slider .tag-a{ right:auto; left:9%; }
html[dir="rtl"] .hero-slider .tag-b{ right:auto; left:16%; }
html[dir="rtl"] .hero-slider-nav{ right:auto; left:calc(5em + 24px); }
html[dir="rtl"] .hero-arrow svg{ transform:scaleX(-1); }
@media (max-width:767px){
  html[dir="rtl"] .hero-slider-nav{ left:24px; right:auto; }
}

/* ---------- Category cards ---------- */
html[dir="rtl"] .category-card .go{ right:auto; left:14px; }

/* ---------- Weekly deals ---------- */
html[dir="rtl"] .deal-card .badge-discount{ left:auto; right:16px; }

/* ---------- Fresh picks ---------- */
html[dir="rtl"] .fresh-card .organic-pill{ left:auto; right:18px; }
html[dir="rtl"] .fresh-card svg.decor{ right:auto; left:-20px; }

/* ---------- Shop by department ---------- */
html[dir="rtl"] .department-card:hover .dept-link svg{ transform:translateX(-4px) rotate(180deg); }

/* ---------- Slider arrows ---------- */
html[dir="rtl"] .slider-arrows svg{ transform:scaleX(-1); }

/* ---------- Promo banner ---------- */
html[dir="rtl"] .promo-banner::after{ right:auto; left:-90px; }

/* ---------- How delivery works (step connector) ---------- */
html[dir="rtl"] .step-connector{ background-image:linear-gradient(to left, var(--forest) 50%, transparent 0%); }

/* ---------- Brands carousel ---------- */
html[dir="rtl"] .brand-belt{ animation-name:brandScrollRTL; }

/* ---------- App promo floating elements ---------- */
html[dir="rtl"] .aff-1{ left:auto; right:-8%; }
html[dir="rtl"] .aff-2{ right:auto; left:-10%; }

/* ---------- Footer ---------- */
html[dir="rtl"] .footer-col a:hover{ padding-left:0; padding-right:4px; }

/* ---------- Page hero ---------- */
html[dir="rtl"] .page-hero-decor { right: auto; left: -60px; }

/* ---------- Auth pages ---------- */
html[dir="rtl"] .auth-controls{ right:auto; left:clamp(18px,4vw,56px); }

/* ---------- Contact page ---------- */
html[dir="rtl"] .info-card .tag-corner{ right:auto; left:22px; }

/* ---------- Map section ---------- */
html[dir="rtl"] .map-visual .directions-btn{ left:auto; right:20px; }

/* ---------- Search overlay ---------- */
html[dir="rtl"] .search-close{ right:auto; left:26px; }

/* ---------- Back to top ---------- */
html[dir="rtl"] .back-to-top{ right:auto; left:26px; }

/* ---------- About page ---------- */
@media (max-width:640px){
  html[dir="rtl"] .story-visual .sv-tag{ left:0; right:auto; }
}
html[dir="rtl"] .story-visual .sv-tag{ right:auto; left:-24px; }

/* ---------- Home2 search bar ---------- */
html[dir="rtl"] .h2-search-bar svg{ margin-left:0; margin-right:10px; }
html[dir="rtl"] .h2-collage-badge{ left:auto; right:16px; }

/* ---------- Recipe cards ---------- */
html[dir="rtl"] .recipe-time{ right:auto; left:12px; }

/* ---------- FAQ ---------- */
html[dir="rtl"] .faq-question{ text-align:right; }

/* ---------- All products page ---------- */
html[dir="rtl"] .shop-product-card .badge-discount{ left:auto; right:14px; }
html[dir="rtl"] .wishlist-btn{ right:auto; left:14px; }
@media (max-width:1024px){
  html[dir="rtl"] .filter-sidebar{ left:auto; right:0; transform:translateX(105%); }
}

/* ---------- Product details page ---------- */
html[dir="rtl"] .pd-main-image .badge-discount{ left:auto; right:18px; }

/* ---------- Loyalty card page ---------- */
html[dir="rtl"] .reward-points-badge{ right:auto; left:12px; }

/* ---------- Delivery coverage page ---------- */
html[dir="rtl"] .zone-status{ left:auto; right:12px; }
html[dir="rtl"] .delivery-map-legend{ left:auto; right:18px; }

/* ---------- Dashboard / cart ---------- */
html[dir="rtl"] .dashboard-nav a.is-active{ box-shadow:inset -3px 0 var(--marigold); }
@media (max-width:900px){
  html[dir="rtl"] .dashboard-sidebar{ inset:0 0 0 auto; transform:translateX(105%); }
  html[dir="rtl"] .dashboard-sidebar.is-open{ transform:translateX(0); }
}