/* ── Ecranele de autentificare, 1:1 cu staging-nodejs (task #3543) ──────────────────────────
 *
 * Sursa: src/app/(auth)/AuthShell.tsx + login/page.tsx de pe staging-nodejs. Ecranele de acolo
 * sunt mereu pe fond inchis (nu au varianta alba), deci si aici.
 * Folosit de: login_form.php, login_2fa.php, forgot_password.php, reset_password.php,
 * register_form.php. Fluxul, campurile si scripturile ecranelor raman cele din laravel.
 */

:root{--auth-accent:#5fe0d6;--auth-accent-hover:#7cebe2}
/* #3936 U5: Archivo servit local (regula 0006) */
@font-face{font-family:'Archivo';font-style:normal;font-weight:300 700;font-stretch:100%;font-display:swap;src:url(/fonts/archivo/archivo-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:300 700;font-stretch:100%;font-display:swap;src:url(/fonts/archivo/archivo-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{margin:0;min-height:100vh;background:#0a0a0a;color:#fff;font-family:'Archivo',-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;line-height:1.5;position:relative;overflow-x:hidden}

/* #3935 U4: aura si grila de fundal scoase (0039); fundalul ramane plat */

.auth-page{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 16px}

/* Sigla deasupra cardului */
.auth-brand{margin-bottom:40px;display:flex;flex-direction:column;align-items:center;gap:12px;text-decoration:none}
.auth-brand img{height:48px;width:auto;max-width:220px;object-fit:contain;user-select:none;-webkit-user-drag:none}
.auth-brand img.mono{filter:brightness(0) invert(1)}
.auth-brand-tag{font-size:11px;color:#94a3b8;text-transform:uppercase;letter-spacing:.25em}

.auth-wrap{width:100%;max-width:448px}

/* Cardul: antet (titlu + subtitlu), corp, subsol optional */
.auth-card{background:#141414;border:1px solid #1e293b;border-radius:16px;box-shadow:0 25px 50px -12px rgba(0,0,0,.4);overflow:hidden}
.auth-head{padding:24px 28px;border-bottom:1px solid #1e293b}
.auth-title{margin:0;font-size:20px;line-height:28px;font-weight:700;color:#fff}
.auth-sub{margin:4px 0 0;font-size:14px;line-height:20px;color:#94a3b8}
.auth-body{padding:24px 28px}
.auth-foot{padding:16px 28px;background:rgba(255,255,255,.06);border-top:1px solid #1e293b;text-align:center;font-size:12px;color:#64748b}
.auth-foot a{color:var(--auth-accent);text-decoration:none;font-weight:500}
.auth-foot a:hover{color:#00e0b0}
.auth-company{margin:24px 0 0;text-align:center;font-size:11px;color:#475569}
.auth-help{margin-top:16px;text-align:center}
.auth-help a{font-size:12px;color:#64748b;text-decoration:none}
.auth-help a:hover{color:#cbd5e1}

/* Mesaje */
.auth-alert{margin-bottom:20px;display:flex;align-items:flex-start;gap:8px;border-radius:8px;padding:10px 12px;font-size:14px;line-height:20px}
.auth-alert .bi{margin-top:2px}
.auth-alert-err{border:1px solid rgba(239,68,68,.3);background:rgba(239,68,68,.05);color:#fca5a5}
.auth-alert-err .bi{color:#f87171}
.auth-alert-ok{border:1px solid rgba(34,197,94,.3);background:rgba(34,197,94,.05);color:#86efac}
.auth-alert-ok .bi{color:#4ade80}

/* Campuri */
.auth-field{margin-bottom:16px}
.auth-lbl-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.auth-lbl{display:block;margin-bottom:6px;font-size:12px;font-weight:600;color:#cbd5e1}
.auth-lbl-row .auth-lbl{margin-bottom:0}
.auth-ic{position:relative}
.auth-ic > .bi{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#64748b;pointer-events:none}
.auth-input{width:100%;padding:10px 12px;background:#0a0a0a;border:1px solid #1e293b;border-radius:8px;font-family:inherit;font-size:14px;line-height:20px;color:#fff;outline:none;transition:border-color .15s}
.auth-ic .auth-input{padding-left:40px}
.auth-input::placeholder{color:#475569}
.auth-input:hover{border-color:#334155}
.auth-input:focus{border-color:var(--auth-accent)}
.auth-hint{margin-top:4px;font-size:12px;color:#64748b}
.auth-row{display:flex;gap:12px}
.auth-row .auth-field{flex:1;min-width:0}

/* Butonul principal: turcoaz cu text negru */
.auth-btn{position:relative;width:100%;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border:none;border-radius:8px;background:var(--auth-accent);color:#000;font-family:inherit;font-size:14px;line-height:20px;font-weight:600;cursor:pointer;transition:background .15s}
.auth-btn:hover{background:var(--auth-accent-hover)}
.auth-btn:active{background:var(--auth-accent-hover)}
.auth-btn:disabled{opacity:.5;cursor:not-allowed}
.auth-btn-spinner{width:14px;height:14px;border:2px solid rgba(0,0,0,.25);border-top-color:#000;border-radius:50%;animation:auth-spin .7s linear infinite;display:none}
.auth-btn.is-loading .auth-btn-spinner{display:block}
@keyframes auth-spin{to{transform:rotate(360deg)}}

/* Legaturi mici */
.auth-link{font-size:12px;font-weight:500;color:var(--auth-accent);text-decoration:none}
.auth-link:hover{color:#00e0b0}
.auth-note{margin:12px 0 0;text-align:center;font-size:12px;line-height:18px;color:#64748b}
.auth-note .auth-link{font-size:12px}

/* Despartitor „sau cu ..." */
.auth-divider{display:flex;align-items:center;gap:12px;margin:20px 0}
.auth-divider::before,.auth-divider::after{content:'';flex:1;height:1px;background:#1e293b}
.auth-divider span{font-size:10px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.1em}
.auth-social .g_id_signin{display:flex;justify-content:center}
.auth-social .g_id_signin > div{width:100%!important}

/* Pasii ecranului de login (email -> parola / cont nou) */
.step{display:none}
.step.active{display:block}
.auth-back{display:inline-flex;align-items:center;gap:6px;margin:0 0 12px -6px;padding:4px 6px;border:none;background:none;border-radius:6px;font-family:inherit;font-size:12px;font-weight:500;color:#94a3b8;cursor:pointer}
.auth-back:hover{color:#fff;background:rgba(255,255,255,.04)}
.auth-email-display{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:16px;padding:6px 8px 6px 12px;background:#0a0a0a;border:1px solid #1e293b;border-radius:8px}
.auth-email-input{flex:1;min-width:0;border:none;background:transparent;padding:4px 0;font-family:inherit;font-size:14px;color:#fff;outline:none;text-overflow:ellipsis}
.auth-email-edit{flex:none;padding:4px 8px;border:none;background:none;border-radius:6px;font-family:inherit;font-size:12px;font-weight:500;color:var(--auth-accent);cursor:pointer}
.auth-email-edit:hover{color:var(--auth-accent-hover);background:rgba(255,255,255,.06)}
.auth-input.shake{animation:auth-shake .35s ease;border-color:#f87171!important}
@keyframes auth-shake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-4px)}40%,80%{transform:translateX(4px)}}

/* Beneficiile de sub pasul 1 (magazin) */
.auth-benefits{display:flex;gap:6px;margin-top:20px;padding-top:16px;border-top:1px solid #1e293b}
.auth-benefit{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:8px 4px}
.auth-benefit-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.04);color:#94a3b8}
.auth-benefit-icon svg{width:16px;height:16px}
.auth-benefit-text{font-size:11px;line-height:1.35;color:#94a3b8}

/* 2FA: codul de 6 cifre */
.auth-code{width:100%;padding:12px;background:#0a0a0a;border:1px solid #1e293b;border-radius:8px;font-family:inherit;font-size:28px;font-weight:700;letter-spacing:.4em;text-align:center;color:#fff;outline:none;transition:border-color .15s}
.auth-code::placeholder{color:#334155}
.auth-code:hover{border-color:#334155}
.auth-code:focus{border-color:var(--auth-accent)}
.auth-timer{margin:10px 0 16px;text-align:center;font-size:12px;color:#94a3b8}
.auth-timer strong{color:var(--auth-accent)}

@media (max-width:480px){
  .auth-head,.auth-body{padding-left:20px;padding-right:20px}
  .auth-foot{padding-left:20px;padding-right:20px}
  .auth-brand{margin-bottom:28px}
  .auth-row{flex-direction:column;gap:0}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* DCL-3576: Tine-ma minte */
.auth-remember{display:flex;align-items:center;gap:10px;margin:2px 0 16px;font-size:13px;color:#cbd5e1;cursor:pointer;user-select:none}
.auth-remember input{width:18px;height:18px;margin:0;accent-color:var(--auth-accent);flex:none}
[data-theme=light] .auth-remember{color:#334155}