#payrollRoot, #materialsRoot { min-width: 0; }
.material-tag { background:#edf0fa; color:#454f80; white-space:normal; overflow-wrap:anywhere; }
.material-tags { margin-top:10px; }
.payroll-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin:16px 0; }
.payroll-tabs { display:flex; flex-wrap:wrap; gap:6px; border-bottom:1px solid #ccd7de; padding-bottom:12px; margin-bottom:16px; }
.payroll-tabs button { background:#e9eef1; color:#26333d; }
.payroll-tabs button.active { background:#1b6c85; color:white; }
.payroll-form { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; align-items:end; }
.payroll-form label { display:grid; gap:6px; margin:0; min-width:0; }
.payroll-form input,.payroll-form select,.payroll-form textarea { width:100%; min-width:0; box-sizing:border-box; }
.payroll-form .full { grid-column:1/-1; }
.material-batch-item { min-width:0; margin:0; padding:12px 0; border:0; border-top:1px solid #ccd7de; }
.material-batch-item legend { max-width:100%; padding:0 8px 0 0; font-weight:600; overflow-wrap:anywhere; }
.material-batch-item .payroll-checkbox input { flex:none; }
.material-batch-fields[hidden] { display:none; }
.payroll-surface { padding:16px 0; border-top:1px solid #d4dfe5; }
.payroll-table { overflow:auto; width:100%; min-width:0; max-width:100%; margin:12px 0; overscroll-behavior-inline:contain; -webkit-overflow-scrolling:touch; }
.payroll-table table { min-width:720px; }
.payroll-table th { white-space:nowrap; }
.payroll-table td { vertical-align:top; }
.payroll-actions { display:flex; flex-wrap:nowrap; gap:6px; }
.payroll-actions button { white-space:nowrap; }
.payroll-checkbox { display:flex!important; flex-direction:row; align-items:center; gap:8px; }
.payroll-checkbox input { width:18px; height:18px; flex:none; }
.payroll-info { padding:10px 12px; background:#edf6f2; color:#245a48; border:1px solid #b9d9ca; border-radius:4px; margin:12px 0; }
.payroll-error { padding:10px 12px; background:#fff0ee; color:#9d2d24; border:1px solid #e4aaa3; border-radius:4px; margin:12px 0; overflow-wrap:anywhere; }
.payroll-warning { color:#93580b; overflow-wrap:anywhere; }
.payroll-muted { color:#526772; font-size:13px; }
.payroll-amount { font-variant-numeric:tabular-nums; white-space:nowrap; }
.payroll-dialog { width:min(940px,calc(100vw - 32px)); max-height:88vh; padding:20px; border:1px solid #cbd6df; border-radius:8px; color:#1c2c37; box-sizing:border-box; }
.payroll-dialog::backdrop { background:#17252c66; }
.payroll-dialog header { position:static; flex-direction:row; display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
.payroll-dialog header h2 { margin:0; font-size:18px; }
.payroll-dialog h3 { font-size:16px; margin:18px 0 10px; }
.payroll-dialog .close { background:transparent; color:#334b59; font-size:24px; width:36px; height:36px; padding:0; flex:none; }
.payroll-dialog .payroll-scroll { max-height:360px; overflow:auto; }
.payroll-pager { display:flex; align-items:center; gap:12px; margin:12px 0; }
.payroll-totals { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; padding:16px 0; border-block:1px solid #ccd7de; }
.payroll-totals dt { color:#526772; font-size:13px; }
.payroll-totals dd { margin:6px 0 0; font-size:20px; font-weight:600; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
#payrollPermissionFields { margin:16px 0; border:1px solid #ccd7de; padding:12px; }
#payrollPermissionFields label { display:flex; align-items:center; gap:8px; }
#payrollPermissionFields input { width:18px; height:18px; }
@media (max-width:760px) { .payroll-form {grid-template-columns:repeat(2,minmax(0,1fr));} .payroll-dialog {padding:14px;} }
@media (max-width:480px) { .payroll-form {grid-template-columns:minmax(0,1fr);} .payroll-tabs {gap:5px;} .payroll-tabs button {padding:8px 10px;} .payroll-totals {grid-template-columns:repeat(2,minmax(0,1fr));} .payroll-head .payroll-actions,.payroll-surface > .payroll-actions,.payroll-pager {flex-wrap:wrap;} .payroll-dialog {max-height:94dvh;overflow:auto;} }
