/* Modern split-layout login page */
.login-body {
  margin:0;
  font-family: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", Arial, sans-serif;
  background:
    radial-gradient(1100px 600px at 12% -10%, #1f3a8a 0%, transparent 60%),
    radial-gradient(900px 700px at 90% 110%, #0c4a6e 0%, transparent 55%),
    linear-gradient(180deg, #0b1224 0%, #0a0f1e 100%);
  color:#e7eef9;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:30px 24px;
}

.login-wrap {
  display:grid;
  grid-template-columns: 1.1fr 0.9fr;
  max-width: 1080px;
  width:100%;
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.08);
  border-radius:20px;
  overflow:hidden;
  box-shadow: 0 60px 140px rgba(0,0,0,0.55), 0 0 0 1px rgba(255,255,255,0.04) inset;
  backdrop-filter: blur(20px);
}
@media (max-width: 880px) {
  .login-wrap { grid-template-columns: 1fr; }
  .login-hero { padding:32px 28px 12px !important; }
  .login-panel { padding:24px 28px 32px !important; }
}

.login-hero {
  padding:46px 44px;
  background:
    radial-gradient(560px 380px at 18% 20%, rgba(93,208,255,0.18) 0%, transparent 60%),
    radial-gradient(420px 320px at 90% 88%, rgba(37,99,235,0.20) 0%, transparent 60%),
    linear-gradient(135deg, rgba(13,30,68,0.7) 0%, rgba(7,16,38,0.7) 100%);
  border-right:1px solid rgba(255,255,255,0.07);
  display:flex; flex-direction:column; justify-content:space-between;
  min-height: 540px;
}
.hero-logo { display:flex; align-items:center; gap:14px; margin-bottom:38px; }
.hero-brand { font-size:18px; font-weight:700; letter-spacing:.01em; color:#fff; }
.hero-sub { font-size:12px; color:#9bb1d4; margin-top:2px; }

.hero-title { font-size:34px; line-height:1.15; font-weight:700; margin:0 0 14px; color:#fff;
  letter-spacing:-0.01em; }
.hero-lede { color:#aebee0; max-width:430px; font-size:15px; line-height:1.55; }

.hero-bullets { list-style:none; padding:0; margin:28px 0 0; color:#cfdcf2; font-size:14px; }
.hero-bullets li { display:flex; align-items:center; gap:11px; padding:8px 0; }
.hero-dot { width:8px; height:8px; border-radius:50%; background:linear-gradient(135deg,#5dd0ff,#2563eb); flex:0 0 8px;
  box-shadow:0 0 12px rgba(93,208,255,.5); }

.hero-foot { margin-top:36px; font-size:11px; color:#6e88b2; letter-spacing:.06em; text-transform:uppercase; }

.login-panel {
  padding:46px 44px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,0.98);
  color:#1b1f29;
}
.login-card { width:100%; max-width:360px; }
.login-card h2 { margin:0 0 8px; font-size:24px; font-weight:700; color:#0f172a; letter-spacing:-0.01em; }
.login-card .muted { color:#5b6577; }
.login-card .small { font-size:13px; }
.login-form { margin-top:22px; }
.login-form label { display:block; font-size:12px; font-weight:600; color:#475067;
  text-transform:uppercase; letter-spacing:.06em; margin-bottom:8px; }
.pwd-wrap { position:relative; }
.pwd-wrap input { width:100%; padding:13px 44px 13px 14px; border:1px solid #d9dee7; border-radius:10px;
  font-size:15px; transition:border-color .15s ease, box-shadow .15s ease; background:#fff;
  font-family: inherit; box-sizing:border-box; }
.pwd-wrap input:focus { outline:none; border-color:#2563eb; box-shadow:0 0 0 4px rgba(37,99,235,.16); }
.pwd-toggle { position:absolute; right:8px; top:50%; transform:translateY(-50%); background:transparent;
  border:0; cursor:pointer; font-size:16px; padding:6px 8px; color:#6b7280; }

.login-btn { width:100%; padding:13px; margin-top:18px; font-size:15px; font-weight:600;
  background: linear-gradient(135deg, #2563eb, #1d4ed8); border-color:#1d4ed8;
  border-radius:10px;
  box-shadow:0 8px 20px rgba(37,99,235,.32); transition:transform .08s ease, box-shadow .15s ease; }
.login-btn:hover { transform:translateY(-1px); box-shadow:0 12px 24px rgba(37,99,235,.42); background:linear-gradient(135deg,#1e58dc,#173fb8); }
.login-btn:active { transform:translateY(0); }

.login-note { margin-top:22px; font-size:12px; color:#6b7280; padding:10px 12px;
  background:#f3f5fa; border-radius:8px; line-height:1.45; }
.login-note strong { color:#0f172a; }

.flash-wrap { margin:10px 0 4px; padding:0; }
.flash { padding:10px 12px; border-radius:8px; margin:6px 0; font-size:13px; }
.flash-success { background:#e7f7ec; color:#0d6a2f; border:1px solid #bfe6c9; }
.flash-error { background:#fde8e7; color:#a01810; border:1px solid #f1b5b1; }