:root{--bg:#f7f1ec;--surface:#fff;--ink:#3a2226;--ink-soft:#8a7176;--line:#efe3e0;--primary:#c81e2e;--primary-2:#e8788a;--accent:#5e1018;--gold:#c9a24b;--teal:#9c4a5e;--blue:#b08968;--good:#2f9e6b;--bad:#d6455d;--shadow:0 8px 30px rgba(94,16,24,.1);--shadow-sm:0 2px 12px rgba(94,16,24,.07);--radius:18px}*{box-sizing:border-box;margin:0;padding:0}body,html{height:100%}body{font-family:Tajawal,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--ink);font-size:15px;-webkit-font-smoothing:antialiased}.app{display:none;min-height:100vh}body.app-ready .app{display:flex}.sidebar{width:296px;flex-shrink:0;background:#fff;color:var(--ink);-webkit-border-end:1px solid var(--line);border-inline-end:1px solid var(--line);box-shadow:0 0 24px rgba(94,16,24,.05);padding:28px 20px;position:-webkit-sticky;position:sticky;top:0;height:100vh}.brand,.sidebar{display:flex;flex-direction:column}.brand{align-items:center;gap:6px;margin-bottom:32px}.brand-badge{width:100%;display:grid;place-items:center;padding:4px}.brand-badge img{width:100%;max-width:100%;height:auto;display:block}.brand-sub{font-size:13px;color:var(--ink-soft);letter-spacing:.5px;font-weight:600}.nav{display:flex;flex-direction:column;gap:6px}.nav-item{display:flex;align-items:center;gap:11px;background:transparent;border:0;color:var(--ink-soft);font-family:inherit;font-size:15px;font-weight:600;text-align:right;padding:12px 14px;border-radius:12px;cursor:pointer;transition:all .18s ease}.nav-item .ni-ico{font-size:17px}.nav-item:hover{background:#fbeef0;color:var(--primary)}.nav-item.active{background:linear-gradient(120deg,var(--primary),#a3142a);color:#fff;font-weight:700;box-shadow:0 6px 16px rgba(200,30,46,.28)}.sidebar-foot{margin-top:auto;padding-top:18px}.user-box{justify-content:space-between;gap:8px;padding:10px 12px;margin-bottom:12px;background:#fbf3ef;border:1px solid var(--line);border-radius:12px}.user-box,.user-meta{display:flex;align-items:center}.user-meta{gap:7px;font-size:13.5px;font-weight:700;color:var(--ink);overflow:hidden;background:transparent;border:0;font-family:inherit;cursor:pointer;padding:0;transition:color .15s}.user-meta:hover{color:var(--primary)}.user-meta .user-ico{font-size:14px}.logout-btn{background:transparent;border:1.5px solid var(--line);color:var(--primary);font-family:inherit;font-weight:700;font-size:12.5px;padding:6px 12px;border-radius:9px;cursor:pointer;transition:.15s;white-space:nowrap}.logout-btn:hover{background:var(--primary);color:#fff;border-color:var(--primary)}.month-pill{font-size:13px;background:#fbf3ef;border-radius:12px;padding:13px 15px;line-height:1.7;border:1px solid var(--line);color:var(--ink)}.month-pill b{color:var(--primary)}.main{flex:1 1;padding:28px 32px 60px;max-width:1500px}.view{display:none;animation:fade .35s ease}.view.active{display:block}@keyframes fade{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.topbar{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:24px;flex-wrap:wrap}.topbar h1{font-size:26px;font-weight:800}.subtitle{color:var(--ink-soft);margin-top:4px;font-size:14px}.topbar-tools{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}.seg-wrap,.select-wrap{display:flex;flex-direction:column;gap:5px;font-size:13px;color:var(--ink-soft);font-weight:600}.seg{display:inline-flex;background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:4px;gap:3px}.seg button{font-family:inherit;font-size:14px;font-weight:700;color:var(--ink-soft);background:transparent;border:0;border-radius:9px;padding:8px 16px;cursor:pointer;transition:all .15s ease}.seg button:hover{color:var(--primary)}.seg button.active{background:linear-gradient(120deg,var(--primary-2),var(--primary));color:#fff;box-shadow:0 4px 12px rgba(139,58,98,.3)}.text-input,input[type=date],input[type=email],input[type=number],input[type=password],input[type=tel],input[type=text],select,textarea{font-family:inherit;font-size:15px;color:var(--ink);background:var(--surface);border:1.5px solid var(--line);border-radius:11px;padding:10px 13px;outline:none;transition:border-color .15s,box-shadow .15s}select{min-width:190px;cursor:pointer}textarea{width:100%;resize:vertical;min-height:92px;line-height:1.7}.form-section>textarea{display:block}input[type=number]{-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input:focus,select:focus,textarea:focus{border-color:var(--primary-2);box-shadow:0 0 0 3px rgba(183,110,121,.15)}.sar{height:.92em;width:auto;display:inline-block;vertical-align:-.08em;-webkit-margin-start:3px;margin-inline-start:3px}.select-wrap.inline{flex-direction:row;align-items:center;gap:9px}.toolbar{gap:16px 24px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:13px 20px;box-shadow:var(--shadow-sm);margin-bottom:24px}.toolbar,.toolbar-group{display:flex;align-items:center}.toolbar-group{gap:11px}.toolbar-spacer{flex:1 1 20px}.tb-label{font-size:13px;white-space:nowrap}.kpi-section-label,.tb-label{font-weight:700;color:var(--ink-soft)}.kpi-section-label{font-size:14px;margin:4px 2px 12px;display:flex;align-items:center;gap:10px}.kpi-section-label:after{content:"";flex:1 1;height:1px;background:var(--line)}.kpi-grid{display:grid;grid-gap:18px;gap:18px;margin-bottom:28px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}.kpi{background:var(--surface);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow-sm);position:relative;overflow:hidden;border:1px solid var(--line)}.kpi:before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:5px;background:var(--kpi-color,var(--primary))}.kpi-label{color:var(--ink-soft);font-size:13.5px;font-weight:600;margin-bottom:8px}.kpi-value{font-size:28px;font-weight:800;letter-spacing:-.5px}.kpi-value small{font-size:14px;font-weight:600;color:var(--ink-soft)}.kpi-delta{margin-top:10px;font-size:13px;font-weight:700;display:inline-flex;align-items:center;gap:5px}.kpi-delta.up{color:var(--good)}.kpi-delta.down{color:var(--bad)}.kpi-delta.flat{color:var(--ink-soft)}.chart-grid{display:grid;grid-gap:22px;gap:22px;grid-template-columns:repeat(2,1fr)}.card{background:var(--surface);border-radius:var(--radius);padding:22px 24px;box-shadow:var(--shadow-sm);border:1px solid var(--line)}.card.span-2{grid-column:span 2}.card.span-full{grid-column:1/-1}.subpanel>.card,.view>.card{margin-bottom:18px}.chart-grid .card{margin-bottom:0}.card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.card-head h3{font-size:16px;font-weight:700}.card-tag{font-size:12px;color:var(--ink-soft);background:var(--bg);padding:4px 10px;border-radius:8px;font-weight:600}.chart-box{position:relative;height:300px}.chart-box.tall{height:380px}.note-grid{display:grid;grid-gap:18px;gap:18px;margin-top:18px;grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}.note-card{background:linear-gradient(120deg,#fff,#fbf3ef);border:1px solid var(--line);-webkit-border-start:5px solid var(--gold);border-inline-start:5px solid var(--gold);border-radius:var(--radius);padding:18px 22px;box-shadow:var(--shadow-sm);line-height:1.9;color:var(--ink)}.note-card b{color:var(--primary)}.note-card.social{border-inline-start-color:var(--primary-2);background:linear-gradient(120deg,#fff,#fdf2f4)}.form-section.social-section{-webkit-border-start:5px solid var(--primary-2);border-inline-start:5px solid var(--primary-2);background:linear-gradient(120deg,#fff,#fdf3f5)}.form-section.social-section h4{color:var(--primary-2)}.full-label{display:flex;flex-direction:column;gap:6px;font-size:13.5px;font-weight:600;color:var(--ink-soft);margin-top:14px}.full-label small{font-weight:400;opacity:.8}.lists-wrap{display:flex;flex-direction:column;gap:14px;margin-top:6px}.list-block{background:#fbf6f3;border:1px solid var(--line);-webkit-border-start:4px solid var(--primary-2);border-inline-start:4px solid var(--primary-2);border-radius:12px;padding:14px 16px}.list-label{display:block;font-weight:700;font-size:14px;color:var(--primary);margin-bottom:12px}.list-rows{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}.list-row{display:flex;gap:8px;align-items:center}.list-row .list-item{flex:1 1;width:100%}.list-row .list-del{flex:0 0 auto}.list-block .list-add{width:100%}.table-wrap{overflow-x:auto}.cmp-table{width:100%;border-collapse:collapse;font-size:14.5px}.cmp-table td,.cmp-table th{padding:13px 14px;text-align:right;border-bottom:1px solid var(--line)}.cmp-table thead th{color:var(--ink-soft);font-weight:700;font-size:13px;background:var(--bg)}.cmp-table tbody tr:hover{background:#faf8fc}.cmp-table .metric{font-weight:600}.cmp-table .num{font-feature-settings:"tnum";font-variant-numeric:tabular-nums;font-weight:600}.delta-chip{font-size:12px;font-weight:700;padding:3px 9px;border-radius:20px}.delta-chip.up{color:var(--good);background:rgba(47,158,107,.12)}.delta-chip.down{color:var(--bad);background:rgba(214,69,93,.12)}.delta-chip.flat{color:var(--ink-soft);background:var(--bg)}.row-actions{display:flex;gap:7px;justify-content:flex-start;flex-wrap:wrap}.row-actions .btn{min-width:66px;justify-content:center;padding:6px 10px}.form{display:flex;flex-direction:column;gap:18px;max-width:1080px;margin-inline:auto;width:100%}.form-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.form input,.form select,.form textarea{max-width:100%}.form-section{background:var(--surface);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow-sm);border:1px solid var(--line)}.form-section h4{font-size:16px;margin-bottom:16px;color:var(--primary);font-weight:700}.form-grid{display:grid;grid-gap:14px 16px;gap:14px 16px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));align-items:end}.form-grid label{display:flex;flex-direction:column;gap:6px;font-size:13.5px;font-weight:600;color:var(--ink-soft);justify-content:flex-end}.form-grid label small{display:block;font-weight:400;opacity:.75;font-size:11.5px}.form-grid input,.form-grid select,.form-grid textarea{width:100%}.staff-rows{display:flex;flex-direction:column;gap:10px;margin-bottom:12px}.staff-row{display:flex;gap:10px;align-items:center}.staff-row input{flex:1 1}.staff-row .del{flex:0 0 auto}.staff-name-label{flex:1 1;font-weight:700;color:var(--ink);background:#fbf3ef;border:1.5px solid var(--line);border-radius:11px;padding:11px 14px}.staff-name-label small{font-weight:400;color:var(--ink-soft)}.form-actions{display:flex;align-items:center;gap:16px}.form-msg{font-weight:700}.form-msg.ok{color:var(--good)}.btn{font-family:inherit;font-size:14.5px;font-weight:700;cursor:pointer;border:1.5px solid transparent;border-radius:11px;padding:11px 18px;transition:transform .12s,box-shadow .15s,background .15s;display:inline-flex;align-items:center;gap:6px}.btn:active{transform:scale(.97)}.btn.sm{padding:8px 13px}.btn.primary{background:linear-gradient(120deg,var(--primary-2),var(--primary));color:#fff;box-shadow:0 6px 16px rgba(139,58,98,.3)}.btn.primary:hover{box-shadow:0 8px 22px rgba(139,58,98,.42)}.btn.ghost{background:var(--surface);border-color:var(--line);color:var(--ink)}.btn.ghost:hover{border-color:var(--primary-2);color:var(--primary)}.btn.danger{background:#fff;border-color:rgba(214,69,93,.4);color:var(--bad)}.btn.danger:hover{background:rgba(214,69,93,.08)}.btn.tiny{padding:5px 10px;font-size:12px}.btn.icon-btn{display:inline-grid;place-items:center;padding:6px 9px}.file-btn{cursor:pointer}.subtabs{display:flex;gap:6px;border-bottom:2px solid var(--line);margin-bottom:22px;flex-wrap:wrap}.subtab{font-family:inherit;font-size:15px;font-weight:700;color:var(--ink-soft);background:transparent;border:0;border-bottom:3px solid transparent;margin-bottom:-2px;padding:12px 18px;cursor:pointer;transition:.15s}.subtab.active,.subtab:hover{color:var(--primary)}.subtab.active{border-bottom-color:var(--primary)}.subpanel{display:none;animation:fade .3s ease}.subpanel.active{display:block}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;gap:12px;flex-wrap:wrap}.panel-head h3{font-size:17px;font-weight:700}.report-row{display:flex;flex-wrap:wrap;gap:14px 18px;align-items:flex-end}.report-row .select-wrap{min-width:170px}.report-row .btn{margin-bottom:1px}.settings-row{display:flex;gap:12px;align-items:center}.settings-row.wrap{flex-wrap:wrap}.settings-row .text-input{flex:1 1;max-width:360px}.hint{color:var(--ink-soft);font-size:13px;margin-top:14px;line-height:1.7}.perm-editor{margin-top:18px;padding-top:18px;border-top:1px solid var(--line)}.perm-editor h4{color:var(--primary);font-size:15px;margin-bottom:14px}.perm-cols{display:grid;grid-gap:18px;gap:18px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.perm-col{display:flex;flex-direction:column;gap:9px;background:#fbf3ef;border:1px solid var(--line);border-radius:12px;padding:14px}.perm-h{font-weight:700;font-size:13px;margin-bottom:2px}.chk,.perm-h{color:var(--ink)}.chk{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;cursor:pointer}.chk input{width:17px;height:17px;accent-color:var(--primary);cursor:pointer}.perm-col-wide{gap:12px}.pm-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-bottom:9px;border-bottom:1px dashed var(--line)}.pm-row .pm-name{font-weight:700;font-size:14px;min-width:88px;color:var(--ink)}.badge{font-size:12px;font-weight:700;padding:4px 11px;border-radius:20px;display:inline-block}.badge.active{color:var(--good);background:rgba(47,158,107,.12)}.badge.leave{color:var(--gold);background:rgba(201,162,75,.15)}.badge.expired{color:var(--ink-soft);background:var(--bg)}.badge.terminated{color:var(--bad);background:rgba(214,69,93,.12)}.badge.role{color:var(--primary);background:rgba(200,30,46,.1)}#toastWrap{position:fixed;bottom:20px;left:20px;z-index:9999;flex-direction:column;pointer-events:none}#toastWrap,.toast{display:flex;gap:10px}.toast{align-items:center;min-width:240px;max-width:380px;background:#fff;color:var(--ink);border:1px solid var(--line);-webkit-border-start:5px solid var(--ink-soft);border-inline-start:5px solid var(--ink-soft);border-radius:12px;padding:13px 16px;box-shadow:0 10px 30px rgba(94,16,24,.16);font-weight:600;font-size:14px;pointer-events:auto;animation:toastIn .25s ease;line-height:1.5}.toast.success{border-inline-start-color:var(--good)}.toast.error{border-inline-start-color:var(--bad)}.toast.info{border-inline-start-color:var(--primary)}.toast .t-ico{font-weight:800;font-size:16px}.toast.success .t-ico{color:var(--good)}.toast.error .t-ico{color:var(--bad)}.toast.info .t-ico{color:var(--primary)}.toast.hide{animation:toastOut .25s ease forwards}@keyframes toastIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes toastOut{to{opacity:0;transform:translateY(12px)}}.modal-overlay{position:fixed;inset:0;background:rgba(45,20,24,.45);z-index:9998;display:grid;place-items:center;animation:fadeIn .2s ease}.modal-box{background:#fff;border-radius:18px;padding:26px;width:min(420px,92vw);box-shadow:0 24px 60px rgba(94,16,24,.25);text-align:center}.modal-box h3{font-size:18px;margin-bottom:10px}.modal-box p{color:var(--ink-soft);line-height:1.7;margin-bottom:22px}.modal-actions{display:flex;gap:12px;justify-content:center}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.form-modal{position:fixed;inset:0;background:rgba(45,20,24,.45);z-index:9990;display:grid;place-items:start center;padding:38px 16px;overflow:auto;animation:fadeIn .2s ease}.form-modal .modal-card{background:#fff;border-radius:18px;box-shadow:0 24px 60px rgba(94,16,24,.28);width:min(760px,96vw);padding:24px 26px}.form-modal .card-head{margin-bottom:16px}#emp_leaves_box .list-label{display:block;margin-bottom:6px;font-weight:600;color:var(--ink)}.leave-row{display:flex;align-items:flex-end;gap:10px;margin-bottom:8px;flex-wrap:wrap}.leave-row .lr-field{display:flex;flex-direction:column;gap:3px;font-size:13px;color:var(--ink-soft)}.leave-row .lr-field input{min-width:150px}.btn.sm{padding:6px 12px;font-size:13px}.dup-warn{color:var(--bad,#c81e2e);background:#fdecec;border:1px solid #f6c9c9;border-radius:8px;padding:8px 12px;margin:8px 2px 0;font-size:13px;font-weight:600}input.input-error{border-color:#c81e2e!important;box-shadow:0 0 0 2px rgba(200,30,46,.15)!important}.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:14px}.pager-info{color:var(--ink-soft);font-size:13px}.pager-btns{display:flex;gap:6px;flex-wrap:wrap}.pager .btn.tiny{min-width:34px}#printRoot{display:none}@media print{body,html{background:#fff!important}#toastWrap,.app,.form-modal,.modal-overlay,body>.app{display:none!important}#printRoot{display:block!important}@page{size:A4;margin:24mm 12mm 18mm}.pr-doc,.pr-doc *{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}.pr-doc{font-family:Tajawal,sans-serif;color:#3a2226;direction:rtl}.pr-doc table,.pr-doc>div{break-inside:avoid;page-break-inside:avoid}.pr-doc table{width:100%}.pr-doc tr{page-break-inside:avoid;break-inside:avoid}.pr-doc .sar{height:.9em;width:auto}.pr-running-header{position:fixed;top:0;left:0;right:0;height:18mm;display:flex;align-items:center;justify-content:center;gap:8px;border-bottom:1px solid #efe3e0;background:#fff}.pr-running-header img{height:26px;width:auto}.pr-running-header span{font-size:11px;color:#8a7176;font-weight:600}.pr-footer{position:fixed;bottom:0;left:0;right:0;text-align:center;font-size:10px;color:#8a7176;padding-top:4px;border-top:1px solid #efe3e0;background:#fff}}@media (max-width:1100px){.chart-grid{grid-template-columns:1fr}.card.span-2{grid-column:span 1}}@media (max-width:820px){.sidebar,body.app-ready .app{flex-direction:column}.sidebar{width:100%;height:auto;position:static;gap:12px;padding:12px 14px;-webkit-border-end:0;border-inline-end:0;border-bottom:1px solid var(--line)}.brand{flex-direction:row;align-items:center;justify-content:space-between;margin-bottom:0;gap:10px;order:0}.brand-badge{width:auto;padding:0}.brand-badge img{max-width:140px}.brand-sub{display:none}.sidebar-foot{display:block;order:1;margin-top:0;padding-top:0}.user-box{margin-bottom:0;padding:7px 12px}.nav{flex-direction:row;flex-wrap:nowrap;overflow-x:auto;gap:6px;padding-bottom:4px;order:2;-webkit-overflow-scrolling:touch}.nav-item{padding:9px 14px;font-size:13.5px;white-space:nowrap;flex:0 0 auto}.nav-item.active{box-shadow:none}.main{padding:16px 14px 50px;max-width:100%}.topbar{flex-direction:column;align-items:stretch;gap:12px}.topbar h1{font-size:22px}.topbar-tools{width:100%}.toolbar,.topbar-tools{flex-direction:column;align-items:stretch}.toolbar{gap:12px}.toolbar-spacer{display:none}.toolbar-group{justify-content:space-between}.seg{width:100%}.seg button{flex:1 1 auto;padding:9px 8px}.select-wrap,.select-wrap.inline{width:100%;flex-direction:column;align-items:stretch}.select-wrap select{width:100%;min-width:0}.kpi-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}.perm-cols{grid-template-columns:1fr}.report-row{flex-direction:column;align-items:stretch}.report-row .btn{width:100%}.chart-box{height:250px}.form{max-width:100%}.form-modal{padding:16px 10px}.form-modal .modal-card{width:96vw;padding:18px 16px}.panel-head{flex-direction:column;align-items:stretch}.subtabs{overflow-x:auto;flex-wrap:nowrap}.subtab{white-space:nowrap;flex:0 0 auto}}.login-bg{min-height:100vh;background:linear-gradient(135deg,#fbeff0,#f7f1ec 60%,#fdf2f4);display:grid;place-items:center;padding:20px}.login-card{background:#fff;width:100%;max-width:420px;border-radius:22px;box-shadow:0 20px 60px rgba(94,16,24,.14);padding:36px 32px;border:1px solid var(--line)}.login-logo{display:block;max-width:200px;margin:0 auto 6px}.login-sub{text-align:center;color:var(--ink-soft);font-weight:600;font-size:13px;margin-bottom:26px}.login-card h2{font-size:20px;margin-bottom:6px;text-align:center}.login-hint{text-align:center;line-height:1.7;margin-bottom:20px}.login-card label,.login-hint{color:var(--ink-soft);font-size:13.5px}.login-card label{display:block;font-weight:700;margin:14px 0 6px}.login-card input{width:100%;font-size:16px;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;outline:none}.login-card input:focus{border-color:var(--primary-2);box-shadow:0 0 0 3px rgba(232,120,138,.18)}.login-card .otp{letter-spacing:8px;text-align:center;font-size:22px;font-weight:700}.login-card button{width:100%;margin-top:22px;background:linear-gradient(120deg,var(--primary-2),var(--primary));color:#fff;font-size:16px;font-weight:800;border:0;border-radius:12px;padding:13px;cursor:pointer;box-shadow:0 8px 20px rgba(200,30,46,.28)}.login-msg{margin-top:16px;font-size:13.5px;font-weight:700;text-align:center;min-height:18px}.login-msg.err{color:var(--primary)}.login-msg.ok{color:#2f9e6b}.login-card .qr{display:grid;place-items:center;margin:18px 0;padding:16px;background:#fbf3ef;border-radius:14px}.login-card .secret{direction:ltr;text-align:center;font-family:monospace;background:#fbf3ef;padding:8px;border-radius:8px;font-size:13px;margin-top:10px;word-break:break-all}