/* 로그인 페이지 전용 스타일 (다크모드 대응 — 색상은 common.css 변수 사용) */
body.login-body {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 20px;
    background:
        radial-gradient(1200px 600px at 15% -10%, rgba(65,84,241,.18), transparent 60%),
        radial-gradient(900px 500px at 110% 110%, rgba(111,123,247,.16), transparent 55%),
        var(--bg);
}
.login-theme { position: fixed; top: 18px; right: 18px; }

.login-card {
    display: flex;
    width: 760px; max-width: 100%;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: var(--shadow);
    overflow: hidden;
}

/* 좌측 히어로 */
.login-hero {
    width: 320px; flex-shrink: 0;
    padding: 44px 36px;
    color: #fff;
    background: linear-gradient(150deg, var(--primary), #2f3fd6 70%, #25309e);
    display: flex; flex-direction: column; justify-content: center; gap: 14px;
}
.login-hero-mark {
    width: 56px; height: 56px; border-radius: 14px;
    background: rgba(255,255,255,.16);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.9rem;
}
.login-hero-title { font-size: 1.85rem; font-weight: 800; letter-spacing: -.3px; color: #fff; }
.login-hero-sub { margin: 0; opacity: .85; font-size: 1.04rem; line-height: 1.6; }

/* 우측 폼 */
.login-panel { flex: 1; padding: 44px 40px; }
.login-panel .form { max-width: none; }
.login-panel .login-brand {
    font-size: 1.55rem; font-weight: 800; color: var(--heading);
    margin-bottom: 22px;
}
.login-panel .form-row { margin-bottom: 16px; }
.login-lang { text-align: center; margin-top: 18px; font-size: .92rem; color: var(--text-muted); }
.login-lang a { color: var(--primary); margin: 0 4px; font-weight: 600; }

@media (max-width: 640px) {
    .login-card { flex-direction: column; width: 380px; }
    .login-hero { width: 100%; padding: 30px 28px; flex-direction: row; align-items: center; }
    .login-hero-sub { display: none; }
    .login-hero-title { font-size: 1.5rem; }
    .login-panel { padding: 30px 26px; }
}

/* 로그인 유지/아이디 저장 옵션 */
.login-remember { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: -2px 0 14px; }
.login-remember .checkbox { display: inline-flex; align-items: center; gap: 6px; font-size: .92rem; color: var(--text-muted); cursor: pointer; }
.login-remember .checkbox input { width: 15px; height: 15px; }