/* ooptIA · acesso (A10): entrar, segunda etapa, PIN e esqueci a senha. Só tokens. */

.ac-h { font: var(--tipoTituloJanela); letter-spacing: var(--letraTitulo); margin-bottom: var(--e4); }
.ac-sub { color: var(--textoSuave); margin-bottom: var(--e20); }
.ac-form { display: flex; flex-direction: column; gap: var(--e14); }
.ac-form .fld input { min-height: 46px; font-size: 15px; }
.ac-links { display: flex; justify-content: space-between; gap: var(--e12); flex-wrap: wrap; margin-top: var(--e16); font: var(--tipoCorpo); }
.ac-links a { color: var(--primariaTexto); font-weight: 600; text-decoration: none; }
.ac-links a:hover { text-decoration: underline; }
.ac-links form { margin: 0; }
.ac-links button { font: inherit; font-weight: 600; color: var(--primariaTexto); background: none; border: 0; padding: 0; cursor: pointer; }
.ac-links button:hover { text-decoration: underline; }
.ac-check { display: flex; align-items: center; gap: var(--e8); font: var(--tipoCorpo); color: var(--texto); }

.ac-msg { border-radius: var(--r10); padding: var(--e10) var(--e12); font: var(--tipoMensagem); margin-bottom: var(--e14); }
.ac-msg.erro { background: var(--erroSuave); color: var(--erroTexto); }
.ac-msg.ok { background: var(--sucessoSuave); color: var(--sucessoTexto); }
.ac-msg.dev { background: var(--atencaoSuave); color: var(--atencaoTexto); }

/* lista de usuários do aparelho (troca rápida por PIN) */
.ac-users { list-style: none; margin: 0 0 var(--e16); padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: var(--e10); }
.ac-user {
    display: flex; flex-direction: column; align-items: center; gap: var(--e6);
    padding: var(--e14) var(--e8); border: var(--bordaPadrao); border-radius: var(--r14);
    background: var(--superficie); color: var(--texto); text-decoration: none; text-align: center;
}
.ac-user:hover, .ac-user:focus-visible { border-color: var(--primaria); }
.ac-user .av { width: 44px; height: 44px; font-size: 15px; }
.ac-user b { font: var(--tipoLinhaTitulo); }
.ac-user small { font: var(--tipoLegenda); color: var(--textoSuave); }
.ac-user[aria-disabled="true"] { opacity: .55; pointer-events: none; }

/* escolha da assinatura (RN-ACE-024): uma linha por ótica, a linha inteira é o botão */
.ac-contas { list-style: none; margin: 0 0 var(--e16); padding: 0; display: flex; flex-direction: column; gap: var(--e10); }
.ac-contas form { margin: 0; }
.ac-conta {
    display: flex; align-items: center; gap: var(--e12); width: 100%; min-height: 64px;
    padding: var(--e12) var(--e14); border: var(--bordaPadrao); border-radius: var(--r14);
    background: var(--superficie); color: var(--texto); text-align: left; cursor: pointer; font: inherit;
}
.ac-conta:hover, .ac-conta:focus-visible { border-color: var(--primaria); }
.ac-conta.on { border-color: var(--primaria); background: var(--primariaSuave); }
.ac-conta > oo-icon { flex: none; color: var(--primariaTexto); }
.ac-conta-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ac-conta-t b { font: var(--tipoLinhaTitulo); overflow-wrap: anywhere; }
.ac-conta-t small { font: var(--tipoLegenda); color: var(--textoSuave); }
.ac-conta oo-etiqueta { flex: none; }

/* teclado de PIN */
.ac-pin-who { display: flex; align-items: center; gap: var(--e12); margin-bottom: var(--e16); }
.ac-pin-who .av { width: 44px; height: 44px; font-size: 15px; }
.ac-dots { display: flex; justify-content: center; gap: var(--e14); margin: var(--e8) 0 var(--e16); }
.ac-dots i { width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--bordaForte); }
.ac-dots i.on { background: var(--primaria); border-color: var(--primaria); }
.ac-pad { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--e10); max-width: 300px; margin: 0 auto; }
.ac-pad button {
    height: 58px; border-radius: var(--r14); border: var(--bordaPadrao); background: var(--superficie);
    font: var(--tipoNumero); color: var(--texto); cursor: pointer;
}
.ac-pad button:active { background: var(--primariaSuave); }
.ac-pad .vazio { visibility: hidden; }
.ac-pin-input { letter-spacing: .5em; text-align: center; }
/* Com JavaScript, o teclado substitui o campo; sem ele, o campo funciona sozinho. */
.js .ac-pin-input-wrap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.ac-pad, .ac-dots { display: none; }
.js .ac-pad { display: grid; }
.js .ac-dots { display: flex; }
