/* =========================================================================
   Arabic / RTL layer.
   The layout itself is written with logical properties (inset-inline,
   margin-inline, padding-inline, text-align: start) so it mirrors natively.
   This file only handles what logical properties cannot express: directional
   icons, Latin-locked strings, and Arabic typographic rhythm.
   ========================================================================= */

[dir="rtl"] body.d4t {
  font-family: var(--font-arabic);
  font-size: 1.09375rem;   /* Arabic reads smaller at the same px — nudge up */
  line-height: 1.85;        /* and needs more leading */
}

[dir="rtl"] .d4t-prose p,
[dir="rtl"] .d4t-prose li { line-height: 1.95; }

/* --- Directional icons: arrows must point the reading direction --------- */
[dir="rtl"] .ico-directional,
[dir="rtl"] .d4t-service__more .ico,
[dir="rtl"] .d4t-audience__cta .ico,
[dir="rtl"] .link-brand .ico { transform: scaleX(-1); }

[dir="rtl"] .d4t-service:hover .d4t-service__more .ico { transform: scaleX(-1) translateX(4px); }

/* Chevrons rotate rather than mirror — leave them alone. */
[dir="rtl"] .d4t-nav__chev,
[dir="rtl"] .d4t-accordion__trigger .ico { transform: none; }
[dir="rtl"] .d4t-nav__item.is-open .d4t-nav__chev,
[dir="rtl"] .d4t-accordion__item.is-open .d4t-accordion__trigger .ico { transform: rotate(180deg); }

/* --- Marquee runs the other way in RTL --------------------------------- */
@keyframes d4t-marquee-x-rtl {
  from { transform: translateX(0); }
  to   { transform: translateX(50%); }
}
[dir="rtl"] .d4t-marquee__track { animation-name: d4t-marquee-x-rtl; }

/* --- Latin-locked content inside an RTL page --------------------------- */
/* Phone numbers, emails, URLs and file names stay LTR and left-anchored. */
[dir="rtl"] .d4t-ltr,
[dir="rtl"] a[href^="tel:"],
[dir="rtl"] a[href^="mailto:"],
[dir="rtl"] .d4t-file__name,
[dir="rtl"] .d4t-lead-ref {
  direction: ltr;
  unicode-bidi: isolate;
}
/* …but the icon + text pair inside a link must still flow RTL */
[dir="rtl"] .d4t-footer__contacts a,
[dir="rtl"] .d4t-topbar__item,
[dir="rtl"] .d4t-location__contact a { direction: rtl; }
[dir="rtl"] .d4t-footer__contacts a > span.num,
[dir="rtl"] .d4t-topbar__item > span.num,
[dir="rtl"] .d4t-location__contact a > span.num,
[dir="rtl"] .d4t-detail__card a > span.num,
[dir="rtl"] .d4t-tile a > span.num { direction: ltr; unicode-bidi: isolate; }

/* Language marquee: native names keep their own direction */
[dir="rtl"] .d4t-marquee__native,
[dir="rtl"] .d4t-lang-card__native { unicode-bidi: isolate; }

/* --- Letter-spacing is meaningless (and harmful) in Arabic ------------- */
[dir="rtl"] .eyebrow,
[dir="rtl"] .d4t-hero__kicker,
[dir="rtl"] .d4t-footer__heading,
[dir="rtl"] .d4t-org__rel,
[dir="rtl"] .d4t-marquee__en,
[dir="rtl"] .d4t-journey__panel-head,
[dir="rtl"] .d4t-journey__doc-label,
[dir="rtl"] .d4t-hero__caption-row,
[dir="rtl"] .d4t-logo__name,
[dir="rtl"] .d4t-logo__sub,
[dir="rtl"] .display-1,
[dir="rtl"] .display-2,
[dir="rtl"] .display-3 { letter-spacing: 0; }

/* Arabic has no case distinction — uppercase transforms do nothing useful
   and break some faces, so drop them on Arabic strings. */
[dir="rtl"] .eyebrow,
[dir="rtl"] .d4t-hero__kicker,
[dir="rtl"] .d4t-footer__heading,
[dir="rtl"] .d4t-org__rel { text-transform: none; }

/* --- Journey rail sits on the correct edge ----------------------------- */
[dir="rtl"] .d4t-journey__rail { inset-inline-start: 19px; }

/* --- Drawer slides in from the left ------------------------------------ */
[dir="rtl"] .d4t-drawer-root.is-open .d4t-drawer { transform: translateX(0); }

/* --- Quote wizard progress fills right-to-left ------------------------- */
[dir="rtl"] .d4t-wizard__bar span { margin-inline-start: 0; margin-inline-end: auto; }

/* --- Forms ------------------------------------------------------------- */
[dir="rtl"] .d4t-field input,
[dir="rtl"] .d4t-field textarea,
[dir="rtl"] .d4t-field select { text-align: right; }
[dir="rtl"] .d4t-field input[type="tel"],
[dir="rtl"] .d4t-field input[type="email"],
[dir="rtl"] .d4t-field input[type="url"] { direction: ltr; text-align: left; }

/* --- Admin CRM screens in an Arabic admin ------------------------------ */
[dir="rtl"] .d4t-crm-table th,
[dir="rtl"] .d4t-crm-table td { text-align: right; }