/* Pagina di accesso */
.login-body{overflow:auto;display:grid;place-items:center;min-height:100vh;padding:24px}
.login{width:380px;max-width:100%;background:var(--panel);border-radius:26px;padding:36px 34px;box-shadow:var(--shadow);text-align:center}
.login-logo{width:96px;height:96px;margin-bottom:10px}
.login h1{font-size:24px;font-weight:800}
.login form{margin-top:22px;text-align:left}
.login .btn{margin-top:18px}
.login-errore{background:var(--red-soft);color:var(--red-ink);font-weight:700;font-size:13px;padding:10px 12px;border-radius:12px;margin-bottom:12px}
.login-hint{margin-top:18px;line-height:1.6}
.login-hint code{font-family:ui-monospace,Menlo,monospace;background:var(--soft);padding:1px 5px;border-radius:5px}

/* recupero password + abbonamento */
.login-links{margin-top:12px;text-align:center;font-size:12.5px}
.login-links a{color:var(--accent);font-weight:700;text-decoration:none}
.login-links a:hover{text-decoration:underline}
.login-scelta{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:10px;cursor:pointer;transition:border-color .15s}
.login-scelta:hover{border-color:var(--accent)}
.login-scelta:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.login-scelta span{display:flex;flex-direction:column}
.login-scelta small{color:var(--ink-3);font-size:11.5px}
.login-avviso{background:var(--mint-soft,#E2F5EE);color:var(--mint-ink,#1F7A5C);border-radius:10px;padding:10px 12px;font-size:12.5px;margin-bottom:12px;line-height:1.5}
.login-blocco{border:1.5px solid var(--amber);background:var(--amber-soft);border-radius:14px;padding:16px;font-size:13px;line-height:1.6;margin-top:6px}
.login-blocco b{display:block;margin-bottom:6px}
.login-blocco .btn{margin-top:10px}
.login-hint a{color:inherit;text-decoration:none;font-weight:600}
.login-hint a:hover{text-decoration:underline}


/* myStore Dipendenti/PWA: correzione esclusiva del login mobile.
   La card non può mai superare il viewport orizzontale. */
.login-body.mio-login{width:100%;max-width:100vw;min-height:100dvh;padding:24px 18px;overflow-x:hidden}
.login-body.mio-login .login{width:100%;max-width:380px;min-width:0;margin:0 auto;padding:32px 24px}
.login-body.mio-login .login form,.login-body.mio-login .field,.login-body.mio-login .input,.login-body.mio-login .btn{min-width:0;max-width:100%}
.login-body.mio-login .input{font-size:16px}
@media(max-width:380px){.login-body.mio-login{padding-left:14px;padding-right:14px}.login-body.mio-login .login{padding-left:20px;padding-right:20px;border-radius:22px}}

/* myStore Terminal: sul PDA la card bianca lascia esattamente 30px per lato.
   Nessuna modifica verticale rispetto al login standard. */
.login-body.terminal-login{padding:24px 30px;overflow-x:hidden}
.login-body.terminal-login .login{
  width:100%;
  max-width:none;
  padding:36px 34px;
  box-shadow:none;
  border-left:0!important;
  outline:0;
}

/* Password resta il login principale; NFC è una seconda via compatta, non un tab. */
.login-or{display:flex;align-items:center;gap:10px;margin:10px 0 10px;color:var(--ink-3);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.login-or:before,.login-or:after{content:'';height:1px;background:var(--line);flex:1}
.login-nfc-quick{min-height:52px;border:1.5px solid var(--line);border-radius:15px;background:var(--soft);display:flex;align-items:center;gap:11px;padding:8px 11px;text-align:left}
.login-nfc-quick-icon{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;flex:none;background:var(--accent-soft);color:var(--accent);font-size:15px}
.login-nfc-quick b{font:800 12.5px var(--display);color:var(--ink)}
.login-nfc-quick.is-reading{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}

/* Toast dedicati al login Terminal: gli esiti NFC non spostano mai il layout. */
.login-toast-wrap{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:300;width:min(390px,calc(100vw - 28px));display:flex;flex-direction:column;gap:7px;pointer-events:none}
.login-toast{padding:11px 13px;border-radius:14px;background:var(--ink);color:var(--panel);display:flex;align-items:center;gap:9px;font-size:11px;font-weight:750;box-shadow:var(--shadow);animation:loginToastIn .28s var(--spring)}
.login-toast.success i{color:var(--mint)}.login-toast.error i{color:var(--red)}.login-toast.warn i{color:var(--amber)}.login-toast.info i{color:var(--sky)}
@keyframes loginToastIn{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}