:root{
  --bg:#f5f8fc;--panel:#fff;--text:#17324d;--muted:#718398;--line:#dce8f4;
  --blue:#0b63ce;--blue-dark:#084b9b;--blue-soft:#edf6ff;--good:#0e7a55;--warn:#a45f00;--bad:#b42318;
  --shadow:0 8px 26px rgba(28,74,119,.07)
}
*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Tahoma,Arial,sans-serif;background:var(--bg);color:var(--text)}
button,input,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}.muted{color:var(--muted)}.money{font-variant-numeric:tabular-nums}.full{width:100%}
.topbar{position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid var(--line);padding:11px 16px;display:flex;justify-content:space-between;align-items:center}.brand-line{display:flex;align-items:center;gap:10px}.mini-brand{width:38px;height:38px;border-radius:12px;background:var(--blue);color:#fff;display:grid;place-items:center;font-size:20px;font-weight:900}.topbar strong{display:block;font-size:17px;color:var(--blue-dark)}.topbar small{display:block;color:var(--muted);font-size:11px;margin-top:1px}.top-actions{display:flex;gap:7px}.icon-btn{position:relative;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--blue-dark);padding:8px 11px;text-decoration:none;font-size:13px;font-weight:700}.icon-btn:hover{background:var(--blue-soft)}
.badge{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--blue);color:#fff;font-size:10px;margin-inline-start:4px}
.tabs{position:sticky;top:61px;z-index:20;background:rgba(245,248,252,.96);backdrop-filter:blur(10px);display:flex;gap:7px;overflow:auto;padding:9px 12px;border-bottom:1px solid var(--line)}.tabs button{white-space:nowrap;border:0;background:transparent;color:#516a82;padding:9px 13px;border-radius:10px;font-weight:700}.tabs button.active{background:var(--blue);color:#fff}.tabs button:hover:not(.active){background:#fff;color:var(--blue-dark)}
main{max-width:1160px;margin:auto;padding:16px 14px 36px}.tabpage{display:none}.tabpage.active{display:block}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin:8px 0 12px}.section-head h2{font-size:20px;margin:0}.section-note{margin:4px 0 0;color:var(--muted);font-size:13px}.section-head input{padding:9px 10px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--text)}
.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin-bottom:16px}.stat{background:#fff;border:1px solid var(--line);border-radius:15px;padding:14px;box-shadow:var(--shadow)}.stat b{display:block;font-size:27px;line-height:1;color:var(--blue)}.stat small{display:block;color:var(--muted);margin-top:7px}
.cards{display:grid;gap:9px}.card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:14px;box-shadow:var(--shadow)}.row{display:flex;justify-content:space-between;align-items:center;gap:12px}.employee-title{font-size:17px}.pill{display:inline-block;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:700;background:var(--blue-soft);color:var(--blue-dark)}.pill.good{background:#eaf8f2;color:var(--good)}.pill.warn{background:#fff5e6;color:var(--warn)}.pill.bad{background:#fff0ee;color:var(--bad)}
.primary,.ghost,.danger,.mini-btn{border-radius:10px;padding:9px 12px;font-weight:700}.primary{border:1px solid var(--blue);background:var(--blue);color:#fff}.primary:hover{background:var(--blue-dark)}.ghost{border:1px solid #bfd8f1;background:#fff;color:var(--blue-dark)}.ghost:hover{background:var(--blue-soft)}.danger{border:1px solid #ffd0ca;background:#fff5f3;color:#a11b12}.mini-btn{border:1px solid var(--line);background:#fff;color:var(--blue-dark);padding:6px 9px;font-size:12px}.inline{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;background:#fff;border:1px solid var(--line);padding:14px;border-radius:15px;margin-bottom:14px;box-shadow:var(--shadow)}.form-grid input,.form-grid select,.form-grid label{width:100%}.form-grid input,.form-grid select{padding:11px;border:1px solid #ccdeee;border-radius:10px;background:#fff;color:var(--text);outline:none}.form-grid input:focus,.form-grid select:focus{border-color:#75aee8;box-shadow:0 0 0 3px rgba(11,99,206,.08)}.form-grid label{font-size:12px;color:var(--muted)}.form-grid label input{display:block;margin-top:4px}.compact-form{margin:12px 0 0;box-shadow:none;border:0;padding:0}.simple-details{background:#fff;border:1px solid var(--line);border-radius:15px;padding:13px 14px;margin-top:14px}.simple-details summary{cursor:pointer;color:var(--blue-dark);font-weight:800}
.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:15px;box-shadow:var(--shadow)}table{border-collapse:collapse;width:100%;min-width:720px}th,td{padding:11px 12px;border-bottom:1px solid #e9f0f6;text-align:right;vertical-align:middle}th{background:#f5f9fd;color:#4e6780;font-size:12px;font-weight:800}tbody tr:last-child td{border-bottom:0}tbody tr:hover{background:#fbfdff}.table-sub{display:block;color:var(--muted);margin-top:3px;font-size:10px}.report-net{font-weight:900;color:var(--blue-dark)}
.schedule-person{background:#fff;border:1px solid var(--line);border-radius:15px;margin-bottom:10px;overflow:hidden;box-shadow:var(--shadow)}.schedule-person h3{margin:0;padding:12px 14px;border-bottom:1px solid var(--line);font-size:15px;color:var(--blue-dark)}.schedule-days{display:grid;grid-template-columns:repeat(7,1fr)}.schedule-day{padding:9px;border-left:1px solid var(--line);min-height:82px}.schedule-day:last-child{border-left:0}.schedule-day button{width:100%;border:0;background:transparent;text-align:right;padding:0;color:var(--text)}.schedule-day:hover{background:#f8fbff}.schedule-date{font-size:10px;color:var(--muted);margin-bottom:4px}
.kpi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:11px}.kpi{background:#f8fbff;border:1px solid #e7f0f8;border-radius:11px;padding:9px}.kpi span{display:block;color:var(--muted);font-size:11px}.kpi b{display:block;margin-top:4px;color:var(--blue-dark)}.kpi.positive b{color:var(--good)}.kpi.late b{color:var(--warn)}
.payroll-card{padding:16px}.payroll-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.payroll-net{min-width:140px;background:var(--blue-soft);border:1px solid #cde4fa;border-radius:12px;padding:9px 12px;text-align:center}.payroll-net small{display:block;color:#54708a;font-size:10px}.payroll-net b{display:block;color:var(--blue-dark);font-size:19px;margin-top:2px}.payroll-lines{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:13px 0}.payroll-lines>div{display:flex;justify-content:space-between;gap:10px;padding:9px 10px;background:#f9fbfd;border:1px solid #e8eff6;border-radius:10px}.payroll-lines span{color:var(--muted);font-size:12px}.payroll-lines b{font-size:13px}.payroll-lines .positive b{color:var(--good)}.payroll-lines .negative b{color:#9b2c24}.payroll-actions{display:flex;gap:8px;flex-wrap:wrap}.payroll-details{margin-top:10px;border-top:1px dashed #d8e6f2;padding-top:9px}.payroll-details summary{cursor:pointer;color:var(--blue-dark);font-size:12px;font-weight:800}.movement-list{display:grid;gap:6px;margin-top:8px}.movement-item{display:flex;justify-content:space-between;gap:10px;padding:8px 9px;background:#fafcfe;border:1px solid #e7eef5;border-radius:9px;font-size:12px}.plus{color:var(--good)}.minus{color:#9b2c24}
.report-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:12px}.report-stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:13px;box-shadow:var(--shadow)}.report-stat small{display:block;color:var(--muted)}.report-stat b{display:block;color:var(--blue-dark);font-size:18px;margin-top:5px}
.alert-strip{margin-bottom:11px}.alert-strip button{width:100%;display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;text-align:right;border:1px solid #cce2f7;background:#eef7ff;color:var(--text);border-radius:13px;padding:10px 12px}.alert-strip b{color:var(--blue-dark)}.alert-strip span{font-size:12px;color:#54708a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.alert-strip strong{font-size:11px;color:var(--blue)}
.center-card{width:min(400px,calc(100% - 28px));margin:10vh auto;background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;text-align:center;box-shadow:0 18px 55px rgba(23,70,114,.12)}.brand-mark{width:54px;height:54px;border-radius:16px;background:var(--blue);color:#fff;display:grid;place-items:center;font-weight:900;font-size:26px;margin:auto}.center-card h1{font-size:21px;margin:13px 0 4px}.pin-display{direction:ltr;display:flex;justify-content:center;gap:12px;margin:17px 0 15px}.pin-slot{width:46px;height:48px;border:2px solid #cfe0f0;border-radius:12px;background:#f8fbfe;display:grid;place-items:center;color:var(--blue);font-size:22px;font-weight:900}.pin-slot.filled{border-color:var(--blue);background:var(--blue-soft)}.pin-pad{direction:ltr;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.pin-key{min-height:55px;border:1px solid #d4e3f1;border-radius:13px;background:#fff;color:var(--blue-dark);font-size:21px;font-weight:900}.pin-key:hover,.pin-key:active{background:var(--blue-soft)}.pin-command{font-size:13px;color:#647c91}.error{color:#b42318;min-height:20px;margin-top:8px}
.modal{position:fixed;inset:0;background:rgba(18,48,78,.45);display:grid;place-items:center;padding:16px;z-index:60}.modal-card{width:min(560px,100%);max-height:88vh;overflow:auto;background:#fff;border-radius:18px;padding:18px;border:1px solid var(--line);box-shadow:0 24px 70px rgba(18,48,78,.2)}.modal-card h3{margin:0 0 3px;color:var(--blue-dark)}.modal-card input,.modal-card select{width:100%;padding:10px;border:1px solid #cfe0ef;border-radius:10px;margin:5px 0 11px}.modal-title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.modal-title-row p{margin:2px 0 0;font-size:12px}.notification-list{display:grid;gap:7px;margin:13px 0}.notification-item{display:flex;justify-content:space-between;gap:10px;align-items:center;border:1px solid var(--line);border-radius:11px;padding:10px}.notification-item.unread{background:#f1f8ff;border-color:#cfe4f8}.notification-item p{margin:3px 0;color:var(--muted);font-size:12px}.notification-item small{color:#8798aa}.empty-state{text-align:center;color:var(--muted);padding:24px 10px}.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:var(--blue-dark);color:#fff;padding:10px 15px;border-radius:11px;z-index:80;box-shadow:0 12px 30px rgba(8,75,155,.22)}
@media(max-width:900px){.stats{grid-template-columns:repeat(3,1fr)}.report-stats{grid-template-columns:repeat(2,1fr)}.payroll-lines{grid-template-columns:repeat(2,1fr)}.form-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){main{padding:12px 10px 88px}.topbar{padding:9px 10px}.mini-brand{width:34px;height:34px;border-radius:10px}.topbar strong{font-size:15px}.top-actions .icon-btn{padding:7px 9px;font-size:11px}.tabs{position:fixed;bottom:0;top:auto;left:0;right:0;z-index:40;background:#fff;border-top:1px solid var(--line);border-bottom:0;padding:6px;display:grid;grid-template-columns:repeat(6,1fr);gap:3px;overflow:visible}.tabs button{font-size:10px;padding:9px 3px;border-radius:8px}.stats{grid-template-columns:repeat(2,1fr)}.stat{padding:12px}.stat b{font-size:24px}.section-head{align-items:flex-start}.form-grid{grid-template-columns:1fr}.schedule-days{grid-template-columns:1fr 1fr}.schedule-day{border-bottom:1px solid var(--line);min-height:68px}.kpi-grid{grid-template-columns:repeat(3,1fr)}.payroll-head{align-items:flex-start}.payroll-net{min-width:120px}.payroll-lines{grid-template-columns:1fr 1fr}.report-stats{grid-template-columns:1fr 1fr}.alert-strip button{grid-template-columns:1fr auto}.alert-strip span{grid-column:1/3;grid-row:2}.modal-title-row{display:block}.modal-title-row .ghost{margin-top:8px}}
@media(max-width:460px){.brand-line small{display:none}.top-actions{gap:4px}.top-actions .icon-btn{padding:7px}.section-head{display:block}.section-head>.inline{margin-top:8px}.schedule-days{grid-template-columns:1fr}.kpi-grid{grid-template-columns:1fr 1fr}.payroll-lines{grid-template-columns:1fr}.payroll-head{display:block}.payroll-net{margin-top:9px;width:100%}.report-stats{grid-template-columns:1fr 1fr}}
@media print{.topbar,.tabs,.section-note,#printReport,.alert-strip,.payroll-actions{display:none!important}body{background:#fff}main{max-width:none;padding:0}.tabpage{display:none!important}#tab-reports{display:block!important}.report-stat,.table-wrap{box-shadow:none}#reportTable table{min-width:0;font-size:10px}th,td{padding:7px}}

/* Shared logo branding */
.brand-logo-shell,.brand-upload-button{overflow:hidden;position:relative}
.brand-logo-img{width:100%;height:100%;object-fit:contain;display:block;background:#fff}
.brand-fallback{display:grid;place-items:center;width:100%;height:100%}
.brand-upload-button{border:0;padding:0;cursor:pointer;font:inherit}
.brand-upload-button .brand-edit{position:absolute;left:-2px;bottom:-2px;width:18px;height:18px;border-radius:8px;background:#fff;color:var(--blue);border:1px solid var(--line);display:grid;place-items:center;font-size:11px;line-height:1;box-shadow:0 2px 7px rgba(23,70,114,.15)}
.brand-upload-button:hover .brand-edit{background:var(--blue-soft)}
.brand-mark .brand-logo-img{border-radius:14px}
.mini-brand .brand-logo-img{border-radius:10px}

/* ZK history review */
.review-details{margin-top:16px}.review-toolbar{align-items:center}.review-summary{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 12px}.review-summary span{background:var(--blue-soft);border:1px solid #d3e8fb;border-radius:999px;padding:7px 10px;font-size:12px;color:var(--blue-dark)}.mini-count{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--blue);color:#fff;font-size:11px;margin-inline-start:6px}.review-details .table-wrap{box-shadow:none}
@media(max-width:700px){.review-toolbar .inline{width:100%}.review-toolbar input,.review-toolbar button{flex:1;min-width:130px}.review-summary span{flex:1;text-align:center}}


.import-note{background:var(--blue-soft);border:1px solid #cfe4f8;color:var(--blue-dark);border-radius:12px;padding:10px 12px;margin:-2px 0 12px;font-size:12px}
.zk-name-review{display:inline-block;margin-top:6px;background:#fff7e8;border:1px solid #f4d9a5;color:#805b17;border-radius:8px;padding:4px 7px;font-size:11px}
.payroll-summary-card{cursor:pointer;transition:transform .12s ease,border-color .12s ease,box-shadow .12s ease}
.payroll-summary-card:hover{transform:translateY(-1px);border-color:#b9d9f5;box-shadow:0 10px 28px rgba(25,92,150,.09)}
.payroll-card-footer{display:flex;justify-content:space-between;align-items:center;border-top:1px dashed #d8e6f2;padding-top:10px;color:var(--blue-dark);font-size:12px;font-weight:800}
.payroll-card-footer b{font-size:20px;line-height:1}
.payroll-detail-top{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;margin-bottom:14px}
.payroll-detail-top h2{margin:0;color:var(--blue-dark)}
.payroll-detail-net{min-width:190px;background:var(--blue);color:#fff;border-radius:15px;padding:12px 15px;text-align:center;box-shadow:0 9px 22px rgba(11,99,206,.16)}
.payroll-detail-net small{display:block;opacity:.82;font-size:11px}.payroll-detail-net b{display:block;font-size:23px;margin-top:3px}
.payroll-detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:12px}
.payroll-detail-stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;box-shadow:var(--shadow)}
.payroll-detail-stat small{display:block;color:var(--muted);font-size:11px}.payroll-detail-stat b{display:block;color:var(--blue-dark);font-size:18px;margin-top:5px}.payroll-detail-stat span{display:block;color:var(--muted);font-size:11px;margin-top:4px}
.payroll-detail-card{margin-bottom:12px}.payroll-detail-card h3{margin:0 0 10px;color:var(--blue-dark)}.section-head.compact{margin-bottom:8px}
.salary-formula{display:grid;gap:6px}.salary-formula>div{display:flex;justify-content:space-between;gap:12px;padding:9px 10px;border:1px solid #e5edf5;background:#fbfdff;border-radius:10px}.salary-formula>div span{color:var(--muted);font-size:12px}.salary-formula-net{background:var(--blue-soft)!important;border-color:#c7e1f8!important}.salary-formula-net b{color:var(--blue-dark);font-size:16px}
.payroll-days-details{margin-top:0}.payroll-days-details .table-wrap{box-shadow:none;margin-top:10px}
@media(max-width:900px){.payroll-detail-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.payroll-detail-top{grid-template-columns:auto 1fr}.payroll-detail-net{grid-column:1/3;width:100%}.payroll-detail-grid{grid-template-columns:1fr 1fr}.payroll-detail-stat{padding:10px}.payroll-detail-stat b{font-size:16px}}

/* ===== Comprehensive attendance/payroll redesign ===== */
.dashboard-tools{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:12px 0}.quick-card{border:1px solid var(--line);background:#fff;border-radius:16px;padding:14px;text-align:right;box-shadow:var(--shadow);color:var(--text)}.quick-card small,.quick-card span{display:block;color:var(--muted)}.quick-card b{display:block;font-size:27px;color:var(--blue-dark);margin:4px 0}.quick-card:hover{border-color:#bcdaf5;background:#fbfdff}
.filter-row{display:flex;gap:8px;margin-bottom:12px}.filter-row input,.filter-row select,.presence-fields input,.presence-fields select{padding:10px 11px;border:1px solid #cfe0ef;border-radius:10px;background:#fff;color:var(--text)}.filter-row input{flex:1}.employee-card .employee-flags{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}.employee-flags>span:not(.pill){font-size:11px;color:var(--muted);background:#f5f8fc;border:1px solid var(--line);border-radius:999px;padding:4px 7px}
.employee-editor-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin-bottom:12px}.employee-editor-head h2{margin:0;color:var(--blue-dark)}.editor-form{padding:16px}.editor-form label,.settings-card>label,.modal-card label{display:grid;gap:5px;color:#536b82;font-size:12px;font-weight:700}.editor-form input,.editor-form select,.settings-card input,.settings-card select{width:100%;padding:10px 11px;border:1px solid #cfe0ef;border-radius:10px;background:#fff;color:var(--text)}.editor-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.span-2{grid-column:span 2}.switch-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:12px}.switch-row{display:flex!important;justify-content:space-between;align-items:center;gap:12px;border:1px solid var(--line);border-radius:12px;padding:11px 12px;background:#fbfdff}.switch-row span{display:block}.switch-row small{display:block;color:var(--muted);font-weight:400;margin-top:3px}.switch-row input[type=checkbox]{width:21px!important;height:21px;accent-color:var(--blue)}
.workdays-field{border:1px solid var(--line);border-radius:12px;padding:10px;background:#fbfdff}.workdays-field>span{display:block;font-size:12px;font-weight:800;color:#536b82;margin-bottom:7px}.day-toggles{display:flex;gap:5px;flex-wrap:wrap}.day-toggle input{display:none!important}.day-toggle span{display:block;border:1px solid #cfe0ef;background:#fff;padding:7px 9px;border-radius:9px;font-size:11px;color:#5a7086;cursor:pointer}.day-toggle input:checked+span{background:var(--blue);border-color:var(--blue);color:#fff}
.shift-groups{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.shift-group{padding:15px}.shift-group-head{display:flex;justify-content:space-between;gap:10px}.shift-group h3{margin:0 0 5px;color:var(--blue-dark)}.shift-group-head b{display:block;font-size:18px}.shift-group-head small{display:block;color:var(--muted);margin-top:4px}.shift-members{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px;border-top:1px dashed var(--line);padding-top:10px}.shift-members span{background:var(--blue-soft);border:1px solid #d4e8fa;color:var(--blue-dark);border-radius:999px;padding:6px 9px;font-size:12px}.dept-schedule{margin-bottom:10px}.dept-schedule h3{margin-top:0;color:var(--blue-dark)}.schedule-line{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:9px 0;border-top:1px solid #edf2f7}.schedule-line:first-of-type{border-top:0}.schedule-line span{font-variant-numeric:tabular-nums;color:#536b82}
.month-calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin:7px 0 14px}.calendar-day{min-height:52px;border:1px solid #d7e5f2;background:#fff;border-radius:9px;padding:6px;color:var(--text)}.calendar-day b{display:block}.calendar-day small{display:block;color:var(--muted);font-size:8px;line-height:1.2;margin-top:4px}.calendar-day.selected{background:var(--blue);border-color:var(--blue);color:#fff}.calendar-day.selected small{color:#e5f2ff}
.presence-card{margin-top:14px}.presence-fields{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.2fr;gap:8px}.presence-result{margin-top:10px}.presence-chip-list{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}.presence-chip-list>span{background:var(--blue-soft);border:1px solid #d2e6f8;color:var(--blue-dark);border-radius:999px;padding:7px 10px}.presence-chip-list small{color:#718398;margin-inline-start:4px}.presence-names{display:grid;gap:7px;margin:12px 0}.presence-names>div{display:flex;justify-content:space-between;border:1px solid var(--line);border-radius:10px;padding:9px}.presence-names span{color:var(--muted);font-size:12px}
.review-block{margin-top:14px}.review-block-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:8px}.review-block-head h3{margin:0;color:var(--blue-dark)}.review-block-head p{margin:3px 0 0;color:var(--muted);font-size:12px}.review-block .table-wrap{box-shadow:none}.review-block input[type=checkbox]{width:18px;height:18px;accent-color:var(--blue)}
.payroll-status{display:flex;justify-content:space-between;gap:12px;align-items:center;border-radius:13px;padding:11px 13px;margin:9px 0 12px;border:1px solid var(--line)}.payroll-status b{display:block}.payroll-status span{color:var(--muted);font-size:12px}.payroll-status.info{background:#f5f9fd}.payroll-status.warn{background:#fff8e9;border-color:#f0d699}.payroll-status.good{background:#edf9f4;border-color:#c7e8d9}.payroll-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}.payroll-toolbar label{font-size:12px;color:#536b82}.payroll-toolbar input{accent-color:var(--blue)}.payroll-summary-card{position:relative;padding-top:18px}.payroll-select{position:absolute;top:9px;left:10px;z-index:2}.payroll-select input{width:19px;height:19px;accent-color:var(--blue)}.quick-months{display:flex;gap:6px;flex-wrap:wrap;margin:-2px 0 8px}.quick-months button{font-size:11px;padding:7px 9px}.detail-actions{display:flex;justify-content:flex-end;gap:8px;margin:-3px 0 12px}
.settings-card{padding:15px;display:grid;gap:10px;margin-bottom:18px}.settings-card>label:not(.switch-row){display:grid;grid-template-columns:1fr minmax(120px,220px);align-items:center}.settings-card>button{justify-self:start}.department-card{display:flex;justify-content:space-between;align-items:center}.department-card b{display:block;color:var(--blue-dark);margin-bottom:4px}.security-card{margin-top:14px}.security-card h3{margin-top:0;color:var(--blue-dark)}.security-card p{margin-bottom:0;color:#536b82;line-height:1.8}
.danger{color:#a12c24!important;border-color:#e6c8c4!important}.mini-btn{border:1px solid #d3e2ef;background:#fff;color:var(--blue-dark);border-radius:8px;padding:6px 8px;font-size:11px;font-weight:700}.mini-btn:hover{background:var(--blue-soft)}

@media(max-width:900px){.shift-groups{grid-template-columns:1fr}.presence-fields{grid-template-columns:1fr 1fr}.switch-grid{grid-template-columns:1fr}.span-2{grid-column:auto}}
@media(max-width:700px){.tabs{grid-template-columns:repeat(7,1fr)!important}.tabs button{font-size:9px!important;padding:9px 1px!important}.dashboard-tools{grid-template-columns:1fr 1fr}.employee-editor-head{grid-template-columns:auto 1fr}.employee-editor-head .danger{grid-column:1/3}.presence-fields{grid-template-columns:1fr 1fr}.payroll-status{display:block}.payroll-status span{display:block;margin-top:4px}.payroll-toolbar{align-items:flex-start}.month-calendar{gap:3px}.calendar-day{min-height:47px;padding:4px}.settings-card>label:not(.switch-row){grid-template-columns:1fr}.settings-card>label:not(.switch-row) input{margin-top:6px}}
@media(max-width:460px){.dashboard-tools{grid-template-columns:1fr}.filter-row{display:grid;grid-template-columns:1fr}.presence-fields{grid-template-columns:1fr 1fr}.payroll-toolbar{display:block}.payroll-toolbar>.inline{margin-top:8px}.shift-group-head{display:block}.shift-group-head .ghost{margin-top:8px}.schedule-line{grid-template-columns:1fr auto}.schedule-line .ghost{grid-column:1/3}.month-calendar{grid-template-columns:repeat(5,1fr)}}

/* Shared internal calendar headings and printable navigation. */
.calendar-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;text-align:center;color:var(--muted);font-size:11px;margin-top:7px}
.calendar-weekdays b{padding:4px 1px}.calendar-pad{min-height:1px}.month-calendar{grid-template-columns:repeat(7,1fr)!important;margin-top:3px}
@media(max-width:460px){.month-calendar,.calendar-weekdays{grid-template-columns:repeat(7,1fr)!important;gap:2px}.calendar-weekdays{font-size:8px}}
@media print{.print-return{display:none!important}}
.employee-schedule-line{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:6px;font-size:13px;color:#536b83}.employee-schedule-line span{display:inline-flex;gap:4px;align-items:center}.review-bulk-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0}.reviewed-row{opacity:.58}.resolving-row{opacity:.35;pointer-events:none}input[readonly]{background:#f4f7fa;color:#536b83}

.employee-subgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}.employee-subcard{min-width:0}.mini-summary{display:flex;gap:10px;flex-wrap:wrap}.mini-summary span{background:#f2f7fd;border:1px solid #dce8f4;border-radius:10px;padding:8px 10px}.employee-finance-filter{margin-bottom:10px}.raw-punches-details{margin-top:14px}.raw-punch-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:8px 0 12px}.raw-day{display:grid;grid-template-columns:130px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid #e5edf6}.raw-day>div:first-child{display:flex;flex-direction:column}.raw-times{display:flex;flex-wrap:wrap;gap:7px}.raw-times span{background:#edf5ff;border:1px solid #cfe0f4;border-radius:999px;padding:6px 10px;font-weight:700}.payroll-range-box{margin:12px 0}.range-fields{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:10px;align-items:end}.range-fields label{display:grid;gap:5px}.movement-item .danger{color:#a12c24}.reviewed-row{opacity:.65}@media(max-width:760px){.employee-subgrid{grid-template-columns:1fr}.raw-day{grid-template-columns:1fr}.range-fields{grid-template-columns:1fr 1fr}.range-fields select,.range-fields button{grid-column:1/-1}}
.raw-times span.raw-rollover{background:#fff6e8;border-color:#f0cf98}.raw-times span small{display:block;font-size:11px;font-weight:600;margin-top:2px;opacity:.8}.raw-times span.raw-rollover small{white-space:nowrap}

/* Employee leave/rest calendar */
.employee-calendar-card{margin-top:18px;padding:16px}.employee-big-calendar{margin-top:10px}.employee-calendar-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;text-align:center;color:var(--muted);font-size:12px;margin-bottom:6px}.employee-calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.employee-calendar-day{min-height:135px;border:1px solid #d6e4f1;border-radius:12px;background:#fff;padding:8px;cursor:pointer;text-align:right;color:var(--text);overflow:hidden}.employee-calendar-day:hover{border-color:#8bb8e2;box-shadow:0 4px 14px #0b63ce12}.employee-calendar-day.empty{visibility:hidden;pointer-events:none}.employee-calendar-day .day-number{font-size:16px;font-weight:900;color:var(--blue-dark);margin-bottom:6px}.employee-calendar-items{display:grid;gap:4px}.employee-calendar-item{display:block;border-radius:7px;padding:4px 6px;font-size:11px;line-height:1.25;background:#f3f7fb}.employee-calendar-item.rest{color:#b3261e;background:#fff0ef;border:1px solid #f2cbc7;font-weight:800}.employee-calendar-item.exception{color:#6f42c1;background:#f5efff;border:1px solid #ddccfa;font-weight:800}.calendar-exception-key{color:#6f42c1!important;font-weight:800}.multi-employee-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:6px 0}.multi-employee-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;max-height:230px;overflow:auto;border:1px solid var(--line);border-radius:11px;padding:8px;margin-bottom:11px}.multi-employee-picker label{display:flex!important;align-items:center;gap:8px;border:1px solid #e5edf5;border-radius:9px;padding:7px 8px;background:#fbfdff;font-size:12px!important}.multi-employee-picker input{width:18px!important;height:18px;margin:0!important;accent-color:var(--blue)}.calendar-day-entry span:first-child{display:grid;gap:2px}.calendar-day-entry small{color:var(--muted)}.calendar-exception-actions{margin:8px 0}.soft-sep{border:0;border-top:1px solid var(--line);margin:14px 0}.employee-calendar-item.leave{color:#244c73;background:#edf5ff;border:1px solid #d2e6fa}.employee-calendar-item.unpaid{color:#8a3a12;background:#fff5e9;border:1px solid #f1d7b5}.employee-calendar-more{font-size:10px;color:var(--muted);padding-top:2px}.calendar-day-editor-list{display:grid;gap:6px;margin:8px 0 12px}.calendar-day-editor-list>div{display:flex;justify-content:space-between;gap:10px;border:1px solid var(--line);border-radius:9px;padding:7px 9px}.live-work-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.live-work-card small{display:block;margin-top:4px}.live-work-card .live-status{font-size:11px;font-weight:700}.live-work-card.status-break{background:#fff9eb}.live-work-card.status-wc{background:#f2f9ff}.live-work-card.status-inside{background:#eefaf5}.live-work-card.status-checked_out{background:#f5f6f7}.net-time-positive{color:#08754f}.net-time-negative{color:#a12c24}.payroll-formula-note{font-size:11px;color:var(--muted);margin-top:4px}.wc-report-card{margin-top:12px}
@media(max-width:900px){.employee-calendar-day{min-height:110px;padding:6px}.employee-calendar-item{font-size:10px}.period-range-fields{grid-template-columns:1fr 1fr}.period-range-fields button{grid-column:auto}}
@media(max-width:620px){.employee-calendar-weekdays,.employee-calendar-grid{grid-template-columns:repeat(7,minmax(72px,1fr));min-width:560px}.employee-big-calendar{overflow-x:auto}.employee-calendar-day{min-height:105px}.employee-calendar-card .section-head{align-items:flex-start}.employee-calendar-card .inline{flex-wrap:wrap}}
@media print{.wc-report-card,.wc-report-only{display:none!important}}

@media(max-width:620px){.multi-employee-picker{grid-template-columns:1fr}}
