/** صفحة dashboard **/

body{
    margin:0;
    font-family:Tahoma,Arial;
    background:linear-gradient(135deg,#0f172a,#020617);
    color:#e5e7eb;
    display:flex;
    min-height:100vh
}
.sidebar{
    width:260px;
    background:#020617;
    border-left:1px solid rgba(255,255,255,.15);
    padding:25px 15px
}
.menu a{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px;
    border-radius:12px;
    background:rgba(255,255,255,.08);
    color:#fff;
    text-decoration:none;
    margin-bottom:10px
}

.menu a:hover {
    background: rgba(96,165,250,.15);
    transform: translateY(-2px);
}

.menu a:active {
    transform: translateY(0);
}

.menu a i{
    width:40px;
    text-align:center;
    color:#22c55e
}


.menu a.logout i{
  color:#ef4444;
  
}
.content{
    flex:1;
    padding:30px;
    width: 100%;
  
}

/**************************************************************/

/********************************صفحة users*******************/

:root{
    --bg1:#0f172a;
    --bg2:#020617;
    --card:rgba(255,255,255,.08);
    --border:rgba(255,255,255,.15);
    --text:#e5e7eb;
    --accent:#22c55e;
    --danger:#ef4444;
}
*{box-sizing:border-box}
body{
    margin:0;
    font-family:Tahoma,Arial;
    background:linear-gradient(135deg,var(--bg1),var(--bg2));
    color:var(--text);
    display:flex;
    min-height:100vh;
}

/* Sidebar */
.sidebar{
    width:260px;
    background:#020617;
    border-left:1px solid var(--border);
    padding:25px 15px;
}
.menu a{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px;
    border-radius:12px;
    background:var(--card);
    color:#fff;
    text-decoration:none;
    margin-bottom:10px;
}
.menu a i{
    width:20px;
    text-align:center;
    color:var(--accent);
}
.menu a.logout i{color:var(--danger)}


.page-title{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:20px;
}
.page-title i{color:var(--accent)}

table{
    width:100%;
    border-collapse:collapse;
    margin-top:0;
}
th,td{
    border:1px solid #334155;
    padding:10px;
    text-align:center;
}
th{background:#020617}

input{
    padding:8px;
    width:100%;
    margin-bottom:10px;
}

button{
    padding:10px 15px;
    background:#22c55e;
    border:none;
    border-radius:8px;
    cursor:pointer;
    font-weight:bold;
}

/* Permissions box */
.perm-box{
    margin-top:30px;
    padding:20px;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255, 8, 8, 0.15);
    border-radius:14px;
}
.perm-group{
    margin:20px 0 10px;
    font-size:14px;
    color:#a7f3d0;
    border-bottom:1px solid rgba(0, 255, 64, 0.15);
    padding-bottom:5px;
}
.perm-item{
    display:grid;
    grid-template-columns:1fr 40px;
    align-items:center;
    background:rgba(0,0,0,.25);
    padding:12px 14px;
    border-radius:12px;
    margin-bottom:8px;
}
.perm-item span{
    font-size:14px;
    
}
.perm-item input{
    width:18px;
    height:18px;
    accent-color:#22c55e;
}

/* Save button icon */
button[name="save_permissions"] i{
    color:#052e16;
    font-size:18px;
    margin-left:6px;
}


    
.edit-users {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    color: #60a5fa;              /* أزرق */
    transition: all .2s ease;
    text-decoration: none;

}

.edit-users:hover {
    background: rgba(96,165,250,.15);
    transform: translateY(-2px);
}

.edit-users:active {
    transform: translateY(0);
}

.edit-per {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    color: #f3e413ff;              /* اصفر */
    transition: all .2s ease;
    text-decoration: none;

}

.edit-per:hover {
    background: rgba(96,165,250,.15);
    transform: translateY(-2px);
}

.edit-per:active {
    transform: translateY(0);
}

.delte-users {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    color: #f0960fff;              /* أزرق */
    transition: all .2s ease;
    text-decoration: none;

}

.delte-users:hover {
    background: rgba(96,165,250,.15);
    transform: translateY(-2px);
}

.delte-users:active {
    transform: translateY(0);
}

/* --------------------المحافطة--------------------------------- */
.gov form {
    margin-bottom: 0;
   
}

.gov{
       flex: 1;
    padding: 30px;
    width: 100%;
}

.set-gov {
color: #ffffff;
}

.tab-gov{
    width:100%;
    border-collapse:collapse;
    margin:10px 0px 0px 0px;
    
}

th{background:#020617}

.tr-gov{
text-align: left;
border:1px solid #f4f9ff;
    padding:10px;
    text-align:center;
}

/************************ المناطق********************/
.areas{
    flex: 1;
    padding: 30px;
    width: 100%;
    position: relative;
}

.tab-areas{
    width: 100%;
    margin-top: 15px;
    border-collapse: collapse;
}

.edit-form{
    display: inline-block;
    margin-bottom: 5px;
}



.areas .close{
    color: #22c55e;
    position: absolute;
    left: 30px;
    top: 30px;
    text-decoration: none;
    font-size: 30px;
}

.areas .close:active {
    transform: translate3d(5px)
}
.modals-wrap{
    display: flex;
    gap: 20px;
    justify-content: right;
}

.modal1-box{
    margin-right: 200mm;
}

/****************** رسالة الخطا ************/
.alert{
    padding: 14px 18px;
    border-radius: 10px;
    margin-bottom: 15px;
    font-size: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    animation: slideDown 0.4s ease;
}

.alert-error{
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.alert i{
    font-size: 18px;
}

/* أنيميشن الدخول */
@keyframes slideDown{
    from{
        opacity: 0;
        transform: translateY(-10px);
    }
    to{
        opacity: 1;
        transform: translateY(0);
    }
}

/*****************صفحة الفواتير******************/

.invoice-box{
    max-width:700px;
    margin:30px auto;
    padding:20px;
    border-radius:8px;
    box-shadow:0 0 10px rgba(0,0,0,.1);

}
.invoice-box h2{
    text-align:center;
    margin-bottom:20px;
}
.invoice-box h3{
    margin:15px 0 10px;
    color:#444;
}
.invoice-box input{
    width:100%;
    padding:10px;
    margin-bottom:10px;
    border:1px solid #05081428;
    border-radius:5px;
}
.row{
    display:flex;
    gap:10px;
}
.row input{
    flex:1;
}
button.sav{
    width:100%;
    padding:12px;
    background:#22c55e;
    color:#fff;
    border:none;
    font-size:16px;
    border-radius:6px;
    cursor:pointer;
}
button.sav:hover{
    background:#22c55e;
}
.success{
    background:#d4edda;
    color:#155724;
    padding:10px;
    margin-bottom:15px;
    border-radius:5px;
    text-align:center;
}

h3.info{
 color:#fff;
   font-family: 'Cairo', Tahoma, Arial;
    font-size: 18px;
    font-weight: bold;
}

h3.inf2{
  color:#fff;  
}

h2 i {color: #22c55e;}



/***********************************صفحة الاعدادات********************************/

.save.b button{
margin-right:280mm;
}
.save-btn {
    background: #22c55e;
    color: #fff;
    padding: 12px 22px;
    border: 2px solid #16a34a;   /* لون أغمق */
    border-radius: 10px;
    font-size: 15px;
    cursor: pointer;
    transition: all .25s ease;
    height: fit-content;
}

.save-btn:hover {
    background: #16a34a;
    border-color: #22c55e;
}

.save.b {
    display: flex;           /* نفس الصف */
    margin-top: 5mm;
    margin-right: 4mm;
    }

.settings-table {
     margin-right: 4mm;
     margin-top: 8mm;   
    }

    /**********************فواتير البيع***********************/
.page-ti{
    display: flex;              /* 🔑 نفس السطر */
    gap: 10px;                  /* مسافة بين الأيقونة والنص */
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 20px;
    white-space: nowrap;        /* يمنع النزول لسطر جديد */
    margin-right: 4mm;
}




/* ===== صفحات الإدارة المنفصلة ===== */
.management-page{
    flex:1;
    padding:30px;
    width:100%;
    min-width:0;
}
.management-page table{
    margin-top:0;
}
.management-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    flex-wrap:wrap;
    margin-bottom:22px;
}
.management-title{
    display:flex;
    align-items:center;
    gap:12px;
    margin:0;
}
.management-title i{
    color:#22c55e;
}
.management-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap;
    margin-bottom:20px;
    padding:14px 16px;
    background:rgba(2,6,23,.72);
    border:1px solid #334155;
    border-radius:14px;
}
.management-toolbar .toolbar-side{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.management-count{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 13px;
    border-radius:10px;
    background:rgba(96,165,250,.12);
    border:1px solid rgba(96,165,250,.30);
    color:#bfdbfe;
    font-weight:700;
}
.management-add-btn,
.management-back-btn,
.management-cancel-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:44px;
    padding:10px 17px;
    border-radius:11px;
    text-decoration:none;
    font-weight:800;
    transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.management-add-btn{
    color:#052e16;
    background:linear-gradient(135deg,#4ade80,#22c55e);
    box-shadow:0 8px 22px rgba(34,197,94,.22);
}
.management-add-btn:hover,
.management-back-btn:hover,
.management-cancel-btn:hover{
    transform:translateY(-2px);
}
.management-back-btn,
.management-cancel-btn{
    color:#e2e8f0;
    background:#111827;
    border:1px solid #475569;
}
.management-search-form{
    display:flex;
    align-items:center;
    gap:8px;
    flex:1;
    min-width:min(100%,280px);
}
.management-search-form input{
    margin:0;
    width:min(100%,360px);
    min-height:44px;
    padding:10px 13px;
    border:1px solid #334155;
    border-radius:10px;
    background:#020617;
    color:#fff;
}
.management-search-form button{
    min-height:44px;
    padding:10px 14px;
}
.management-form-page{
    flex:1;
    padding:30px;
    width:100%;
    min-width:0;
}
.management-form-shell{
    max-width:820px;
    margin:0 auto;
}
.management-form-card{
    overflow:hidden;
    background:linear-gradient(160deg,rgba(15,23,42,.98),rgba(2,6,23,.98));
    border:1px solid #334155;
    border-radius:20px;
    box-shadow:0 20px 55px rgba(0,0,0,.28);
}
.management-form-card__head{
    display:flex;
    align-items:center;
    gap:14px;
    padding:22px 24px;
    border-bottom:1px solid #334155;
    background:rgba(255,255,255,.025);
}
.management-form-card__icon{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    flex:0 0 48px;
    border-radius:14px;
    color:#052e16;
    background:linear-gradient(135deg,#86efac,#22c55e);
    font-size:20px;
}
.management-form-card__head h2{
    margin:0 0 4px;
}
.management-form-card__head p{
    margin:0;
    color:#94a3b8;
    font-size:.9em;
}
.management-form{
    padding:24px;
}
.management-form-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}
.management-form-group{
    display:flex;
    flex-direction:column;
    gap:8px;
}
.management-form-group.full{
    grid-column:1/-1;
}
.management-form-group label{
    color:#e2e8f0;
    font-weight:800;
}
.management-form-group input,
.management-form-group select,
.management-form-group textarea{
    width:100%;
    margin:0;
    min-height:48px;
    padding:11px 13px;
    border:1px solid #475569;
    border-radius:11px;
    background:#020617;
    color:#fff;
    outline:none;
}
.management-form-group textarea{
    min-height:100px;
    resize:vertical;
}
.management-form-group input:focus,
.management-form-group select:focus,
.management-form-group textarea:focus{
    border-color:#22c55e;
    box-shadow:0 0 0 3px rgba(34,197,94,.14);
}
.management-form-hint{
    color:#94a3b8;
    font-size:.82em;
}
.management-form-actions{
    display:flex;
    justify-content:flex-end;
    gap:10px;
    flex-wrap:wrap;
    margin-top:24px;
    padding-top:20px;
    border-top:1px solid #334155;
}
.management-save-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:46px;
    padding:11px 22px;
    border:0;
    border-radius:11px;
    color:#052e16;
    background:linear-gradient(135deg,#4ade80,#22c55e);
    font-weight:900;
    cursor:pointer;
}
.management-empty{
    padding:28px !important;
    color:#94a3b8;
}
@media (max-width:760px){
    .management-page,
    .management-form-page{padding:18px;}
    .management-form-grid{grid-template-columns:1fr;}
    .management-form-group.full{grid-column:auto;}
    .management-add-btn,
    .management-back-btn{width:100%;}
    .management-toolbar .toolbar-side{width:100%;}
    .management-search-form{width:100%;}
    .management-search-form input{width:100%;}
}

/* =========================================================
   التقسيم الاحترافي للقوائم
   ========================================================= */
.pagination-shell{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap;
    margin:16px 0;
    padding:13px 15px;
    border:1px solid #334155;
    border-radius:14px;
    background:linear-gradient(145deg,rgba(15,23,42,.94),rgba(2,6,23,.94));
    box-shadow:0 10px 28px rgba(0,0,0,.15);
}
.pagination-summary{
    display:flex;
    align-items:center;
    gap:6px;
    color:#cbd5e1;
    white-space:nowrap;
}
.pagination-summary i{color:#60a5fa;margin-left:3px}
.pagination-summary strong{color:#fff}
.pagination-size-form{
    display:flex;
    align-items:center;
    gap:9px;
    margin:0;
}
.pagination-size-form label{
    color:#cbd5e1;
    font-weight:700;
    white-space:nowrap;
}
.pagination-select-wrap{
    position:relative;
    min-width:92px;
}
.pagination-select-wrap select{
    width:100%;
    height:40px;
    margin:0;
    padding:7px 13px 7px 34px;
    appearance:none;
    border:1px solid #475569;
    border-radius:10px;
    background:#020617;
    color:#fff;
    font-weight:800;
    cursor:pointer;
    outline:none;
}
.pagination-select-wrap select:focus{
    border-color:#22c55e;
    box-shadow:0 0 0 3px rgba(34,197,94,.13);
}
.pagination-select-wrap i{
    position:absolute;
    left:11px;
    top:50%;
    transform:translateY(-50%);
    color:#94a3b8;
    pointer-events:none;
    font-size:12px;
}
.pagination-nav{
    display:flex;
    align-items:center;
    gap:7px;
    flex-wrap:wrap;
}
.pagination-numbers{
    display:flex;
    align-items:center;
    gap:6px;
}
.pagination-btn{
    min-width:38px;
    height:38px;
    padding:0 11px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    border:1px solid #475569;
    border-radius:10px;
    background:#111827;
    color:#e2e8f0;
    text-decoration:none;
    font-weight:800;
    transition:.18s ease;
}
a.pagination-btn:hover{
    transform:translateY(-2px);
    border-color:#60a5fa;
    background:#1e293b;
}
.pagination-btn.active{
    color:#052e16;
    border-color:#22c55e;
    background:linear-gradient(135deg,#4ade80,#22c55e);
    box-shadow:0 7px 18px rgba(34,197,94,.22);
}
.pagination-btn.disabled{
    opacity:.38;
    cursor:not-allowed;
}
.pagination-direction{min-width:92px}
.pagination-ellipsis{color:#94a3b8;padding:0 2px}
@media(max-width:820px){
    .pagination-shell{align-items:stretch}
    .pagination-summary,
    .pagination-size-form,
    .pagination-nav{width:100%;justify-content:center}
}
@media(max-width:520px){
    .pagination-direction{min-width:42px;font-size:0;padding:0 10px}
    .pagination-direction i{font-size:14px}
    .pagination-numbers .pagination-btn{min-width:34px;padding:0 8px}
}

/* ===== Professional UI v2 ===== */
:root{--accent:#22c55e;--bg:#07111f;--panel:#0f1d30;--panel2:#13243a;--stroke:#263c56;--text:#e5edf7;--muted:#91a4bb;--danger:#ef4444;--warning:#f59e0b;--info:#38bdf8;--radius:14px}
*{box-sizing:border-box}
html{background:var(--bg)}
body.app-body{margin:0;min-height:100vh;background:radial-gradient(circle at top right,#12304a 0,transparent 34%),var(--bg);color:var(--text);display:block!important}
.app-sidebar{position:fixed;right:0;top:0;bottom:0;width:270px;background:rgba(7,17,31,.97);border-left:1px solid var(--stroke);padding:18px 14px;display:flex;flex-direction:column;z-index:1000;backdrop-filter:blur(12px)}
.brand-box{display:flex;align-items:center;gap:12px;padding:8px 7px 20px;border-bottom:1px solid var(--stroke);margin-bottom:14px}.brand-box strong{display:block;max-width:175px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand-box small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.brand-mark{width:44px;height:44px;border-radius:13px;background:color-mix(in srgb,var(--accent) 22%,transparent);color:var(--accent);display:grid;place-items:center;font-size:20px;border:1px solid color-mix(in srgb,var(--accent) 40%,transparent)}
.app-nav{display:flex;flex-direction:column;gap:5px;overflow-y:auto;padding-left:3px}.app-nav a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;text-decoration:none;color:#cbd8e7;transition:.18s;border:1px solid transparent}.app-nav a i{width:25px;text-align:center;color:#7692ad}.app-nav a:hover{background:#13243a;border-color:#263c56;transform:translateX(-2px)}.app-nav a.active{background:color-mix(in srgb,var(--accent) 14%,#0f1d30);color:#fff;border-color:color-mix(in srgb,var(--accent) 40%,transparent)}.app-nav a.active i{color:var(--accent)}
.sidebar-user{margin-top:auto;border-top:1px solid var(--stroke);padding:15px 5px 2px;display:flex;align-items:center;gap:10px}.user-avatar{width:38px;height:38px;border-radius:12px;background:var(--accent);color:#062319;display:grid;place-items:center;font-weight:900}.user-meta{min-width:0;flex:1}.user-meta strong,.user-meta small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-meta small{color:var(--muted);font-size:11px}.logout-form button,.legacy-logout button{border:0;background:#32151c;color:#fca5a5;border-radius:9px;padding:9px;cursor:pointer}
.app-main{margin-right:270px;min-height:100vh;padding:26px}.mobile-menu-button{display:none}.sidebar-overlay{display:none}
.page-shell{max-width:1400px;margin:0 auto}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px;flex-wrap:wrap}.page-heading h1{font-size:25px;margin:0}.page-heading p{color:var(--muted);margin:6px 0 0}.page-actions{display:flex;gap:9px;flex-wrap:wrap}
.panel{background:linear-gradient(145deg,rgba(15,29,48,.98),rgba(10,23,39,.98));border:1px solid var(--stroke);border-radius:var(--radius);padding:18px;box-shadow:0 14px 35px #0002}.panel+.panel{margin-top:16px}.panel-title{margin:0 0 15px;font-size:17px}.grid{display:grid;gap:14px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.form-group{display:flex;flex-direction:column;gap:7px}.form-group label{font-weight:700;font-size:13px}.form-control{width:100%;height:42px;border:1px solid #31506b;background:#071421;color:#f8fafc;border-radius:10px;padding:0 12px;outline:none}.form-control:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent)}textarea.form-control{height:auto;min-height:90px;padding:11px 12px;resize:vertical}.form-hint{color:var(--muted);font-size:11px}.form-actions{display:flex;gap:10px;align-items:center;justify-content:flex-end;margin-top:18px;flex-wrap:wrap}
.btn{height:40px;padding:0 15px;border-radius:10px;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none;cursor:pointer;font-weight:800;font-family:inherit}.btn-primary{background:var(--accent);color:#052e16}.btn-secondary{background:#1b3047;color:#e5edf7;border-color:#31506b}.btn-danger{background:#451821;color:#fecaca;border-color:#7f1d1d}.btn-warning{background:#4a3510;color:#fde68a;border-color:#854d0e}.btn-info{background:#12364a;color:#bae6fd;border-color:#0e7490}.btn-sm{height:34px;padding:0 10px;font-size:12px}.btn:hover{filter:brightness(1.08)}.btn:disabled{opacity:.55;cursor:not-allowed}
.table-wrap{overflow:auto;border:1px solid var(--stroke);border-radius:12px}.data-table{width:100%;border-collapse:collapse;min-width:850px;background:#0a1727}.data-table th{background:#13243a;color:#cbd8e7;font-size:12px;white-space:nowrap}.data-table th,.data-table td{border-bottom:1px solid #20364d;padding:11px;text-align:center}.data-table tbody tr:hover{background:#10243a}.table-actions{display:flex;justify-content:center;gap:6px;flex-wrap:wrap}.inline-form{display:inline-flex;margin:0}.empty-state{text-align:center;padding:35px;color:var(--muted)}
.badge{display:inline-flex;align-items:center;justify-content:center;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:800;border:1px solid}.badge-success{color:#86efac;background:#143523;border-color:#166534}.badge-warning{color:#fde68a;background:#422f0c;border-color:#854d0e}.badge-danger{color:#fca5a5;background:#40151d;border-color:#991b1b}.badge-info{color:#bae6fd;background:#12364a;border-color:#0369a1}.badge-muted{color:#cbd5e1;background:#263449;border-color:#475569}
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.stat-card{background:linear-gradient(145deg,#10243a,#0c1c2e);border:1px solid var(--stroke);border-radius:14px;padding:17px;display:flex;gap:13px;align-items:center}.stat-icon{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent);font-size:20px}.stat-info small{color:var(--muted)}.stat-info strong{display:block;font-size:23px;margin-top:4px}
.filters{display:flex;align-items:end;gap:10px;flex-wrap:wrap}.filters .form-group{min-width:170px;flex:1}.filters .form-control{height:40px}.search-compact{max-width:230px}
.app-flashes{position:fixed;top:18px;left:18px;z-index:5000;width:min(420px,calc(100vw - 36px));display:flex;flex-direction:column;gap:8px}.app-flash{padding:13px 15px;border-radius:11px;border:1px solid;box-shadow:0 12px 30px #0005;background:#102033}.app-flash--success{color:#bbf7d0;border-color:#15803d}.app-flash--error{color:#fecaca;border-color:#b91c1c}.app-flash--warning{color:#fde68a;border-color:#d97706}.app-flash--info{color:#bae6fd;border-color:#0284c7}
.item-row{display:grid;grid-template-columns:2.2fr 1fr .7fr .8fr .8fr auto;gap:9px;align-items:end;padding:12px;border:1px solid #263c56;border-radius:12px;background:#091827;margin-bottom:10px}.item-total{height:42px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#10243a;font-weight:900}.invoice-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.summary-box{background:#091827;border:1px solid #263c56;border-radius:12px;padding:13px}.summary-box span{color:var(--muted);font-size:12px}.summary-box strong{display:block;margin-top:7px;font-size:18px}
.chart-bars{display:flex;align-items:flex-end;gap:9px;height:220px;padding-top:20px}.chart-column{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:7px;height:100%;min-width:34px}.chart-bar{width:100%;max-width:55px;background:linear-gradient(180deg,var(--accent),color-mix(in srgb,var(--accent) 50%,#0d5c45));border-radius:8px 8px 2px 2px;min-height:3px}.chart-label{font-size:10px;color:var(--muted);white-space:nowrap}.chart-value{font-size:10px;color:#e5edf7}
@media(max-width:1050px){.stats-grid,.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}.item-row{grid-template-columns:1.8fr 1fr .8fr .8fr}.item-row .line-total-cell,.item-row .remove-cell{grid-column:auto}.invoice-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.app-sidebar{transform:translateX(105%);transition:.22s;width:min(285px,88vw)}.app-main{margin-right:0;padding:70px 14px 20px}.mobile-menu-button{display:grid;position:fixed;right:14px;top:14px;z-index:1200;width:43px;height:43px;place-items:center;border-radius:11px;border:1px solid var(--stroke);background:#10243a;color:#fff}.menu-open .app-sidebar{transform:translateX(0)}.menu-open .sidebar-overlay{display:block;position:fixed;inset:0;background:#0009;z-index:900}.grid-2,.grid-3,.grid-4,.stats-grid,.invoice-summary{grid-template-columns:1fr}.item-row{grid-template-columns:1fr 1fr}.item-row .item-select-cell{grid-column:1/-1}.page-heading{align-items:flex-start}.panel{padding:14px}}
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.professional-card{display:block;text-decoration:none;color:var(--text);background:linear-gradient(145deg,#10243a,#091827);border:1px solid var(--stroke);border-radius:14px;padding:18px;transition:.2s}.professional-card:hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:0 14px 28px #0003}.professional-card .card-icon{color:var(--accent);font-size:22px}.professional-card h3{margin:13px 0}.card-meta{display:flex;justify-content:space-between;gap:10px;color:var(--muted)}.card-meta strong{color:var(--accent)}


/* =========================================================
   UI alignment and table spacing fix — v2.0.1
   ========================================================= */

/* Eliminate the legacy empty area above tables on every list page. */
table,
.data-table,
.page-shell table,
.app-main table {
    margin-top: 0 !important;
}

.table-wrap {
    display: block;
    min-height: 0;
}

.data-table {
    margin: 0 !important;
}

/* Normalize controls so inputs, selects and action buttons share one baseline. */
.form-control,
.filters .form-control,
.management-search-form input {
    margin: 0 !important;
}

.filters {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}

.filters .form-group {
    margin: 0;
    min-width: 170px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 7px;
}

.filters .form-group label {
    display: flex;
    align-items: flex-end;
    min-height: 20px;
    margin: 0;
    line-height: 1.25;
}

.filters input.form-control,
.filters select.form-control,
.filters .btn {
    height: 42px !important;
    min-height: 42px !important;
}

.filters input.form-control,
.filters select.form-control {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 40px;
}

.filters select.form-control {
    line-height: normal;
}

.filters input[type="file"].form-control {
    padding: 7px 10px !important;
    line-height: normal;
}

.filters > .btn {
    align-self: flex-end;
    margin: 0 !important;
    flex: 0 0 auto;
}

.search-compact {
    width: 210px;
    max-width: 210px;
    flex: 0 1 210px !important;
}

/* Keep the bottom pagination visually attached to the table panel. */
.table-wrap + .pagination-shell {
    margin-top: 14px;
    margin-bottom: 0;
}

@media (max-width: 900px) {
    .filters .form-group,
    .filters .search-compact {
        width: calc(50% - 6px);
        max-width: none;
        min-width: 220px;
        flex: 1 1 calc(50% - 6px) !important;
    }
}

@media (max-width: 620px) {
    .filters {
        align-items: stretch;
    }

    .filters .form-group,
    .filters .search-compact,
    .filters > .btn {
        width: 100%;
        max-width: none;
        min-width: 0;
        flex: 1 1 100% !important;
    }
}

/* Invoice creation refinements — v2.0.2 */
.invoice-notes-group {
  margin-top: 18px;
  margin-bottom: 0;
}
.invoice-notes-group textarea.form-control {
  min-height: 88px;
  resize: vertical;
}

/* =========================================================
   واجهة الصلاحيات الاحترافية - v2.0.6
   ========================================================= */
.permissions-section{
    margin-top:20px;
}
.permissions-section[hidden]{
    display:none !important;
}
.permissions-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    flex-wrap:wrap;
    margin-bottom:16px;
    padding:17px 18px;
    border:1px solid var(--stroke);
    border-radius:16px;
    background:linear-gradient(145deg,rgba(15,29,48,.98),rgba(8,21,36,.98));
    box-shadow:0 12px 30px rgba(0,0,0,.17);
}
.permissions-toolbar__title{
    display:flex;
    align-items:center;
    gap:13px;
    min-width:0;
}
.permissions-toolbar__icon{
    display:grid;
    place-items:center;
    width:46px;
    height:46px;
    flex:0 0 46px;
    border-radius:13px;
    color:#052e16;
    background:linear-gradient(135deg,#86efac,#22c55e);
    box-shadow:0 8px 20px rgba(34,197,94,.2);
}
.permissions-toolbar h2{
    margin:0;
    font-size:20px;
}
.permissions-toolbar p{
    margin:5px 0 0;
    color:var(--muted);
    font-size:.9em;
}
.permissions-toolbar__actions{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}
.permissions-count{
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-height:40px;
    padding:8px 12px;
    border:1px solid rgba(96,165,250,.28);
    border-radius:11px;
    color:#bfdbfe;
    background:rgba(96,165,250,.09);
    white-space:nowrap;
}
.permissions-count i{color:#60a5fa}
.permissions-count strong{color:#fff;font-size:1.08em}
.permissions-toggle-all{
    min-height:40px;
}
.permissions-toggle-all.is-active{
    color:#052e16;
    border-color:#22c55e;
    background:linear-gradient(135deg,#86efac,#22c55e);
}
.permissions-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(310px,1fr));
    align-items:start;
    gap:14px;
}
.permission-card{
    overflow:hidden;
    border:1px solid var(--stroke);
    border-radius:16px;
    background:linear-gradient(145deg,rgba(15,29,48,.98),rgba(8,21,36,.98));
    box-shadow:0 12px 30px rgba(0,0,0,.14);
    transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.permission-card:hover{
    transform:translateY(-2px);
    border-color:#3f5872;
    box-shadow:0 16px 34px rgba(0,0,0,.2);
}
.permission-card.has-selection{
    border-color:rgba(34,197,94,.38);
}
.permission-card__header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:14px 15px;
    border-bottom:1px solid rgba(51,65,85,.72);
    background:rgba(255,255,255,.018);
}
.permission-card__heading{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
}
.permission-card__icon{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    flex:0 0 38px;
    border-radius:11px;
    color:#86efac;
    background:rgba(34,197,94,.1);
    border:1px solid rgba(34,197,94,.2);
}
.permission-card__heading h3{
    margin:0 0 3px;
    font-size:16px;
}
.permission-card__count{
    color:var(--muted);
    font-size:.78em;
}
.permission-card__count strong{
    color:#86efac;
}
.permission-group-toggle{
    min-height:32px;
    padding:6px 9px;
    border:1px solid #3b526a;
    border-radius:9px;
    color:#cbd5e1;
    background:#0a1727;
    font-size:.76em;
    font-weight:800;
    white-space:nowrap;
    cursor:pointer;
    transition:.18s ease;
}
.permission-group-toggle:hover{
    border-color:#60a5fa;
    color:#fff;
    background:#11263d;
}
.permission-group-toggle.is-active{
    color:#052e16;
    border-color:#22c55e;
    background:#4ade80;
}
.permission-card__list{
    padding:8px;
}
.permission-item{
    position:relative;
    display:grid;
    grid-template-columns:26px minmax(0,1fr);
    align-items:center;
    gap:11px;
    min-height:50px;
    margin:0;
    padding:9px 10px;
    direction:ltr;
    border:1px solid transparent;
    border-radius:10px;
    cursor:pointer;
    transition:background .16s ease,border-color .16s ease,transform .16s ease;
}
.permission-item + .permission-item{
    margin-top:3px;
}
.permission-item:hover{
    border-color:rgba(96,165,250,.2);
    background:rgba(96,165,250,.055);
}
.permission-checkbox{
    position:absolute;
    width:1px !important;
    height:1px !important;
    margin:0 !important;
    opacity:0;
    pointer-events:none;
}
.permission-check{
    position:relative;
    display:grid;
    place-items:center;
    width:24px;
    height:24px;
    border:2px solid #52657a;
    border-radius:7px;
    background:#091421;
    transition:.17s ease;
}
.permission-checkbox:focus-visible + .permission-check{
    outline:3px solid rgba(96,165,250,.3);
    outline-offset:2px;
}
.permission-checkbox:checked + .permission-check{
    border-color:#22c55e;
    background:linear-gradient(135deg,#4ade80,#22c55e);
    box-shadow:0 5px 14px rgba(34,197,94,.22);
}
.permission-checkbox:checked + .permission-check::after{
    content:'✓';
    color:#052e16;
    font-size:16px;
    line-height:1;
    font-weight:1000;
}
.permission-item__content{
    min-width:0;
    direction:rtl;
    text-align:right;
}
.permission-item__content strong{
    display:block;
    color:#eaf2fb;
    font-size:.94em;
    line-height:1.45;
}
.permission-checkbox:checked ~ .permission-item__content strong{
    color:#fff;
}
.permissions-form-actions{
    position:sticky;
    bottom:12px;
    z-index:25;
    display:flex;
    justify-content:flex-start;
    gap:10px;
    flex-wrap:wrap;
    margin-top:18px;
    padding:12px;
    border:1px solid var(--stroke);
    border-radius:14px;
    background:rgba(8,21,36,.94);
    box-shadow:0 12px 30px rgba(0,0,0,.25);
    backdrop-filter:blur(8px);
}
@media(max-width:720px){
    .permissions-toolbar{
        align-items:flex-start;
        padding:14px;
    }
    .permissions-toolbar__actions{
        width:100%;
    }
    .permissions-count,
    .permissions-toggle-all{
        flex:1;
        justify-content:center;
    }
    .permissions-grid{
        grid-template-columns:1fr;
    }
    .permission-card__header{
        align-items:flex-start;
    }
    .permission-group-toggle{
        font-size:.7em;
    }
    .permissions-form-actions{
        bottom:8px;
    }
    .permissions-form-actions .btn{
        flex:1;
    }
}