<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>aqlam - Dashboard</title>

    <!-- Custom fonts for this template-->
    <link href="vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">
    <link
        href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i"
        rel="stylesheet">
    <!-- Buttons extension -->
<!-- <link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.4.2/css/buttons.dataTables.min.css"> -->
    <!-- Custom styles for this template-->
    <link href="css/sb-admin-2.min.css" rel="stylesheet">
    <link href="https://cdn.datatables.net/buttons/3.2.5/css/buttons.dataTables.css" rel="stylesheet"/>
    <style>
        body{background:#f5f7fb}
.pos-header{background:#fff;padding:12px;border-radius:10px}
.service-card{cursor:pointer;transition:0.15s}
.service-card:hover{transform:scale(1.02)}
.bill-box{background:#fff;border-radius:12px;padding:18px}
.item-row{border-bottom:1px solid #eee;padding:10px 0}
.muted-small{font-size:0.9rem;color:#666}
.disabled-note{font-size:0.85rem;color:#999}
        .form-group {
            direction: rtl !important;
            text-align: right !important;
        }

        h1,
        p,
        th,
        td,
        tr {
            direction: rtl !important;
            text-align: right !important;
        }

        .form-check-input {
            margin-right: 60px !important;
        }

        video,
        img#snapshot {
            width: 100%;
            height: auto;
            border-radius: .5rem;
            background: #000;
        }

        #snapshot {
            display: none;
            margin-top: 1rem;
        }

        #downloadLink {
            display: none;
        }

        .student-card {
            transition: transform 0.2s;
        }

        .student-card:hover {
            transform: scale(1.02);
        }

        .student-img {
            width: 80px;
            height: 80px;
            object-fit: cover;
            border-radius: 50%;
            border: 2px solid #0d6efd;
        }

        .sidebar {
            right: 0 !important;
            left: auto !important;
        }

        /* محتوى الصفحة يزاح لليسار */


        /* النصوص يمين */
        .sidebar .nav-item .nav-link {
            text-align: right;
        }

        /* الأيقونة تيجي بعد النص */
        .sidebar .nav-item .nav-link i {
            margin-left: 10px;
            margin-right: 0;
        }

        .student-card img {
            margin-left: 15px;
            /* لو RTL */
        }

        .page-title {
            font-weight: 700;
            color: #0d6efd;
        }

        .barcode-card {
            border: none;
            border-radius: 1rem;
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
        }

        .student-card {
            border: none;
            border-radius: 1rem;
            transition: transform 0.2s;
        }

        .student-card:hover {
            transform: scale(1.02);
            box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
        }

        .student-card img {
            border: 3px solid #e9ecef;
            object-fit: cover;
        }

        .group-buttons .btn {
            border-radius: 20px;
            font-weight: 600;
        }

        .navbar .btn-link {
            margin-left: 1rem !important;
            margin-right: 0 !important;
        }

/* الخلفية العامة للـ sidebar بنكهة Material */
.md-sidebar {
    background: #ffffff;
    color: #263238;
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.08);
    padding-top: 0.75rem;
    font-size: 0.9rem;
}

/* لوجو / اسم الشركة */
.md-sidebar .md-logo {
    padding: 0.75rem 1rem;
    margin-bottom: 0.25rem;
}
.md-sidebar .sidebar-brand-text {
    font-weight: 700;
    font-size: 1rem;
    color: #1e88e5;
}

/* heading فوق القوائم */
.md-sidebar .sidebar-heading {
    font-size: 0.75rem;
    font-weight: 600;
    color: #90a4ae;
    padding: 0 1rem;
}

/* شكل عنصر القائمة الرئيسي */
.md-sidebar .md-nav-link {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin: 2px 0;   /* بدون يمين + شمال */
    padding: 0.6rem 1rem;
    border-radius: 10px; /* أنعم وأضيق */
    color: #37474f;
    position: relative;
    overflow: hidden;
}

/* icon + text */
.md-sidebar .md-icon {
    width: 26px;
    text-align: center;
    font-size: 0.95rem;
    color: #546e7a;
}
.md-sidebar .md-text {
    flex: 1;
    white-space: nowrap;
}

/* السهم */
.md-sidebar .md-arrow {
    font-size: 0.7rem;
    color: #b0bec5;
    transition: transform 0.2s ease;
}

/* لما القائمة مفتوحة – لف السهم */
.md-sidebar .nav-link[aria-expanded="true"] .md-arrow i {
    transform: rotate(90deg);
}

/* hover & active بأسلوب Material */
.md-sidebar .md-nav-link:hover {
    background: rgba(33, 150, 243, 0.06);
    color: #1e88e5;
}
.md-sidebar .md-nav-link:hover .md-icon {
    color: #1e88e5;
}

.md-sidebar .nav-item.active > .md-nav-link {
    background: rgba(33, 150, 243, 0.12);
    color: #1e88e5;
}
.md-sidebar .nav-item.active > .md-nav-link .md-icon {
    color: #1e88e5;
}

.md-nav-link:hover,
.nav-item.active > .md-nav-link {
    border-radius: 8px;
}


/* inner collapse = كأنها card Material */
.md-sidebar .md-collapse-inner {
    background: #fafafa;
    border-radius: 16px;
    margin: 0.15rem 0.9rem 0.4rem;
    padding: 0.4rem 0.5rem 0.45rem;
    border: 1px solid #eceff1;
}

/* العناصر داخل المنسدلة */
.md-sidebar .md-collapse-item {
    display: block;
    padding: 0.4rem 0.75rem;
    margin: 0.1rem 0;
    border-radius: 10px;
    font-size: 0.85rem;
    color: #455a64;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease, transform 0.08s ease;
}
.md-sidebar .md-collapse-item:hover {
    background: rgba(33, 150, 243, 0.10);
    color: #0d47a1;
    transform: translateX(-2px);
}

/* شريط فاصل Material بدل hr الغامق */
.md-sidebar .sidebar-divider {
    border-top: 1px solid #eceff1;
    margin: 0.5rem 1rem;
}

/* إخفاء اللون القديم لأي .sidebar-dark أو bg-gradient-primary قديمة */
.sidebar.md-sidebar.sidebar-dark,
.bg-gradient-primary.md-sidebar {
    background: #ffffff !important;
}


.md-sidebar {
    overflow: hidden;   /* يمنع أي تمدد للخارج */
}

/* عنصر القائمة */
.md-nav-link {
    margin: 3px 0;      /* بدون يمين/شمال */
    padding: 0.65rem 1rem;
    border-radius: 8px; /* Material style */
}

/* الـ Hover */
.md-nav-link:hover {
    background: rgba(30, 136, 229, 0.06);
    color: var(--khedma-primary);
}

/* Active */
.nav-item.active > .md-nav-link {
    background: rgba(30, 136, 229, 0.12);
    border-radius: 8px;
}

.md-collapse-inner a {
    text-decoration: none !important;
}

/* ألوان الهوية */
:root {
    --khedma-primary: #1E88E5;
    --khedma-primary-dark: #1565C0;
    --khedma-accent: #26C6DA;
    --khedma-text: #263238;
    --khedma-text-muted: #90A4AE;
}

/* الـ nav نفسه */
.khedma-nav {
    height: 60px;
    padding-inline: 1rem;
}

/* البراند */
.khedma-brand .brand-icon {
    width: 34px;
    height: 34px;
    border-radius: 2px;
    background: linear-gradient(135deg, var(--khedma-primary), var(--khedma-accent));
    color: #fff;
    font-size: 0.9rem;
}
.khedma-brand .brand-text {
    font-weight: 900;
    font-size: 0.99rem;
    color: black;
}
.khedma-brand .tagline {
    font-size: 0.7rem;
    color: var(--khedma-text-muted);
}

/* الروابط في النص */
.khedma-nav-links .nav-link {
    padding: 0.4rem 0.9rem;
    border-radius: 9px;
    font-size: 0.88rem;
    color: black;
    transition: background 0.15s ease, color 0.15s ease;
}

.khedma-nav-links .nav-link:hover {
    background: rgba(30, 136, 229, 0.08);
    color: var(--khedma-primary-dark);
}

.khedma-nav-links .nav-link.active {
    background: rgba(30, 136, 229, 0.14);
    color: black;
    font-weight: 900;
}

/* منطقة المستخدم */
.khedma-user .user-name {
    font-size: 0.85rem;
    color: var(--khedma-text);
    margin-inline-end: 0.5rem;
}

.khedma-user .btn-outline-danger {
    font-size: 0.8rem;
    padding: 0.25rem 0.75rem;
    border-radius: 9px;
}

.khedma-page {
    /* background-color: #F5F7FB; */
    padding-top: 1rem;
    padding-bottom: 2rem;
}

/* عنوان الصفحة */
.khedma-page .page-title {
    font-weight: 700;
    color: #263238;
}
.khedma-page .page-subtitle {
    font-size: 0.8rem;
    color: #90A4AE;
}

/* كارت الإحصائية */
.stat-card {
    border-radius: 14px;
}
.stat-card .stat-label {
    font-size: 0.8rem;
    color: #90A4AE;
}
.stat-card .stat-value {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1E88E5;
    line-height: 1.1;
}
.stat-card .stat-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: linear-gradient(135deg, #1E88E5, #26C6DA);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

/* كارت الجدول */
.khedma-table-card {
    border-radius: 16px;
}
.khedma-table-card .table-title {
    font-weight: 600;
    color: #263238;
}

/* شريط أدوات الداتا تابل */
.khedma-dt-toolbar {
    justify-content: flex-start;
}
.khedma-dt-buttons .btn {
    border-radius: 999px;
    padding: 0.2rem 0.75rem;
    font-size: 0.78rem;
}
.khedma-dt-buttons .btn:not(:last-child) {
    margin-left: 0.25rem;
}

/* الجدول */
#dataTable thead th {
    font-size: 0.85rem;
    color: #607D8B;
}
#dataTable tbody td {
    font-size: 0.9rem;
}

/* أزرار تعديل / حذف اللي جايه من السيرفر */
#dataTable .btn {
    border-radius: 999px;
    font-size: 0.78rem;
    padding: 0.2rem 0.75rem;
}

/* Pagination شكله أنعم */
.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 0.1rem 0.5rem !important;
    border-radius: 999px !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: #1E88E5 !important;
    color: #fff !important;
    border: none !important;
}




/* ====== DAILY REPORT PAGE ====== */

.daily-report-page {

    padding-top: 1rem;
    padding-bottom: 2rem;
}

/* عنوان الأقسام */
.daily-report-section-title {
    font-weight: 600;
    color: #263238;
}

/* صف الفلتر */
#dailyReportFilterRow .form-label {
    color: #607D8B;
    font-size: 0.8rem;
}

#dailyReportFilterRow .input-group-text {
    background-color: #f1f4f9;
    border-color: #e0e6ef;
    font-size: 0.8rem;
}

#dailyReportApplyBtn {
    border-radius: 999px;
    font-size: 0.85rem;
}

/* زر الطباعة */
#dailyReportPrintBtn {
    border-radius: 12px;
    font-size: 0.95rem;
    font-weight: 500;
}

/* الكروت العامة (لو حبيت تستعملها بعدين للإجماليات) */
.daily-report-page .card {
    border-radius: 16px;
}

/* الجداول */
.daily-report-table {
    background-color: #fff;
    border-radius: 12px;
    overflow: hidden;
}

.daily-report-table thead th {
    font-size: 0.85rem;
    color: #607D8B;
    border-bottom-width: 1px;
    background-color: #F3F6FB;
}

.daily-report-table tbody td {
    font-size: 0.88rem;
}

/* صفوف تلون خفيف */
.daily-report-table tbody tr:nth-child(even) {
    background-color: #FAFBFF;
}

/* جدول الملخص تحت */
.daily-report-summary-table {
    background-color: #fff;
    border-radius: 16px;
    overflow: hidden;
    margin-top: 0.5rem;
}

.daily-report-summary-table td {
    font-size: 0.9rem;
    padding: 0.55rem 0.9rem;
}

.daily-report-summary-table tr:nth-child(odd) td:first-child {
    background-color: #F3F6FB;
}

.daily-report-summary-table tr td:first-child {
    width: 45%;
    color: #455A64;
    font-weight: 500;
}

.daily-report-summary-table tr td:last-child {
    text-align: left;
    direction: ltr;        /* عشان الأرقام و EGP تبان مظبوطة */
    font-weight: 600;
    color: #1E88E5;
}

/* خلي إجمالي المصاريف أحمر بسيط */
.daily-report-summary-table tr:nth-last-child(2) td:last-child,
.totalExp {
    color: #E53935;
}

/* صافي الربح أخضر */
#total {
    color: #2E7D32;
}

/* مسافة بين الأقسام */
#dailyReportExpensesSection,
#dailyReportSalesSection {
    padding: 0.75rem 0.75rem 0.5rem;
    background-color: #ffffff;
    border-radius: 16px;
    margin-bottom: 0.75rem;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.03);
}

/* ====== PRINT STYLE ====== */

@media print {
    body {
        background: #ffffff !important;
    }

    .sidebar,
    .khedma-nav,
    #dailyReportApplyBtn,
    #dailyReportFilterRow,
    #dailyReportPrintBtn {
        display: none !important;
    }

    #dailyReportPage {
        padding: 0;
    }

    #printMe {
        box-shadow: none !important;
        margin: 0 !important;
    }

    .daily-report-table,
    .daily-report-summary-table {
        font-size: 11px;
    }
}
/* ====== SAFE REPORT (تقرير الخزنة) ====== */

.safe-report-page {

    padding-top: 1rem;
    padding-bottom: 2rem;
}

/* كروت الإجماليات */
.safe-summary-row .safe-summary-card {
    border-radius: 18px;
    overflow: hidden;
    position: relative;
}

.safe-summary-card .safe-summary-label {
    font-size: 0.8rem;
    color: #607D8B;
    margin-bottom: 0.35rem;
}

.safe-summary-card .safe-summary-value {
    font-size: 1.4rem;
    font-weight: 700;
    color: #1E88E5;
}

.safe-summary-card .safe-summary-value.text-danger {
    color: #E53935;
}

.safe-summary-card .safe-summary-value.text-success {
    color: #2E7D32;
}

.safe-summary-card .currency {
    font-size: 0.85rem;
    margin-left: 4px;
    opacity: 0.8;
}

/* خط ديكوري بسيط في الكروت */
.safe-summary-card::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
    width: 5px;
    height: 100%;
    background: linear-gradient(180deg, #1E88E5, #26C6DA);
    opacity: 0.7;
}

/* كارت جدول الملخص */
.safe-summary-table-card {
    border-radius: 18px;
    margin-top: 0.75rem;
}

.safe-summary-table {
    margin-bottom: 0;
}

.safe-summary-table td {
    font-size: 0.9rem;
    padding: 0.55rem 0.9rem;
}

.safe-summary-table tr td:first-child {
    width: 45%;
    color: #455A64;
    font-weight: 500;
    background-color: #F4F6FB;
}

.safe-summary-table tr td:last-child {
    text-align: left;
    direction: ltr; /* عشان الرقم + EGP يبانوا مظبوط في RTL */
    font-weight: 600;
    color: #1E88E5;
}

/* ألوان خاصة للمصاريف وصافي الربح */
.safe-summary-table .totalExp {
    color: #E53935;
}

.safe-summary-table #totalBottom {
    color: #2E7D32;
}

/* فلتر الفترات */
#safeReportApplyBtn {
    border-radius: 999px;
    font-size: 0.85rem;
}

/* لوحة ملخص الخزنة */
.safe-summary-panel {
    background-color: #ffffff;
    border-radius: 18px;
    padding: 0.75rem 1rem;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

/* صف في الملخص */
.safe-summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.45rem 0.6rem;
    border-radius: 12px;
    font-size: 0.9rem;
}

/* خلفية متبادلة للصفوف */
.safe-summary-row:nth-child(odd) {
    background-color: #F4F7FB;
}

/* آخر صف (صافي الربح) مميز أكثر */
.safe-summary-row-final {
    margin-top: 0.35rem;
    border: 1px solid rgba(46, 125, 50, 0.22);
    background: linear-gradient(90deg, #E8F5E9, #F4F9F4);
}

/* نص العنوان */
.safe-summary-label {
    color: #455A64;
    font-weight: 500;
}

/* قيمة المبلغ */
.safe-summary-value {
    min-width: 140px;
    text-align: left;
    direction: ltr; /* عشان الرقم + EGP يبانوا صح في RTL */
    font-weight: 600;
    color: #1E88E5;
}

/* العملة */
.safe-summary-value .currency {
    font-size: 0.8rem;
    margin-left: 4px;
    opacity: 0.8;
}

/* ألوان خاصة */
.safe-summary-value.text-discount {
    color: #E53935;
}

.safe-summary-value.text-expense {
    color: #D32F2F;
}

.safe-summary-value.text-profit {
    color: #2E7D32;
}

/* خلفية صفحة البيع */
.sales-page {

    padding-top: 1rem;
    padding-bottom: 1.5rem;
}

/* كارت الفاتورة */
.bill-box {
    border-radius: 18px;
}

.sale-items-wrapper {
    max-height: 260px;
    border-radius: 12px;
    border: 1px solid #e0e6ef;
    background-color: #FAFBFF;
    padding: 0.5rem;
}

.sale-items-box {
    max-height: 240px;
    overflow-y: auto;
}

/* تقدر تستخدم الكلاس ده لسطور الفاتورة اللي انت بتضيفها ديناميك */
.sale-item-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.3rem 0.4rem;
    border-radius: 8px;
    font-size: 0.85rem;
}
.sale-item-row:nth-child(odd) {
    background-color: #EEF2FF;
}

/* الإجمالي */
.sale-total-line .total_sales {
    font-size: 1.1rem;
    color: #1E88E5;
}

/* أزرار الأقسام (tabs) */
.bodyCat .sales-cat-btn {
    padding-inline: 0.8rem;
}
.bodyCat .sales-cat-btn.active {
    background-color: #1E88E5;
    border-color: #1E88E5;
    color: #fff;
}

/* كروت الخدمات */
.service-card {
    border-radius: 16px;
    cursor: pointer;
    transition: transform 0.08s ease, box-shadow 0.08s ease;
}
.service-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
}

.price-badge {
    background-color: #1E88E5;
    color: #fff;
    border-radius: 999px;
    padding: 0.25rem 0.6rem;
    font-size: 0.78rem;
}
/* أزرار التصدير في DataTables */
.dataTables_wrapper .dt-buttons .dt-button,
.dataTables_wrapper .dt-buttons .btn {
    border-radius: 999px !important;   /* زرار حبوبه */
    padding: 0.25rem 0.9rem !important;
    margin-inline-start: 0.35rem;      /* مسافة بسيطة بين الأزرار */
    font-size: 0.8rem;
    border: 1px solid #1E88E5;
    background-color: #ffffff;
    color: #1E88E5;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
    transition: background-color 0.15s ease, color 0.15s ease,
                box-shadow 0.15s ease, transform 0.05s ease;
}

/* أول زر مايبقاش لازق في اليمين */
.dataTables_wrapper .dt-buttons .dt-button:first-child,
.dataTables_wrapper .dt-buttons .btn:first-child {
    margin-inline-start: 0;
}

/* Hover */
.dataTables_wrapper .dt-buttons .dt-button:hover,
.dataTables_wrapper .dt-buttons .btn:hover {
    background-color: #1E88E5;
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(15, 23, 42, 0.18);
}

/* حالة الضغط */
.dataTables_wrapper .dt-buttons .dt-button:active,
.dataTables_wrapper .dt-buttons .btn:active {
    transform: translateY(0);
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.18);
}

/* شيل البوردار الأزرق القبيح بتاع الفوكس */
.dataTables_wrapper .dt-buttons .dt-button:focus,
.dataTables_wrapper .dt-buttons .btn:focus {
    outline: none !important;
    box-shadow: 0 0 0 0.12rem rgba(30, 136, 229, 0.25);
}
.khedma-dt-btn {
    border-radius: 999px;
    /* تقدر تعيد استخدام نفس القيم اللي فوق أو تخصّصها هنا */
}

/* ===== NAVBAR الجديد ===== */

.khedma-navbar {
    background: #ffffff;
    border-radius: 18px;
    padding: 0.75rem 1.4rem;
    margin: 0.8rem auto 1rem;
    width: 95%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    position: relative;
    z-index: 20;
}

/* اليسار (زر خروج + اسم المستخدم) */
.khedma-navbar .nav-left {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.logout-btn {
    border: 1px solid #E53935;
    background: #fff;
    color: #E53935;
    font-size: 0.8rem;
    padding: 0.3rem 0.8rem;
    border-radius: 12px;
    cursor: pointer;
    transition: 0.15s ease;
}
.logout-btn:hover {
    background: #E53935;
    color: #fff;
}

/* الروابط */
.khedma-navbar .nav-links {
    display: flex;
    gap: 1.2rem;
}

.khedma-navbar .nav-item {
    font-size: 0.9rem;
    font-weight: 500;
    color: #4C6282;
    text-decoration: none;
    padding: 0.4rem 0.8rem;
    border-radius: 12px;
    transition: 0.15s ease;
}

.khedma-navbar .nav-item:hover {
    background: rgba(30, 136, 229, 0.12);
    color: #1565C0;
}

/* لو في صفحة Active */
.khedma-navbar .nav-item.active {
    background: #1E88E5;
    color: #fff !important;
}

/* في الموبايل */
@media (max-width: 768px) {
    .khedma-navbar {
        flex-direction: column;
        gap: 0.5rem;
        text-align: center;
        padding: 1rem;
    }

    .khedma-navbar .nav-links {
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.6rem;
    }
}
/* ===== FOOTER ===== */

.khedma-footer {
    background: #ffffff;
    border-radius: 18px;
    padding: 1rem 1.5rem;
    width: 95%;
    margin: 1.5rem auto;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
    text-align: center;
}

.khedma-footer .footer-content {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
}

.khedma-footer .footer-logo {
    width: 32px;
    height: 32px;
    object-fit: contain;
}

.khedma-footer .footer-text {
    font-size: 0.9rem;
    font-weight: 600;
    color: #4C6282;
}

/* Mobile */
@media (max-width: 768px) {
    .khedma-footer .footer-text {
        font-size: 0.85rem;
    }
    .khedma-footer .footer-logo {
        width: 26px;
        height: 26px;
    }
}
/* ===== MAIN PAGE CONTAINER ===== */

.khedma-page-container {
    background: #ffffff;
    border-radius: 22px;
    padding: 1.5rem 1.8rem;
    width: 95%;
    margin: 1rem auto 2rem;
    min-height: 75vh;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);
}

/* لو الصفحة فيها عناصر كبيرة */
@media (max-width: 768px) {
    .khedma-page-container {
        padding: 1rem 1.2rem;
        width: 95%;
    }
}

.khedma-nav-links .nav-link {
    color: #333;
    font-weight: 600;
    padding: 8px 14px;
    position: relative;
    border-radius: 8px;
    transition: 0.25s ease;
}

/* Hover */
.khedma-nav-links .nav-link:hover {
    color: #0d6efd;
}

/* الخط المتحرك تحت الرابط */
.khedma-nav-links .nav-link::after {
    content: "";
    position: absolute;
    bottom: -3px;
    right: 0;
    width: 0%;
    height: 2px;
    background-color: #0d6efd;
    border-radius: 2px;
    transition: 0.25s ease;
}

/* لما يمر الماوس */
.khedma-nav-links .nav-link:hover::after {
    width: 100%;
}

/* Active Page */
.khedma-nav-links .nav-link.active {
    color: #0d6efd;
}

.khedma-nav-links .nav-link.active::after {
    width: 100%;
}
/* === Sidebar Same Ending Style as Footer === */
.md-sidebar {
    background: #ffffff !important;
    border-radius: 22px 0 22px 0 !important; /* نفس انحناء الفوتر */
    margin: 1rem;
    margin-left: 0; /* يمين فقط */
    width: 250px;
    padding-top: 1rem;
    padding-bottom: 1rem;
    height: calc(100vh - 2rem); /* نفس فكرة الفوتر، ارتفاع محسوب */
    overflow-y: auto;
    box-shadow: 0px 8px 20px rgba(0,0,0,0.07);
    display: flex;
    flex-direction: column;
}

/* جعل آخر عنصر داخل الـ sidebar مسافة لأسفل */
.md-sidebar::after {
    content: "";
    display: block;
    height: 35px;  /* padding مثل footer */
}

/* شكل Scroll ناعم */
.md-sidebar::-webkit-scrollbar {
    width: 6px;
}

.md-sidebar::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,0.15);
    border-radius: 10px;
}

.md-sidebar::-webkit-scrollbar-track {
    background: transparent;
}


/* ====== تحسين شكل الحقول داخل المودال ====== */

.modal .form-group label {
    font-weight: 600;
    color: #37474F;
    margin-bottom: 6px;
    font-size: 0.9rem;
}

.modal .form-control {
    border-radius: 12px !important;
    padding: 10px 12px;
    background: #F9FBFF;
    border: 1px solid #dce3ec;
    font-size: 0.9rem;
    transition: all .2s ease;
}

.modal .form-control:focus {
    background: #ffffff;
    border-color: #1565C0;
    box-shadow: 0 0 0 0.15rem rgba(21, 101, 192, 0.25);
}

/* Checkboxes */
.modal .form-check-input {
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.modal .form-check-label {
    margin-right: 8px;
    font-size: 0.9rem;
    cursor: pointer;
}

/* زر إنهاء المودال */
.doneButtonModalPage {
    border-radius: 12px !important;
    padding: 8px 16px;
    font-weight: bold;
}

/* الزر الثاني */
.modal-footer .btn-secondary {
    border-radius: 12px;
}

/* مسافات موحّدة */
.modal .form-group {
    margin-bottom: 1rem;
}


.doneButtonModalPage {
    background: #1565C0;
    border: none;
    color: #fff;
    border-radius: 12px;
    font-weight: 600;
    padding: 10px 26px;
    transition: 0.2s;
}

.doneButtonModalPage:hover {
    background: #0d47a1;
}

/* تحسين شكل عناصر الإدخال في النظام */
.khedma-input {
    font-size: 16px !important;      /* حجم خط أكبر */
    font-weight: 500 !important;     /* خط أوضح */
    padding: 10px 14px !important;   /* مسافات داخلية أريح */
    border: 1px solid #cfd6e1 !important; 
    border-radius: 10px !important;  /* زوايا ناعمة */
    color: #1e293b !important;        /* لون كتابة أوضح */
    background-color: #fff !important;
    transition: 0.2s ease-in-out;
}

/* عند التركيز (الفوكس) */
.khedma-input:focus {
    border-color: #3b82f6 !important; /* أزرق جميل */
    box-shadow: 0 0 0 3px rgba(59,130,246,0.25) !important;
    outline: none !important;
    background-color: #ffffff !important;
}

select.khedma-input {
    height: 48px !important;          /* ارتفاع واضح */
    font-size: 16px !important;       /* خط أكبر */
    padding: 0 14px !important;       /* مسافات داخلية */
    border-radius: 10px !important;   /* حواف ناعمة */
    cursor: pointer;
}
/* ===== GLOBAL PAGE LOADER ===== */

#pageLoader {
    position: fixed;
    inset: 0;
    background: #f4f6fb;
    z-index: 9999;               /* فوق كل حاجة */
    display: flex;
    align-items: center;
    justify-content: center;
}

#pageLoader .loader-box {
    text-align: center;
}

#pageLoader .loader-spinner {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 4px solid #d0d7e5;
    border-top-color: #1E88E5;
    animation: khedma-spin 0.9s linear infinite;
    margin: 0 auto 14px;
}

#pageLoader .loader-text {
    font-size: 0.95rem;
    color: #546e7a;
    font-weight: 600;
}

/* أنيميشن */
@keyframes khedma-spin {
    to {
        transform: rotate(360deg);
    }
}

/* Sidebar ثابت ويغطي طول الشاشة بالكامل */


    </style>



</head>