/* Payroll uses the tenant palette and native forms/details; no UI dependency. */
.payroll-navigation { display:flex; align-items:stretch; gap:.5rem; max-width:110rem; margin:1rem auto 0; border-bottom:1px solid var(--ui-border); overflow-x:auto; scrollbar-width:thin; }
.payroll-navigation-link { display:flex; align-items:center; gap:.7rem; flex:1; min-width:max-content; padding:.85rem 1rem; border-bottom:2px solid transparent; color:var(--ui-muted); text-decoration:none; }
.payroll-navigation-link strong { display:block; font-size:.88rem; font-weight:650; }
.payroll-navigation-link small { display:block; font-size:.72rem; margin-top:.2rem; }
.payroll-step-number { display:grid; flex:none; place-items:center; width:2rem; height:2rem; border-radius:.65rem; background:var(--ui-raised); border:1px solid var(--ui-border); font-size:.8rem; font-weight:700; color:var(--ui-muted); }
.payroll-navigation-link[aria-current="page"] { color:var(--ui-text); border-bottom-color:var(--tenant-accent); }
.payroll-navigation-link[aria-current="page"] .payroll-step-number { background:var(--tenant-accent); color:white; border-color:var(--tenant-accent); }
.payroll-navigation-link:hover { background:var(--ui-hover); }
.payroll-navigation-link:focus-visible { outline:2px solid var(--tenant-accent); outline-offset:-3px; }
.payroll-workspace { --payroll-success:#047857; --payroll-success-bg:#ecfdf5; --payroll-warning:#92400e; --payroll-warning-bg:#fffbeb; --payroll-danger:#be123c; --payroll-danger-bg:#fff1f2; --payroll-accent:var(--tenant-accent); padding-block:1.5rem; }
.theme-dark .payroll-workspace { --payroll-success:#6ee7b7; --payroll-success-bg:#062f29; --payroll-warning:#fcd34d; --payroll-warning-bg:#352812; --payroll-danger:#fda4af; --payroll-danger-bg:#3c1526; --payroll-accent:var(--tenant-bright); }
.payroll-page-heading { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.4rem; }
.payroll-page-heading h1 { font-size:clamp(1.55rem,2vw,1.9rem); font-weight:750; letter-spacing:-.04em; line-height:1.3; }
.payroll-page-heading > div > p:not(.payroll-eyebrow) { color:var(--ui-muted); font-size:.86rem; margin-top:.35rem; }
.payroll-eyebrow { font-size:.66rem; font-weight:700; letter-spacing:.12em; color:var(--ui-muted); margin-bottom:.35rem; }
.payroll-heading-code { display:inline-block; color:var(--ui-muted); font-size:.8rem; letter-spacing:0; font-weight:500; margin-left:.5rem; vertical-align:middle; }
.payroll-workspace .module-action-button { border-radius:.65rem; white-space:normal; text-align:center; }
.payroll-workspace form .module-action-button { margin-top:0; }
.payroll-workspace .payroll-muted, .payroll-muted { color:var(--ui-muted); font-size:.75rem; }
.payroll-workspace .payroll-footnote { margin:.8rem 0 1rem; color:var(--ui-muted); font-size:.76rem; line-height:1.6; }
.payroll-workspace .payroll-field-hint { color:var(--ui-muted); font-size:.75rem; line-height:1.5; margin-top:.4rem; }
.payroll-text-link { color:var(--payroll-accent); font-size:.82rem; font-weight:650; text-decoration:none; }
.payroll-text-link:hover { text-decoration:underline; }
.payroll-card { min-width:0; padding:1.25rem; margin-bottom:1rem; border:1px solid var(--ui-border); border-radius:1rem; background:var(--ui-surface); }
.payroll-card-heading { display:flex; align-items:center; gap:.8rem; margin-bottom:1rem; }
.payroll-card-heading h2, .payroll-workspace .payroll-guide-card h2 { font-size:1rem; font-weight:700; margin:0; }
.payroll-card-heading p { color:var(--ui-muted); font-size:.8rem; margin-top:.25rem; }
.payroll-table-card { position:relative; padding:0; overflow:hidden; }
.payroll-workspace select { background-color:var(--ui-input); color:var(--ui-text); transition:border-color 140ms, box-shadow 140ms; }
.theme-dark .payroll-workspace :is(select, input, textarea) { color-scheme:dark; }
.payroll-table { width:100%; }
.payroll-workspace .payroll-table :is(th,td) { padding:.95rem 1rem; }
.payroll-table td strong { font-weight:650; }
.payroll-table tbody tr:last-child td { border-bottom:0; }
.payroll-table tbody tr:hover { background:var(--ui-hover); }
.payroll-table .module-action-button { padding:.4rem .8rem; font-size:.76rem; }
.payroll-badge { display:inline-flex; align-items:center; gap:.3rem; padding:.25rem .6rem; border-radius:999px; color:var(--ui-muted); background:var(--ui-raised); font-size:.7rem; line-height:1.4; font-weight:650; vertical-align:middle; white-space:nowrap; }
.payroll-badge[data-tone="success"] { color:var(--payroll-success); background:var(--payroll-success-bg); }
.payroll-badge[data-tone="warning"] { color:var(--payroll-warning); background:var(--payroll-warning-bg); }
.payroll-badge[data-tone="danger"] { color:var(--payroll-danger); background:var(--payroll-danger-bg); }
.payroll-table td .payroll-badge { margin-top:.25rem; }
.payroll-filter-bar { display:flex; flex-wrap:wrap; align-items:flex-end; gap:.8rem; padding:1rem; margin-bottom:1.25rem; border:1px solid var(--ui-border); border-radius:.85rem; background:var(--ui-surface); }
.payroll-filter-bar > div { flex:1 1 10rem; min-width:0; }
.payroll-filter-bar > .payroll-filter-search { flex:2 1 14rem; }
.payroll-filter-bar > .treasury-actions { flex:0 1 auto; padding-bottom:.1rem; }
.payroll-workspace .payroll-filter-bar label { font-size:.75rem; }
.payroll-filter-bar-compact { background:none; border:0; padding:0; margin-top:1.25rem; }
.payroll-filter-bar-compact > .payroll-filter-search { max-width:32rem; }
.payroll-process-strip { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; padding:1rem 1.25rem; border:1px solid var(--ui-border); border-radius:.85rem; margin-bottom:1rem; }
.payroll-process-strip > span { display:grid; grid-template-columns:auto 1fr; column-gap:.7rem; align-items:center; }
.payroll-process-strip i { grid-row:span 2; display:grid; place-items:center; width:1.6rem; height:1.6rem; background:var(--ui-surface); border:1px solid var(--ui-border); border-radius:50%; color:var(--ui-muted); font-style:normal; font-size:.7rem; }
.payroll-process-strip strong { font-size:.8rem; font-weight:600; }
.payroll-process-strip small { font-size:.72rem; color:var(--ui-muted); margin-top:.2rem; }
.payroll-empty { text-align:center; padding:3rem 1.5rem; }
.payroll-empty-icon { display:grid; place-items:center; width:3.3rem; height:3.3rem; margin:0 auto 1rem; border-radius:1rem; color:var(--payroll-accent); background:color-mix(in srgb,var(--tenant-accent) 10%,var(--ui-surface)); font-size:.85rem; font-weight:700; }
.payroll-workspace .payroll-empty h2 { font-size:1.1rem; margin-bottom:.5rem; }
.payroll-empty p { font-size:.85rem; color:var(--ui-muted); max-width:36rem; margin:0 auto 1.25rem; }
.payroll-pagination { display:flex; flex-wrap:wrap; gap:1rem; align-items:center; justify-content:space-between; margin-block:1rem 1.5rem; font-size:.8rem; color:var(--ui-muted); }
.payroll-form-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(15rem,.4fr); gap:1.25rem; align-items:start; }
.payroll-guide-card { padding:1.25rem; border:1px solid var(--ui-border); border-radius:1rem; background:var(--ui-raised); }
.payroll-guide-card dl { margin-top:1.5rem; }
.payroll-guide-card dt { font-size:.82rem; font-weight:650; margin-top:1rem; }
.payroll-guide-card dd, .payroll-guide-card li p { margin-top:.35rem; font-size:.8rem; color:var(--ui-muted); line-height:1.65; }
.payroll-callout { padding:.85rem 1rem; background:color-mix(in srgb,var(--tenant-accent) 5%,var(--ui-surface)); border:1px solid color-mix(in srgb,var(--tenant-accent) 20%,var(--ui-border)); border-radius:.7rem; color:var(--ui-muted); font-size:.8rem; line-height:1.65; margin-block:.85rem 1.1rem; }
.payroll-callout strong { color:var(--ui-text); }
.payroll-explainer-list { margin-top:1.2rem; padding-left:1.25rem; }
.payroll-explainer-list li { padding-left:.35rem; margin-bottom:1.1rem; }
.payroll-explainer-list li::marker { color:var(--payroll-accent); font-size:.8rem; font-weight:700; }
.payroll-explainer-list strong { font-size:.83rem; }
.payroll-save-bar { position:sticky; bottom:max(.75rem,env(safe-area-inset-bottom)); z-index:5; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.9rem 1rem; border:1px solid var(--ui-border); border-radius:.85rem; background:var(--ui-surface); box-shadow:0 4px 18px rgb(0 0 0 / .08); margin:1rem 0; }
.payroll-save-bar > span { color:var(--ui-muted); font-size:.78rem; line-height:1.5; }
.payroll-save-bar > span[data-dirty="true"] { color:var(--payroll-warning); }
.payroll-save-bar .module-action-button { flex-shrink:0; }
.payroll-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.payroll-metric { position:relative; padding:1.15rem 1.25rem; border:1px solid var(--ui-border); border-radius:1rem; background:var(--ui-surface); overflow:hidden; }
.payroll-metric p { color:var(--ui-muted); font-size:.8rem; font-weight:600; }
.payroll-metric > strong { display:block; margin-top:.45rem; font-size:clamp(1.4rem,2vw,1.9rem); font-weight:750; letter-spacing:-.035em; font-variant-numeric:tabular-nums; }
.payroll-metric small { display:block; color:var(--ui-muted); font-size:.73rem; margin-top:.35rem; }
.payroll-metric[data-tone="accent"] > strong { color:var(--payroll-accent); }
.payroll-metric[data-tone="success"] > strong { color:var(--payroll-success); }
.payroll-metric[data-tone="warning"] > strong { color:var(--payroll-warning); }
.payroll-review-progress { display:flex; align-items:center; flex-wrap:wrap; gap:1rem; justify-content:space-between; padding:1rem 1.25rem; border:1px solid var(--ui-border); background:var(--ui-surface); border-radius:.85rem; margin-top:1.25rem; }
.payroll-review-progress strong { font-size:.85rem; }
.payroll-review-progress p { font-size:.78rem; color:var(--ui-muted); }
.payroll-review-progress progress { display:block; width:14rem; max-width:100%; height:.45rem; accent-color:var(--tenant-accent); border-radius:999px; overflow:hidden; border:0; background:var(--ui-raised); }
.payroll-review-progress progress::-webkit-progress-bar { background:var(--ui-raised); }
.payroll-review-progress progress::-webkit-progress-value { background:var(--tenant-accent); }
.payroll-review-progress progress::-moz-progress-bar { background:var(--tenant-accent); }
.payroll-secondary-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.6rem; margin:1rem 0; }
.payroll-secondary-actions > span { color:var(--ui-muted); font-size:.76rem; margin-right:.25rem; }
.payroll-secondary-actions .module-action-button { padding:.5rem .7rem; font-size:.75rem; }
.payroll-review-card { border:1px solid var(--ui-border); border-radius:.85rem; background:var(--ui-surface); margin-bottom:.75rem; overflow:hidden; }
.payroll-review-summary { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(9rem,auto) auto; align-items:center; gap:1rem; padding:1rem 1.25rem; cursor:pointer; list-style:none; }
.payroll-review-summary::-webkit-details-marker { display:none; }
.payroll-review-summary:hover { background:var(--ui-hover); }
.payroll-review-summary:focus-visible, .payroll-workspace summary:focus-visible { outline:2px solid var(--tenant-accent); outline-offset:-3px; }
.payroll-worker-identity strong { display:block; font-size:.85rem; font-weight:650; }
.payroll-worker-identity small { display:block; color:var(--ui-muted); font-size:.73rem; margin-top:.3rem; }
.payroll-line-net { text-align:right; }
.payroll-line-net small { display:block; font-size:.68rem; color:var(--ui-muted); }
.payroll-line-net strong { display:block; font-size:1rem; font-weight:700; margin-top:.15rem; font-variant-numeric:tabular-nums; }
.payroll-chevron { color:var(--ui-muted); width:1rem; text-align:center; font-size:1.25rem; }
.payroll-review-card[open] > .payroll-review-summary { border-bottom:1px solid var(--ui-border); }
.payroll-review-card[open] .payroll-chevron { transform:rotate(180deg); }
.payroll-review-content { padding:1.25rem; }
.payroll-attendance-summary { padding:.9rem 1rem; border-radius:.65rem; background:var(--ui-raised); margin-bottom:1.25rem; }
.payroll-attendance-summary header { display:flex; flex-wrap:wrap; gap:.5rem; justify-content:space-between; font-size:.8rem; }
.payroll-attendance-summary header span { color:var(--ui-muted); font-size:.75rem; }
.payroll-attendance-facts { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:.75rem; margin-block:.85rem; }
.payroll-attendance-facts strong { display:block; font-size:1.1rem; font-weight:650; font-variant-numeric:tabular-nums; }
.payroll-attendance-facts small { font-size:.71rem; color:var(--ui-muted); }
.payroll-money-sections { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:1.5rem; }
.payroll-money-group { min-width:0; }
.payroll-money-group legend { font-size:.83rem; font-weight:700; border-bottom:1px solid var(--ui-border); padding-bottom:.5rem; width:100%; }
.payroll-money-group[data-tone="income"] legend { color:var(--payroll-success); }
.payroll-money-group[data-tone="deduction"] legend { color:var(--payroll-warning); }
.payroll-money-group .treasury-form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.payroll-line-calculation { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; justify-content:space-between; padding:.9rem 1rem; border:1px solid var(--ui-border); border-radius:.65rem; margin-block:1rem; font-size:.8rem; background:var(--ui-raised); }
.payroll-line-calculation > strong { font-size:1.25rem; font-variant-numeric:tabular-nums; }
.payroll-line-calculation > span { color:var(--ui-muted); }
.payroll-line-calculation > span strong { color:var(--ui-text); }
.payroll-employment-details { border-top:1px solid var(--ui-border); margin-top:1rem; padding-block:.8rem; }
.payroll-employment-details summary { cursor:pointer; font-size:.8rem; font-weight:600; }
.payroll-employment-details summary span { display:block; margin:.35rem 0 0 1rem; color:var(--ui-muted); font-size:.75rem; font-weight:400; }
.payroll-line-notes { margin-top:.5rem; }
.payroll-inline-error, .payroll-error-box { color:var(--payroll-danger); font-size:.82rem; }
.payroll-error-box { border:1px solid color-mix(in srgb,var(--payroll-danger) 35%,var(--ui-border)); padding:1rem 1.25rem; border-radius:.75rem; background:var(--payroll-danger-bg); margin-bottom:1rem; }
.payroll-error-box ul { list-style:disc; padding-left:1rem; margin-block:.5rem; }
.payroll-error-box p { font-size:.78rem; }
.payroll-confirm-card { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; border:1px solid var(--ui-border); border-radius:.85rem; padding:1.2rem; margin-block:1.25rem; background:var(--ui-surface); }
.payroll-workspace .payroll-confirm-card h2 { font-size:.95rem; margin-bottom:.35rem; }
.payroll-confirm-card p { font-size:.8rem; color:var(--ui-muted); max-width:44rem; }
.payroll-danger-action { display:flex; justify-content:flex-end; padding-top:.5rem; }
.payroll-danger-action .module-action-button { color:var(--payroll-danger); font-size:.75rem; }
.payroll-workspace .payroll-payment-row { padding-block:.65rem; }
.payroll-workspace .payroll-payment-row:last-child { border-bottom:0; }
.payroll-workspace .payroll-payment-row summary { font-size:.83rem; }
.payroll-payment-row summary small { display:block; margin-top:.2rem; }
.payroll-payment-row .payroll-payment-balance { text-align:right; }
.payroll-payment-row .payroll-payment-balance strong { display:block; color:var(--ui-text); margin-top:.2rem; }
.payroll-payment-content { padding:.75rem .25rem; }
.payroll-payment-history { margin-bottom:1rem; padding:0; list-style:none; }
.payroll-payment-history li { display:flex; flex-wrap:wrap; gap:.75rem; padding:.65rem .8rem; background:var(--ui-raised); border-radius:.5rem; margin-block:.35rem; font-size:.78rem; }
.payroll-payment-history li span { color:var(--ui-muted); }
.payroll-payment-history li strong { margin-left:auto; font-variant-numeric:tabular-nums; }
.payroll-day-heading { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.payroll-day-heading h2 { margin:0; }
.payroll-day-heading h2 span { font-size:.8rem; color:var(--ui-muted); font-weight:400; margin-left:.5rem; }
.payroll-day-heading p { color:var(--ui-muted); font-size:.76rem; margin-top:.3rem; }
.payroll-day-heading .module-action-button { font-size:.75rem; padding:.5rem .7rem; }
.payroll-attendance-list { padding:0; }
.payroll-attendance-row { display:grid; grid-template-columns:minmax(13rem,1.5fr) minmax(11rem,1.2fr) repeat(3,minmax(7rem,.7fr)); column-gap:1rem; row-gap:.8rem; padding:1rem 1.25rem; align-items:center; }
.payroll-attendance-row + .payroll-attendance-row { border-top:1px solid var(--ui-border); }
.payroll-attendance-worker strong { display:block; font-size:.84rem; font-weight:650; }
.payroll-attendance-worker small { display:block; font-size:.73rem; color:var(--ui-muted); margin-top:.3rem; }
.payroll-attendance-worker .payroll-badge { margin-top:.4rem; }
.payroll-workspace .payroll-attendance-row label { font-size:.7rem; font-weight:500; }
.payroll-attendance-row :is(select,input,textarea):disabled { opacity:.7; cursor:not-allowed; }
.payroll-attendance-time small { display:block; font-size:.68rem; color:var(--ui-muted); margin-top:.25rem; }
.payroll-attendance-row[data-status="present"] .payroll-attendance-state select { border-color:color-mix(in srgb,var(--payroll-success) 45%,var(--ui-border)); }
.payroll-attendance-row[data-status="absence"] .payroll-attendance-state select, .payroll-attendance-row[data-status="unpaid_leave"] .payroll-attendance-state select { border-color:color-mix(in srgb,var(--payroll-warning) 45%,var(--ui-border)); }
.payroll-attendance-note { grid-column:1 / -1; }
.payroll-attendance-note summary { font-size:.73rem; color:var(--ui-muted); cursor:pointer; width:fit-content; }
.payroll-attendance-note textarea { margin-top:.5rem; }
.payroll-report-table { min-width:55rem; }
.payroll-report-breakdown { margin-top:.5rem; font-size:.73rem; }
.payroll-report-breakdown summary { cursor:pointer; color:var(--payroll-accent); }
.payroll-report-breakdown dl { margin-top:.5rem; min-width:10rem; }
.payroll-report-breakdown dl > div { display:flex; justify-content:space-between; gap:1rem; padding-block:.2rem; }
.payroll-report-breakdown dt { color:var(--ui-muted); }
@media (max-width:1100px) { .payroll-form-layout { grid-template-columns:minmax(0,1fr); } .payroll-guide-card { display:block; } .payroll-attendance-row { grid-template-columns:repeat(3,minmax(0,1fr)); } .payroll-attendance-worker { grid-column:span 2; } .payroll-money-sections { grid-template-columns:minmax(0,1fr); gap:1rem; } }
@media (max-width:760px) {
  .payroll-navigation { margin-top:.4rem; gap:0; }.payroll-navigation-link { padding:.75rem .7rem; gap:.4rem; }.payroll-navigation-link small { display:none; }.payroll-navigation-link strong { font-size:.75rem; }.payroll-navigation-link .payroll-step-number { width:1.5rem; height:1.5rem; font-size:.7rem; border-radius:.5rem; }
  .payroll-process-strip { grid-template-columns:minmax(0,1fr); gap:.85rem; }.payroll-process-strip > span { grid-template-columns:1.6rem minmax(0,1fr); }.payroll-process-strip strong { font-size:.78rem; }
  .payroll-metrics { gap:.65rem; grid-template-columns:minmax(0,1fr); }.payroll-metric { padding:1rem; }.payroll-metric > strong { font-size:1.55rem; }
  .payroll-card,.payroll-review-content { padding:1rem; }.payroll-table-card,.payroll-attendance-list { padding:0; }.payroll-heading-code { display:block; margin:.35rem 0 0; }
  .payroll-review-summary { grid-template-columns:minmax(0,1fr) auto; gap:.65rem; padding:1rem; }.payroll-worker-identity { grid-column:1; }.payroll-review-summary > .payroll-badge { grid-column:2; grid-row:1; }.payroll-line-net { grid-column:1; text-align:left; }.payroll-chevron { grid-column:2; justify-self:end; }
  .payroll-attendance-facts { grid-template-columns:repeat(3,minmax(0,1fr)); }.payroll-money-group .treasury-form-grid { grid-template-columns:minmax(0,1fr); }
  .payroll-save-bar { position:static; flex-direction:column; align-items:stretch; box-shadow:none; margin-top:1rem; }.payroll-save-bar .module-action-button { width:100%; }.payroll-save-bar > span { font-size:.75rem; }
  .payroll-filter-bar > .treasury-actions { flex:1 0 100%; }.payroll-filter-bar-compact > .payroll-filter-search { max-width:none; }
  .payroll-attendance-row { grid-template-columns:repeat(3,minmax(0,1fr)); padding:1rem; gap:.8rem .65rem; }.payroll-attendance-worker { grid-column:1 / -1; }.payroll-attendance-state { grid-column:1 / -1; }.payroll-attendance-row input { padding-inline:.5rem; }.payroll-workspace .payroll-attendance-time label { min-height:2rem; }
  .payroll-confirm-card { padding:1rem; }.payroll-confirm-card form { width:100%; }.payroll-confirm-card form .module-action-button { width:100%; }
}
@media (prefers-reduced-motion:no-preference) { .payroll-navigation-link,.payroll-review-summary { transition:background-color 140ms ease; } }
@media (prefers-reduced-motion:reduce) { .payroll-workspace select { transition:none; } }
@media print { .payroll-navigation,.payroll-filter-bar,.payroll-save-bar,.payroll-secondary-actions,.payroll-danger-action,.payroll-pagination { display:none; } }