/* Language switcher (works in all languages, not just RTL) */
.lang-switch{display:flex;gap:3px;margin-inline-start:6px;padding:3px;border-radius:12px;background:#fff;border:1px solid var(--line, #e4e7ec)}
.lang-switch button{border:0;background:none;padding:6px 9px;border-radius:9px;font-weight:700;font-size:.78rem;cursor:pointer;color:var(--muted, #667085)}
.lang-switch button.active{background:var(--blue, #16325c);color:#fff}
@media(max-width:760px){.lang-switch{margin-inline-start:2px}.lang-switch button{padding:5px 7px}}

/* --- Right-to-left layout (Arabic) ---
   Flexbox and CSS Grid already flip their main axis automatically under
   dir="rtl" — most of the layout needs no changes at all. These overrides
   only cover the handful of rules that use a *physical* left/right value
   instead of a logical one, which don't flip on their own. */
[dir="rtl"]{
  font-family: "Segoe UI", Tahoma, Geneva, Arial, "Noto Sans Arabic", sans-serif;
}
[dir="rtl"] .dialog-close{ right: auto; left: 14px; }
[dir="rtl"] .cart-btn span{ margin-left: 0; margin-right: 5px; }
[dir="rtl"] .progress-step:before{ left: auto; right: 13px; }