/* NEO PAYMENT GATEWAY — halaman MASUK / DAFTAR / LUPA & RESET SANDI / VERIFIKASI 2FA merchant, bahasa visual SITUNEO (24 Okt 2026).
 * Dimuat SESUDAH gaya lama halaman (neo-publik.css lebih dulu); semua aturan berawalan body.nm supaya menimpa tanpa !important.
 * Dua kolom: foto suasana (dibuat AI, berlabel jujur di alt) + formulir terang. Hanya tampilan — logika formulir tidak disentuh. */
body.nm{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:stretch;justify-content:stretch;min-height:100vh;padding:0;overflow-x:hidden;
  background:var(--bg);color:var(--ink);font-family:var(--f-isi);font-size:1.0625rem;line-height:1.65}
body.nm.nm-satu{display:flex;align-items:center;justify-content:center;padding:2rem 1rem}
body.nm .bg-animation,body.nm .gradient-orb{display:none!important}
.nm-foto{position:sticky;top:0;height:100vh;background:var(--navy);overflow:hidden}
.nm-foto picture,.nm-foto img{display:block;width:100%;height:100%}
.nm-foto img{object-fit:cover;object-position:50% 40%}
.nm-foto-ket{position:absolute;left:24px;right:24px;bottom:24px;background:var(--navy);color:var(--on-navy);border-radius:18px;padding:22px 24px;border:1px solid rgba(244,239,227,.18)}
.nm-foto-ket .np-logo{color:#fff;margin-bottom:12px;font-size:1.125rem}
.nm-foto-ket .np-logo-mark{background:#1B2A4D}.nm-foto-ket .np-logo-tx span{color:#6FD9C8}
.nm-foto-ket p{margin:0;font:700 1.25rem/1.35 var(--f-judul);letter-spacing:-.01em}
.nm-pojok{position:fixed;top:12px;right:112px;z-index:70}
@media print{.nm-pojok{display:none}}
body.nm .login-wrapper,body.nm .register-wrapper,body.nm .forgot-container,body.nm .reset-container,body.nm .verify-container{
  position:relative;z-index:1;width:100%;max-width:520px;margin:0 auto;align-self:center;justify-self:center;padding:56px 24px 40px}
body.nm .register-wrapper{max-width:680px}
body.nm.nm-satu .login-wrapper,body.nm.nm-satu .forgot-container,body.nm.nm-satu .reset-container,body.nm.nm-satu .verify-container{padding:0}
@media (max-width:900px){
  body.nm{grid-template-columns:1fr}.nm-foto{display:none}.nm-pojok{right:106px}
  body.nm .login-wrapper,body.nm .register-wrapper{padding:72px 16px 32px}
}
/* Logo di atas kartu */
body.nm .login-logo,body.nm .register-logo,body.nm .logo{text-align:left;margin-bottom:1.5rem}
body.nm .logo{text-align:center}
body.nm .login-logo a,body.nm .register-logo a,body.nm .logo a{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
body.nm .logo-icon{width:42px;height:42px;border-radius:12px;background:var(--navy);box-shadow:none;display:grid;place-items:center}
body.nm .logo-icon svg{width:26px;height:26px}
body.nm .logo-icon svg path:nth-child(1),body.nm .logo-icon svg line{stroke:#2DD4BF}body.nm .logo-icon svg path:nth-child(2){stroke:#5EEAD4}
body.nm .logo-text{font:800 1.375rem/1 var(--f-judul);color:var(--ink);letter-spacing:-.01em}
body.nm .logo-text span{background:none;-webkit-background-clip:border-box;background-clip:border-box;-webkit-text-fill-color:currentColor;color:var(--neo);font-weight:700}
body.nm .login-subtitle,body.nm .register-subtitle{color:var(--muted);font-size:1rem;margin-top:.6rem}
body.nm .merchant-badge{background:var(--neo-bg);border:1px solid var(--line2);color:var(--neo);font:700 .75rem/1 var(--f-isi);letter-spacing:.07em;padding:.45rem .8rem;border-radius:999px;margin-top:.9rem}
/* Kartu */
body.nm .login-card,body.nm .register-card,body.nm .forgot-card,body.nm .reset-card,body.nm .verify-card{background:var(--card);backdrop-filter:none;-webkit-backdrop-filter:none;
  border:1px solid var(--line);border-radius:20px;padding:2rem;box-shadow:var(--shadow);color:var(--ink)}
@media (max-width:520px){body.nm .login-card,body.nm .register-card,body.nm .forgot-card,body.nm .reset-card,body.nm .verify-card{padding:1.4rem}}
body.nm .card-header{text-align:left;margin-bottom:1.5rem}
body.nm .card-header h1{font:800 1.75rem/1.2 var(--f-judul);color:var(--ink);letter-spacing:-.02em;margin:0 0 .4rem}
body.nm .card-header p{color:var(--muted);font-size:1rem;margin:0}
/* Pesan */
body.nm .alert{border-radius:12px;padding:.9rem 1rem;font-size:.9688rem;line-height:1.55;border:1px solid var(--line2);display:flex;gap:.7rem;align-items:flex-start;margin-bottom:1.2rem}
body.nm .alert svg{width:20px;height:20px;flex:none;margin-top:2px}
body.nm .alert-danger,body.nm .alert-error,body.nm .alert-locked{background:var(--bad-bg)!important;border-color:var(--bad)!important;color:var(--bad)!important}
body.nm .alert-success{background:var(--ok-bg)!important;border-color:var(--ok)!important;color:var(--ok)!important}
body.nm .alert-info{background:var(--neo-bg)!important;border-color:var(--neo)!important;color:var(--neo)!important}
/* Formulir */
body.nm .form-group{margin-bottom:1.15rem}
body.nm .form-label{display:block;font:600 .9375rem/1.4 var(--f-isi);color:var(--ink);margin-bottom:.45rem}
body.nm .form-label .required{color:var(--bad)}
body.nm .form-input,body.nm .form-select,body.nm .form-textarea{width:100%;min-height:50px;padding:.8rem 1rem;background:var(--bg);border:1.5px solid var(--line2);border-radius:12px;
  font:400 1rem/1.4 var(--f-isi);color:var(--ink);transition:border-color .15s,box-shadow .15s}
body.nm .input-wrapper .form-input{padding-left:2.9rem}
body.nm .form-input::placeholder,body.nm .form-textarea::placeholder{color:#6B7388}
body.nm .form-select option{background:var(--card);color:var(--ink)}
body.nm .form-input:focus,body.nm .form-select:focus,body.nm .form-textarea:focus{outline:none;border-color:var(--neo);box-shadow:0 0 0 3px rgba(10,110,101,.22);background:var(--card)}
body.nm .input-icon{color:var(--muted)}body.nm .input-icon svg{width:20px;height:20px}
body.nm .password-toggle,body.nm .toggle-password{color:var(--muted);background:transparent}
body.nm .password-toggle:hover,body.nm .toggle-password:hover{color:var(--ink)}
body.nm .form-check{font-size:.9375rem}
body.nm .checkbox-label{color:var(--muted)}
body.nm .forgot-link,body.nm .register-link a,body.nm .login-link a,body.nm .back-link a,body.nm .back-home a,body.nm .action-link{color:var(--neo);font-weight:600;text-decoration:none}
body.nm .forgot-link:hover,body.nm .back-link a:hover,body.nm .back-home a:hover,body.nm .login-link a:hover,body.nm .action-link:hover{color:var(--ink);text-decoration:underline}
body.nm .form-section{border-bottom:1px solid var(--line)}
body.nm .section-title{color:var(--neo);font:700 .8125rem/1 var(--f-isi);letter-spacing:.09em}
/* Tombol timbul */
body.nm .btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:50px;padding:.8rem 1.4rem;border-radius:12px;border:2px solid transparent;
  font:700 1rem/1.2 var(--f-isi);cursor:pointer;text-decoration:none;box-shadow:0 3px 0 rgba(11,23,54,.28);transition:transform .15s,box-shadow .15s,background-color .15s}
body.nm .btn svg{width:20px;height:20px}
body.nm .btn:hover{transform:translateY(-2px);box-shadow:0 5px 0 rgba(11,23,54,.28),0 10px 18px -8px rgba(11,23,54,.35)}
body.nm .btn:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(11,23,54,.28)}
body.nm .btn-primary{background:var(--gold);color:var(--on-gold)}body.nm .btn-primary:hover{background:var(--gold-h)}
body.nm .btn-secondary{background:transparent;color:var(--ink);border-color:var(--ink)}
body.nm .btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
@media (prefers-reduced-motion:reduce){body.nm .btn:hover,body.nm .btn:active{transform:none}}
body.nm .divider{color:var(--muted)}body.nm .divider::before,body.nm .divider::after{background:var(--line)}
body.nm .divider span{background:var(--card);color:var(--muted)}
body.nm .register-link a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border:2px solid var(--ink);border-radius:12px;color:var(--ink)}
body.nm .register-link a:hover{background:var(--bg2);text-decoration:none}
body.nm .back-home,body.nm .back-link,body.nm .login-link{text-align:center;margin-top:1.4rem}
body.nm .copyright{color:var(--muted);font-size:.875rem;text-align:center;margin-top:1.2rem}
/* Langkah daftar */
body.nm .step-circle{background:var(--bg2);color:var(--muted);border:1.5px solid var(--line2)}
body.nm .step.active .step-circle{background:var(--gold);color:var(--on-gold);border-color:var(--gold);box-shadow:none}
body.nm .step.completed .step-circle{background:var(--ok);color:#fff;border-color:var(--ok)}
body.nm .step-label{color:var(--muted)}body.nm .step.active .step-label,body.nm .step.completed .step-label{color:var(--ink)}
body.nm .step-line{background:var(--line2)}body.nm .step-line.active{background:var(--gold)}
body.nm .success-icon,body.nm .status-icon.success{background:var(--ok-bg);box-shadow:none;color:var(--ok)}
body.nm .status-icon.error{background:var(--bad-bg);box-shadow:none;color:var(--bad)}
body.nm .success-icon svg,body.nm .status-icon svg{color:inherit}
body.nm .success-card h2,body.nm .success-box h2,body.nm .status-box h2{color:var(--ink);font-family:var(--f-judul)}
body.nm .success-card p,body.nm .success-box p,body.nm .status-box p{color:var(--muted)}
body.nm .success-box .success-icon{background:var(--ok-bg);box-shadow:none}
/* OTP & captcha & lain */
body.nm .otp-input{background:var(--bg);border:2px solid var(--line2);color:var(--ink);border-radius:12px}
body.nm .otp-input:focus{border-color:var(--neo);box-shadow:0 0 0 3px rgba(10,110,101,.22)}
body.nm .otp-input.filled{border-color:var(--neo);background:var(--neo-bg)}
body.nm .email-preview,body.nm .email-display{background:var(--neo-bg);border:1px solid var(--line2);color:var(--ink);border-radius:12px}
body.nm .email-preview .label{color:var(--muted)}body.nm .email-preview .email{color:var(--neo)}
body.nm .timer,body.nm .timer-badge{color:var(--neo)}
body.nm .timer-badge{background:var(--neo-bg);border-color:var(--line2)}
body.nm .resend-link{color:var(--muted)}body.nm .resend-link button{color:var(--neo)}body.nm .resend-link button:hover{color:var(--ink)}body.nm .resend-link button:disabled{color:#6B7388}
body.nm .shield-icon{background:var(--neo-bg);box-shadow:none;color:var(--neo)}
body.nm .trust-device label{color:var(--muted)}
body.nm .captcha-box{color:var(--ink)}
body.nm .password-strength{background:var(--line)}
body.nm .strength-text{color:var(--muted)}
body.nm .ico-ok{color:var(--ok)}body.nm .ico-no{color:var(--bad)}
body.nm .login-link{color:var(--muted);font-size:.9688rem}
body.nm .alert-info svg,body.nm .alert svg{color:inherit}
body.nm .btn-admin{background:var(--gold);color:var(--on-gold);border:2px solid var(--gold)}body.nm .btn-admin:hover{background:var(--gold-h);transform:translateY(-2px);box-shadow:0 5px 0 rgba(11,23,54,.28)}
body.nm .admin-badge{display:inline-flex;align-items:center;gap:.35rem;background:var(--warn-bg);border:1px solid var(--line2);color:var(--warn);font:700 .75rem/1 var(--f-isi);letter-spacing:.07em;padding:.45rem .8rem;border-radius:999px;margin-top:.9rem}
