/* ============================================================
   Giriş / kimlik sayfaları
   ============================================================ */

.auth-wrap {
  min-height: 100vh; display: grid; grid-template-columns: 1fr 480px;
  background: var(--bg);
}

.auth-side {
  background: linear-gradient(150deg, #052e16 0%, #065f46 45%, #0b1220 100%);
  color: #fff; padding: 56px; display: flex; flex-direction: column;
  position: relative; overflow: hidden;
}
.auth-side::after {
  content: ''; position: absolute; width: 620px; height: 620px; border-radius: 50%;
  background: radial-gradient(circle, rgba(22,163,74,.32), transparent 62%);
  right: -220px; bottom: -220px; pointer-events: none;
}
.auth-side .brand-lg {
  display: flex; align-items: center; gap: 13px; font-size: 19px; font-weight: 750; color: #fff;
}
.auth-side .brand-lg .logo {
  width: 42px; height: 42px; border-radius: 12px;
  background: rgba(255,255,255,.14); backdrop-filter: blur(6px);
  display: grid; place-items: center; border: 1px solid rgba(255,255,255,.2);
}
.auth-side .brand-lg .logo svg { width: 23px; height: 23px; }
.auth-side .pitch { margin-top: auto; position: relative; z-index: 1; max-width: 520px; }
.auth-side .pitch h2 {
  font-size: 32px; line-height: 1.2; letter-spacing: -.025em; margin-bottom: 14px; font-weight: 750;
}
.auth-side .pitch p { color: rgba(255,255,255,.78); font-size: 15px; line-height: 1.7; margin-bottom: 26px; }
.auth-side .feats { display: grid; gap: 13px; }
.auth-side .feat { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; color: rgba(255,255,255,.9); }
.auth-side .feat .ic {
  width: 30px; height: 30px; flex: 0 0 30px; border-radius: 9px; background: rgba(255,255,255,.13);
  display: grid; place-items: center; border: 1px solid rgba(255,255,255,.14);
}
.auth-side .feat .ic svg { width: 15px; height: 15px; }
.auth-side .feat b { display: block; font-weight: 650; margin-bottom: 1px; }
.auth-side .feat span { color: rgba(255,255,255,.66); font-size: 12.5px; line-height: 1.5; }
.auth-side .foot { margin-top: 40px; font-size: 12px; color: rgba(255,255,255,.45); position: relative; z-index: 1; }

.auth-main {
  display: flex; align-items: center; justify-content: center; padding: 40px 44px;
  background: var(--surface);
}
.auth-box { width: 100%; max-width: 372px; }
.auth-box .top { margin-bottom: 26px; }
.auth-box h1 { font-size: 25px; margin-bottom: 7px; letter-spacing: -.02em; }
.auth-box .sub { color: var(--ink-3); font-size: 14px; margin: 0; line-height: 1.6; }
.auth-box .mobile-brand { display: none; align-items: center; gap: 10px; margin-bottom: 26px; font-weight: 700; font-size: 16px; }
.auth-box .mobile-brand .logo {
  width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(135deg, var(--brand), #059669);
  display: grid; place-items: center;
}
.auth-box .mobile-brand .logo svg { width: 18px; height: 18px; }

.auth-box .field input { padding: 11px 13px; font-size: 15px; }
.auth-box .btn { padding: 12px 18px; font-size: 15px; }
.auth-box .links { margin-top: 20px; font-size: 13.5px; color: var(--ink-3); text-align: center; }
.auth-box .links a { font-weight: 600; }

/* Parola alanı, güç göstergesi, kod girişi ve kurtarma kodu stilleri
   app.css içine taşındı; hem giriş sayfaları hem panel aynı görünümü kullanır. */

@media (max-width: 980px) {
  .auth-wrap { grid-template-columns: 1fr; }
  .auth-side { display: none; }
  .auth-main { background: var(--bg); min-height: 100vh; }
  .auth-box { background: var(--surface); padding: 30px 26px; border-radius: var(--r-lg); box-shadow: var(--sh-2); border: 1px solid var(--line); max-width: 420px; }
  .auth-box .mobile-brand { display: flex; }
}