/* ===========================================================================
   Busca inteligente — a linha "Você quis dizer…"
   Vai junto com busca.js. Segue a regra do app para o tio e a tia (README do
   projeto, 3ª mensagem): letra de 20 px para cima, botão de 56 px, nada de cinza
   fraco. Usa os tokens do módulo visual (--r-…); se o app ainda estiver no estilo
   antigo, cai nas variáveis dele (--texto, --cor-marca…), e por último no valor fixo.
   =========================================================================== */

.sugestoes{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;
  margin:6px 0 14px;
  font-size:calc(20px * var(--r-escala, 1));
  line-height:1.3;
  color:var(--r-tinta, var(--texto, #21170F));
}
.sugestoes[hidden]{display:none}
.sugestoes-rotulo{font-weight:700}
.sugestao{
  min-height:56px;min-width:56px;max-width:100%;
  padding:6px 22px;
  background:var(--r-papel, var(--fundo-2, #FFFFFF));
  border:3px solid var(--r-couro, var(--cor-marca, #5C3214));
  border-radius:999px;
  color:var(--r-tinta, var(--texto, #21170F));
  font:inherit;
  font-family:var(--r-fonte-texto, inherit);
  font-size:calc(22px * var(--r-escala, 1));
  font-weight:700;
  line-height:1.2;
  overflow-wrap:anywhere;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.sugestao:active{
  background:var(--r-couro, var(--cor-marca, #5C3214));
  color:var(--r-couro-texto, #FFF6E6);
}
.sugestao:focus-visible{
  outline:4px solid var(--r-foco, var(--texto, #1B1209));
  outline-offset:3px;
}
