/* ==========================================================================
   Seiva · Campo de senha e o recado de senha esquecida (P0-7, 2026-09-03)
   --------------------------------------------------------------------------
   Folha própria, e não o style.css, porque vale nas TRÊS telas com senha
   (entrar, primeiro acesso, trocar a senha) e anda junto do seiva-senha.js.
   Carregada por ÚLTIMO no base.html: usa os tokens var(--nt-*) e precisa da
   palavra final sobre a margem do input.
   ========================================================================== */

/* --- A caixa e o olho -------------------------------------------------- */
/* .campo-senha é o berço do botão. BLOCO, nunca inline: caixa em elemento
   inline corta o conteúdo (lição de 2026-08-29, `.dica` na orientação de
   SR). Como o input vira `display:block` aqui dentro, a margem que o
   separava do rótulo passa para a caixa — senão sobra a folga do baseline
   do inline-block e o olho fica torto no campo. */
.campo-senha { position: relative; display: block; margin-top: 6px; }
.campo-senha input { display: block; margin-top: 0; }
.entrar-campos .campo-senha { margin-top: 7px; }

/* O botão só existe quando o JavaScript está de pé: o seiva-senha.js marca
   a caixa com `com-olho`. Sem JS ninguém vê um olho que não funciona, e o
   campo não fica com um vão reservado à toa. */
.campo-senha .ver-senha { display: none; }
.campo-senha.com-olho input { padding-right: 48px; }
.campo-senha.com-olho .ver-senha {
  position: absolute; top: 0; right: 0; bottom: 0;
  /* alvo de toque de 44 x 40 px no mínimo — dedo no tablet do posto */
  width: 44px; min-height: 40px; padding: 0;
  display: flex; align-items: center; justify-content: center;
  background: none; border: 0; border-radius: 0 11px 11px 0;
  box-shadow: none; filter: none; transform: none;
  color: var(--nt-muted); cursor: pointer;
}
.campo-senha.com-olho .ver-senha:hover {
  background: none; color: var(--nt-brand-text);
}
/* Foco visível: o Tab passa pelo campo e depois pelo olho. */
.campo-senha.com-olho .ver-senha:focus-visible {
  outline: 2px solid var(--nt-brand); outline-offset: -3px;
  border-radius: 10px; color: var(--nt-brand-text);
}

/* Um ícone de cada vez: olho aberto = senha escondida (clique para ver);
   olho cortado = senha à mostra (clique para esconder). */
.campo-senha .ver-senha .olho-fechado { display: none; }
.campo-senha .ver-senha.mostrando .olho-aberto { display: none; }
.campo-senha .ver-senha.mostrando .olho-fechado { display: block; }

/* --- "Esqueceu a senha?" ----------------------------------------------- */
/* Não há recuperação por e-mail, e é de propósito: quem devolve o acesso é
   o administrador, pela tela de Usuários. O que faltava era DIZER isso —
   sem o recado, quem esquece tenta até bater no bloqueio por tentativas.
   Mesmo tamanho e mesmo token de cor da linha "Na nuvem; só o caso
   anonimizado vai para a IA", logo acima. */
.entrar-esqueci {
  margin: 10px 0 0; text-align: center;
  font: 500 12px 'Hanken Grotesk', system-ui, sans-serif;
  color: var(--nt-muted);
}