/* Login page extras. Base look comes from ngms-ui.css. */
.ngms-app.ngms-center-wrap { background: transparent; border-radius: 0; }
#ngms-login .ngms-btn.ngms-btn-ghost { min-height: 40px; font-weight: 400; }
#ngms-login label { cursor: pointer; }

/* gender picker */
#ngms-login .ngms-gender { border: 0; padding: 0; margin: 0 0 16px; display: flex; gap: 10px; flex-wrap: wrap; }
#ngms-login .ngms-gender legend { padding: 0; margin-bottom: 6px; font-weight: 600; }
#ngms-login .ngms-gender-opt { flex: 1 1 120px; position: relative; margin: 0; }
#ngms-login .ngms-gender-opt input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
#ngms-login .ngms-gender-opt span { display: flex; align-items: center; justify-content: center; min-height: 44px; border: 1px solid var(--ngms-line); border-radius: 6px; font-weight: 500; transition: background-color .2s, border-color .2s, color .2s; }
#ngms-login .ngms-gender-opt input:checked + span { background: var(--ngms-primary); border-color: var(--ngms-primary); color: #fff; }
#ngms-login .ngms-gender-opt input:focus-visible + span { box-shadow: 0 0 0 3px rgba(48,77,157,.45); }

/* ===== standalone sign-in page (no site header / footer) ===== */
body.ngms-login-page { margin: 0; min-height: 100vh; min-height: 100dvh; background: #07090f; color: #eef1fb; font-family: inherit; }
.ngms-login-stage { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; padding: 28px 16px calc(28px + env(safe-area-inset-bottom)); position: relative; overflow: hidden; box-sizing: border-box; }
.ngms-login-stage::before, .ngms-login-stage::after { content: ''; position: absolute; width: 560px; height: 560px; border-radius: 50%; filter: blur(110px); opacity: .5; pointer-events: none; z-index: 0; }
.ngms-login-stage::before { top: -220px; inset-inline-end: -160px; background: #304d9d; }
.ngms-login-stage::after { bottom: -260px; inset-inline-start: -180px; background: #1c2f6e; opacity: .45; }
.ngms-login-coach .ngms-login-stage::before { background: #2f6bd8; }
.ngms-login-panel .ngms-login-stage::before { background: #5a3fd0; } .ngms-login-panel .ngms-login-stage::after { background: #2a2a7a; }
.ngms-login-stage > * { position: relative; z-index: 1; }
.ngms-login-stage .ngms-app.ngms-center-wrap { width: 100%; display: flex; justify-content: center; background: transparent; padding: 0; }
.ngms-login-stage .ngms-auth-box { width: 100%; max-width: 420px; box-sizing: border-box; padding: 36px 30px 30px; border-radius: 22px; border: 1px solid rgba(130, 160, 255, .18); background: rgba(14, 19, 38, .78); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 30px 80px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .05); text-align: center; }
.ngms-login-stage .ngms-auth-box .ngms-logo { display: block; margin: 0 auto 14px; width: 78px; height: 78px; }
.ngms-login-stage .ngms-auth-box h1 { margin: 0 0 8px; font-size: 1.45rem; font-weight: 800; }
.ngms-login-stage .ngms-sub { margin: 0 0 22px; color: #9aa6c6; line-height: 1.9; font-size: .95rem; }
.ngms-login-badge { display: inline-flex; align-items: center; margin: 0 0 10px !important; padding: 5px 16px; border-radius: 999px; background: rgba(74, 107, 220, .18); border: 1px solid rgba(120, 150, 255, .4); color: #b4c5ff; font-size: .9rem; font-weight: 700; }
.ngms-login-panel .ngms-login-badge { background: rgba(110, 85, 230, .2); border-color: rgba(160, 140, 255, .45); color: #cdc2ff; }
.ngms-login-stage .ngms-input { min-height: 52px; font-size: 1.05rem; text-align: center; letter-spacing: .04em; background: rgba(255, 255, 255, .04); }
.ngms-login-stage .ngms-btn { min-height: 52px; font-size: 1rem; font-weight: 700; }
body.ngms-login-page a.ngms-login-back { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 22px; border-radius: 999px; border: 1px solid rgba(130, 160, 255, .22); background: rgba(255, 255, 255, .03); color: #b4c5ff; font-size: .9rem; font-weight: 500; text-decoration: none; transition: background-color .25s, border-color .25s, transform .25s; }
body.ngms-login-page a.ngms-login-back svg { transition: transform .25s; }
body.ngms-login-page a.ngms-login-back:hover, body.ngms-login-page a.ngms-login-back:focus-visible { background: rgba(74, 107, 220, .22); border-color: rgba(150, 175, 255, .55); color: #fff; outline: 0; }
body.ngms-login-page a.ngms-login-back:hover svg { transform: translateX(3px); }
.ngms-login-credit { margin: 6px 0 0; font-size: .78rem; color: #5f6b8c; letter-spacing: .01em; }
.ngms-login-credit a { color: #8a9bd6; text-decoration: none; font-weight: 600; border-bottom: 1px dashed rgba(138, 155, 214, .45); padding-bottom: 1px; transition: color .2s, border-color .2s; }
.ngms-login-credit a:hover, .ngms-login-credit a:focus-visible { color: #fff; border-color: #fff; outline: 0; }
@media (prefers-reduced-motion: reduce) { body.ngms-login-page a.ngms-login-back, body.ngms-login-page a.ngms-login-back svg { transition: none; } }
@media (max-width: 480px) { .ngms-login-stage .ngms-auth-box { padding: 30px 20px 24px; border-radius: 18px; } }
