/* Apply Cairo to everything when Arabic is active */
html[lang="ar"],
html[lang="ar"] body {
    font-family: "Cairo", sans-serif !important;
}

/* Optional: fix icon alignment for better Arabic UI spacing */
html[lang="ar"] .menu-title {
    font-family: "Cairo", sans-serif !important;
}

html[lang="ar"] h1,
html[lang="ar"] h2,
html[lang="ar"] h3,
html[lang="ar"] h4,
html[lang="ar"] h5,
html[lang="ar"] h6 {
    font-family: "Cairo", sans-serif !important;
}

/* -------- GLOBAL RTL -------- */
body[dir="rtl"] {
    direction: rtl;
    text-align: right;
}

/* -------- SIDEBAR -------- */
body[dir="rtl"] .sidebar-wrapper {
    left: unset;
    right: 0;
    border-right: 0;
    border-left: 1px solid #e4e4e4;
}

body[dir="rtl"] .sidebar-header {
    left: unset;
    right: 0;
}

/* -------- TOPBAR -------- */
body[dir="rtl"] .topbar {
    left: 0;
    right: 250px;
}

body[dir="rtl"] .wrapper.toggled .topbar {
    right: 70px;
}

/* -------- PAGE WRAPPER -------- */
body[dir="rtl"] .page-wrapper {
    margin-left: 0;
    margin-right: 250px;
}

body[dir="rtl"] .wrapper.toggled .page-wrapper {
    margin-right: 70px;
}

/* -------- PAGE FOOTER ---------- */
body[dir="rtl"] .page-footer {
    left: 0;
    right: 250px;
}
body[dir="rtl"] .wrapper.toggled .page-footer {
    right: 70px;
}

/* -------- MENU ALIGNMENT -------- */
body[dir="rtl"] .metismenu a {
    justify-content: right;
}

body[dir="rtl"] .metismenu a .menu-title {
    margin-left: 0;
    margin-right: 10px;
}

/* Arrow for submenus */
body[dir="rtl"] .metismenu .has-arrow:after {
    right: unset;
    left: 15px;
    transform: rotate(135deg) translateY(-50%);
}