/* KIT D'ACCESSO DELLA FLOTTA — gli stili dei campi d'accesso (copia 1.1).
   Differenza dal kit: i colori della Plancia (--innova-*) sono sostituiti con
   quelli di wamonitor (il verde WhatsApp del marchio e il grigio di AdminLTE 3),
   come prevede S42 («l'app copia i file, cambia solo marchio e testi»). */

/* ★ PLANCIA-ACCESSO-1 — l'occhiolino dei campi password (static/js/occhiolino.js):
   il pulsante sta DENTRO il campo, a destra, 44 px di tocco; il campo lascia
   spazio al testo. Contorno di fuoco visibile da tastiera. */
.campo-occhio { position: relative; }
.campo-occhio > input { padding-right: 2.9rem; }
.occhiolino {
  position: absolute; top: 50%; right: .15rem; transform: translateY(-50%);
  width: 2.75rem; height: 2.75rem; min-height: 44px;
  display: flex; align-items: center; justify-content: center;
  border: 0; background: transparent; color: #6c757d; border-radius: .5rem;
  padding: 0; cursor: pointer; -webkit-tap-highlight-color: transparent;
  z-index: 4;
}
.occhiolino:hover { color: #343a40; }
.occhiolino:focus-visible { outline: 2px solid #25D366; outline-offset: -2px; color: #343a40; }
.occhiolino[aria-pressed="true"] { color: #343a40; }
.campo-occhio > input.form-control-sm { padding-right: 2.6rem; }
.campo-occhio > input.form-control-sm + .occhiolino { width: 2.4rem; height: 2.4rem; min-height: 0; }

/* PLANCIA-ACCESSO-STANDARD-1: il nome utente fuori vista nei moduli di cambio e
   reimpostazione. Resta RESO (1 px, non display:none) e non readonly, perché il
   portachiavi di iPhone lo riconosca come nome utente della password. */
.utente-nascosto {
  position: absolute !important; width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: -1px !important; overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important;
  opacity: 0.01; pointer-events: none;
}

/* wamonitor: l'involucro del kit va dentro la login-box di AdminLTE, che mette
   il margine sul .input-group. Senza questo, il campo con l'occhiolino perde la
   spaziatura verticale delle altre righe del modulo. */
.login-box .campo-occhio { margin-bottom: 1rem; }
.login-box .form-group .campo-occhio { margin-bottom: 0; }