/* SBR Air V4 — Workers screen on the SBR Air primitives (v1.1 §14 data grid). Scoped to #view-workers.
   Only approved tokens from shared/ui/sbr-air.tokens.css are used. */
.sa-scope.sa-workers { color: var(--sa-text); font-family: var(--sa-font); }
.sa-workers__toolbar { display: flex; align-items: center; gap: var(--sa-space-2); flex-wrap: wrap; margin-bottom: var(--sa-space-3); }
.sa-workers__search { position: relative; flex: 1 1 260px; max-width: 360px; }
.sa-workers__search svg { position: absolute; left: 10px; top: 50%; width: 16px; height: 16px; transform: translateY(-50%); color: var(--sa-text-3); pointer-events: none; }
.sa-workers__search .sa-input { width: 100%; padding-left: 32px; }
.sa-workers__filter { flex: 0 1 260px; }
.sa-workers__count { margin-left: auto; font-size: var(--sa-text-sm); color: var(--sa-text-2); font-variant-numeric: tabular-nums; }
.sa-workers .sa-btn svg { width: 16px; height: 16px; flex: none; }
.sa-workers .sa-table-wrap { max-height: calc(100vh - 230px); }
.sa-workers .sa-table thead th { position: sticky; top: 0; z-index: 1; }
.sa-workers .sa-table th, .sa-workers .sa-table td { padding: 0 10px; white-space: nowrap; }
/* group headers (v1.1 §14 grouping: collapsible group header with count) */
.sa-workers tr.sa-wk-group th { height: 36px; padding: 0 12px; background: var(--sa-surface-subtle); text-align: left; font-size: var(--sa-text-xs);
  font-weight: var(--sa-weight-semibold); letter-spacing: .4px; text-transform: uppercase; color: var(--sa-text-2); border-bottom: 1px solid var(--sa-border); }
.sa-workers tr.sa-wk-sub th { height: 34px; padding: 0 12px 0 24px; background: var(--sa-surface); text-align: left; font-size: var(--sa-text-sm);
  font-weight: var(--sa-weight-semibold); color: var(--sa-text); border-bottom: 1px solid var(--sa-border); }
.sa-workers tr.sa-wk-sub th small { margin-left: 8px; font-weight: var(--sa-weight-regular); color: var(--sa-text-3); font-size: var(--sa-text-xs); }
.sa-workers .sa-wk-person { display: flex; align-items: center; gap: 10px; min-width: 200px; }
.sa-workers .sa-wk-avatar { width: 30px; height: 30px; border-radius: var(--sa-r-full); background: var(--sa-surface-subtle); border: 1px solid var(--sa-border);
  color: var(--sa-text-2); display: inline-flex; align-items: center; justify-content: center; font-size: var(--sa-text-xs); font-weight: var(--sa-weight-semibold); flex: none; }
.sa-workers .sa-wk-secret { display: inline-flex; align-items: center; gap: 4px; font-variant-numeric: tabular-nums; }
.sa-workers .sa-wk-secret .sa-icon-btn { width: 28px; height: 28px; }
.sa-workers .sa-wk-secret .sa-icon-btn svg { width: 16px; height: 16px; }
.sa-workers .sa-wk-secret .sa-icon-btn[aria-pressed="true"] { color: var(--sa-blue-text); }
.sa-workers .sa-wk-muted { color: var(--sa-text-3); }
.sa-workers td.sa-wk-actions { text-align: right; }
.sa-workers td.sa-wk-actions .sa-btn + .sa-btn { margin-left: 6px; }
.sa-workers .sa-state { padding: 32px; text-align: center; color: var(--sa-text-2); }
/* v1.1 §23: small desktop / iPad landscape drops secondary columns; tablet portrait keeps the essentials */
@media (max-width: 1279px) { .sa-workers .sa-wk-col-adp { display: none; } }
@media (max-width: 1023px) { .sa-workers .sa-wk-col-tax, .sa-workers .sa-wk-col-role, .sa-workers .sa-wk-col-div { display: none; } .sa-workers__count { margin-left: 0; } }
@media (max-width: 767px)  { .sa-workers .sa-wk-col-assign, .sa-workers .sa-wk-col-pin { display: none; } }
/* v1.1 §23 tablet portrait: 52 px rows, names may wrap so the row actions stay visible without sideways scrolling */
@media (max-width: 1023px) {
  .sa-workers .sa-table td { height: 52px; }
  .sa-workers .sa-table td:first-child { white-space: normal; }
  .sa-workers .sa-wk-person { min-width: 0; }
  .sa-workers .sa-table th, .sa-workers .sa-table td { padding: 0 6px; }
  .sa-workers td.sa-wk-actions .sa-btn + .sa-btn { margin-left: 4px; }
  .sa-workers .sa-cell-primary { white-space: normal; }
}

/* ── Worker add / edit drawer (v1.1 §19) ── */
.sa-scope.sa-wf-overlay { position: fixed; inset: 0; z-index: var(--sa-z-modal); background: var(--sa-scrim); font-family: var(--sa-font); color: var(--sa-text); }
.sa-scope .sa-wf .sa-drawer__head .sa-icon-btn svg { width: 20px; height: 20px; }
.sa-scope .sa-wf-section { margin: 4px 0 10px; padding-top: 4px; font-size: var(--sa-text-xs); font-weight: var(--sa-weight-semibold); letter-spacing: .4px; text-transform: uppercase; color: var(--sa-text-2); }
.sa-scope .sa-wf-section:not(:first-of-type) { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--sa-border); }
.sa-scope .sa-wf-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--sa-space-3); }
.sa-scope .sa-wf-grid .sa-wf-wide { grid-column: 1 / -1; }
.sa-scope .sa-wf-inline { display: flex; gap: var(--sa-space-2); align-items: center; }
.sa-scope .sa-wf-inline .sa-input { flex: 1; min-width: 0; }
.sa-scope .sa-wf-inline .sa-icon-btn svg { width: 18px; height: 18px; }
.sa-scope .sa-wf-inline .sa-icon-btn[aria-pressed="true"] { color: var(--sa-blue-text); }
.sa-scope .sa-wf .sa-label .sa-info { width: 20px; height: 20px; vertical-align: middle; margin-left: 2px; }
.sa-scope .sa-wf .sa-label .sa-info svg { width: 14px; height: 14px; }
.sa-scope .sa-wf-cross { padding: 12px; margin-bottom: var(--sa-space-3); border: 1px solid var(--sa-border); border-radius: var(--sa-r-md); background: var(--sa-surface-subtle); }
.sa-scope .sa-wf-cross[data-active="true"] { border-color: var(--sa-blue); }
.sa-scope .sa-wf-cross .sa-field { margin-bottom: 0; }
.sa-scope .sa-wf-error:empty { display: none; }
.sa-scope .sa-wf-error { margin-top: var(--sa-space-3); padding: 10px 12px; border: 1px solid var(--sa-red); border-radius: var(--sa-r-md); background: var(--sa-red-subtle);
  color: var(--sa-red-text); font-size: var(--sa-text-sm); font-weight: var(--sa-weight-medium); }
@media (max-width: 767px) { .sa-scope .sa-wf-grid { grid-template-columns: 1fr; } }