/*
 * RTL overrides for Arabic.
 *
 * Bootstrap's own RTL build (swapped in for the regular bootstrap.min.css
 * when dir="rtl" — see layouts/app.blade.php and the auth pages) already
 * mirrors every Bootstrap component: grid, flex utilities, dropdowns,
 * modals, forms. This file only fixes the handful of custom, non-Bootstrap
 * classes in style.css/auth.css that don't use Bootstrap's own direction
 * variables.
 */

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

/* Sidebar: pinned to the inline-start edge, so it moves to the right. */
[dir="rtl"] .midd {
    flex-direction: row-reverse;
}

[dir="rtl"] .sidebar-menu i {
    margin-inline-end: 0;
    margin-inline-start: 8px;
}

/* Header: hamburger / page title / right-side controls mirror order. */
[dir="rtl"] .header-inner {
    flex-direction: row-reverse;
}

[dir="rtl"] .top-header-right {
    flex-direction: row-reverse;
}

[dir="rtl"] .notification-dropdown,
[dir="rtl"] .profile-menu {
    right: auto;
    left: 0;
}

[dir="rtl"] .dropdown-field {
    margin-inline-end: 0;
    margin-inline-start: 1rem;
}

/* Icons that imply direction (back/forward chevrons, arrows) flip. */
[dir="rtl"] .fa-chevron-left,
[dir="rtl"] .fa-chevron-right,
[dir="rtl"] .fa-arrow-left,
[dir="rtl"] .fa-arrow-right {
    transform: scaleX(-1);
}

/* Auth pages: the animated skyline stage and the form panel swap sides. */
[dir="rtl"] .auth {
    flex-direction: row-reverse;
}

/* Arabic script is cursive — letters must stay joined, so the wide
   letter-spacing used for the (Latin) uppercase eyebrow/badge text
   breaks it into disconnected glyphs. Uppercase has no effect on
   Arabic either way, so turning both off only affects this locale. */
[dir="rtl"] .auth__eyebrow,
[dir="rtl"] .auth__badge {
    letter-spacing: normal;
    text-transform: none;
}

/* The hero copy block otherwise keeps its LTR text-align, so headings
   line up under the eyebrow line instead of drifting left. */
[dir="rtl"] .auth__copy {
    text-align: right;
}