/* =========================================
   1. CORE RTL SETUP
   ========================================= */
html[dir="rtl"],
body[dir="rtl"] {
    direction: rtl;
    text-align: right;
    overflow-x: hidden;
}

/* =========================================
   2. LAYOUT & POSITIONING
   ========================================= */

/* Sidebar (Vertical Menu) - Fixed to the RIGHT */
[dir="rtl"] .app-menu.navbar-menu {
    right: 0 !important;
    left: auto !important;
    border-right: none !important;
    border-left: 1px solid rgba(255, 255, 255, 0.05) !important;
    transform: none !important;
    top: 0;
    bottom: 0;
    position: fixed;
    z-index: 1004;
    background: linear-gradient(180deg, #0f172a 0%, #1e1b4b 100%) !important;
}

/* Sidebar Logo Area Alignment */
[dir="rtl"] .navbar-brand-box {
    text-align: right;
    padding: 0 1.3rem;
    background: transparent !important;
}

/* SimpleBar RTL Padding & Offset Fix */
[dir="rtl"] .simplebar-content {
    padding-right: 0px !important;
    padding-left: 0px !important;
}

[dir="rtl"] .simplebar-offset {
    right: 0 !important;
    left: auto !important;
}

/* =========================================
   2.1. COLOR CONSISTENCY (Matches EN Colors 100%)
   ========================================= */

/* Sidebar navigation link colors */
[dir="rtl"] .navbar-menu .navbar-nav {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

[dir="rtl"] .navbar-menu .navbar-nav .nav-link {
    color: #94a3b8 !important;
}

[dir="rtl"] .navbar-menu .navbar-nav .nav-link:hover {
    color: #ffffff !important;
    background: rgba(99, 102, 241, 0.14) !important;
}

[dir="rtl"] .navbar-menu .navbar-nav .nav-link.active,
[dir="rtl"] .navbar-menu .navbar-nav .nav-link[aria-expanded="true"] {
    color: #ffffff !important;
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.3) 0%, rgba(139, 92, 246, 0.25) 100%) !important;
    border-inline-start: 3px solid #6366f1 !important;
}

[dir="rtl"] .navbar-menu .navbar-nav .nav-link.active i,
[dir="rtl"] .navbar-menu .navbar-nav .nav-link:hover i {
    color: #818cf8 !important;
}

/* RTL Collapse Arrow Indicator Positioning */
[dir="rtl"] .app-menu .navbar-nav .nav-link[data-bs-toggle="collapse"]::after,
[dir="rtl"] .app-menu .navbar-nav .nav-link::after {
    right: auto !important;
    left: 1.25rem !important;
}

/* Submenu Padding in RTL */
[dir="rtl"] .app-menu .menu-dropdown .nav {
    padding-right: 1.5rem !important;
    padding-left: 0.5rem !important;
}

/* Menu title color */
[dir="rtl"] .navbar-menu .menu-title {
    color: #64748b !important;
}

/* Ensure light logo is displayed on dark background */
[dir="rtl"] .navbar-brand-box .logo-dark {
    display: none !important;
}

[dir="rtl"] .navbar-brand-box .logo-light {
    display: inline-block !important;
}

/* Header (Topbar) - Pushed to the LEFT of the sidebar */
[dir="rtl"] #page-topbar {
    right: 250px !important;
    left: 0 !important;
    width: auto !important;
    transition: all 0.1s ease-out;
    background: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

[data-bs-theme="dark"][dir="rtl"] #page-topbar {
    background: #0f172a !important;
    border-bottom: 1px solid #1e293b !important;
}

/* Main Content Area - Pushed to the LEFT of the sidebar */
[dir="rtl"] .main-content {
    margin-right: 250px !important;
    margin-left: 0 !important;
    transition: all 0.1s ease-out;
}

/* Footer - Pushed to the LEFT of the sidebar */
[dir="rtl"] .footer {
    right: 250px !important;
    left: 0 !important;
    width: auto !important;
}

/* =========================================
   3. COLLAPSED SIDEBAR (Icons Only)
   ========================================= */

[dir="rtl"][data-sidebar-size="sm"] .main-content,
[dir="rtl"][data-sidebar-size="sm"] .footer {
    margin-right: 70px !important;
}

[dir="rtl"][data-sidebar-size="sm"] #page-topbar {
    right: 70px !important;
}

[dir="rtl"][data-sidebar-size="sm"] .navbar-menu {
    width: 70px !important;
}

[dir="rtl"][data-sidebar-size="sm"] .navbar-menu .navbar-nav .nav-link span {
    display: none;
}

[dir="rtl"][data-sidebar-size="sm"] .navbar-menu .navbar-nav .nav-link i {
    margin-right: 0;
    margin-left: 0;
    display: block;
    text-align: center;
    font-size: 22px;
}

/* =========================================
   4. RESPONSIVE / MOBILE (Screens < 768px)
   ========================================= */
@media (max-width: 767.98px) {
    [dir="rtl"] .main-content {
        margin-right: 0 !important;
    }
    [dir="rtl"] #page-topbar {
        right: 0 !important;
    }
    [dir="rtl"] .footer {
        right: 0 !important;
    }
    
    [dir="rtl"] .navbar-menu {
        right: -250px !important; 
        display: none;
    }

    [dir="rtl"].vertical-sidebar-enable .navbar-menu {
        display: block;
        right: 0 !important;
    }
}

/* =========================================
   5. COMPONENT OVERRIDES & FIXES
   ========================================= */

/* Flip Directional Icons */
[dir="rtl"] .bx-right-arrow-alt:before { content: "\ea19"; }
[dir="rtl"] .bx-left-arrow-alt:before { content: "\ea27"; }
[dir="rtl"] .ri-arrow-right-line:before { content: "\ea60"; }
[dir="rtl"] .ri-arrow-left-line:before { content: "\ea6c"; }
[dir="rtl"] .mdi-chevron-right:before { content: "\f0141"; }
[dir="rtl"] .mdi-chevron-left:before { content: "\f0142"; }

/* Dropdown Menus */
[dir="rtl"] .dropdown-menu {
    text-align: right;
    right: auto !important;
}
[dir="rtl"] .dropdown-menu-end {
    left: 0 !important;
    right: auto !important;
}

/* List Groups */
[dir="rtl"] .list-group {
    padding-right: 0;
    padding-left: 0;
}

/* Form Inputs & Checks */
[dir="rtl"] .form-check {
    padding-right: 1.5em;
    padding-left: 0;
}
[dir="rtl"] .form-check .form-check-input {
    float: right;
    margin-right: -1.5em;
    margin-left: 0;
}
[dir="rtl"] .form-control, 
[dir="rtl"] .form-select {
    text-align: right;
    background-position: left 0.75rem center;
}

/* Spacing Utilities Reversal */
[dir="rtl"] .ms-1 { margin-right: 0.25rem !important; margin-left: 0 !important; }
[dir="rtl"] .me-1 { margin-left: 0.25rem !important; margin-right: 0 !important; }
[dir="rtl"] .ms-2 { margin-right: 0.5rem !important; margin-left: 0 !important; }
[dir="rtl"] .me-2 { margin-left: 0.5rem !important; margin-right: 0 !important; }
[dir="rtl"] .ms-3 { margin-right: 1rem !important; margin-left: 0 !important; }
[dir="rtl"] .me-3 { margin-left: 1rem !important; margin-right: 0 !important; }
[dir="rtl"] .ms-auto { margin-right: auto !important; margin-left: 0 !important; }
[dir="rtl"] .me-auto { margin-left: auto !important; margin-right: 0 !important; }

/* Float & Text Align Reversal */
[dir="rtl"] .float-start { float: right !important; }
[dir="rtl"] .float-end { float: left !important; }
[dir="rtl"] .text-start { text-align: right !important; }
[dir="rtl"] .text-end { text-align: left !important; }

/* Close Buttons */
[dir="rtl"] .btn-close {
    margin-left: 0;
    margin-right: auto;
}

/* ApexCharts RTL fix */
[dir="rtl"] .apexcharts-canvas {
    direction: ltr;
}
[dir="rtl"] .apexcharts-legend-marker {
    margin-right: 0;
    margin-left: 5px;
}
