/* ============================================================
   Digital MQR — RTL overrides (Arabic)
   Loaded only when is_rtl() is true (TranslatePress AR).
   The brand stylesheet already uses logical properties
   (margin-inline / inset-inline-* / padding-inline) and ships
   [dir="rtl"] rules for the hero wash, marquees, strips and button
   arrows — so this file only adds what those don't cover:
   Arabic typography, directional glyphs, and a few mirror fixes.
   ============================================================ */

/* ---------- Arabic typography ---------- */
[dir="rtl"] body,
[dir="rtl"] .btn,
[dir="rtl"] input,
[dir="rtl"] select,
[dir="rtl"] textarea,
[dir="rtl"] button {
  font-family: var(--ff-ar);
}

/* Latin tracking (-0.01em / .04–.22em) hurts Arabic legibility — neutralise. */
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] h4 {
  letter-spacing: 0;
}
[dir="rtl"] .eyebrow,
[dir="rtl"] .seg-tag,
[dir="rtl"] .seg-c .tag,
[dir="rtl"] .badge,
[dir="rtl"] .badge2,
[dir="rtl"] .footer h4,
[dir="rtl"] .strip-lbl,
[dir="rtl"] .up-badge,
[dir="rtl"] .badge-live,
[dir="rtl"] .hero-x .eyebrow-x span,
[dir="rtl"] .evx-card .st {
  letter-spacing: .02em;
}

/* Phone numbers / emails stay LTR even inside RTL text. */
[dir="rtl"] a[href^="tel:"],
[dir="rtl"] a[href^="mailto:"],
[dir="rtl"] .ltr {
  direction: ltr;
  unicode-bidi: embed;
  display: inline-block;
}

/* ---------- directional glyph arrows ---------- */
/* Textual arrows inside "Read more →", "Explore →", card .read, .more, .crumb */
[dir="rtl"] .read,
[dir="rtl"] .more,
[dir="rtl"] .seg-c .more,
[dir="rtl"] .sol-card .read {
  /* keep the glyph but flip it horizontally so it points start-ward */
}
[dir="rtl"] .read::after,
[dir="rtl"] .more::after { content: none; }

/* The inline ↗ on the Shop button & external links — mirror to look natural. */
[dir="rtl"] .shop-btn,
[dir="rtl"] .footer ul a {
  /* leave external ↗ as-is (it reads as "opens in new tab" in both dirs) */
}

/* ---------- header ---------- */
/* nav-actions / nav-links already use margin-inline-start:auto (logical). */
[dir="rtl"] .nav-links.open {
  text-align: right;
}

/* ---------- segments / cards ---------- */
[dir="rtl"] .seg-c,
[dir="rtl"] .sol-card .body,
[dir="rtl"] .sol-cardx .bd,
[dir="rtl"] .evx-card .bd {
  text-align: right;
}

/* ---------- footer ---------- */
[dir="rtl"] .footer .grid,
[dir="rtl"] .footer ul {
  text-align: right;
}
[dir="rtl"] .footer .socials {
  justify-content: flex-start;
}

/* ---------- contact ---------- */
[dir="rtl"] .field label,
[dir="rtl"] .info-item,
[dir="rtl"] .ci-row {
  text-align: right;
}

/* ---------- article / solution body bullets ---------- */
[dir="rtl"] .article ul.feat li,
[dir="rtl"] .narr li,
[dir="rtl"] .sol-feats .f {
  text-align: right;
}

/* ---------- lightbox arrows (the ‹ › glyphs) ---------- */
/* prev/next are positioned with inset-inline-* already; swap their glyphs so
   "previous" still points toward the start of the (reversed) sequence. */
[dir="rtl"] .lb .prev { transform: translateY(-50%) scaleX(-1); }
[dir="rtl"] .lb .next { transform: translateY(-50%) scaleX(-1); }

/* ---------- WordPress / Elementor reconciliations ---------- */
[dir="rtl"] .alignleft  { float: right; margin: 5px 0 20px 20px; }
[dir="rtl"] .alignright { float: left;  margin: 5px 20px 20px 0; }
[dir="rtl"] .skip-link  { border-radius: 0 0 0 10px; left: auto; right: -9999px; }
[dir="rtl"] .skip-link:focus { right: 0; left: auto; }
