/* RTL overrides for Arabic (dir="rtl"). Loaded after catalog.css/phase1.css/phase1-nav.css so
   these rules win on specificity-equal physical properties that dir="rtl" does not auto-mirror
   (border-left/right, explicit left/right positioning, text-align:left, left-side padding used
   for icon/marker spacing). Flexbox/Grid main-axis order already mirrors automatically under
   dir="rtl" without any CSS here — only genuinely physical declarations are overridden below.
   Product photos are never mirrored (no transform:scaleX on any img/video). */

[dir="rtl"] { text-align: right; }

/* Header / nav */
[dir="rtl"] .nav { margin-left: 0; margin-right: auto; }
[dir="rtl"] .menu-toggle { margin-left: 0; margin-right: auto; }
[dir="rtl"] .products-menu { left: auto; right: -18px; }
[dir="rtl"] .lang-switcher { margin-left: 0; margin-right: 12px; }
[dir="rtl"] .lang-switcher-menu { left: auto; right: 0; text-align: right; }

/* Accent borders that read as "start of block" — must sit on the right in RTL */
[dir="rtl"] .notice,
[dir="rtl"] .store-product-status,
[dir="rtl"] .reference-notice,
[dir="rtl"] .photo-followup,
[dir="rtl"] .route-status,
[dir="rtl"] .form-status,
[dir="rtl"] .awning-order-note {
  border-left: 0;
  border-right: 4px solid var(--rust);
}
[dir="rtl"] .store-product-status { border-right-width: 3px; }
[dir="rtl"] .route-status { border-right-width: 3px; }

[dir="rtl"] .store-confidence > div,
[dir="rtl"] .purchase-assurance > div {
  border-right: 0;
  border-left: 1px solid var(--line);
}
[dir="rtl"] .store-confidence > div:last-child,
[dir="rtl"] .purchase-assurance > div:last-child { border-left: 0; }

/* Floating WhatsApp button and toast — mirror corners so nothing collides with a RTL-mirrored layout */
[dir="rtl"] .wa-float { right: auto; left: 18px; }
[dir="rtl"] .quote-toast { left: auto; right: 24px; }
@media (max-width: 600px) {
  [dir="rtl"] .wa-float { right: auto; left: 12px; }
}
@media (max-width: 980px) {
  [dir="rtl"] .wa-float { right: auto; left: 24px; }
}
@media (max-width: 600px) and (max-width: 980px) {
  [dir="rtl"] .wa-float { right: auto; left: 20px; }
  [dir="rtl"] .quote-toast { left: auto; right: 20px; }
}

/* List markers / icon-adjacent spacing that used padding-left / left-positioned pseudo-elements */
[dir="rtl"] .trust-points li { padding: 13px 44px 13px 16px; }
[dir="rtl"] .trust-points li:before { left: auto; right: 16px; }
[dir="rtl"] .feature-list { padding-left: 0; padding-right: 20px; }
[dir="rtl"] .hero-note ul { padding-left: 0; padding-right: 20px; }
[dir="rtl"] .hp-field { left: auto !important; right: -10000px !important; }

/* Text explicitly forced left in the LTR stylesheet */
[dir="rtl"] .video-load { text-align: right; }
[dir="rtl"] .electric-size-grid dd { text-align: right; }

/* Breadcrumb separator stays visually correct (a plain "/" reads fine in both directions) */
[dir="rtl"] .breadcrumb { direction: rtl; unicode-bidi: embed; }

/* Numbers, phone numbers, emails, URLs and brand/model names must stay LTR even inside RTL flow */
[dir="rtl"] .brand,
[dir="rtl"] a[href^="mailto:"],
[dir="rtl"] a[href^="tel:"],
[dir="rtl"] a[href^="https://wa.me/"],
[dir="rtl"] [data-email],
[dir="rtl"] .sku,
[dir="rtl"] .reference-id {
  direction: ltr;
  unicode-bidi: isolate;
}

/* Mobile off-canvas nav: top/left/right values are symmetric already, no change needed. */
