/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */


@font-face {
    font-family: 'Tajawal-Bold';
    src: url('/fonts/Tajawal-Bold.ttf') format('truetype'), url('/fonts/Tajawal-Bold.woff2') format('woff2'), url('/fonts/Tajawal-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}
body {
    font-family: 'Tajawal-Bold', sans-serif;
}
/* ========= Sidebar Pro (RTL) ========= */
:root {
    --sb-bg: #0f172a; /* خلفية الشريط */
    --sb-bg-2: #111827; /* خلفية العناصر/الهيدر */
    --sb-fg: #e5e7eb; /* نص أساسي */
    --sb-muted: #9ca3af; /* نص خافت */
    --sb-active: #1d4ed8; /* لون مفعّل */
    --sb-hover: rgba(255,255,255,.06);
    --sb-border: rgba(255,255,255,.08);
    --sb-radius: 12px;
    --sb-indicator: #38bdf8; /* لون شريط المؤشر */
}

.sidebar {
    background: var(--sb-bg) !important;
    color: var(--sb-fg);
    width: 290px;
    border-inline-end: 1px solid var(--sb-border);
}

    .sidebar .sidebar-content {
        padding: 16px 14px !important;
    }

.sidebar-nav {
    margin: 0;
    padding: 0;
    list-style: none;
}

.sidebar-brand {
    background: var(--sb-bg-2);
    border: 1px solid var(--sb-border);
    border-radius: var(--sb-radius);
    padding: 12px;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
}

/* عناوين الأقسام */
.sidebar-header {
    color: var(--sb-muted);
    letter-spacing: .5px;
    font-size: 12px;
    padding: 14px 10px 8px;
    margin-top: 8px;
    border-top: 1px dashed var(--sb-border);
}

/* عنصر قائمة */
.sidebar-item {
    margin: 8px 0;
}

/* رابط */
.sidebar-link {
    display: flex;
    align-items: center;
    gap: 10px;
    background: transparent;
    color: var(--sb-fg);
    padding: 10px 12px;
    border-radius: var(--sb-radius);
    text-decoration: none;
    border: 1px solid transparent;
    transition: background .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

    .sidebar-link i {
        font-size: 15px;
        min-width: 18px;
        text-align: center;
        opacity: .9;
    }

    .sidebar-link:hover {
        background: var(--sb-hover);
        border-color: var(--sb-border);
    }

    /* حالة تركيز للوصولية */
    .sidebar-link:focus-visible {
        outline: none;
        box-shadow: 0 0 0 3px rgba(56,189,248,.35);
    }

    /* نشط (موحّد — لا تعريف مزدوج) */
    .sidebar-link.active {
        background: linear-gradient(90deg, var(--sb-active) 0%, #2563eb 80%);
        color: #fff;
        box-shadow: 0 4px 12px rgba(29,78,216,.35);
    }
/* مؤشر جانبي للعناصر النشطة داخل القوائم العلوية فقط */
.sidebar-item > .sidebar-link.active {
    border-inline-start: 4px solid var(--sb-indicator);
    padding-inline-start: 8px; /* تعويض مساحة المؤشر */
}

/* روابط قابلة للطي */
.sidebar-link.collapsible {
    position: relative;
}

.sidebar-link .caret {
    margin-inline-start: auto;
    transition: transform .2s ease;
}

.sidebar-link[aria-expanded="true"] .caret {
    transform: rotate(180deg);
}

/* القائمة الداخلية */
.sidebar-dropdown {
    padding: 6px 0;
    margin: 4px 0 0;
    border-inline-start: 2px solid var(--sb-border);
}

    .sidebar-dropdown .sidebar-link {
        padding: 8px 14px;
        margin-inline: 6px;
        border-radius: 10px;
        color: var(--sb-muted);
    }

        .sidebar-dropdown .sidebar-link:hover {
            color: var(--sb-fg);
        }

/* شارة صغيرة اختيارية */
.badge-pill {
    font-size: 11px;
    padding: 3px 8px;
    border-radius: 20px;
    background: var(--sb-bg-2);
    color: #fff;
}

/* شريط تمرير لطيف */
.js-simplebar {
    scrollbar-width: thin;
}

    .js-simplebar::-webkit-scrollbar {
        width: 8px;
    }

    .js-simplebar::-webkit-scrollbar-thumb {
        background: var(--sb-border);
        border-radius: 10px;
    }

/* RTL: اجعل حدود القائمة الداخلية على اليمين، وأبقِ مؤشر العنصر النشط بمنطق الحدود */
[dir="rtl"] .sidebar-dropdown {
    border-inline-start: none;
    border-inline-end: 2px solid var(--sb-border);
}
/* في RTL المؤشر سيبقى باستخدام logical properties بدون تعديل إضافي */