/* ==========================================================================
   PSN HEAVEN — Arabic / RTL overrides
   Loaded AFTER style.css on every page under /ar/.
   Flexbox reverses its main axis automatically under direction:rtl, so most
   of the layout needs no change — only absolutely-positioned and
   directional-border elements are corrected here.
   ========================================================================== */

:root {
  --font-head: 'Tajawal', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body: 'Tajawal', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

html { direction: rtl; }
body { text-align: right; }

/* Arabic reads better slightly larger with more line height */
body { font-size: 17.5px; line-height: 1.9; }
h1, h2, h3, h4 { letter-spacing: 0; line-height: 1.35; }
h1 { font-size: clamp(2.1rem, 5vw, 3.6rem); }

/* Latin fragments inside Arabic copy (@usernames, PS5, prices) */
.ltr {
  direction: ltr;
  display: inline-block;
  unicode-bidi: isolate;
}

/* Skip link */
.skip-link { left: auto; right: -9999px; border-radius: 0 0 0 8px; }
.skip-link:focus { right: 0; left: auto; }

/* Eyebrow dash sits on the correct side automatically via flex,
   but the centred variant must stay hidden */
.head.text-center .eyebrow::before { display: none; }
.head--left { text-align: right; }

/* Game card badges swap corners */
.game__tag  { left: auto; right: 14px; }
.game__save { right: auto; left: 14px; }
.game__soon { right: auto; left: 14px; }

/* Comparison table borders flip */
.compare__cell { border-right: 0; border-left: 1px solid var(--line); }
.compare__cell:last-child { border-left: 0; }

/* Accordion */
.acc__q { text-align: right; }

/* Prose bullets */
.prose li::before { content: "—"; }

/* Mobile drawer links */
.mobile-nav a { text-align: right; }

/* Numbers, prices and times stay left-to-right.
   NOTE: never force direction:ltr on an element that also holds Arabic words —
   it reorders them. Wrap the numeric fragment in .ltr instead. */
.game__price,
.summary__line span:last-child,
time { direction: ltr; unicode-bidi: isolate; }
.game__price { justify-content: flex-end; flex-direction: row-reverse; }

/* Buttons with icons: keep icon on the leading (right) edge naturally via flex.
   Arrow glyphs that imply direction get mirrored. */
.btn .arrow { transform: scaleX(-1); }

@media (max-width: 767px) {
  .compare__cell { border-left: 0; border-bottom: 1px solid var(--line); }
  .compare__row:last-child .compare__cell:last-child { border-bottom: 0; }
}
