/* ==========================================================================
   RTL override layer
   --------------------------------------------------------------------------
   Loaded ONLY for right-to-left locales (Arabic etc.), AFTER Bootstrap's RTL
   build and the brand theme.  Bootstrap's `bootstrap.rtl.min.css` already
   mirrors the start/end spacing, float and text utilities; this file only
   patches the hand-written / inline components whose CSS Bootstrap can't see:
   chat bubbles, directional icons, and a few landing-page niceties.

   Guard everything with [dir="rtl"] so a stray inclusion can never leak into
   an LTR page.
   ========================================================================== */

/* ── Chat bubbles — flip the little "tail" corner to the correct side ──────── */
[dir="rtl"] .bubble-out { border-bottom-right-radius: 16px; border-bottom-left-radius: 4px; }
[dir="rtl"] .bubble-in  { border-bottom-left-radius: 16px; border-bottom-right-radius: 4px; }

/* ── Directional inline icons ─────────────────────────────────────────────
   Bootstrap-Icons chevrons/arrows are glyphs, not layout, so `dir` doesn't
   flip them.  Mirror the common "forward / next / back" ones horizontally so
   a "continue →" affordance points the reader's natural forward direction. */
[dir="rtl"] .bi-arrow-right,
[dir="rtl"] .bi-arrow-left,
[dir="rtl"] .bi-chevron-right,
[dir="rtl"] .bi-chevron-left,
[dir="rtl"] .bi-arrow-right-short,
[dir="rtl"] .bi-arrow-left-short,
[dir="rtl"] .rtl-flip { transform: scaleX(-1); }

/* Opt-out hook: mark an icon .rtl-noflip when its meaning is absolute
   (e.g. an external-link or a brand logo) and must not mirror. */
[dir="rtl"] .rtl-noflip { transform: none !important; }

/* ── Landing pages ────────────────────────────────────────────────────────
   The hero, step cards and CTA bands are flexbox/grid + logical utilities,
   so Bootstrap-RTL handles them.  These are the few inline bits that assume
   a left origin. */
[dir="rtl"] .hero,
[dir="rtl"] .cta-final,
[dir="rtl"] .step { text-align: right; }

/* Numbered step badges sometimes carry a left margin/offset in the inline
   style; keep them hugging the start edge. */
[dir="rtl"] .step .step-num { margin-left: 0; margin-right: 0; }

/* Lists inside body copy: move the bullet/number to the right gutter. */
[dir="rtl"] .landing-body ul,
[dir="rtl"] .landing-body ol { padding-right: 1.25rem; padding-left: 0; }

/* Latin fragments (brand name, URLs, phone numbers) inside RTL copy should
   still read left-to-right without dragging surrounding punctuation around. */
[dir="rtl"] .ltr-inline { direction: ltr; unicode-bidi: isolate; display: inline-block; }
