.hr-overview{display:grid;grid-template-columns:1fr 1.6fr;gap:24px}.hr-overview h3{font-size:23px;margin:9px 0}.hr-overview p{line-height:1.7}.hr-overview .secondary{margin-top:14px}.hr-overview>.chart-note{grid-column:1/-1;margin:0}.hr-overview .report-metrics{grid-template-columns:repeat(3,minmax(0,1fr));align-self:center}.payroll-person{margin-bottom:18px}.payroll-fields{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.payroll-line-result{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;background:#f1f5ea;padding:18px;margin-top:20px;border-radius:12px}.payroll-line-result span{font-size:11px;color:#64775e}.payroll-line-result b{display:block;color:#244c3f;font-size:18px;margin-top:7px}.payroll-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.payroll-vouchers{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:18px}.payroll-vouchers>div{padding:20px;background:#f2f5ec;border-radius:13px}.payroll-vouchers h3{margin:10px 0}.payroll-vouchers strong{font-size:25px}.payroll-vouchers p{font-size:12px;margin-top:10px}.payslip-columns{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin:25px 0}.payslip-columns h3{margin-bottom:15px}.payslip-columns .summary-row{gap:18px}.payslip-columns b{white-space:nowrap}#payrollPeriod #addPayrollEmployee{margin-top:18px}#employeeForm .primary{margin-top:20px}#payrollPayment .primary{margin-top:15px}#employeeProfile .report-metrics b{font-size:20px}
@media screen and (max-width:1050px){.hr-overview{grid-template-columns:1fr}.payroll-fields{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media screen and (max-width:760px){.hr-overview .report-metrics{grid-template-columns:1fr}.payroll-fields{gap:15px 12px}.payroll-fields label{font-size:11px}.payroll-fields input{min-width:0;width:100%}.payroll-line-result{grid-template-columns:1fr 1fr;gap:17px 12px;padding:16px}.payroll-line-result b{font-size:18px}.payroll-metrics{grid-template-columns:1fr 1fr;gap:23px 12px}.payroll-metrics b{font-size:21px}.payroll-vouchers,.payslip-columns{grid-template-columns:1fr}.payroll-person .card-head{align-items:start}.payroll-person .card-head h3{font-size:18px}#payrollSlip{padding:24px 20px}#payrollSlip .document-header{gap:25px}#payrollSlip .summary-row{font-size:12px}#payrollSlip .summary-total strong{font-size:30px}}
@media screen and (max-width:360px){.payroll-fields{grid-template-columns:1fr}.payroll-metrics b{font-size:18px}}
@page payslip{size:A4;margin:14mm}
@media print{#payrollSlip{page:payslip;padding:0;box-shadow:none}.payslip-columns{grid-template-columns:1fr 1fr}#payrollSlip .summary-total{break-inside:avoid}html:has(#payrollSlip),body:has(#payrollSlip){background:white!important}}

.payroll-document-brand{display:flex;align-items:center;gap:12px;color:#1d493e}.payroll-document-brand>div>strong{font-size:25px;letter-spacing:-1px;font-weight:700}.payroll-document-brand strong span{font-weight:400}.payroll-document-brand small{display:block;font-size:8px;letter-spacing:2px}.payroll-employer{margin-top:20px}.payroll-employer strong{display:block;font-size:18px;color:#244e40}.payroll-employer small{display:block;font-size:10px;color:#71806f;margin-top:3px}.payroll-document-footer{border-top:1px solid #c9d4c3;padding-top:16px;margin-top:30px;color:#64735e;break-inside:avoid}.payroll-document-footer>strong{display:block;font-size:12px;color:#1d493e}.payroll-document-footer strong span{font-weight:400}.payroll-document-footer p{font-size:9px;line-height:1.7;margin:8px 0}.payroll-document-footer>small{font-size:8px}.paysheet-screen-hint{font-size:12px;color:#687b66;margin-bottom:18px}.paysheet-meta{display:flex;flex-wrap:wrap;gap:18px 45px;margin:24px 0}.paysheet-meta small,.paysheet-meta strong{display:block}.paysheet-meta small{font-size:9px;letter-spacing:1px;color:#77856e;margin-bottom:7px}.paysheet-meta strong{font-size:13px}#payrollSheet{max-width:none;padding:35px}#payrollSheet .table-wrap{overflow:auto}#payrollSheet .paysheet-table table{min-width:1020px}#payrollSheet .paysheet-deductions table{min-width:650px}#payrollSheet th,#payrollSheet td{padding:12px 9px;font-size:11px}#payrollSheet th:first-child{width:19%}#payrollSheet th{white-space:normal}#payrollSheet td.num,#payrollSheet tfoot th.num{white-space:nowrap}#payrollSheet td:first-child{white-space:normal;min-width:170px;overflow-wrap:anywhere}#payrollSheet td small{font-size:9px}#payrollSheet tfoot{background:#edf1e7;color:#234d40}#payrollSheet tfoot th{font-weight:700}.paysheet-settlement{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;border-top:2px solid #295443;margin:25px 0 15px;padding-top:18px;break-inside:avoid}.paysheet-settlement span{display:block;font-size:9px;letter-spacing:1px}.paysheet-settlement strong{font-size:23px;display:block;margin-top:8px}
@media screen and (max-width:760px){.payroll-document-brand>div>strong{font-size:20px}.payroll-document-brand{gap:8px}.payroll-document-brand .brand-mark{width:31px;height:34px;font-size:29px}.payroll-employer strong{font-size:17px}#payrollSlip .document-header,#payrollSheet .document-header{display:flex;flex-direction:column;align-items:start;text-align:left}#payrollSlip .document-header>div,#payrollSheet .document-header>div{text-align:left}#payrollSheet{padding:24px 18px}.paysheet-settlement{grid-template-columns:1fr;gap:16px}.paysheet-settlement strong{font-size:22px}.paysheet-meta{display:grid;gap:16px}.payroll-document-footer>strong span{display:block}}
@page paysheet{size:A4 landscape;margin:12mm}
@media print{.paysheet-screen-hint{display:none}#payrollSheet{page:paysheet;padding:0;max-width:none;box-shadow:none}#payrollSheet .table-wrap{overflow:visible}#payrollSheet .paysheet-table table,#payrollSheet .paysheet-deductions table{min-width:0;width:100%;table-layout:fixed}#payrollSheet th,#payrollSheet td{padding:7px 4px;font-size:8px}#payrollSheet td small{font-size:7px}#payrollSheet td:first-child{min-width:0}#payrollSheet th:first-child{width:19%}#payrollSheet td.num,#payrollSheet tfoot th.num{white-space:normal;overflow-wrap:anywhere}#payrollSheet thead{display:table-header-group}#payrollSheet tfoot{display:table-row-group}#payrollSheet h3{break-after:avoid;font-size:12px}#payrollSheet .paysheet-meta{break-inside:avoid}#payrollSheet .document-header{padding-bottom:15px}#payrollSheet .payroll-employer{margin-top:12px}#payrollSheet .paysheet-settlement strong{font-size:22px}#payrollSheet .chart-note{font-size:9px}.payroll-document-brand .brand-mark{border:1px solid #1d493e;print-color-adjust:exact}html:has(#payrollSheet),body:has(#payrollSheet){background:white!important}#payrollSlip .document-header,#payrollSheet .document-header{display:flex;flex-direction:row;text-align:left}.payroll-document-footer{color:#475443}#payrollSlip .payroll-document-footer p{font-size:9px}}

@media print{#payrollSheet{line-height:1.3}#payrollSheet .payroll-document-brand>div>strong{font-size:20px}#payrollSheet .payroll-document-brand small{font-size:7px}#payrollSheet .brand-mark{width:30px;height:32px;font-size:27px}#payrollSheet .payroll-employer{margin-top:7px}#payrollSheet .payroll-employer strong{font-size:14px}#payrollSheet .payroll-employer small{font-size:8px}#payrollSheet .document-header{padding-bottom:10px}#payrollSheet .document-header h2{font-size:25px}#payrollSheet .paysheet-meta{margin:13px 0}#payrollSheet .paysheet-meta strong{font-size:10px}#payrollSheet .paysheet-meta small{font-size:8px;margin-bottom:4px}#payrollSheet th,#payrollSheet td{padding:5px 4px;font-size:8px;line-height:1.35}#payrollSheet td small{line-height:1.3;margin-top:2px}#payrollSheet .section-gap{margin-top:16px}#payrollSheet .paysheet-settlement{margin:16px 0 10px;padding-top:12px}#payrollSheet .paysheet-settlement strong{margin-top:5px;font-size:20px}#payrollSheet .document-note{padding:10px;margin-top:8px;font-size:9px}#payrollSheet .payroll-document-footer{padding-top:10px;margin-top:14px}#payrollSheet .payroll-document-footer>strong{font-size:10px}#payrollSheet .payroll-document-footer p{font-size:8px;margin:5px 0}#payrollSheet .payroll-document-footer>small{font-size:7px}#payrollSheet .paysheet-closing{break-inside:avoid}}

/* Compact professional paysheet: identifiers have their own column. */
#payrollSheet .paysheet-table table{min-width:1100px}#payrollSheet .paysheet-deductions table{min-width:690px}#payrollSheet th,#payrollSheet td{padding:8px 7px;line-height:1.3;font-size:10px}#payrollSheet th{font-size:9px;color:#486052;border-bottom:1px solid #bccaba}#payrollSheet tbody td{border-bottom:1px solid #e4e9df}#payrollSheet td:first-child{min-width:0;white-space:nowrap}#payrollSheet th:first-child{width:8%}#payrollSheet .paysheet-table th:nth-child(2){width:18%}#payrollSheet .paysheet-deductions th:first-child{width:12%}#payrollSheet .paysheet-deductions th:nth-child(2){width:28%}#payrollSheet td:nth-child(2){white-space:normal;overflow-wrap:anywhere}#payrollSheet .paysheet-employee-number{font-size:9px;color:#657764;font-variant-numeric:tabular-nums}#payrollSheet td.num,#payrollSheet th.num{font-variant-numeric:tabular-nums}#payrollSheet tfoot th{border-top:2px solid #486052;padding-top:10px;padding-bottom:10px}#payrollSheet tfoot th:first-child{width:auto}
@media print{#payrollSheet .paysheet-table table,#payrollSheet .paysheet-deductions table{min-width:0}#payrollSheet th,#payrollSheet td{font-size:8px;line-height:1.25;padding:4px 4px}#payrollSheet th{font-size:7px}#payrollSheet .paysheet-employee-number{font-size:7px;white-space:nowrap}#payrollSheet tfoot th{padding:7px 4px;font-size:8px}#payrollSheet .paysheet-table th:first-child{width:7%}#payrollSheet .paysheet-table th:nth-child(2){width:18%}#payrollSheet .paysheet-deductions th:first-child{width:10%}#payrollSheet .paysheet-deductions th:nth-child(2){width:28%}#payrollSheet td.num{white-space:nowrap}#payrollSheet .paysheet-closing{break-inside:avoid}}
#payrollSheet td strong{font-size:inherit;line-height:inherit;font-weight:600}
#payrollSheet .paysheet-table table{min-width:1000px;width:100%;table-layout:fixed}
@media print{#payrollSheet .paysheet-table table{min-width:0}}