/* Bancada — o contador é o próprio título da seção, não uma caixa à parte.
   Cada bancada é um dono de pendência: azul precisa agendar, âmbar espera
   terceiro, verde já resolvido. A régua de baixo abre a fila que vem junto. */

.bench-head {
  display: flex; align-items: center; gap: 12px;
  /* filete claro: o preto do masthead fecha a folha, aqui só separa a bancada
     da lista dela. O respiro é a altura do botão que mora no slot da direita. */
  border-bottom: 1px solid var(--line-strong); padding-bottom: 16px; margin: 34px 0 0;

  & .bl { display: flex; align-items: baseline; gap: 12px; }

  & .bn {
    font-size: 22px; font-weight: 400; line-height: 1;
    font-variant-numeric: tabular-nums;
  }

  & .bt {
    font-family: var(--mono); font-size: 11px; letter-spacing: .12em;
    text-transform: uppercase;
  }

  /* a regra de ordenação (ou as ações da lista), encostada à direita */
  & .bh {
    margin-left: auto; font-size: 12px; color: var(--ink-faint);
    display: flex; justify-content: flex-end; align-items: center; gap: 6px;
  }
}

.bench-head:first-of-type { margin-top: 0; }

/* Quando a busca vem logo abaixo, ela e a bancada são o mesmo cabeçalho: o
   filete não corta no meio do par — quem o desenha é o topo da tabela. */
.bench-head:has(+ .painel) { border-bottom: 0; padding-bottom: 14px; }

.bench--mine { & .bt, & .bn { color: var(--accent); } }
.bench--wait { & .bt, & .bn { color: var(--warn); } }
.bench--done { & .bt, & .bn { color: var(--ok); } }