/* =============================================================================
   Right-to-left (Arabic) polish layer.

   The app is authored with logical Tailwind utilities (ms-/me-/ps-/pe-/text-start/
   border-s/…), so under <html dir="rtl"> the layout mirrors automatically. This file
   only holds the few things logical utilities cannot express, and EVERY rule is scoped
   to [dir="rtl"] so left-to-right languages are completely unaffected.

   BlazorMHD.UI (mhd.css) is intentionally NOT overridden here.
   Add page-specific RTL tweaks below as they surface during visual QA.
   ============================================================================= */

/* Prices, quantities and percentages are Latin/numeric runs that must keep their
   natural left-to-right order when they sit inside right-to-left text. Isolating them
   stops the surrounding Arabic text from reordering the number. */
[dir="rtl"] .tabular-nums {
  unicode-bidi: isolate;
}

/* Mixed-direction data in table cells (owner, 2026-09-15). A cell holding Latin data — a German
   product description, a phone number, a date with a time — was laid out as an RTL paragraph, so
   the trailing full stop jumped to the front (".Laufende Betriebsausgaben"), a phone number showed
   its "+" at the end ("5551200 30 49+") and a moment read time-first ("02:08 01.09.2026").
   plaintext takes each paragraph's direction from its own first strong letter, so Arabic cells stay
   RTL and Latin cells read LTR. It also makes `start` follow that detected direction, which would
   push Latin cells to the left edge of a right-aligned column — so the alignment is pinned here:
   right by default, left where the markup asked for the end (numbers), centre where it asked for
   centre. (This file is unlayered and loads last, so these beat the Tailwind utilities.) */
[dir="rtl"] td,
[dir="rtl"] td :is(div, p) {
  unicode-bidi: plaintext;
}
[dir="rtl"] td {
  text-align: right;
}
[dir="rtl"] td:is(.text-end, .text-left),
[dir="rtl"] td :is(div, p):is(.text-end, .text-left) {
  text-align: left;
}
[dir="rtl"] td :is(div, p):is(.text-start, .text-right) {
  text-align: right;
}
[dir="rtl"] td.text-center,
[dir="rtl"] td :is(div, p).text-center {
  text-align: center;
}

/* An element explicitly authored with a horizontal-directional glyph (e.g. a "→" that
   means "forward") can opt into mirroring under RTL by adding the .rtl-mirror class.
   Nothing is mirrored unless it opts in, so this is safe by default. */
[dir="rtl"] .rtl-mirror {
  display: inline-block;
  transform: scaleX(-1);
}