/* =============================================================
   MIRAI — Right-to-left overrides (Arabic)
   Active only while js/i18n/i18n.js sets <html dir="rtl">.
   Flex rows mirror on their own; this file fixes what doesn't.
   ============================================================= */

/* ===== BLOCK: Arabic typeface =====
   Montserrat and Cormorant have no Arabic glyphs. Noto Kufi Arabic
   is loaded by i18n.js only when Arabic is chosen. */
html[dir="rtl"] body,
html[dir="rtl"] body * {
  font-family: 'Noto Kufi Arabic', 'Montserrat', system-ui, sans-serif !important;
}

/* ===== BLOCK: No letter-spacing =====
   Tracking pulls Arabic letters apart and breaks the joined script. */
html[dir="rtl"] body * {
  letter-spacing: 0 !important;
}

/* ===== BLOCK: Text alignment ===== */
html[dir="rtl"] .hero-text,
html[dir="rtl"] .footer-bottom {
  text-align: right;
}

/* ===== BLOCK: Spacing that was written for left-to-right ===== */
html[dir="rtl"] .login-icon {
  margin-right: 0;
  margin-left: 5px;
}

@media (min-width: 768px) {
  html[dir="rtl"] .content-section {
    padding-left: 0;
    padding-right: 3rem;
  }
}

/* ===== BLOCK: Arrows point the reading direction ===== */
html[dir="rtl"] .arrow {
  display: inline-block;
  margin-left: 0;
  margin-right: 0.5rem;
  transform: scaleX(-1);
}

html[dir="rtl"] .cta:hover .arrow {
  transform: scaleX(-1) translateX(5px);
}

html[dir="rtl"] .btn-arrow {
  transform: scaleX(-1);
}

html[dir="rtl"] .btn-submit:hover .btn-arrow {
  transform: scaleX(-1) translateX(4px);
}

/* ===== BLOCK: Mobile curtain slides in from the right ===== */
@media (max-width: 860px) {
  html[dir="rtl"] .curtain-menu {
    left: auto;
    right: 0;
    border-right: none;
    border-left: 0.5px solid rgba(141, 153, 174, 0.12);
  }
}

/* ===== BLOCK: English-only details stay left-to-right =====
   The registered address is English; inside an RTL paragraph the
   leading "71-75," would jump to the end of the line. */
html[dir="rtl"] .footer-address,
html[dir="rtl"] .contact-card address {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: right;
}