/* O bloco da regua no topo do fio da conversa (14/10, entrega 3; spec
   docs/superpowers/specs/2026-10-13-regua-debitos-veiculares-design.md,
   secao 9.5): o que a regua mandou a este cliente antes de ele responder.

   Da familia das bolhas centradas do fio (a NOTA interna, `.conversa__bolha--nota`):
   centrado, borda tracejada, cor apagada -- e historico, nao conversa. O aviso do
   sistema (`.conversa__bolha--sistema`) perdeu a caixa em 10/11/2026 e ficou uma
   linha discreta; este bloco segue na caixa porque agrupa varias linhas. So
   tokens (--bc-*), nunca hex novo. */

.regua-na-conversa {
  align-self: center;
  width: min(100%, 34rem);
  margin: .25rem 0 .75rem;
  padding: .7rem .9rem;
  color: var(--bc-ink-mut);
  background: var(--bc-surface-2);
  border: 1px dashed var(--bc-line);
  border-radius: var(--bc-raio);
  font-size: .82rem;
  line-height: 1.4;
}

.regua-na-conversa__topo {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .25rem .5rem;
  margin-bottom: .5rem;
}

.regua-na-conversa__rotulo {
  font-family: var(--bc-fonte-mono);
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.regua-na-conversa__nome { color: var(--bc-ink); }

.regua-na-conversa__dia {
  font-family: var(--bc-fonte-mono);
  font-size: .72rem;
}

.regua-na-conversa__passos {
  display: grid;
  gap: .5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.regua-na-conversa__passo {
  display: grid;
  gap: .15rem;
  padding-top: .5rem;
  border-top: 1px solid var(--bc-line-soft);
}

.regua-na-conversa__passo:first-child {
  padding-top: 0;
  border-top: 0;
}

.regua-na-conversa__passo-titulo {
  color: var(--bc-ink);
  font-weight: 600;
}

.regua-na-conversa__texto {
  margin: 0;
  color: var(--bc-ink);
  white-space: pre-wrap;
  overflow-wrap: break-word;
}

.regua-na-conversa__rodape {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .4rem;
}

.regua-na-conversa__hora {
  font-family: var(--bc-fonte-mono);
  font-size: .68rem;
}

.regua-na-conversa__estado { font-size: .72rem; }
.regua-na-conversa__estado--lido,
.regua-na-conversa__estado--entregue { color: var(--bc-ok); }
.regua-na-conversa__estado--falhou { color: var(--bc-danger); }
.regua-na-conversa__estado--indeterminado { color: var(--bc-warn); }