/* RTL-specific overrides
   Most rules in base.css and components.css use CSS logical properties
   (margin-inline-*, padding-inline-*, inset-inline-*) so this file is small. */

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

/* Mirror the language switch positioning is handled by inset-inline-end already. */

/* Mirror voucher code letter-spacing — Arabic-Indic digits look fine with less spacing. */
[dir="rtl"] .voucher-code-box__code { letter-spacing: 4px; }
[dir="rtl"] .table td.cell-mono,
[dir="rtl"] .verify-result__code { direction: ltr; unicode-bidi: isolate; }

/* Letter-spacing on the verify input causes Arabic glyphs to disconnect; force LTR
   visually since voucher codes are Latin/digits. */
[dir="rtl"] .verify-form__row .input { direction: ltr; text-align: right; }
[dir="rtl"] .stats__value-mono { direction: ltr; }

/* In RTL, the input icon sits on the right; keep readable. */
[dir="rtl"] .input--with-icon { padding-inline-start: 40px; padding-inline-end: var(--space-4); }
[dir="rtl"] .input-wrap__icon { inset-inline-start: auto; inset-inline-end: 12px; }
[dir="rtl"] .admin-search .input { padding-inline-start: 36px; padding-inline-end: var(--space-4); }