.payroll-toolbar{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin-bottom:18px}.payroll-toolbar .field{min-width:210px}.payroll-toolbar input{background:#fff}.payroll-name strong,.payroll-name span{display:block}.payroll-name span{color:var(--muted);font-size:13px;margin-top:3px}.payroll-breakdown{display:grid;grid-template-columns:repeat(2,minmax(160px,1fr));gap:10px;margin:18px 0}.payroll-line{display:flex;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:10px;background:#f6f8fb}.payroll-line.total{background:#eaf3ff;color:#123c76;font-size:18px;font-weight:800}.payroll-line.deduction{color:#b42318}.payroll-slip{max-width:850px}.payroll-slip-head{display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding-bottom:16px}.payroll-status{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:800}.payroll-status.draft{background:#eef2f7;color:#475569}.payroll-status.approved{background:#fff2d8;color:#9a5a00}.payroll-status.paid{background:#dcfce7;color:#067647}.payroll-payment{background:#f8fafc;border:1px solid var(--line);border-radius:12px;padding:14px;margin-top:15px}.payroll-check{display:flex;align-items:center;gap:9px;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:#f8fafc}.payroll-check input{width:auto}.payroll-positive{color:#079447;font-weight:800}.payroll-negative{color:#d92d20}.payroll-note{font-size:13px;color:var(--muted);margin-top:8px}
@media(max-width:760px){.payroll-breakdown{grid-template-columns:1fr}.payroll-toolbar>*{width:100%}}
@media print{body *{visibility:hidden}.payroll-slip,.payroll-slip *{visibility:visible}.payroll-slip{position:absolute;inset:0;max-width:none;border:0;box-shadow:none}.payroll-slip .actions{display:none!important}}