:root{font-family:'IBM Plex Sans Arabic',Tahoma,Arial,sans-serif;color:#1f2937;background:#f3f6f9;direction:rtl}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font-family:inherit}.hidden{display:none!important}.login{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,#173b63,#285e91)}.login-card{width:min(430px,100%);background:#fff;border-radius:18px;padding:32px;box-shadow:0 20px 60px #0003}.brand{font-size:30px;font-weight:800;color:#173b63}.sub{color:#667085;margin:6px 0 24px}.field{margin:14px 0}.field label{display:block;margin-bottom:7px;font-weight:700}.field input{width:100%;padding:13px;border:1px solid #d0d5dd;border-radius:10px;font-size:16px}.btn{border:0;border-radius:10px;padding:12px 16px;font-weight:700;cursor:pointer}.btn-primary{background:#173b63;color:#fff}.btn-danger{background:#b42318;color:#fff}.btn-secondary{background:#eaf0f6;color:#173b63}.full{width:100%}.msg{margin-top:14px;color:#b42318}.shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh}.side{background:#173b63;color:#fff;padding:24px}.side .brand{color:#fff}.nav{display:grid;gap:8px;margin-top:24px}.nav button{color:#fff;background:transparent;border:0;text-align:right;padding:12px;border-radius:9px;cursor:pointer}.nav button:hover,.nav button.active{background:#ffffff1f}.main{padding:28px}.top{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:24px}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}.card{background:#fff;border:1px solid #e4e7ec;border-radius:14px;padding:18px}.value{font-size:28px;font-weight:800;color:#173b63}.table-wrap{overflow:auto;background:#fff;border-radius:14px;border:1px solid #e4e7ec}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:12px;border-bottom:1px solid #eee;text-align:right}.actions{display:flex;gap:8px;flex-wrap:wrap}.muted{color:#667085}.status{display:inline-block;padding:4px 9px;border-radius:999px;background:#eef2f6}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.section{margin-top:24px}.toast{position:fixed;left:20px;bottom:20px;background:#111827;color:#fff;padding:12px 16px;border-radius:10px;z-index:1000}@media(max-width:780px){.shell{grid-template-columns:1fr}.side{position:static}.main{padding:16px}.top{align-items:flex-start;flex-direction:column}}

/* ===== Employees split workspace ===== */

.employees-workspace{
    display:grid;
    grid-template-columns:1fr;
    gap:24px;
    align-items:start;
    margin-top:18px;
}

.employees-list-panel,
.employees-profile-panel{
    width:100%;
    min-width:0;
}

.employees-list-panel{
    margin:0;
    overflow:hidden;
}

.employees-profile-panel{
    min-width:0;
}

.employee-profile-container{
    min-height:420px;
}

.employees-panel-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:14px;
}

.employees-panel-head h3{
    margin:0;
}

.employee-search-wrap{
    margin-bottom:14px;
}

.employee-search-wrap input{
    width:100%;
    min-height:42px;
    padding:9px 13px;
    border:1px solid #d5dee8;
    border-radius:9px;
    background:#fff;
    font:inherit;
}

.employee-name-link{
    border:0;
    background:transparent;
    color:#174a7e;
    font:inherit;
    font-weight:700;
    cursor:pointer;
    padding:3px 0;
}

.employee-name-link:hover{
    text-decoration:underline;
}

.employee-actions{
    display:flex;
    flex-wrap:wrap;
    gap:5px;
}

.employee-status{
    display:inline-block;
    padding:4px 9px;
    border-radius:999px;
    font-size:12px;
    font-weight:700;
}

.employee-status-active{
    background:#e8f7ee;
    color:#18794e;
}

.employee-status-inactive{
    background:#fff0e6;
    color:#a64b00;
}

.employee-profile-empty{
    min-height:420px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    background:#fff;
    border:1px solid #e1e7ee;
    border-radius:12px;
}

.employee-profile-empty-icon{
    font-size:42px;
    margin-bottom:10px;
}

#employee-edit-box > .card{
    margin-top:0;
}

@media (max-width:1250px){
    .employees-workspace{
        grid-template-columns:1fr;
    }

    .employee-profile-container{
        min-height:auto;
    }

    .employee-profile-empty{
        min-height:220px;
    }
}


/* ===== Employee list typography refinement ===== */

.employees-list-panel{
    font-size:14px;
}

.employees-list-panel .table{
    font-size:14px;
}

.employees-list-panel .table th{
    font-size:14px;
    font-weight:700;
    padding:11px 8px;
    white-space:nowrap;
}

.employees-list-panel .table td{
    font-size:14px;
    padding:10px 8px;
    vertical-align:middle;
    line-height:1.35;
}

/* اسم الموظف */
.employee-name-link{
    font-size:14px !important;
    font-weight:700;
    line-height:1.3;
}

/* الرقم والقسم والدور */
#employees-main-table td{
    font-size:14px;
}

/* حالة الموظف */
.employee-status{
    font-size:12px;
    padding:4px 9px;
    line-height:1.2;
}

/* أزرار الإجراءات */
.employee-actions{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:5px;
}

.employee-actions .btn{
    font-size:11px;
    padding:6px 9px;
    min-height:30px;
    line-height:1.2;
    white-space:nowrap;
}

/* عنوان قائمة الموظفين */
.employees-panel-head h3{
    font-size:20px;
    font-weight:700;
}

.employees-panel-head .muted{
    font-size:13px;
}

/* مربع البحث */
.employee-search-wrap input{
    font-size:14px;
}

/* الجزء الفارغ لملف الموظف */
.employee-profile-empty h3{
    font-size:20px;
}

.employee-profile-empty .muted{
    font-size:14px;
}

/* منع تضخم عمود الاسم */
#employees-main-table td:nth-child(2){
    min-width:120px;
}


.employee-completion{
    min-width:95px;
}

.employee-completion-text{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:6px;
    font-size:11px;
    margin-bottom:4px;
}

.employee-completion-text strong{
    color:#174a7e;
    font-size:12px;
}

.employee-completion-text span{
    color:#6b7785;
}

.employee-completion-bar{
    width:100%;
    height:6px;
    background:#e5ebf1;
    border-radius:999px;
    overflow:hidden;
}

.employee-completion-bar > div{
    height:100%;
    background:#174a7e;
    border-radius:999px;
}


.payroll-mini-input{
    width:82px;
    min-width:72px;
    padding:6px 5px;
    border:1px solid #d5dee8;
    border-radius:6px;
    font:inherit;
    font-size:12px;
}


/* =========================================================
   Finance Page - Responsive Payroll Layout
   ========================================================= */

#finance-payroll-area{
    width:100%;
    min-width:0;
}

/* بطاقات الملخص */
#finance-payroll-area .cards{
    grid-template-columns:repeat(3,minmax(180px,1fr));
    gap:12px;
}

#finance-payroll-area .cards .card{
    padding:15px;
}

#finance-payroll-area .cards .value{
    font-size:22px;
}

/* حاوية الجدول */
#finance-payroll-area .table-wrap{
    width:100%;
    max-width:100%;
    overflow-x:auto;
    overflow-y:visible;
    border-radius:10px;
    -webkit-overflow-scrolling:touch;
}

/* جدول الرواتب */
#finance-payroll-area .table{
    width:max-content;
    min-width:100%;
    border-collapse:collapse;
    font-size:11px;
    white-space:nowrap;
}

#finance-payroll-area .table th{
    font-size:11px;
    font-weight:700;
    padding:9px 7px;
    vertical-align:middle;
    text-align:center;
    white-space:nowrap;
}

#finance-payroll-area .table td{
    font-size:11px;
    padding:7px 6px;
    vertical-align:middle;
    text-align:center;
    line-height:1.25;
}

/* اسم الموظف */
#finance-payroll-area .table td:first-child{
    min-width:125px;
    text-align:right;
    white-space:normal;
}

#finance-payroll-area .table td:first-child strong{
    font-size:12px;
}

/* الحقول الرقمية */
#finance-payroll-area .payroll-mini-input{
    width:68px;
    min-width:68px;
    height:30px;
    padding:4px 5px;
    font-size:11px;
    text-align:center;
}

/* أزرار إجراءات المالية */
#finance-payroll-area .employee-actions{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:4px;
    min-width:110px;
}

#finance-payroll-area .employee-actions .btn{
    font-size:10px;
    padding:5px 7px;
    min-height:28px;
    white-space:nowrap;
}

/* إبراز الصافي */
#finance-payroll-area .table td strong{
    color:#173b63;
}

/* رأس جدول المالية */
#finance-payroll-area thead th{
    position:sticky;
    top:0;
    z-index:2;
    background:#f4f7fa;
}

/* جعل عمود الموظف ثابت أثناء التمرير الأفقي */
#finance-payroll-area th:first-child,
#finance-payroll-area td:first-child{
    position:sticky;
    right:0;
    z-index:3;
    background:#fff;
}

#finance-payroll-area thead th:first-child{
    background:#f4f7fa;
    z-index:4;
}

/* قسم اختيار الشهر */
#content > .card .form-grid{
    align-items:end;
}

/* الأجهزة المتوسطة */
@media (max-width:1200px){
    #finance-payroll-area .cards{
        grid-template-columns:repeat(3,1fr);
    }

    #finance-payroll-area .table{
        font-size:10px;
    }

    #finance-payroll-area .table th,
    #finance-payroll-area .table td{
        font-size:10px;
        padding:6px 5px;
    }
}

/* الجوال */
@media (max-width:700px){
    #finance-payroll-area .cards{
        grid-template-columns:1fr;
    }

    #finance-payroll-area .payroll-mini-input{
        width:62px;
        min-width:62px;
    }
}


/* =========================================================
   Finance Employee Cards
   ========================================================= */

.finance-employees-list{
    display:flex;
    flex-direction:column;
    gap:18px;
}

.finance-employee-card{
    background:#fff;
    border:1px solid #dfe6ee;
    border-radius:14px;
    overflow:hidden;
    box-shadow:0 2px 8px rgba(20,55,90,.04);
}

.finance-employee-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:16px 18px;
    border-bottom:1px solid #e7edf3;
}

.finance-employee-title{
    display:flex;
    align-items:center;
    gap:12px;
}

.finance-employee-title h3{
    margin:0 0 3px;
    font-size:18px;
}

.finance-icon{
    width:42px;
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#eef5fb;
    font-size:21px;
}

.finance-status{
    padding:6px 12px;
    border-radius:999px;
    font-size:12px;
    font-weight:700;
}

.finance-status-draft{
    background:#f1f3f5;
    color:#52606d;
}

.finance-status-approved{
    background:#fff4d6;
    color:#966600;
}

.finance-status-paid{
    background:#e7f7ec;
    color:#18794e;
}

.finance-info-section{
    padding:14px 18px;
    border-bottom:1px solid #edf1f5;
}

.finance-section-title{
    display:flex;
    align-items:center;
    gap:7px;
    font-size:14px;
    font-weight:700;
    color:#173b63;
    margin-bottom:12px;
}

.finance-info-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(145px,1fr));
    gap:10px;
}

.finance-info-item{
    background:#f8fafc;
    border:1px solid #e5ebf1;
    border-radius:9px;
    padding:10px;
    display:flex;
    flex-direction:column;
    gap:4px;
}

.finance-info-item span{
    font-size:11px;
    color:#6c7885;
}

.finance-info-item strong{
    font-size:14px;
    color:#173b63;
}

.finance-edit-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
    gap:12px;
}

.payroll-finance-input{
    width:100%;
    height:38px;
    padding:7px 9px;
    border:1px solid #d5dee8;
    border-radius:7px;
    font:inherit;
    font-size:13px;
}

.finance-suggestion-total{
    background:#fffaf0;
}

.finance-review-warning{
    display:block;
    color:#b42318;
    margin-top:3px;
    font-size:10px;
}

.finance-apply-btn{
    margin-top:12px;
}

.finance-summary{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:1px;
    background:#dfe6ee;
    border-bottom:1px solid #dfe6ee;
}

.finance-summary > div{
    background:#f8fafc;
    padding:14px 16px;
    display:flex;
    flex-direction:column;
    gap:4px;
}

.finance-summary span{
    font-size:11px;
    color:#6c7885;
}

.finance-summary strong{
    font-size:17px;
    color:#173b63;
}

.finance-summary .finance-net{
    background:#eef6fc;
}

.finance-summary .finance-net strong{
    font-size:20px;
}

.finance-note{
    display:flex;
    align-items:center;
    gap:7px;
    padding:10px 18px;
    font-size:12px;
    color:#5d6975;
    border-bottom:1px solid #edf1f5;
}

.finance-card-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    padding:14px 18px;
}

.finance-card-actions .btn{
    min-width:115px;
}

@media(max-width:800px){
    .finance-summary{
        grid-template-columns:1fr;
    }

    .finance-employee-head{
        align-items:flex-start;
    }

    .finance-card-actions{
        flex-direction:column;
    }

    .finance-card-actions .btn{
        width:100%;
    }
}


/* ===== Finance submenu ===== */

.nav-group{
    width:100%;
}

.nav-parent{
    width:100%;
    display:flex !important;
    align-items:center;
    justify-content:space-between;
}

.nav-arrow{
    font-size:16px;
    transition:transform .2s ease;
}

.nav-parent.open .nav-arrow{
    transform:rotate(180deg);
}

.nav-submenu{
    display:flex;
    flex-direction:column;
    gap:4px;
    margin-top:4px;
    padding-right:10px;
}

.nav-submenu button{
    font-size:12px !important;
    padding:9px 12px !important;
    opacity:.92;
    border-radius:7px;
}

.nav-submenu button.active{
    background:rgba(255,255,255,.14);
}


/* ===== Monthly Finance Report ===== */

.monthly-finance-cards{
    display:flex;
    flex-direction:column;
    gap:16px;
}

.monthly-finance-employee{
    background:#fff;
    border:1px solid #dfe6ee;
    border-radius:14px;
    overflow:hidden;
}

.monthly-finance-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:14px 16px;
    border-bottom:1px solid #e8edf2;
}

.monthly-finance-header h3{
    margin:0 0 3px;
    font-size:17px;
}

.monthly-finance-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:1px;
    background:#e4eaf0;
}

.monthly-finance-item{
    background:#fff;
    padding:12px;
    display:flex;
    align-items:center;
    gap:9px;
    min-height:68px;
}

.monthly-icon{
    width:34px;
    height:34px;
    min-width:34px;
    border-radius:9px;
    background:#eef5fb;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:17px;
}

.monthly-finance-item div{
    min-width:0;
}

.monthly-finance-item small{
    display:block;
    color:#718096;
    font-size:10px;
    margin-bottom:3px;
}

.monthly-finance-item strong{
    display:block;
    color:#173b63;
    font-size:13px;
    overflow-wrap:anywhere;
}

.monthly-finance-item.monthly-net{
    background:#eef6fc;
}

.monthly-finance-item.monthly-net strong{
    font-size:16px;
}

@media(max-width:1000px){
    .monthly-finance-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:600px){
    .monthly-finance-grid{
        grid-template-columns:1fr;
    }
}


/* ===== All employees payroll report ===== */

.all-payroll-report{
    overflow:hidden;
}

.all-payroll-table{
    font-size:11px;
}

.all-payroll-table th,
.all-payroll-table td{
    text-align:center;
    vertical-align:middle;
    padding:8px 6px;
    white-space:nowrap;
}

.all-payroll-table td:nth-child(2){
    text-align:right;
    min-width:140px;
}

.all-payroll-table tfoot th{
    background:#eef4f9;
    color:#173b63;
}

.all-payroll-signatures{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:35px;
    padding:35px 20px 18px;
}

.all-payroll-signatures > div{
    text-align:center;
    font-size:12px;
}

.all-payroll-signatures span{
    display:block;
    font-weight:700;
    margin-bottom:24px;
    color:#173b63;
}

.all-payroll-signatures strong{
    font-weight:400;
    letter-spacing:1px;
}

@media(max-width:800px){
    .all-payroll-signatures{
        grid-template-columns:1fr;
        gap:20px;
    }
}


/* =====================================================
   Monthly Report - Final Containment / Layout Fix
   ===================================================== */

#monthly-full-report-area{
    width:100%;
    max-width:100%;
    min-width:0;
    overflow:hidden;
}

/* جميع بطاقات التقرير لا تتجاوز مساحة المحتوى */
#monthly-full-report-area .card{
    width:100%;
    max-width:100%;
    min-width:0;
    overflow:hidden;
}

/* الفلاتر */
.monthly-report-filters{
    width:100%;
    max-width:100%;
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:10px;
}

.monthly-report-filters .field{
    min-width:0;
}

.monthly-report-filters input,
.monthly-report-filters select{
    width:100%;
    max-width:100%;
    min-width:0;
}

/* بطاقات الملخص */
.monthly-report-summary{
    width:100%;
    max-width:100%;
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:10px;
    margin-bottom:16px;
}

.monthly-summary-card{
    min-width:0;
    width:100%;
    overflow:hidden;
}

.monthly-summary-card span{
    display:block;
    white-space:normal;
    overflow-wrap:anywhere;
    line-height:1.4;
}

.monthly-summary-card strong{
    display:block;
    max-width:100%;
    white-space:normal;
    overflow-wrap:anywhere;
    font-size:15px;
}

/* المقارنة */
.monthly-comparison-grid{
    width:100%;
    max-width:100%;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.monthly-comparison-grid > div{
    min-width:0;
    overflow:hidden;
}

.monthly-comparison-grid span,
.monthly-comparison-grid strong{
    white-space:normal;
    overflow-wrap:anywhere;
}

/* العناوين والتنبيهات */
.monthly-report-section-title,
.monthly-alert-item,
.monthly-alert-ok{
    max-width:100%;
    white-space:normal;
    overflow-wrap:anywhere;
}

/* أهم إصلاح: الجدول يبقى داخل البطاقة */
#monthly-full-report-area .table-wrap{
    width:100%;
    max-width:100%;
    min-width:0;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    border-radius:8px;
}

/* جدول تفاصيل الموظفين */
.monthly-report-table{
    width:100%;
    min-width:1450px;
    max-width:none;
    table-layout:auto;
    border-collapse:collapse;
    white-space:nowrap;
}

.monthly-report-table th{
    font-size:10px;
    padding:7px 6px;
    text-align:center;
    vertical-align:middle;
    line-height:1.25;
}

.monthly-report-table td{
    font-size:10px;
    padding:7px 6px;
    text-align:center;
    vertical-align:middle;
}

/* اسم الموظف */
.monthly-report-table .monthly-employee-name{
    min-width:130px;
    max-width:170px;
    text-align:right;
    white-space:normal;
    overflow-wrap:anywhere;
}

/* العمود الأول ثابت عند التمرير */
.monthly-report-table th:first-child,
.monthly-report-table td:first-child{
    position:sticky;
    right:0;
    z-index:2;
    background:#fff;
}

.monthly-report-table thead th:first-child{
    background:#eaf1f7;
    z-index:3;
}

/* واسم الموظف ثابت بعد الرقم */
.monthly-report-table th:nth-child(2),
.monthly-report-table td:nth-child(2){
    position:sticky;
    right:35px;
    z-index:2;
    background:#fff;
}

.monthly-report-table thead th:nth-child(2){
    background:#eaf1f7;
    z-index:3;
}

/* ملخص الفروع */
.monthly-branch-table{
    width:100%;
    min-width:850px;
    border-collapse:collapse;
}

.monthly-branch-table th,
.monthly-branch-table td{
    font-size:11px;
    padding:8px 6px;
    text-align:center;
    white-space:nowrap;
}

/* منع الصفحة الرئيسية من التوسع بسبب التقارير */
.main,
#content{
    min-width:0;
    max-width:100%;
}

.main{
    overflow-x:hidden;
}

/* الشاشات المتوسطة */
@media(max-width:1300px){

    .monthly-report-filters{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .monthly-report-summary{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .monthly-comparison-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

/* الأجهزة الصغيرة */
@media(max-width:800px){

    .monthly-report-filters{
        grid-template-columns:1fr;
    }

    .monthly-report-summary{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .monthly-comparison-grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:520px){

    .monthly-report-summary{
        grid-template-columns:1fr;
    }
}


/* =====================================================
   Monthly Report - Compact Professional Layout
   ===================================================== */

.monthly-report-filters{
    gap:6px !important;
}

.monthly-report-filters .field{
    margin:0 !important;
}

.monthly-report-filters label{
    font-size:12px !important;
    line-height:1.15 !important;
    margin-bottom:3px !important;
}

.monthly-report-filters input,
.monthly-report-filters select{
    height:34px !important;
    padding:4px 8px !important;
    font-size:12px !important;
}

/* ملخص الأرقام */
.monthly-report-summary{
    gap:6px !important;
    margin:8px 0 10px !important;
}

.monthly-summary-card{
    padding:7px 9px !important;
    min-height:58px !important;
    gap:1px !important;
}

.monthly-summary-card span{
    font-size:11px !important;
    line-height:1.15 !important;
    margin:0 !important;
}

.monthly-summary-card strong{
    font-size:15px !important;
    line-height:1.1 !important;
    margin:1px 0 0 !important;
}

/* عناوين الأقسام */
.monthly-report-section-title{
    font-size:13px !important;
    line-height:1.15 !important;
    margin:0 0 6px !important;
}

/* المقارنة */
.monthly-comparison-grid{
    gap:5px !important;
}

.monthly-comparison-grid > div{
    padding:6px 8px !important;
    min-height:48px !important;
}

.monthly-comparison-grid span{
    font-size:11px !important;
    line-height:1.1 !important;
    margin:0 0 2px !important;
}

.monthly-comparison-grid strong{
    font-size:13px !important;
    line-height:1.1 !important;
}

/* التنبيهات */
.monthly-alerts{
    gap:4px !important;
}

.monthly-alert-item,
.monthly-alert-ok{
    padding:6px 8px !important;
    font-size:11px !important;
    line-height:1.2 !important;
}

/* تقليل ارتفاع الأقسام */
#monthly-full-report-area .card.section{
    padding:10px !important;
    margin-top:8px !important;
    margin-bottom:8px !important;
}

/* جدول الموظفين */
.monthly-report-table th{
    font-size:11px !important;
    line-height:1.05 !important;
    padding:5px 4px !important;
}

.monthly-report-table td{
    font-size:11px !important;
    line-height:1.05 !important;
    padding:5px 4px !important;
}

.monthly-report-table .monthly-employee-name{
    min-width:115px !important;
    max-width:145px !important;
}

/* الأعمدة المالية أصغر */
.monthly-report-table th:nth-child(n+10):nth-child(-n+20),
.monthly-report-table td:nth-child(n+10):nth-child(-n+20){
    min-width:65px !important;
}

/* ملخص الفروع */
.monthly-branch-table th,
.monthly-branch-table td{
    font-size:11px !important;
    line-height:1.05 !important;
    padding:5px 4px !important;
}

/* الأزرار */
#monthly-full-report-area + *,
#monthly-full-report-area .actions{
    gap:5px !important;
}


/* =====================================================
   Monthly Payroll - Employee Column Rows
   ===================================================== */

.monthly-employees-section{
    padding:12px !important;
}

.monthly-report-title-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
}

.monthly-report-count{
    font-size:11px;
    font-weight:700;
    background:#eef4f9;
    border-radius:14px;
    padding:4px 9px;
    color:#173b63;
}

.monthly-column-header{
    display:grid;
    grid-template-columns:
        minmax(180px,1.35fr)
        minmax(210px,1.25fr)
        minmax(200px,1.2fr)
        minmax(190px,1.1fr)
        minmax(125px,.75fr)
        minmax(145px,.9fr);

    gap:1px;
    background:#dce4ec;
    border:1px solid #dce4ec;
    border-radius:8px 8px 0 0;
    overflow:hidden;
}

.monthly-column-header > div{
    background:#eef3f8;
    color:#173b63;
    font-size:11px;
    font-weight:800;
    text-align:center;
    padding:7px 5px;
}

.monthly-employee-rows{
    display:flex;
    flex-direction:column;
    gap:5px;
    margin-top:5px;
}

.monthly-employee-row{
    display:grid;

    grid-template-columns:
        minmax(180px,1.35fr)
        minmax(210px,1.25fr)
        minmax(200px,1.2fr)
        minmax(190px,1.1fr)
        minmax(125px,.75fr)
        minmax(145px,.9fr);

    border:1px solid #dde5ec;
    border-radius:8px;
    background:#fff;
    overflow:hidden;
}

.monthly-column{
    min-width:0;
    padding:7px 8px;
    border-left:1px solid #e3e9ef;
}

.monthly-column:last-child{
    border-left:0;
}

.employee-column{
    display:flex;
    align-items:center;
    gap:8px;
}

.monthly-row-number{
    width:26px;
    height:26px;
    min-width:26px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#eef4f9;
    color:#173b63;
    font-size:10px;
    font-weight:800;
}

.monthly-employee-main{
    min-width:0;
}

.monthly-employee-name-text{
    display:block;
    color:#172536;
    font-size:12px;
    line-height:1.15;
    margin-bottom:2px;
}

.monthly-employee-main span{
    display:block;
    font-size:10px;
    color:#37516d;
    line-height:1.15;
}

.monthly-employee-main small{
    display:block;
    font-size:9px;
    color:#788594;
    line-height:1.15;
    margin-top:2px;
}

.attendance-column,
.finance-column,
.deduction-column{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:4px 8px;
}

.attendance-column > div,
.finance-column > div,
.deduction-column > div{
    min-width:0;
}

.monthly-column span{
    display:block;
    font-size:9px;
    color:#748190;
    line-height:1.1;
    margin:0 0 2px;
}

.monthly-column strong{
    display:block;
    font-size:11px;
    color:#172536;
    line-height:1.1;
    margin:0;
}

.monthly-column-total{
    grid-column:1 / -1;
    padding-top:4px;
    margin-top:1px;
    border-top:1px solid #edf0f3;
}

.finance-column .monthly-column-total strong{
    color:#18794e;
}

.deduction-column .monthly-column-total strong{
    color:#b42318;
}

.net-column{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    background:#f6f4ff;
}

.net-column > strong{
    font-size:17px;
    color:#6040bd;
}

.net-column small{
    font-size:9px;
    color:#7869a5;
}

.payment-column{
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:5px;
}

.monthly-payment-status{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    align-self:flex-start;
    border-radius:12px;
    padding:3px 8px;
    font-weight:800;
    font-size:9px !important;
}

.monthly-payment-status.paid{
    background:#eaf7ee;
    color:#18794e;
}

.monthly-payment-status.approved{
    background:#fff6dd;
    color:#8c6200;
}

.monthly-payment-status.draft{
    background:#f0f2f4;
    color:#596675;
}

.monthly-employees-total{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:1px;
    background:#dce4ec;
    border:1px solid #dce4ec;
    border-radius:7px;
    overflow:hidden;
    margin-top:7px;
}

.monthly-employees-total > div{
    background:#f6f9fb;
    padding:6px 8px;
    text-align:center;
}

.monthly-employees-total span{
    display:block;
    font-size:9px;
    color:#748190;
    line-height:1.1;
}

.monthly-employees-total strong{
    display:block;
    font-size:11px;
    color:#173b63;
    line-height:1.15;
    margin-top:2px;
}

/* الصفحة نفسها لا تتوسع */
.monthly-employees-section{
    width:100%;
    max-width:100%;
    overflow-x:auto !important;
}

.monthly-column-header,
.monthly-employee-row{
    min-width:1050px;
}

@media(max-width:900px){

    .monthly-column-header{
        display:none;
    }

    .monthly-employee-row{
        min-width:0;
        grid-template-columns:1fr 1fr;
    }

    .monthly-column{
        border-bottom:1px solid #e3e9ef;
    }

    .employee-column,
    .net-column{
        grid-column:1 / -1;
    }

    .monthly-employees-total{
        grid-template-columns:repeat(2,1fr);
    }
}


/* ===== Finance Payment Reports ===== */

.finance-report-tabs{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:10px;
margin:0 0 14px;
}

.finance-report-tab{
display:flex;
align-items:center;
gap:10px;
min-height:72px;
padding:12px;
border:1px solid #d6e0e9;
border-radius:12px;
background:#fff;
cursor:pointer;
text-align:right;
}

.finance-report-tab:hover{
border-color:#174a7e;
}

.finance-report-tab.active{
background:#edf5fb;
border:2px solid #174a7e;
}

.finance-report-tab-icon{
width:38px;
height:38px;
min-width:38px;
display:flex;
align-items:center;
justify-content:center;
border-radius:9px;
background:#eaf1f7;
font-size:20px;
}

.finance-report-tab strong{
display:block;
font-size:14px;
color:#173b63;
margin:0;
}

.finance-report-tab small{
display:block;
font-size:11px;
color:#718091;
margin-top:3px;
}


/* controls */

.finance-report-controls{
padding:14px !important;
}

.finance-report-control-grid{
display:grid;
grid-template-columns:1fr 1fr 2fr;
gap:12px;
align-items:start;
}

.finance-report-control-grid .field{
min-width:0;
}

.finance-report-control-grid label{
display:block;
font-size:12px;
font-weight:700;
margin-bottom:5px;
}

.finance-report-control-grid input,
.finance-report-control-grid select{
width:100%;
height:42px;
padding:0 10px;
border:1px solid #ccd8e3;
border-radius:8px;
background:#fff;
font-size:12px;
}

.finance-report-actions{
display:flex;
gap:7px;
margin-top:12px;
}


/* report result */

.finance-report-result{
padding:16px !important;
}

.finance-report-result-head{
display:flex;
justify-content:space-between;
align-items:center;
gap:15px;
padding-bottom:10px;
margin-bottom:10px;
border-bottom:1px solid #dfe6ed;
}

.finance-report-result-head h2{
margin:0;
font-size:20px;
color:#173b63;
}

.finance-report-result-head .muted{
margin-top:3px;
}

.finance-report-period{
padding:6px 12px;
border-radius:20px;
background:#edf4fa;
font-size:11px;
font-weight:700;
color:#174a7e;
}


/* summary */

.finance-report-summary-row{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:8px;
margin-bottom:10px;
}

.finance-report-summary-row > div{
padding:10px 12px;
border:1px solid #dce5ed;
border-radius:9px;
background:#fafcfe;
}

.finance-report-summary-row span{
display:block;
font-size:11px;
color:#718091;
}

.finance-report-summary-row strong{
display:block;
font-size:17px;
color:#173b63;
margin-top:3px;
}


/* employee rows */

.finance-simple-list{
display:flex;
flex-direction:column;
gap:6px;
}

.finance-simple-row{
display:grid;
grid-template-columns:minmax(250px,1.6fr) repeat(4,minmax(120px,1fr));
border:1px solid #dce5ed;
border-radius:9px;
overflow:hidden;
background:#fff;
}

.finance-simple-row > div{
padding:9px 10px;
border-left:1px solid #e5ebf0;
min-width:0;
}

.finance-simple-row > div:last-child{
border-left:0;
}

.finance-simple-row span{
display:block;
font-size:10px;
color:#778493;
margin-bottom:2px;
}

.finance-simple-row strong{
display:block;
font-size:13px;
color:#172536;
}

.finance-simple-employee{
display:flex;
align-items:center;
gap:8px;
}

.finance-simple-employee small{
display:block;
font-size:10px;
color:#748292;
margin-top:3px;
}

.finance-row-no{
width:28px;
height:28px;
min-width:28px;
display:flex !important;
align-items:center;
justify-content:center;
border-radius:50%;
background:#edf4fa;
color:#174a7e !important;
font-weight:700;
}

.finance-simple-net{
background:#edf6fc;
}

.finance-simple-net strong{
font-size:15px;
color:#174a7e;
}


/* employee header */

.finance-employee-report-banner{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:7px;
margin-bottom:10px;
}

.finance-employee-report-banner > div{
padding:9px 10px;
border:1px solid #dce5ed;
border-radius:8px;
background:#fafcfe;
}

.finance-employee-report-banner span{
display:block;
font-size:10px;
color:#778493;
}

.finance-employee-report-banner strong{
display:block;
font-size:13px;
margin-top:2px;
}


/* attendance */

.finance-attendance-summary{
display:grid;
grid-template-columns:repeat(6,minmax(0,1fr));
gap:7px;
}

.finance-attendance-summary > div{
padding:12px 8px;
text-align:center;
border:1px solid #dce5ed;
border-radius:9px;
background:#fafcfe;
}

.finance-attendance-summary span{
display:block;
font-size:10px;
color:#718091;
}

.finance-attendance-summary strong{
display:block;
font-size:18px;
color:#173b63;
margin-top:4px;
}


/* entitlements */

.finance-entitlements-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:8px;
}

.finance-entitlements-grid > div{
padding:11px 12px;
border:1px solid #dce5ed;
border-radius:9px;
background:#fafcfe;
}

.finance-entitlements-grid span{
display:block;
font-size:10px;
color:#718091;
}

.finance-entitlements-grid strong{
display:block;
font-size:15px;
color:#173b63;
margin-top:4px;
}


/* empty */

.finance-report-empty{
min-height:160px;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
text-align:center;
gap:5px;
}

.finance-report-empty-icon{
font-size:32px;
}

.finance-report-no-data{
padding:25px;
text-align:center;
color:#718091;
}


/* specialized rows */

.salary-history-row{
grid-template-columns:55px repeat(5,minmax(120px,1fr));
}

.attendance-all-row{
grid-template-columns:minmax(250px,1.6fr) repeat(5,minmax(100px,1fr));
}


/* responsive */

@media(max-width:1100px){

.finance-report-tabs{
grid-template-columns:repeat(2,1fr);
}

.finance-report-control-grid{
grid-template-columns:1fr 1fr;
}

.payment-report-employee-field{
grid-column:1/-1;
}

.finance-attendance-summary{
grid-template-columns:repeat(3,1fr);
}

.finance-entitlements-grid{
grid-template-columns:repeat(2,1fr);
}

}


/* ===== Leave Bonus Employee Summary ===== */

.leave-bonus-employee-card{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:6px;
margin-top:8px;
padding:8px;
border:1px solid #dce5ed;
border-radius:9px;
background:#f8fafc;
}

.leave-bonus-employee-card > div{
min-width:0;
padding:6px 8px;
border-left:1px solid #e2e8ee;
}

.leave-bonus-employee-card > div:nth-child(4n){
border-left:0;
}

.leave-bonus-employee-card span{
display:block;
font-size:9px;
color:#748190;
line-height:1.1;
}

.leave-bonus-employee-card strong{
display:block;
margin-top:2px;
font-size:11px;
color:#173b63;
line-height:1.2;
}

.leave-bonus-employee-loading{
padding:8px;
font-size:10px;
color:#718091;
}

@media(max-width:900px){

.leave-bonus-employee-card{
grid-template-columns:repeat(2,1fr);
}

}


/* =====================================================
   Leave Bonus - Employee + Approval Workflow
   ===================================================== */

/* بيانات الموظف */

#leave-bonus-selected{
width:100%;
}

.leave-bonus-employee-card{
display:grid !important;
grid-template-columns:repeat(6,minmax(0,1fr)) !important;
width:100%;
gap:0 !important;
margin-top:8px;
padding:0 !important;
overflow:hidden;
border:1px solid #dce5ed;
border-radius:9px;
background:#fff;
}

.leave-bonus-employee-card > div{
min-width:0;
padding:7px 9px !important;
border-left:1px solid #e4eaf0;
border-bottom:1px solid #edf1f4;
}

.leave-bonus-employee-card > div:nth-child(6n){
border-left:0;
}

.leave-bonus-employee-card span{
display:block;
font-size:9px !important;
line-height:1.2;
color:#788695;
margin-bottom:2px;
}

.leave-bonus-employee-card strong{
display:block;
font-size:11px !important;
line-height:1.25;
color:#173b63;
white-space:normal;
overflow-wrap:anywhere;
}


/* تنبيهات رصيد الإجازة */

.leave-bonus-alert{
margin:7px 0;
padding:8px 10px;
border-radius:7px;
font-size:10px;
line-height:1.5;
}

.leave-bonus-alert.warning{
background:#fff9e8;
border:1px solid #e6cd82;
color:#725b13;
}

.leave-bonus-alert.danger{
background:#fff2f2;
border:1px solid #e2aaaa;
color:#8d2929;
}


/* مسار الاعتماد */

.leave-bonus-workflow{
padding:10px 12px !important;
margin-top:8px;
}

.leave-workflow-header{
display:flex;
align-items:center;
justify-content:space-between;
gap:15px;
margin-bottom:10px;
}

.leave-workflow-header strong{
font-size:12px;
color:#173b63;
}

.leave-workflow-header .muted{
font-size:9px;
margin-top:2px;
}

.leave-workflow-status{
padding:4px 10px;
border:1px solid #c9d6e2;
border-radius:15px;
font-size:9px;
font-weight:700;
color:#174a7e;
background:#f4f8fb;
white-space:nowrap;
}

.leave-workflow-steps{
display:grid;
grid-template-columns:repeat(6,minmax(0,1fr));
gap:5px;
}

.leave-workflow-step{
min-width:0;
padding:7px 4px;
text-align:center;
border:1px solid #dce4eb;
border-radius:7px;
background:#fafbfd;
}

.leave-workflow-number{
display:flex;
align-items:center;
justify-content:center;
width:23px;
height:23px;
margin:0 auto 4px;
border-radius:50%;
background:#e6ebf0;
color:#687582;
font-size:9px;
font-weight:700;
}

.leave-workflow-label{
font-size:9px;
line-height:1.25;
font-weight:700;
color:#6e7b88;
}


/* مرحلة مكتملة */

.leave-workflow-step.done{
background:#f4faf6;
border-color:#bfd9c7;
}

.leave-workflow-step.done .leave-workflow-number{
background:#37805a;
color:#fff;
}

.leave-workflow-step.done .leave-workflow-label{
color:#326849;
}


/* المرحلة الحالية */

.leave-workflow-step.current{
background:#f1f6fb;
border:2px solid #174a7e;
padding:6px 3px;
}

.leave-workflow-step.current .leave-workflow-number{
background:#174a7e;
color:#fff;
}

.leave-workflow-step.current .leave-workflow-label{
color:#173b63;
}


/* تصغير المسافات */

#leave-bonus-form-status .card{
padding:7px 11px !important;
margin-top:7px;
margin-bottom:0;
}


/* الشاشات الأصغر */

@media(max-width:1100px){

.leave-bonus-employee-card{
grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}

.leave-bonus-employee-card > div:nth-child(6n){
border-left:1px solid #e4eaf0;
}

.leave-bonus-employee-card > div:nth-child(3n){
border-left:0;
}

.leave-workflow-steps{
grid-template-columns:repeat(3,1fr);
}

}

@media(max-width:650px){

.leave-bonus-employee-card{
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}

.leave-workflow-steps{
grid-template-columns:repeat(2,1fr);
}

.leave-workflow-header{
align-items:flex-start;
flex-direction:column;
}

}


/* =====================================================
   Leave Bonus - Full Width Employee Area
   ===================================================== */

.leave-bonus-search-row{
display:grid;
grid-template-columns:minmax(320px,520px);
justify-content:start;
margin-bottom:8px;
}

.leave-bonus-selected-full{
display:block;
width:100%;
margin:0 0 12px;
}

.leave-bonus-calculation-grid{
display:grid;
grid-template-columns:repeat(5,minmax(0,1fr));
gap:10px;
}

.leave-bonus-employee-card{
display:grid !important;
grid-template-columns:repeat(6,minmax(0,1fr)) !important;
width:100% !important;
margin:0 !important;
border:1px solid #d8e2eb;
border-radius:10px;
overflow:hidden;
background:#fff;
}

.leave-bonus-employee-card > div{
padding:9px 10px !important;
min-width:0;
border-left:1px solid #e5ebf0;
border-bottom:1px solid #edf1f4;
}

.leave-bonus-employee-card > div:nth-child(6n){
border-left:0;
}

.leave-bonus-employee-card span{
display:block;
font-size:10px !important;
line-height:1.2;
color:#73808e;
white-space:nowrap;
}

.leave-bonus-employee-card strong{
display:block;
margin-top:3px;
font-size:12px !important;
line-height:1.3;
color:#173b63;
white-space:normal;
word-break:normal;
overflow-wrap:break-word;
}

@media(max-width:1200px){

.leave-bonus-calculation-grid{
grid-template-columns:repeat(3,minmax(0,1fr));
}

.leave-bonus-employee-card{
grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}

.leave-bonus-employee-card > div:nth-child(6n){
border-left:1px solid #e5ebf0;
}

.leave-bonus-employee-card > div:nth-child(3n){
border-left:0;
}

}


/* ===== Benefit Approval Status ===== */

.leave-bonus-approval-summary{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:8px;
margin-top:10px;
}

.leave-bonus-approval-summary > div{
padding:8px 10px;
border:1px solid #dce5ed;
border-radius:8px;
background:#fafcfe;
}

.leave-bonus-approval-summary span{
display:block;
font-size:9px;
color:#748190;
margin-bottom:3px;
}

.leave-bonus-approval-summary strong{
font-size:12px;
}

.benefit-approved{
color:#187244;
}

.benefit-not-approved{
color:#9b2c2c;
}


/* ===== EOS Calculation Rule ===== */

.eos-calculation-rule{
margin:8px 0;
}

.eos-rule{
padding:9px 11px;
border:1px solid #d7e1e9;
border-radius:8px;
font-size:10px;
line-height:1.55;
background:#fafcfe;
color:#334155;
}

.eos-rule.ok{
background:#f4faf6;
border-color:#b9d8c3;
color:#2f6548;
}

.eos-rule.warning{
background:#fff8e7;
border-color:#e4c979;
color:#765b0e;
}


/* ===== Custody Clearance ===== */

.custody-items-table-wrap{
overflow-x:auto;
margin-top:10px;
}

.custody-items-table{
min-width:1050px;
}

.custody-items-table input,
.custody-items-table select{
width:100%;
min-width:90px;
}

.custody-items-table
.custody-item-name{
min-width:150px;
}

.custody-items-table
.custody-item-notes{
min-width:150px;
}

.custody-summary{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:8px;
margin-top:12px;
}

.custody-summary>div{
border:1px solid #d7e1e9;
border-radius:8px;
padding:10px 12px;
background:#fafcfe;
}

.custody-summary span{
display:block;
font-size:11px;
color:#718091;
margin-bottom:4px;
}

.custody-summary strong{
font-size:15px;
color:#173b63;
}

@media(max-width:700px){

.custody-summary{
grid-template-columns:1fr;
}

}


/* =====================================================
   Custody Clearance - Redesigned Interface
   ===================================================== */

.custody-search-card,
.custody-items-card,
.custody-summary-card{
padding:18px !important;
}

.custody-section-title{
font-size:17px;
font-weight:800;
color:#173b63;
margin-bottom:8px;
}

.custody-search-box{
width:100%;
}

.custody-search-box input{
width:100%;
height:45px;
font-size:12px;
}

.custody-selected-employee{
margin-top:8px;
font-size:10px;
color:#748190;
}

.custody-selected-employee .leave-bonus-employee-card{
margin-top:10px !important;
}


/* Header for custody items */

.custody-items-header{
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
margin-bottom:14px;
}

.custody-add-button{
min-width:125px;
height:38px;
font-weight:700;
white-space:nowrap;
}

.custody-add-button span{
font-size:15px;
margin-left:4px;
}


/* Empty state */

.custody-empty-state{
display:flex;
align-items:center;
justify-content:center;
gap:8px;
min-height:70px;
padding:15px;
border:1px solid #dbe6ef;
border-radius:8px;
background:#f5f9fd;
font-size:11px;
color:#53677a;
text-align:center;
}

.custody-empty-icon{
font-size:16px;
color:#174a7e;
}


/* Custody summary */

.custody-summary-card{
margin-top:10px;
}

.custody-summary{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:10px;
margin-top:10px;
}

.custody-summary>div{
position:relative;
padding:12px 14px;
border:1px solid #d8e2eb;
border-radius:9px;
background:#fff;
min-height:74px;
}

.custody-summary span{
display:block;
font-size:9px;
color:#748190;
margin-bottom:5px;
}

.custody-summary strong{
display:block;
font-size:15px;
line-height:1.2;
color:#173b63;
}

.custody-summary small{
display:block;
margin-top:4px;
font-size:8px;
color:#8793a0;
}


/* Custody items table */

.custody-items-table-wrap{
margin-top:8px;
border:1px solid #d9e3ec;
border-radius:9px;
overflow:auto;
}

.custody-items-table{
margin:0;
background:#fff;
}

.custody-items-table th{
background:#eef4f8;
font-size:9px;
white-space:nowrap;
}

.custody-items-table td{
vertical-align:middle;
padding:5px;
}

.custody-items-table input,
.custody-items-table select{
height:34px;
border-radius:6px;
font-size:10px;
}


/* Notes and actions */

#custody-notes{
width:100%;
min-height:85px;
resize:vertical;
}

@media(max-width:1100px){

.custody-summary{
grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:700px){

.custody-items-header{
flex-direction:column;
align-items:stretch;
}

.custody-add-button{
width:100%;
}

.custody-summary{
grid-template-columns:1fr;
}

}


.custody-posted-badge{
display:inline-flex;
align-items:center;
padding:5px 9px;
border:1px solid #b9d8c3;
border-radius:14px;
background:#f4faf6;
color:#187244;
font-size:9px;
font-weight:700;
white-space:nowrap;
}


/* =========================================================
   Finance Navigation Tree
   ========================================================= */

.finance-menu-tree{
display:flex;
flex-direction:column;
gap:3px;
}

.finance-main-link{
display:flex;
align-items:center;
gap:7px;
}

.finance-menu-section{
display:flex;
flex-direction:column;
}

.finance-sub-parent{
display:flex;
align-items:center;
justify-content:space-between;
width:100%;
}

.finance-sub-children{
display:flex;
flex-direction:column;
margin-right:12px;
padding-right:8px;
border-right:1px solid rgba(255,255,255,.14);
}

.finance-sub-children button{
font-size:11px;
padding-right:14px;
opacity:.92;
}

.finance-sub-parent .nav-arrow{
transition:transform .2s ease;
}

.finance-sub-parent.open .nav-arrow{
transform:rotate(180deg);
}


/* =========================================================
   Finance Dashboard
   ========================================================= */

.finance-dashboard-filters{
display:grid;
grid-template-columns:180px 220px minmax(260px,1fr);
gap:12px;
align-items:end;
}

.finance-dashboard-search{
min-width:0;
}

.finance-dashboard-cards{
display:grid;
grid-template-columns:repeat(5,minmax(0,1fr));
gap:10px;
margin:14px 0;
}

.finance-dashboard-stat{
padding:15px;
}

.finance-dashboard-stat span{
display:block;
font-size:10px;
color:#738092;
margin-bottom:6px;
}

.finance-dashboard-stat strong{
display:block;
font-size:21px;
color:#173b63;
}

.finance-dashboard-stat small{
display:block;
margin-top:3px;
font-size:9px;
color:#8a96a3;
}

.finance-dashboard-net{
background:#f2f7fb;
}

.finance-dashboard-net strong{
color:#0f5f8f;
}

.finance-dashboard-status-grid{
display:grid;
grid-template-columns:repeat(5,minmax(0,1fr));
gap:9px;
margin-top:12px;
}

.finance-dashboard-status-grid>div{
border:1px solid #d8e2eb;
border-radius:9px;
padding:12px;
background:#fafcfe;
text-align:center;
}

.finance-dashboard-status-grid span{
display:block;
font-size:9px;
color:#748190;
margin-bottom:5px;
}

.finance-dashboard-status-grid strong{
font-size:17px;
color:#173b63;
}

@media(max-width:1100px){

.finance-dashboard-cards{
grid-template-columns:repeat(3,1fr);
}

.finance-dashboard-status-grid{
grid-template-columns:repeat(3,1fr);
}

}

@media(max-width:760px){

.finance-dashboard-filters{
grid-template-columns:1fr;
}

.finance-dashboard-cards,
.finance-dashboard-status-grid{
grid-template-columns:1fr 1fr;
}

}


/* إعدادات الحضور ونتيجة مسح رمز QR */
.attendance-settings .field select{width:100%;padding:13px;border:1px solid #d0d5dd;border-radius:10px;font-size:16px;background:#fff}
.attendance-settings .form-grid > .actions{align-self:end;margin-bottom:14px}
.attendance-settings .table td{vertical-align:middle}
.scan-result h2{font-size:clamp(20px,5vw,28px);line-height:1.5}
.attendance-settings select[data-user-perm]{padding:6px 10px;border:1px solid #d0d5dd;border-radius:8px;font-size:14px;background:#fff;min-width:110px}
.attendance-settings select[data-user-perm].perm-allow{border-color:#1f7a4d;background:#eaf7ef;color:#1f7a4d;font-weight:700}
.attendance-settings select[data-user-perm].perm-deny{border-color:#a11d1d;background:#fdecec;color:#a11d1d;font-weight:700}
.attendance-settings fieldset label{padding:4px 0;border-bottom:1px dashed #eef2f6}

/* سجلّي والشاشة الرئيسية للموظف */
.home{display:grid;gap:18px;max-width:880px}
.home-hello h1{margin:4px 0;color:#173b63;font-size:26px}
.home-today{background:linear-gradient(135deg,#173b63,#1f5f99);color:#fff;border-radius:16px;padding:18px 20px;display:grid;gap:14px}
.home-today-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.home-label{font-size:13px;opacity:.8;letter-spacing:.02em}
.home-status{font-size:22px;font-weight:700;margin-top:2px}
.home-periods{display:grid;gap:8px}
.home-period{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;background:#ffffff14;border-radius:10px;padding:8px 12px;font-variant-numeric:tabular-nums}
.home-period b{font-size:18px}
.home-today .muted{color:#d5e3f1}
.home-hint{font-size:13px;opacity:.85;border-top:1px solid #ffffff2b;padding-top:10px}
.home-alerts{display:grid;gap:8px}
.home-alert{background:#fff7e8;border:1px solid #f1d7a8;border-inline-start:4px solid #b8894a;border-radius:10px;padding:10px 14px;color:#6b4a14}
.home-alert.bad{background:#fdecea;border-color:#f5c2bd;border-inline-start-color:#b42318;color:#7a1a12}
.home-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.home-stat{background:#fff;border:1px solid #e4e7ec;border-radius:12px;padding:12px 14px;display:grid;gap:4px}
.home-stat span{color:#667085;font-size:13px}
.home-stat b{font-size:22px;color:#173b63;font-variant-numeric:tabular-nums}
.home-note{font-size:12px;margin-top:-10px}
.home-actions{display:flex;gap:10px;flex-wrap:wrap}
.home-recent h2{font-size:18px;margin:0 0 4px;color:#173b63}
.tl-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.tl-chip{border:1px solid #d0d5dd;background:#fff;color:#344054;border-radius:999px;padding:7px 14px;cursor:pointer;font-weight:500}
.tl-chip.active{background:#173b63;border-color:#173b63;color:#fff}
.tl-feed{max-width:880px}
.tl-day{font-size:14px;color:#667085;margin:18px 0 8px;font-weight:600}
.tl-list{list-style:none;margin:0;padding:0;border-inline-start:2px solid #e4e7ec;margin-inline-start:15px;display:grid;gap:10px}
.tl-item{display:flex;gap:12px;align-items:flex-start;margin-inline-start:-16px}
.tl-dot{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:14px;background:#eaf0f6;border:2px solid #fff;box-shadow:0 0 0 1px #e4e7ec}
.tl-g-attendance .tl-dot{background:#e3f0fb}
.tl-g-leave .tl-dot{background:#e6f5ec}
.tl-g-finance .tl-dot{background:#f7eedf;color:#8a6428;font-weight:700}
.tl-g-document .tl-dot{background:#eef0f4}
.tl-g-action .tl-dot{background:#fdecea}
.tl-body{flex:1;min-width:0;background:#fff;border:1px solid #e4e7ec;border-radius:12px;padding:10px 14px}
.tl-head{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.tl-head time{margin-inline-start:auto;color:#667085;font-size:13px;font-variant-numeric:tabular-nums}
.tl-detail{display:flex;gap:6px 14px;flex-wrap:wrap;color:#475467;font-size:14px;margin-top:4px;font-variant-numeric:tabular-nums}
.tl-pill{font-size:12px;padding:2px 9px;border-radius:999px;font-weight:600}
.tl-ok{background:#e6f5ec;color:#136c3a}
.tl-warn{background:#fff3dc;color:#8a5a00}
.tl-bad{background:#fdecea;color:#a3281d}
.tl-info{background:#e3f0fb;color:#1f5f99}
.tl-empty{color:#667085;margin-top:12px}
.tl-more{margin:18px 0}
.mnav{display:none}
@media(max-width:780px){
.has-mnav .side{padding:12px 16px}
.has-mnav .side .brand img{max-width:120px!important}
.has-mnav .side .nav{display:none}
.has-mnav .side.open .nav{display:grid}
.has-mnav .main{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
.mnav{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;position:fixed;inset-inline:0;bottom:0;z-index:900;background:#fff;border-top:1px solid #e4e7ec;padding:6px 6px calc(6px + env(safe-area-inset-bottom,0px));box-shadow:0 -6px 20px #0000000f}
.mnav button{border:0;background:transparent;display:grid;justify-items:center;gap:2px;padding:6px 2px;color:#475467;font-size:12px;border-radius:10px;cursor:pointer}
.mnav button span{font-size:18px;line-height:1}
.mnav button.active{color:#173b63;background:#eaf0f6;font-weight:700}
.home-hello h1{font-size:22px}
.home-stats{grid-template-columns:1fr 1fr}
}

/* لوحة التحكم المرنة: أقسام منسدلة وقوائم مختصرة */
.dash{display:grid;gap:14px;max-width:1100px}
.dash .top{margin-bottom:6px}
.dsec{background:#fff;border:1px solid #e4e7ec;border-radius:14px;overflow:hidden}
.dsec>summary{list-style:none;display:flex;align-items:center;gap:10px;padding:14px 18px;cursor:pointer;font-weight:700;color:#173b63;user-select:none}
.dsec>summary::-webkit-details-marker{display:none}
.dsec>summary:hover{background:#f8fafc}
.dsec-title{font-size:16px}
.dsec-count{background:#eaf0f6;color:#173b63;border-radius:999px;padding:1px 10px;font-size:13px;font-variant-numeric:tabular-nums}
.dsec-arrow{margin-inline-start:auto;transition:transform .2s;color:#667085}
details[open]>summary .dsec-arrow{transform:rotate(180deg)}
.dsec-body{padding:0 18px 16px}
.dsec-accent{border-color:#b8894a66;box-shadow:inset 4px 0 0 #b8894a}
.dsec-accent>summary .dsec-count{background:#b8894a;color:#fff}
.dsec-bad>summary .dsec-count{background:#fdecea;color:#a3281d}
.dsec-nest{display:grid;gap:10px}
.dsec-nest .dsec{border-radius:10px}
.dsec-nest .dsec>summary{padding:10px 14px;font-size:15px}
.dsec-nest .dsec-body{padding:0 14px 12px}
.dkpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.dkpi{background:#f8fafc;border:1px solid #edf0f4;border-radius:10px;padding:10px 14px;display:grid;gap:2px}
.dkpi span{color:#667085;font-size:13px}
.dkpi b{font-size:24px;color:#173b63;font-variant-numeric:tabular-nums}
.drows{list-style:none;margin:0;padding:0;display:grid}
.drows+.drows{border-top:1px solid #edf0f4}
.drow{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid #edf0f4;flex-wrap:wrap}
.drows .drow:last-child{border-bottom:0}
.drow-main{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 220px}
.drow-main .muted{font-size:13px}
.drow-info{font-size:14px;color:#475467;font-variant-numeric:tabular-nums}
.drow-act{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.dbtn{padding:7px 12px;font-size:14px}
.dpct{color:#173b63;font-variant-numeric:tabular-nums}
.dbar{display:block;height:6px;background:#e7edf4;border-radius:6px;overflow:hidden;max-width:260px;margin-top:4px}
.dbar span{display:block;height:100%;background:#1f5f99}
.dash-more{margin-top:8px;border:0;background:transparent;color:#1f5f99;font-weight:700;cursor:pointer;padding:6px 0}
.dash-empty{padding:6px 0}
.dash-note{font-size:13px;margin-top:4px}
.tl-daybox{margin-top:8px}
.tl-daybox>summary{list-style:none;display:flex;align-items:center;gap:8px;cursor:pointer;margin:10px 0 8px}
.tl-daybox>summary::-webkit-details-marker{display:none}
.tl-daycount{background:#eaf0f6;color:#475467;border-radius:999px;padding:0 8px;font-size:12px;font-variant-numeric:tabular-nums}
.tl-daybox>summary .dsec-arrow{margin-inline-start:0;font-size:12px}
.home .dsec-body .home-stats{margin-top:2px}
@media(max-width:780px){
.dsec>summary{padding:12px 14px}
.dsec-body{padding:0 14px 14px}
.dkpis{grid-template-columns:1fr 1fr}
.drow-act{width:100%}
.drow-act .dbtn{flex:1}
}
.drows[hidden]{display:none}
.tl-weekbox{background:#fff;border:1px solid #e4e7ec;border-radius:12px;margin-top:10px}
.tl-weekbox>summary{list-style:none;display:flex;align-items:center;gap:8px;padding:12px 16px;cursor:pointer;font-weight:600;color:#344054}
.tl-weekbox>summary::-webkit-details-marker{display:none}
.tl-weekbox>summary .dsec-arrow{margin-inline-start:auto}
.tl-weekbody{padding:0 16px 14px}
.tl-wday{font-size:13px;color:#667085;margin:12px 0 8px;font-weight:600}
@media(max-width:780px){.has-mnav .shell{align-content:start;grid-template-rows:auto 1fr}}
@media(max-width:780px){.has-mnav .toast{bottom:calc(84px + env(safe-area-inset-bottom,0px))}.has-mnav .main h1{font-size:24px}}