/* ==========================================================================
   connexion.css — Page de connexion (vue/vueConnexion.php).
   Plein écran centré sur le dégradé Lazarre, carte vitrée, marque de la coque (nav.css).
   ========================================================================== */

.auth { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 32px 16px; position: relative; overflow: hidden; }
.auth::before, .auth::after { content: ''; position: absolute; border-radius: 50%; filter: blur(90px); opacity: .35; pointer-events: none; }
.auth::before { width: 520px; height: 520px; left: -160px; top: -140px; background: var(--neon-violet); }
.auth::after  { width: 460px; height: 460px; right: -140px; bottom: -160px; background: var(--neon-cyan); opacity: .22; }
[data-theme="light"] .auth::before, [data-theme="light"] .auth::after { opacity: .18; }

.auth-theme { position: absolute; top: 18px; right: 18px; }
.auth-wrap { position: relative; width: 100%; max-width: 420px; display: flex; flex-direction: column; align-items: center; gap: 18px; }
.auth-card {
    width: 100%; box-sizing: border-box; padding: 34px 32px 28px;
    background: var(--nav-side-bg); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
    border: 1px solid var(--glass-border); border-radius: 20px; box-shadow: var(--shadow-lg);
}
.auth-brand { display: flex; align-items: center; gap: 11px; margin-bottom: 24px; }
.auth-title { font-family: 'Space Grotesk', sans-serif; font-size: 1.6rem; font-weight: 700; margin: 0 0 4px; color: var(--text-primary); letter-spacing: -0.02em; }
.auth-sub { margin: 0 0 24px; font-size: .93rem; color: var(--text-muted); }
.auth-card .neon-form-group { margin-bottom: 16px; }
.auth-card .neon-toggle-btn { display: grid; place-items: center; color: var(--text-muted); }
.auth-card .neon-toggle-btn:hover { color: var(--neon-cyan); }
.auth-btn { width: 100%; margin-top: 6px; }
.auth-foot { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 18px 0 0; font-size: 12px; color: var(--text-muted); }
.auth-legal { margin: 0; font-size: 12px; color: var(--text-muted); }