/* RTL Support for Arabic Language */

/* Import Cairo Font */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200;300;400;500;600;700;800;900&display=swap');

/* Basic RTL setup */
html[lang="ar"] {
    direction: rtl;
    text-align: right;
}

html[lang="ar"] body,
html[lang="ar"] h1, 
html[lang="ar"] h2, 
html[lang="ar"] h3, 
html[lang="ar"] h4, 
html[lang="ar"] h5, 
html[lang="ar"] h6,
html[lang="ar"] p,
html[lang="ar"] a,
html[lang="ar"] span,
html[lang="ar"] div,
html[lang="ar"] input,
html[lang="ar"] textarea,
html[lang="ar"] button,
html[lang="ar"] select,
html[lang="ar"] .form-control,
html[lang="ar"] .btn {
    font-family: 'Cairo', sans-serif !important;
}

/* Reverse padding and margins */
html[lang="ar"] .ml-1, 
html[lang="ar"] .mx-1 {
    margin-left: 0 !important;
    margin-right: 0.25rem !important;
}

html[lang="ar"] .mr-1, 
html[lang="ar"] .mx-1 {
    margin-right: 0 !important;
    margin-left: 0.25rem !important;
}

html[lang="ar"] .ml-2, 
html[lang="ar"] .mx-2 {
    margin-left: 0 !important;
    margin-right: 0.5rem !important;
}

html[lang="ar"] .mr-2, 
html[lang="ar"] .mx-2 {
    margin-right: 0 !important;
    margin-left: 0.5rem !important;
}

html[lang="ar"] .ml-3, 
html[lang="ar"] .mx-3 {
    margin-left: 0 !important;
    margin-right: 1rem !important;
}

html[lang="ar"] .mr-3, 
html[lang="ar"] .mx-3 {
    margin-right: 0 !important;
    margin-left: 1rem !important;
}

html[lang="ar"] .ml-4, 
html[lang="ar"] .mx-4 {
    margin-left: 0 !important;
    margin-right: 1.5rem !important;
}

html[lang="ar"] .mr-4, 
html[lang="ar"] .mx-4 {
    margin-right: 0 !important;
    margin-left: 1.5rem !important;
}

html[lang="ar"] .pl-1, 
html[lang="ar"] .px-1 {
    padding-left: 0 !important;
    padding-right: 0.25rem !important;
}

html[lang="ar"] .pr-1, 
html[lang="ar"] .px-1 {
    padding-right: 0 !important;
    padding-left: 0.25rem !important;
}

html[lang="ar"] .pl-2, 
html[lang="ar"] .px-2 {
    padding-left: 0 !important;
    padding-right: 0.5rem !important;
}

html[lang="ar"] .pr-2, 
html[lang="ar"] .px-2 {
    padding-right: 0 !important;
    padding-left: 0.5rem !important;
}

html[lang="ar"] .pl-3, 
html[lang="ar"] .px-3 {
    padding-left: 0 !important;
    padding-right: 1rem !important;
}

html[lang="ar"] .pr-3, 
html[lang="ar"] .px-3 {
    padding-right: 0 !important;
    padding-left: 1rem !important;
}

html[lang="ar"] .pl-4, 
html[lang="ar"] .px-4 {
    padding-left: 0 !important;
    padding-right: 1.5rem !important;
}

html[lang="ar"] .pr-4, 
html[lang="ar"] .px-4 {
    padding-right: 0 !important;
    padding-left: 1.5rem !important;
}

/* Fix float classes */
html[lang="ar"] .float-left {
    float: right !important;
}

html[lang="ar"] .float-right {
    float: left !important;
}

/* Text alignment */
html[lang="ar"] .text-left {
    text-align: right !important;
}

html[lang="ar"] .text-right {
    text-align: left !important;
}

/* Dropdown menus */
html[lang="ar"] .dropdown-menu {
    left: auto !important;
    right: 0 !important;
    text-align: right !important;
}

/* List items */
html[lang="ar"] ul {
    padding-right: 0;
}

html[lang="ar"] .list-inline-item:not(:last-child) {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* Carousel, Slick sliders direction */
html[lang="ar"] .slick-slider {
    direction: ltr;
}

html[lang="ar"] .slick-slide {
    float: left;
    direction: rtl;
}

/* FlexBox order fixes */
html[lang="ar"] .flex-row {
    flex-direction: row-reverse !important;
}

/* Icon rotations */
html[lang="ar"] .fa-angle-double-right,
html[lang="ar"] .fa-long-arrow-right,
html[lang="ar"] .fa-arrow-right {
    transform: rotate(180deg);
}

html[lang="ar"] .fa-angle-double-left,
html[lang="ar"] .fa-long-arrow-left,
html[lang="ar"] .fa-arrow-left {
    transform: rotate(180deg);
}

/* Fix breadcrumb separator */
html[lang="ar"] .breadcrumb-item + .breadcrumb-item::before {
    padding-right: 0;
    padding-left: 0.5rem;
}

html[lang="ar"] .breadcrumb-item + .breadcrumb-item {
    padding-left: 0;
    padding-right: 0.5rem;
}

/* Form controls */
html[lang="ar"] .custom-control {
    padding-left: 0;
    padding-right: 1.5rem;
}

html[lang="ar"] .custom-control-label::before,
html[lang="ar"] .custom-control-label::after {
    left: auto;
    right: -1.5rem;
}

/* Input groups */
html[lang="ar"] .input-group > .input-group-prepend > .btn,
html[lang="ar"] .input-group > .input-group-prepend > .input-group-text,
html[lang="ar"] .input-group > .input-group-append:not(:last-child) > .btn,
html[lang="ar"] .input-group > .input-group-append:not(:last-child) > .input-group-text,
html[lang="ar"] .input-group > .input-group-append:last-child > .btn:not(:last-child):not(.dropdown-toggle),
html[lang="ar"] .input-group > .input-group-append:last-child > .input-group-text:not(:last-child) {
    border-radius: 0 0.25rem 0.25rem 0;
}

html[lang="ar"] .input-group > .input-group-append > .btn,
html[lang="ar"] .input-group > .input-group-append > .input-group-text,
html[lang="ar"] .input-group > .input-group-prepend:not(:first-child) > .btn,
html[lang="ar"] .input-group > .input-group-prepend:not(:first-child) > .input-group-text,
html[lang="ar"] .input-group > .input-group-prepend:first-child > .btn:not(:first-child),
html[lang="ar"] .input-group > .input-group-prepend:first-child > .input-group-text:not(:first-child) {
    border-radius: 0.25rem 0 0 0.25rem;
}

/* Fix position fixed elements */
html[lang="ar"] .pos-fixed-bottom-right {
    right: auto !important;
    left: 0 !important;
}

html[lang="ar"] .pos-fixed-bottom-left {
    left: auto !important;
    right: 0 !important;
}

/* Modal fixes */
html[lang="ar"] .modal-header .close {
    margin: -1rem auto -1rem -1rem;
}

/* Fix back to top button */
html[lang="ar"] .gtf-back-to-top {
    right: auto;
    left: 1.5rem;
}

/* Fix card and box elements */
html[lang="ar"] .card-header,
html[lang="ar"] .card-body,
html[lang="ar"] .card-footer {
    text-align: right;
}

/* Project-specific styles */
html[lang="ar"] .navbar-nav .dropdown-toggle::after {
    margin-right: 0.255em;
    margin-left: 0;
}

html[lang="ar"] .navbar-expand-lg .navbar-nav .dropdown-menu {
    right: 0;
    left: auto;
}

/* Fix dropright to dropleft for RTL */
html[lang="ar"] .dropdown-item.dropdown.dropright {
    display: flex;
    flex-direction: row-reverse;
}

html[lang="ar"] .dropdown-item.dropdown.dropright .dropdown-menu {
    right: 100%;
    left: auto;
}

html[lang="ar"] .dropdown-submenu {
    right: 100%;
    left: auto;
}

/* RTL fixes for news articles */
html[lang="ar"] .card-img-top .badge.position-absolute.pos-fixed-bottom {
    right: 0;
    left: auto;
}

/* Fix hover shine effect for RTL */
html[lang="ar"] .hover-shine::before {
    left: auto;
    right: -75%;
    background: -webkit-linear-gradient(right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    background: linear-gradient(to left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    -webkit-transform: skewX(25deg);
    transform: skewX(25deg);
}

html[lang="ar"] .hover-shine:hover::before {
    -webkit-animation: shine-rtl .75s;
    animation: shine-rtl .75s;
}

@-webkit-keyframes shine-rtl {
    100% {
        right: 125%;
    }
}

@keyframes shine-rtl {
    100% {
        right: 125%;
    }
}

/* Search component RTL fixes */
html[lang="ar"] .btn-icon-left .icon {
    margin-right: 0;
    margin-left: 0.5rem;
}

html[lang="ar"] .btn-icon-right .icon {
    margin-left: 0;
    margin-right: 0.5rem;
}

/* News article specific RTL fixes */
html[lang="ar"] .pagination.rounded-active .page-item:first-child .page-link {
    border-radius: 0 30px 30px 0;
}

html[lang="ar"] .pagination.rounded-active .page-item:last-child .page-link {
    border-radius: 30px 0 0 30px;
}

/* Bootstrap grid RTL adjustments */
@media (min-width: 576px) {
    html[lang="ar"] .offset-sm-1 {
        margin-left: 0;
        margin-right: 8.333333%;
    }
    html[lang="ar"] .offset-sm-2 {
        margin-left: 0;
        margin-right: 16.666667%;
    }
    html[lang="ar"] .offset-sm-3 {
        margin-left: 0;
        margin-right: 25%;
    }
}

@media (min-width: 768px) {
    html[lang="ar"] .offset-md-1 {
        margin-left: 0;
        margin-right: 8.333333%;
    }
    html[lang="ar"] .offset-md-2 {
        margin-left: 0;
        margin-right: 16.666667%;
    }
    html[lang="ar"] .offset-md-3 {
        margin-left: 0;
        margin-right: 25%;
    }
}

@media (min-width: 992px) {
    html[lang="ar"] .offset-lg-1 {
        margin-left: 0;
        margin-right: 8.333333%;
    }
    html[lang="ar"] .offset-lg-2 {
        margin-left: 0;
        margin-right: 16.666667%;
    }
    html[lang="ar"] .offset-lg-3 {
        margin-left: 0;
        margin-right: 25%;
    }
}

/* Header and Navigation Specific Fixes */
html[lang="ar"] .navbar-nav {
    padding-right: 0;
}

html[lang="ar"] .navbar-toggler {
    margin-left: 0;
    margin-right: auto;
}

html[lang="ar"] .d-lg-none.ml-auto {
    margin-right: auto !important;
    margin-left: 0 !important;
}

/* Fix for search component */
html[lang="ar"] .property-search-status-tab button {
    border-right: 0 !important;
    border-left: 1px solid rgba(255, 255, 255, 0.3) !important;
}

html[lang="ar"] .property-search-status-tab button:last-child {
    border-left: 0 !important;
    border-right: 1px solid rgba(255, 255, 255, 0.3) !important;
}

html[lang="ar"] .form-control.border-right {
    border-right: 0 !important;
    border-left: 1px solid #dae1e7 !important;
}

html[lang="ar"] .rounded-right-md-0 {
    border-radius: 0 0.25rem 0.25rem 0 !important;
}

html[lang="ar"] .rounded-left-md-0 {
    border-radius: 0.25rem 0 0 0.25rem !important;
}

html[lang="ar"] .rounded-md-top-left-0 {
    border-top-right-radius: 0 !important;
    border-top-left-radius: 0.25rem !important;
}

html[lang="ar"] .rounded-lg-top-left {
    border-top-right-radius: 0.3rem !important;
    border-top-left-radius: 0 !important;
}

html[lang="ar"] .position-absolute.pos-fixed-right-center {
    right: auto !important;
    left: 0 !important;
}

/* News listing page fixes */
html[lang="ar"] .justify-content-lg-end {
    justify-content: flex-start !important;
}

html[lang="ar"] .badge-circle.badge-absolute {
    right: auto;
    left: -5px;
}

/* Button and icon alignment fixes */
html[lang="ar"] .btn {
    text-align: right;
}

html[lang="ar"] .btn.advanced-search.text-left {
    text-align: right !important;
}

html[lang="ar"] .d-flex.align-items-center.justify-content-center i {
    margin-right: 0;
}

/* Dropdown menu adjustments */
html[lang="ar"] .dropdown-toggle::after {
    margin-left: 0;
    margin-right: 0.255em;
}

/* Custom control placement */
html[lang="ar"] .custom-control-label {
    padding-right: 1.5rem;
    padding-left: 0;
}

html[lang="ar"] .custom-control-input {
    right: 0;
    left: auto;
}

/* More specific news page fixes */
html[lang="ar"] .page-title .breadcrumb,
html[lang="ar"] .page-title h1 {
    text-align: right;
}

html[lang="ar"] .news-categories .btn {
    margin-right: 0;
    margin-left: 0.25rem;
}

/* Fix the direction of dropdown submenus */
html[lang="ar"] .dropdown-item.dropdown.dropright {
    display: flex;
    flex-direction: row-reverse;
}

html[lang="ar"] .dropdown-item.dropdown.dropright .dropdown-toggle::after {
    transform: rotate(180deg);
}

/* Fix news cards direction */
html[lang="ar"] .card-body {
    text-align: right;
}

html[lang="ar"] .card-body .text-heading.hover-primary {
    display: block;
    text-align: right;
}

/* Fix for mobile menu */
html[lang="ar"] .navbar-collapse .dropdown-menu {
    text-align: right;
}

/* Fix for News categories tabs */
html[lang="ar"] .list-inline .list-inline-item {
    display: inline-block;
}

/* Fix header elements for all pages */
html[lang="ar"] header.main-header {
    direction: rtl;
}

html[lang="ar"] .ml-auto {
    margin-right: auto !important;
    margin-left: 0 !important;
}

html[lang="ar"] .mr-auto {
    margin-left: auto !important;
    margin-right: 0 !important;
}

/* Specific fixes for project and offer details pages */
html[lang="ar"] .d-sm-flex.justify-content-sm-between {
    direction: rtl;
}

html[lang="ar"] .list-inline.d-sm-flex.align-items-sm-center li {
    text-align: right;
}

html[lang="ar"] .breadcrumb {
    padding-right: 0;
}

html[lang="ar"] .breadcrumb-item {
    display: flex;
    align-items: center;
}

html[lang="ar"] .breadcrumb-item::before {
    padding-left: 0.5rem;
    padding-right: 0;
}

/* Fix icons in pages */
html[lang="ar"] i.fal.fa-map-marker-alt,
html[lang="ar"] i.fal.fa-clock,
html[lang="ar"] i.fal.fa-eye,
html[lang="ar"] i.fal.fa-calendar-alt {
    margin-right: 0 !important;
    margin-left: 0.5rem !important;
}

/* Fix top gallery section */
html[lang="ar"] .galleries.m-n1 .item {
    direction: rtl;
}

html[lang="ar"] .position-absolute.pos-fixed-top-right {
    right: auto;
    left: 0;
}

/* Fix form search in offers page */
html[lang="ar"] .form-search-01 .form-inline {
    direction: rtl;
}

html[lang="ar"] .form-search-01 .form-group,
html[lang="ar"] .form-search-01 .form-control,
html[lang="ar"] .form-search-01 .selectpicker {
    text-align: right;
}

html[lang="ar"] .form-search-01 .form-group .dropdown-toggle::after {
    position: absolute;
    left: 1rem;
    right: auto;
}

/* Custom checkbox adjustments for search forms */
html[lang="ar"] .custom-control.custom-checkbox {
    padding-left: 0;
    padding-right: 1.5rem;
    text-align: right;
}

html[lang="ar"] .custom-control.custom-checkbox .custom-control-label {
    text-align: right;
}

/* Section headings and titles */
html[lang="ar"] section h1,
html[lang="ar"] section h2,
html[lang="ar"] section h3,
html[lang="ar"] section h4,
html[lang="ar"] section h5,
html[lang="ar"] section h6 {
    text-align: right;
}

/* Fix d-flex containers */
html[lang="ar"] .d-flex {
    direction: rtl;
}

html[lang="ar"] .d-sm-flex {
    direction: rtl;
}

/* Fix flex row columns */
html[lang="ar"] .row {
    direction: rtl;
}

/* Fix badges placement in property listings */
html[lang="ar"] .badge.badge-orange.mr-2 {
    margin-right: 0 !important;
    margin-left: 0.5rem !important;
}

/* Fix carousel/slick slider buttons */
html[lang="ar"] .slick-prev {
    left: auto;
    right: 1rem;
}

html[lang="ar"] .slick-next {
    right: auto;
    left: 1rem;
}

/* Fix galleries layout on project page */
html[lang="ar"] .col-lg-6.p-1:first-child {
    order: 2;
}

html[lang="ar"] .col-lg-6.p-1:last-child {
    order: 1;
}

/* Homepage view all news link placement */
html[lang="ar"] .ml-auto.text-heading.hover-primary {
    margin-right: auto !important;
    margin-left: 0 !important;
    text-align: left;
}

/* Bootstrap fixes for article page layout */
html[lang="ar"] .col-lg-8.pr-xl-7 {
    padding-right: 15px !important;
    padding-left: 3rem !important;
}

/* Fix property details page icons and bullets */
html[lang="ar"] .list-inline-item i {
    margin-right: 0;
    margin-left: 0.25rem;
}

/* Fix forms direction for popups and modals */
html[lang="ar"] form {
    direction: rtl;
    text-align: right;
}

/* Fix header section bars for all pages */
html[lang="ar"] .primary-content.pt-8 {
    direction: rtl;
}

/* Fix dropdown submenu positioning for Arabic */
html[lang="ar"] .dropdown-menu .dropdown-menu {
    right: 100% !important;
    left: auto !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
}

html[lang="ar"] .dropdown-item.dropdown.dropright .dropdown-menu {
    right: 100% !important;
    left: auto !important;
    margin-right: 0.125rem !important;
    margin-left: 0 !important;
}

/* Fix arrow direction for submenu indicators */
html[lang="ar"] .dropdown-item.dropdown.dropright .dropdown-toggle::after {
    transform: rotate(180deg);
    position: absolute;
    left: 1rem;
    right: auto;
}

/* Ensure proper positioning of main navigation dropdowns */
html[lang="ar"] .navbar-nav .nav-item.dropdown .dropdown-menu {
    right: 0 !important;
    left: auto !important;
}

/* Fix dropdown toggle icon positioning */
html[lang="ar"] .dropdown .dropdown-toggle::after {
    margin-right: 0.255em;
    margin-left: 0;
}

/* Ensure submenu opens on correct side */
html[lang="ar"] .dropdown-submenu {
    position: relative;
}

html[lang="ar"] .dropdown-submenu .dropdown-menu {
    top: 0;
    right: 100%;
    left: auto;
    margin-top: 0;
    margin-right: 0.125rem;
}

/* Ensure menu items are aligned correctly */
html[lang="ar"] .dropdown-item {
    text-align: right;
}

/* Fix for category dropdown placement in projects menu */
html[lang="ar"] #navbar-item-pages .dropdown-menu {
    right: 0 !important;
    left: auto !important;
}

html[lang="ar"] #navbar-item-pages .dropdown-item.dropdown.dropright .dropdown-menu {
    right: 100% !important;
    left: auto !important;
}

/* Comprehensive mobile and tablet menu fixes for Arabic RTL */
@media (max-width: 991.98px) {
    /* Basic mobile menu structure fixes */
    html[lang="ar"] .navbar-collapse {
        right: 0 !important;
        left: auto !important;
        text-align: right !important;
    }
    
    /* Main nav items in mobile */
    html[lang="ar"] .navbar-nav {
        padding-right: 0 !important;
        text-align: right !important;
    }
    
    /* Ensure all dropdown menus appear correctly */
    html[lang="ar"] .navbar-nav .dropdown-menu {
        right: 0 !important;
        left: auto !important;
        margin-right: 0 !important;
        padding-right: 1rem !important;
        position: static !important;
        float: none !important;
        width: 100% !important;
        border: none !important;
    }
    
    /* Fix nested dropdown menus */
    html[lang="ar"] .dropdown-item.dropdown .dropdown-menu {
        right: 0 !important;
        left: auto !important;
        margin-right: 1rem !important;
        padding-right: 1rem !important;
        display: block !important;
    }
    
    /* Fix dropright items in mobile */
    html[lang="ar"] .dropdown-item.dropdown.dropright {
        display: block !important;
        width: 100% !important;
    }
    
    /* Fix toggle indicators for mobile */
    html[lang="ar"] .dropdown-toggle::after {
        position: absolute !important;
        left: 1rem !important;
        right: auto !important;
    }
    
    /* Fix dropdown icon direction */
    html[lang="ar"] .dropdown-item.dropdown.dropright .dropdown-toggle::after {
        transform: rotate(90deg) !important;
    }
    
    /* Fix spacing for nested menus */
    html[lang="ar"] .dropdown-menu .dropdown-item {
        padding-right: 1.5rem !important;
        padding-left: 1rem !important;
    }
    
    /* Fix Projects submenu specifically */
    html[lang="ar"] #navbar-item-pages .dropdown-menu,
    html[lang="ar"] #navbar-item-dashboard .dropdown-menu {
        display: none !important;
    }
    
    html[lang="ar"] #navbar-item-pages.show .dropdown-menu,
    html[lang="ar"] #navbar-item-dashboard.show .dropdown-menu {
        display: block !important;
    }
    
    /* Fix toggle button position */
    html[lang="ar"] .navbar-toggler {
        margin-right: auto !important;
        margin-left: 0 !important;
    }
    
    /* Ensure RTL for navbar brand and toggler container */
    html[lang="ar"] .navbar > .container {
        flex-direction: row-reverse !important;
    }
    
    /* Fix dropdown link appearance */
    html[lang="ar"] .dropdown-link {
        text-align: right !important;
        display: block !important;
        width: 100% !important;
    }
    
    /* Fix category/subcategory indentation */
    html[lang="ar"] .dropdown-item.dropdown .dropdown-menu .dropdown-item {
        padding-right: 2.5rem !important;
    }

    /* Fix full mobile menu by forcing RTL */
    html[lang="ar"] #primaryMenu01 {
        direction: rtl !important;
        text-align: right !important;
    }
    
    /* Fix mobile language switcher */
    html[lang="ar"] .d-block.d-lg-none .navbar-nav.flex-row {
        justify-content: flex-start !important;
    }
}

/* Fix for tablets specifically */
@media (min-width: 768px) and (max-width: 991.98px) {
    html[lang="ar"] .navbar-collapse {
        right: 0 !important;
        left: auto !important;
    }
    
    html[lang="ar"] .navbar-expand-lg .navbar-nav .dropdown-menu {
        position: static !important;
        float: none !important;
    }
}

/* Mobile menu text alignment fixes */
html[lang="ar"] .navbar-nav .nav-item .nav-link,
html[lang="ar"] .navbar-nav .dropdown-item,
html[lang="ar"] .dropdown-menu .dropdown-item,
html[lang="ar"] .dropdown-submenu .dropdown-item {
    text-align: right !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    width: 100% !important;
}

/* Fix dropdown submenu text alignment in mobile */
html[lang="ar"] .dropdown-menu {
    text-align: right !important;
    padding-right: 1rem !important;
    padding-left: 0 !important;
}

/* Fix mobile submenu arrow positions */
html[lang="ar"] .navbar-nav .dropdown-toggle::after {
    position: absolute !important;
    left: 1rem !important;
    right: auto !important;
}

/* Fix for mobile menu content alignment */
@media (max-width: 991.98px) {
    /* Ensure dropdown items are right-aligned in all cases */
    html[lang="ar"] .navbar-nav .nav-item .nav-link,
    html[lang="ar"] .navbar-nav .dropdown-item,
    html[lang="ar"] .dropdown-menu .dropdown-item,
    html[lang="ar"] .dropdown-submenu .dropdown-item {
        text-align: right !important;
        justify-content: flex-start !important;
        flex-direction: row-reverse !important;
        padding-right: 1rem !important;
        padding-left: 2rem !important;
    }
    
    /* Fix mobile submenu structure */
    html[lang="ar"] .dropdown-menu {
        width: 100% !important;
        position: static !important;
        float: none !important;
        background-color: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        margin-top: 0 !important;
        margin-right: 0 !important;
        padding-right: 1rem !important;
    }
    
    /* Special fix for the category items */
    html[lang="ar"] #navbar-item-pages.nav-item.dropdown .dropdown-item.dropdown.dropright {
        display: flex !important;
        flex-direction: row-reverse !important;
        text-align: right !important;
        width: 100% !important;
    }
    
    /* Fix submenu nesting in mobile */
    html[lang="ar"] .dropdown-menu .dropdown-menu {
        margin-right: 1.5rem !important;
        padding-right: 0 !important;
    }
    
    /* Ensure back arrow icon is on left side */
    html[lang="ar"] .navbar-nav .dropdown-toggle::after {
        margin-left: 0 !important;
        margin-right: auto !important;
        position: absolute !important;
        left: 1rem !important;
        right: auto !important;
    }
    
    /* Force correct order of icon and text for all menu items */
    html[lang="ar"] .nav-link,
    html[lang="ar"] .dropdown-link {
        display: flex !important;
        flex-direction: row-reverse !important;
        justify-content: space-between !important;
        width: 100% !important;
    }
    
    /* Fix for back button in submenus */
    html[lang="ar"] .dropdown-submenu .dropdown-item:before {
        content: "\f104" !important; /* Replace with back arrow */
        font-family: "Font Awesome 5 Pro" !important;
        display: inline-block !important;
        margin-left: 0.5rem !important;
        margin-right: 0 !important;
    }
    
    /* Fix specific issue with Categories submenu in screenshot */
    html[lang="ar"] #navbar-item-pages .dropdown-menu {
        text-align: right !important;
    }
    
    html[lang="ar"] #navbar-item-pages .dropdown-menu .dropdown-item {
        text-align: right !important;
        padding-right: 1.5rem !important;
    }
    
    /* Force text alignment for all menu items */
    html[lang="ar"] #primaryMenu01 * {
        text-align: right !important;
    }
}

/* Fix for dropright elements to show category name on right */
html[lang="ar"] .dropdown-item.dropdown.dropright a {
    text-align: right !important;
}