/* ===== DITADO POR VOZ (Conversa v2 C1) — sobre o ds-v5 =====
   O microfone segue a convenção dos chats (ChatGPT & cia): ícone SEM rótulo,
   no canto direito da caixa, colado ao botão de enviar. Mesmo diâmetro do
   `.enviar` (34px) pra dupla ficar alinhada; discreto por padrão, porque o
   caminho principal continua sendo digitar. */
/* `.composer .acoes` é `justify-content:space-between` com 3 filhos (.esq, mic,
   enviar) — sem o `margin-left:auto` o microfone para no MEIO da caixa, longe do
   enviar. O auto empurra a dupla mic+enviar junta para o canto direito. */
.voz-mic{margin-left:auto;width:34px;height:34px;min-width:34px;border-radius:50%;border:none;background:transparent;
  color:var(--mut,#6b6b6b);cursor:pointer;flex:0 0 auto;display:inline-flex;align-items:center;
  justify-content:center;padding:0;transition:background .12s ease,color .12s ease}
.voz-mic:not(.gravando):hover{background:var(--hover,#f2f1ee);color:var(--tinta,#0d0d0d)}
/* anel de foco vermelho, como o resto do site (o preto destoava só aqui) */
.voz-mic:focus-visible{outline:2px solid var(--verm,#e3120b);outline-offset:2px;border-radius:50%}
.voz-mic svg{width:19px;height:19px;display:block}
.voz-mic .voz-stop{display:none}
/* gravando: o mesmo botão vira "parar" (quadrado), em vermelho — sem inventar
   um segundo controle pro usuário procurar. */
.voz-mic.gravando{background:var(--verm,#e3120b);color:#fff}
.voz-mic.gravando:hover{background:var(--verm,#e3120b);filter:brightness(.92)}
.voz-mic.gravando .voz-on{display:none}
.voz-mic.gravando .voz-stop{display:block}
.voz-mic:disabled{opacity:.5;cursor:default}
.voz-mic:disabled:hover{background:transparent;color:var(--mut,#6b6b6b)}
/* No mobile o mic mantém os 34px do `.enviar`: aos 38px ele desalinhava a dupla
   (4px de diferença de altura) e os 4px extras empurravam as pílulas da
   esquerda pra uma segunda linha, crescendo a caixa em 27px. */
@media(max-width:700px){.voz-mic svg{width:20px;height:20px}}

/* painel de gravação (dentro da caixa do composer) */
.voz-painel{display:flex;align-items:center;gap:10px;padding:8px 2px 2px;flex-wrap:nowrap;min-width:0}
.voz-bolha{width:9px;height:9px;border-radius:50%;background:var(--verm,#e3120b);flex:0 0 auto;animation:voz-pulsa 1.2s ease infinite}
@keyframes voz-pulsa{50%{opacity:.25}}
.voz-onda{flex:1 1 auto;display:flex;align-items:center;gap:2px;height:26px;overflow:hidden;min-width:0}
.voz-onda i{flex:0 0 3px;border-radius:2px;background:var(--verm,#e3120b);height:30%;animation:voz-onda 1s ease-in-out infinite}
.voz-onda i:nth-child(2n){height:70%;animation-delay:.15s}
.voz-onda i:nth-child(3n){height:50%;animation-delay:.3s}
.voz-onda i:nth-child(5n){height:90%;animation-delay:.1s}
@keyframes voz-onda{50%{transform:scaleY(.35)}}
@media(prefers-reduced-motion:reduce){.voz-bolha,.voz-onda i{animation:none}}
.voz-tempo{font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--verm,#e3120b);flex:0 0 auto}
.voz-cancelar{background:none;border:none;font-size:12.5px;color:var(--sutil,#6e6e6e);cursor:pointer;font-family:'Inter',sans-serif;flex:0 0 auto;min-height:32px;padding:0 6px}
.voz-cancelar:hover{color:var(--tinta,#0d0d0d)}
/* Não existe um segundo botão de confirmar: quem para a gravação é o próprio
   microfone, que já está vermelho e virou quadrado. Um ✓ preto de 34px ao lado
   do enviar preto de 34px era indistinguível dele — dois círculos idênticos no
   mesmo canto, um enviando a pergunta e o outro confirmando o ditado. */
/* aviso acima do rodapé do composer */
.voz-aviso{font-size:12px;text-align:center;margin:6px 0 0;font-family:'Inter',sans-serif}
/* "Gravando" precisa ser ANUNCIADO por leitor de tela, mas não escrito: o botão
   vermelho pulsando já diz isso a quem enxerga, e a linha de texto custava 24px
   de salto no layout (empurrando o Pulso da home pra baixo). */
.voz-aviso.so-leitor{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.voz-aviso.info{color:var(--mut,#6b6b6b)}
.voz-aviso.ok{color:var(--ok,#1f7a45)}
.voz-aviso.erro{color:var(--verm-texto,#c8100a)}
[data-theme="escuro"] .voz-aviso.erro{color:#ff8480}
/* `:not(.gravando)` é obrigatório: sem ele esta regra empata em especificidade
   com `.voz-mic.gravando:hover` e vence por vir depois — o botão de gravação
   perdia o vermelho justamente com o ponteiro em cima, que é onde ele está
   logo depois do clique. Contraste caía de 5,64:1 para 1,10:1: sumia. */
[data-theme="escuro"] .voz-mic:not(.gravando):hover{background:var(--hover,#26272c)}
@media(max-width:480px){.voz-onda i:nth-child(n+14){display:none}}
/* link discreto de privacidade dentro do painel de gravação */
.voz-priv{font-size:11.5px;color:var(--sutil,#6e6e6e);text-decoration:underline;text-underline-offset:2px;
  flex:0 0 auto;font-family:'Inter',sans-serif;white-space:nowrap}
.voz-priv:hover{color:var(--tinta,#0d0d0d)}
@media(max-width:480px){.voz-priv{display:none}}
