/* ─────────────────────────────────────────────────────────
   Blucript — Arabic (right-to-left) pages under /ar.
   Loaded after each page's own styles. The pages themselves are
   built by tools/arabic/build.js from the English pages.
───────────────────────────────────────────────────────── */

/* Arabic letters join up, so any letter-spacing breaks the words apart. The English fonts
   have no Arabic glyphs; IBM Plex Sans Arabic covers both scripts. */
html[dir="rtl"] body,
html[dir="rtl"] body * {
    font-family: 'Twemoji Country Flags', 'IBM Plex Sans Arabic', 'Inter', sans-serif !important;
    letter-spacing: 0 !important;
}
html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3 { line-height: 1.35; }

/* Navigation */
html[dir="rtl"] nav > .lang-switch { margin-left: 0; margin-right: 1.4rem; }

/* Tables and FAQ read from the right */
html[dir="rtl"] .cmp-table th, html[dir="rtl"] .cmp-table td { text-align: right; }
html[dir="rtl"] .cmp-table td.ct, html[dir="rtl"] .cmp-table td:not(:first-child) { text-align: center; }
html[dir="rtl"] .cmp-table th:first-child { border-top-left-radius: 0; border-top-right-radius: var(--radius-sm); }
html[dir="rtl"] .cmp-table th:last-child { border-top-right-radius: 0; border-top-left-radius: var(--radius-sm); }
html[dir="rtl"] .faq-q { text-align: right; }
html[dir="rtl"] .lp-faq summary::after { float: left; }

/* Floating WhatsApp button moves to the bottom-left, as on other Arabic sites */
html[dir="rtl"] a[href^="https://wa.me"][style*="position:fixed"] { right: auto !important; left: 2rem !important; }
html[dir="rtl"] .lp-wa { right: auto; left: 1.6rem; }

/* Platform preview carousel: the track keeps sliding left to right so the slide maths still
   works; each slide's content is right-to-left. Previous sits on the right. */
html[dir="rtl"] .bk-track { direction: ltr; }
html[dir="rtl"] .bk-slide { direction: rtl; }
html[dir="rtl"] .bk-arrow-prev { left: auto; right: 14px; }
html[dir="rtl"] .bk-arrow-next { right: auto; left: 14px; }
html[dir="rtl"] .bk-arrow svg { transform: scaleX(-1); }

/* WhatsApp chat mock-ups: incoming bubbles sit on the right in an Arabic chat, so the
   "tail" corner and the time move with them. */
html[dir="rtl"] .wa-in, html[dir="rtl"] .coex-in, html[dir="rtl"] .lp-in { border-top-left-radius: 10px; border-top-right-radius: 2px; }
html[dir="rtl"] .wa-out, html[dir="rtl"] .coex-out, html[dir="rtl"] .lp-out { border-top-right-radius: 10px; border-top-left-radius: 2px; }
html[dir="rtl"] .wa-msg .wa-time, html[dir="rtl"] .coex-bubble .t, html[dir="rtl"] .lp-msg .t { text-align: left; }