/* mani-shell-rtl.css */

body, html {
    font-family: 'Cairo', 'Plus Jakarta Sans', system-ui, sans-serif;
}

.mnx-nav-list {
    padding-right: 0 !important;
    padding-left: 0 !important;
    list-style: none !important;
    margin: 0;
}

.mnx-rail {
    border-right: none !important;
    border-left: 1px solid var(--mnx-border);
}

.mnx-drawer {
    border-right: none !important;
    border-left: 1px solid var(--mnx-border);
    margin-left: 0 !important;
    margin-right: 0;
}

.mnx-app.drawer-closed .mnx-drawer {
    margin-left: 0 !important;
    margin-right: calc(var(--mnx-drawer) * -1) !important;
}

/* Smart Hover Push State for RTL */
.mnx-app.drawer-closed.drawer-hovered .mnx-drawer {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.mnx-rail-btn[data-tip]:hover::after {
    left: auto;
    right: calc(100% + 14px);
}

.mnx-rail-btn[data-tip]:hover::before {
    left: auto;
    right: calc(100% + 7px);
    border-right-color: transparent;
    border-left-color: var(--mnx-ink);
}

.mnx-top-btn {
    justify-content: center;
}

.mnx-bc-sep {
    transform: none !important;
    display: inline-block;
    font-size: 10px !important;
}

.mnx-user-row {
    flex-direction: row;
}

.mnx-user-meta {
    text-align: right;
}

@keyframes mnx-soft-fade {
    from { opacity: 0; }
    to { opacity: 1; }
}

.mnx-nav-section.is-active {
    animation: mnx-soft-fade 0.2s ease-in-out forwards;
}

@media(max-width:768px) {
    .mnx-drawer {
        left: auto !important;
        right: 56px;
        box-shadow: -8px 0 24px rgba(0, 0, 0, .08);
    }

    .mnx-app.drawer-closed .mnx-drawer {
        margin-left: 0 !important;
        margin-right: calc(var(--mnx-drawer) * -1) !important;
        box-shadow: none;
    }
}