/* ==========================================================================
   css/operacao.css — estilos que dependem de markup novo em
   js/pages/operacao.js (auditoria visual Apple, 2026-09-24).

   Só o que o template novo precisa: o resto (cores de componente, contraste,
   raio) mora na foundation.css. Seletores levam o id da página pra valer
   independente da ordem de carga em relação à foundation.css.
   Tokens: todos de foundation.css (--muted, --accent-data, --fill-track…).
   ========================================================================== */

/* ── Fila de Decisão (F2) ───────────────────────────────────────────────────
   "R$ 15k em jogo" era um chip azul colado num botão: parecia clicável.
   Vira texto na linha do h2 — contexto do número, não controle. */
#page-decisoes .fila-headline { flex-wrap: wrap; row-gap: 8px; }
#page-decisoes .fila-headline-money {
  color: var(--muted);
  font-weight: var(--fw-regular, 400);
  font-variant-numeric: tabular-nums;
  white-space: nowrap; /* no 375 quebra como bloco, não "em jogo" sozinho */
}

/* ── Conteúdo (C2) ──────────────────────────────────────────────────────────
   Desktop: stepper de 6 itens como sempre; o resumo compacto fica oculto. */
#page-conteudo .conteudo-bc-compact { display: none; }

/* Etapa bloqueada não é botão: sem mãozinha nem "proibido" — é só o mapa. */
#page-conteudo .conteudo-bc-item.is-blocked { cursor: default; }

/* ≤760px: 6 números soltos (45×34, a 6ª quebrava de linha) viram
   "Etapa 1 de 6 · Causa" + trilho de 6 segmentos. Navegar entre etapas
   fica com a barra de baixo (Voltar/Avançar), que tem alvo de toque cheio. */
@media (max-width: 760px) {
  #page-conteudo .conteudo-breadcrumbs > .conteudo-bc-item,
  #page-conteudo .conteudo-breadcrumbs > .conteudo-bc-sep { display: none; }
  #page-conteudo .conteudo-bc-compact {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
  }
  #page-conteudo .conteudo-bc-compact-label {
    font-size: var(--fs-foot, 13px);
    font-weight: var(--fw-semibold, 600);
    color: var(--text);
    font-variant-numeric: tabular-nums;
  }
  #page-conteudo .conteudo-bc-rail {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 4px;
  }
  #page-conteudo .conteudo-bc-seg {
    height: 4px;
    border-radius: 2px;
    background: var(--fill-track);
  }
  /* feitas em cinza, atual no azul de dado: o olho acha "onde estou" */
  #page-conteudo .conteudo-bc-seg.is-done { background: var(--muted); }
  #page-conteudo .conteudo-bc-seg.is-current { background: var(--accent-data); }
}

/* ── Feedback (FB1 + FB2) ───────────────────────────────────────────────────
   Instrução e "Concluído quando" saíram dos cards: aparecem uma vez,
   logo abaixo do cabeçalho do tema. */
#page-feedback .fb-theme-guide {
  display: grid;
  gap: 8px;
  padding: 14px 18px 0;
}
#page-feedback .fb-theme-guide .fb-action-block,
#page-feedback .fb-theme-guide .fb-done { margin: 0; }

/* Ícone linear de categoria (substitui o emoji): cor de apoio, não de status. */
#page-feedback .fb-theme-icon {
  display: inline-flex;
  align-items: center;
  color: var(--muted);
  font-size: inherit;
}
#page-feedback .fb-theme-icon svg { width: 20px; height: 20px; flex: none; }

/* ── Cognição (CG1) ─────────────────────────────────────────────────────────
   Motor fora do ar: contagem desconhecida é "—" neutro, nunca 0 colorido. */
#page-aprendizado .learning-stat-box.is-unknown .learning-stat-num { color: var(--muted); }
#page-aprendizado .cognition-retry { margin-top: 12px; }

/* ── Auditoria de fontes (AU1) ──────────────────────────────────────────────
   Status mora só no pill. Sem detalhe do backend + status ≠ ok não é
   "saudável": sai do verde pro neutro. */
#page-auditoria .audit-clean.is-nodetail {
  color: var(--muted);
  background: var(--fill-quiet);
  border-left-color: var(--separator);
}
#page-auditoria .audit-header [data-audit-retry] { margin-top: 4px; }
