/* RTL layout for the Arabic build. Applies ONLY under html[dir="rtl"], so the
   English build is byte-identical in behaviour and nothing here can affect it.

   The page chrome is built with flexbox, so `direction: rtl` already mirrors
   row order - the sidebar rail moves to the right and card grids flow right to
   left without per-component rules. What follows fixes the cases direction
   alone does not: inline styles that hard-code `left`, latin runs inside Arabic
   sentences, and icons that must stay on the leading edge. */

html[dir="rtl"] body { direction: rtl; text-align: right; }

/* Numbers, TIDs, stat values and any latin token inside an Arabic sentence must
   not be reordered by the bidi algorithm. Isolate them. */
html[dir="rtl"] .num,
html[dir="rtl"] [data-num],
html[dir="rtl"] code,
html[dir="rtl"] time { unicode-bidi: isolate; direction: ltr; display: inline-block; }

/* Card and list rows: mirror padding/margins that were written one-sided. */
html[dir="rtl"] [style*="text-align:left"]  { text-align: right !important; }
html[dir="rtl"] [style*="text-align: left"] { text-align: right !important; }

/* Flex rows keep their visual order; only the writing direction flips. Rows
   that are deliberately LTR (a stat table of numbers) opt out with .keep-ltr. */
html[dir="rtl"] .keep-ltr { direction: ltr; text-align: left; }

/* The sidebar rail sits in a flex row with the content; direction:rtl puts it
   on the right. Its own text stays right-aligned. */
html[dir="rtl"] aside, html[dir="rtl"] nav { text-align: right; }

/* Breadcrumb / back chevrons point the other way in RTL. */
html[dir="rtl"] .chev-back { transform: scaleX(-1); display: inline-block; }

/* Inputs: caret and placeholder to the right. */
html[dir="rtl"] input[type="text"],
html[dir="rtl"] input[type="search"],
html[dir="rtl"] select,
html[dir="rtl"] textarea { direction: rtl; text-align: right; }

/* Leaflet map internals are geometric, not textual - never flip them. */
html[dir="rtl"] .leaflet-container,
html[dir="rtl"] .leaflet-pane,
html[dir="rtl"] .leaflet-control-container { direction: ltr; text-align: left; }

/* Arabic needs a little more line height than the latin default to keep
   diacritics and descenders clear at small sizes. */
html[dir="rtl"] body { line-height: 1.7; }