/* badges.css — Tier Badge e Status Badge (§3.5). Nunca intercambiáveis. */

/* Tier Badge (comercial) — só plano superior; ausência é o indicador do plano base */
.demo-tier {
  font-family: var(--ff-mono); font-size: 10px; font-weight: 500;
  text-transform: uppercase; letter-spacing: .08em; padding: 5px 10px;
  background: var(--accent); color: #fff; display: inline-block;
  border-radius: var(--radius);
}

/* Status Badge (semântico) — estados de prazo/retorno (princípio 07).
   Outline na cor semântica; só o crítico é sólido — único alarme da interface. */
.status {
  font-family: var(--ff-mono); font-size: 10px; font-weight: 500;
  text-transform: uppercase; letter-spacing: .06em;
  padding: 4px 10px; display: inline-block;
  border-radius: var(--radius); border: 1px solid; background: var(--bg);
}
.status.ok     { color: var(--ok);     border-color: var(--ok); }
.status.warn   { color: var(--warn);   border-color: var(--warn); }
.status.danger { color: #fff; border-color: var(--danger); background: var(--danger); }
.status.neutral{ color: var(--fg-dim); border-color: var(--line-2); }