/*
 * Right-to-left overrides, loaded only when the active language is RTL
 * (currently Arabic). Covers the shared chrome (header, language switcher,
 * bottom tab bar, search modal, forms) and directional icons - not a full
 * mirror of every page's bespoke layout, but enough that the app reads
 * naturally in Arabic instead of looking flipped-by-accident.
 */

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

/* Header: mirror the row so the logo stays on the visual "start" side and
   nav/search/profile controls read right-to-left. */
html[dir="rtl"] .header__content {
    flex-direction: row-reverse;
}

html[dir="rtl"] .header__nav {
    flex-direction: row-reverse;
    padding-right: 0;
}

html[dir="rtl"] .header__auth {
    flex-direction: row-reverse;
}

/* Bottom tab bar: icon-over-label layout doesn't need mirroring, but the
   row order should still follow reading direction. */
html[dir="rtl"] .bottom-tab-bar {
    flex-direction: row-reverse;
}

/* Directional icons that visually point the wrong way once mirrored */
html[dir="rtl"] .fa-arrow-left,
html[dir="rtl"] .fa-chevron-left,
html[dir="rtl"] .button-arrow {
    transform: scaleX(-1);
}

/* Forms: icons/actions inside inputs sit on the leading edge */
html[dir="rtl"] .control.has-icon .control-icon {
    left: auto;
    right: 14px;
}

html[dir="rtl"] .control.has-icon .input {
    padding-left: 14px;
    padding-right: 44px;
}

html[dir="rtl"] .control.has-action .control-action {
    right: auto;
    left: 12px;
}

/* Search modal */
html[dir="rtl"] .modal-buscador-inputbox {
    flex-direction: row-reverse;
}

html[dir="rtl"] .modal-buscador-filters {
    flex-direction: row-reverse;
}

/* Generic utility overrides used throughout the templates */
html[dir="rtl"] .text-left {
    text-align: right;
}

html[dir="rtl"] .text-right {
    text-align: left;
}

html[dir="rtl"] .d-flex.justify-content-between {
    flex-direction: row-reverse;
}