/*
 * Right-to-left adjustments, loaded only on /ar/.
 *
 * main.css uses logical spacing where it can, so this file only has to handle
 * the places that are genuinely directional: text alignment, the marquee's
 * travel, and decorative borders that sit on one side.
 */

body.rtl {
  /* Cinzel has no Arabic glyphs; Tajawal-like system faces render Arabic well
     and need no extra download. Latin model names still fall back to Poppins. */
  font-family: "Poppins", "Segoe UI", Tahoma, "Noto Kufi Arabic", sans-serif;
}

body.rtl .lmc-hero__title,
body.rtl .lmc-section__title,
body.rtl .lmc-pagehead h1,
body.rtl .lmc-car__name {
  font-family: "Segoe UI", Tahoma, "Noto Kufi Arabic", sans-serif;
  letter-spacing: 0;
}

/* Model names stay Latin even in the Arabic edition, so they keep the Latin
   face and direction when they appear on their own. */
body.rtl .lmc-card__name,
body.rtl .lmc-car__ref {
  direction: ltr;
  text-align: right;
  font-family: "Poppins", sans-serif;
}

body.rtl .lmc-crumbs,
body.rtl .lmc-card__body,
body.rtl .lmc-split__text,
body.rtl .lmc-req__col {
  text-align: right;
}

body.rtl .lmc-menu {
  padding-right: 0;
}

body.rtl .lmc-burger {
  margin-left: 0;
  margin-right: auto;
}

/* The marquee is a transform, so its direction has to be flipped explicitly
   rather than inherited from the document.

   In RTL the track is already right-aligned inside the viewport, so its box
   starts at a large negative x. Travelling further negative — the mirror of the
   LTR keyframes — pushes it off screen entirely for half the cycle. It has to
   travel the other way instead, from its resting place rightwards by one copy. */
body.rtl .lmc-brandstrip__viewport {
  animation-name: lmc-marquee-rtl;
}

@keyframes lmc-marquee-rtl {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(50%, 0, 0); }
}

body.rtl .lmc-car__specs dt,
body.rtl .lmc-card__specs span {
  letter-spacing: 0;
}

/* Prices keep Latin digits and read left to right inside a right-aligned box. */
body.rtl .lmc-card__price,
body.rtl .lmc-car__pricebar {
  direction: ltr;
}

body.rtl .lmc-footer__col {
  text-align: right;
}

body.rtl .lmc-skip:focus {
  left: auto;
  right: 12px;
}

@media (prefers-reduced-motion: reduce) {
  body.rtl .lmc-brandstrip__viewport { animation: none; }
}
