/* =========================================================
   TopVisa Theme — RTL Overrides
   Loaded only when is_rtl() is true (e.g. Arabic).
   Overrides LTR-specific rules in styles.css.
   ========================================================= */

/* ----- Global ----- */
body {
    direction: rtl;
    text-align: right;
}

/* ----- Header ----- */

/* Slide-out mobile nav opens from the left instead of the right */
header#header nav.menu {
    right: unset;
    left: -280px;
}

body.show-menu header#header nav.menu {
    right: unset;
    left: 0;
}

/* Mobile hamburger button stays on the left side */
header#header .mobile_menu {
    right: unset;
    left: 0.75rem;
}

/* Nav underline indicator: flip from left: 0 to right: 0 */
header#header nav.menu a::after {
    left: unset;
    right: 0;
}

/* Dropdown arrow: flip padding from right to left */
header#header nav.menu li.menu-item-has-children > a {
    padding-right: 0;
    padding-left: 20px;
}

header#header nav.menu li.menu-item-has-children > a::before {
    right: unset;
    left: 0;
}

/* Sub-menu: flip horizontal position */
header#header nav.menu .sub-menu {
    left: unset;
    right: 27px;
    transform: translateX(50%);
}

header#header nav.menu .sub-menu::before {
    left: unset;
    right: calc(50% - 7.5px);
}

/* "Button" nav item: flip padding */
header#header nav.menu ul li.button {
    padding-left: 0;
    padding-right: 68px;
}

/* Mobile sub-menu offset */
@media (max-width: 767px) {
    header#header nav.menu .sub-menu {
        right: -20px;
        left: unset;
        transform: unset;
    }
}

/* Featured-on bar: UAE time pushed to the left in RTL */
header#header .featured_on .uae-time {
    margin-left: 0;
    margin-right: auto;
}

/* ----- Footer ----- */

/* Contact icons: flip margin from right to left */
footer#footer .contacts a img {
    margin-right: 0;
    margin-left: 12px;
}

/* Menu links: flip justify-content for desktop */
footer#footer .menu {
    justify-content: flex-start;
}

/* Disclaimer is already text-align: center so no change needed */

/* ----- Bootstrap grid: reverse column order for RTL rows ----- */
.row {
    flex-direction: row-reverse;
}

/* Restore rows that should NOT be reversed (add as needed after visual testing) */
.row.no-rtl-reverse {
    flex-direction: row;
}
