/* SBR Air V6 — Jobs Operations Board (#view-jobs). Approved tokens only. Frozen board v1.0: 46 px rows,
   6 px cell padding, Stage → Next Action → Day group, metric groups, quick views, iPad landscape / portrait Option B. */
.sa-scope.sa-jb { color: var(--sa-text); font-family: var(--sa-font); }
.sa-jb__sub { margin: -6px 0 14px; }
.sa-jb__metrics { display: flex; gap: var(--sa-space-3); flex-wrap: wrap; margin-bottom: var(--sa-space-3); }
.sa-jb-group { flex: 1 1 auto; background: var(--sa-surface); border: 1px solid var(--sa-border); border-radius: var(--sa-r-lg); padding: 10px 12px 8px; }
.sa-jb-group--closed { flex: 0 1 auto; }
.sa-jb-group__title { margin: 0 0 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-jb-group__row { display: flex; gap: 2px; flex-wrap: wrap; }
.sa-jb-metric { all: unset; box-sizing: border-box; display: flex; flex-direction: column; gap: 2px; min-width: 112px; padding: 6px 8px; border-radius: var(--sa-r-md); cursor: pointer; }
.sa-jb-metric:hover { background: var(--sa-surface-hover); }
.sa-jb-metric:focus-visible { outline: 2px solid var(--sa-focus); outline-offset: 0; }
.sa-jb-metric__num { display: flex; align-items: baseline; gap: 8px; font-size: 24px; line-height: 1.2; font-weight: var(--sa-weight-semibold); font-variant-numeric: tabular-nums; }
.sa-jb-metric__label { font-size: var(--sa-text-sm); color: var(--sa-text-2); }
.sa-jb-mk { display: inline-flex; align-items: center; gap: 2px; font-size: var(--sa-text-sm); font-weight: var(--sa-weight-semibold); }
.sa-jb-mk--att { color: var(--sa-amber-text); }
.sa-jb-mk--exc { color: var(--sa-red-text); }
.sa-jb__card { background: var(--sa-surface); border: 1px solid var(--sa-border); border-radius: var(--sa-r-lg); }
.sa-jb__views { padding: 0 12px; }
.sa-jb__toolbar { display: flex; align-items: center; gap: var(--sa-space-2); flex-wrap: wrap; padding: 10px 12px; border-bottom: 1px solid var(--sa-border); }
.sa-jb__search { position: relative; flex: 1 1 260px; max-width: 380px; }
.sa-jb__search svg { position: absolute; left: 10px; top: 50%; width: 16px; height: 16px; transform: translateY(-50%); color: var(--sa-text-3); pointer-events: none; }
.sa-jb__search .sa-input { width: 100%; padding-left: 32px; }
.sa-jb__toolbar select.sa-input { flex: 0 1 170px; }
.sa-jb__toolbar #jb-f-attn.is-on { border-color: var(--sa-amber); color: var(--sa-amber-text); background: var(--sa-amber-subtle); }
.sa-jb__count { margin-left: auto; font-size: var(--sa-text-sm); color: var(--sa-text-2); font-variant-numeric: tabular-nums; }
.sa-jb__grid .sa-table-wrap { border: 0; border-radius: 0 0 var(--sa-r-lg) var(--sa-r-lg); max-height: calc(100vh - 360px); }
.sa-jb-table thead th { position: sticky; top: 0; z-index: 1; }
.sa-jb-table th, .sa-jb-table td { padding: 0 6px; }
.sa-jb-table td { height: 46px; }
.sa-jb-table th button { white-space: nowrap; }
.sa-jb-table th button svg { margin-left: 2px; }
.sa-jb-table tbody tr { cursor: pointer; }
.sa-jb-table tbody tr:focus-visible { outline: 2px solid var(--sa-focus); outline-offset: -2px; }
.sa-jb-table .sa-cell-primary, .sa-jb-table .sa-cell-secondary { display: block; }
.sa-jb-jobnum { font-weight: var(--sa-weight-semibold); white-space: nowrap; }
.jb-c-job { width: 150px; } .jb-c-stage { width: 180px; } .jb-c-next { width: 220px; } .jb-c-day { width: 96px; } .jb-c-pm { width: 120px; }
.jb-c-crew { width: 92px; } .jb-c-attn { width: 140px; } .jb-c-act { width: 80px; text-align: right; white-space: nowrap; }
.jb-c-prop .sa-cell-primary, .jb-c-prop .sa-cell-secondary { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jb-c-stage .sa-flag { margin-left: 4px; }
.sa-jb-next { display: block; font-weight: var(--sa-weight-medium); }
.sa-jb-next.is-att { color: var(--sa-amber-text); }
.sa-jb-next.is-exc { color: var(--sa-red-text); }
.sa-jb-next.is-quiet { color: var(--sa-text-2); font-weight: var(--sa-weight-regular); }
.sa-jb-day { white-space: nowrap; font-variant-numeric: tabular-nums; }
.sa-jb-day.is-over { color: var(--sa-red-text); font-weight: var(--sa-weight-semibold); }
.sa-jb-unassigned { color: var(--sa-amber-text); }
.sa-jb-muted { color: var(--sa-text-3); }
.sa-jb-crew { display: inline-flex; gap: 2px; }
.sa-jb-av { width: 24px; height: 24px; border-radius: var(--sa-r-full); background: var(--sa-surface-subtle); border: 1px solid var(--sa-border); display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: var(--sa-weight-semibold); color: var(--sa-text-2); }
.sa-jb-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.sa-jb-portrait-line { display: none !important; }
.sa-jb__gap { margin: 0; padding: 10px 12px; border-top: 1px solid var(--sa-border); font-size: var(--sa-text-xs); color: var(--sa-text-2); }
.sa-jb .sa-state { padding: 32px; text-align: center; }
/* iPad landscape (1024–1279): Job · Property · Stage · Next Action · Day · Project Mgr · Crew · Attention */
@media (max-width: 1279px) { .jb-c-prop .sa-cell-primary, .jb-c-prop .sa-cell-secondary { max-width: 180px; } .jb-c-attn { width: 120px; } }
/* iPad portrait Option B (768–1023): Job (+ Property · Location line) · Stage · Next Action · Day · Attention; 52 px rows */
@media (max-width: 1023px) {
  .sa-jb-table .jb-c-prop, .sa-jb-table .jb-c-pm, .sa-jb-table .jb-c-crew { display: none; }
  .sa-scope .sa-jb-table td { height: 52px; }
  .sa-jb-portrait-line { display: block !important; max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .jb-c-job .sa-cell-secondary:not(.sa-jb-portrait-line) { display: none; }
  .sa-jb-group, .sa-jb-group--closed { flex: 1 1 100%; }
  .sa-jb-metric { min-width: 96px; }
  .sa-jb__count { margin-left: 0; }
  .sa-jb__grid .sa-table-wrap { max-height: none; }
  .jb-c-next { width: auto; }
}
/* Fixed layout: Property / Customer is the only flexible column (VF-1); text cells truncate with ellipsis and show the
   full value on hover (title). Desktop / landscape: flags sit on the small second line under Stage, as frozen; the
   separate Attention column exists only in iPad portrait Option B. */
.sa-jb-table { table-layout: fixed; }
.sa-jb-table td { overflow: hidden; }
.sa-jb-table .sa-cell-primary, .sa-jb-table .sa-cell-secondary, .sa-jb-next { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jb-c-job { width: 140px; } .jb-c-stage { width: 172px; } .jb-c-next { width: 220px; } .jb-c-day { width: 92px; } .jb-c-pm { width: 112px; }
.jb-c-crew { width: 80px; } .jb-c-act { width: 80px; }
.sa-jb-table .jb-c-attn { display: none; width: 112px; }
.jb-c-prop .sa-cell-primary, .jb-c-prop .sa-cell-secondary { max-width: none; }
.sa-jb-stageflag { display: block; margin-top: 3px; line-height: 1; }
.sa-jb-stageflag .sa-flag { margin-left: 0; }
.jb-c-stage .sa-badge { max-width: 100%; }
@media (max-width: 1279px) { .jb-c-next { width: 190px; } .jb-c-pm { width: 104px; } .jb-c-stage { width: 160px; } }
@media (max-width: 1023px) {
  .sa-jb-table .jb-c-attn { display: table-cell; }
  .sa-jb-stageflag { display: none; }
  .jb-c-job { width: 200px; } .jb-c-stage { width: 120px; } .jb-c-next { width: auto; } .jb-c-day { width: 84px; } .jb-c-act { width: 84px; }
}
/* Tablet sizing (measured): landscape grid ≈ 900 px with the expanded nav; portrait icon buttons are 44 px touch targets */
@media (max-width: 1279px) {
  .jb-c-job { width: 128px; } .jb-c-stage { width: 146px; } .jb-c-next { width: 168px; } .jb-c-day { width: 84px; }
  .jb-c-pm { width: 96px; } .jb-c-crew { width: 70px; } .jb-c-act { width: 76px; }
}
@media (max-width: 1023px) {
  .sa-scope .sa-jb-table td { height: 52px; }
  .jb-c-job { width: 188px; } .jb-c-stage { width: 118px; } .jb-c-next { width: auto; } .jb-c-day { width: 80px; }
  .sa-jb-table .jb-c-attn { width: 104px; } .jb-c-act { width: 100px; }
}