/* ═══════════════════════════════════════════
   Auth Pages — Login / Register
   ═══════════════════════════════════════════ */

.auth-card {
  width:100%; max-width:420px;
  padding:44px 40px;
  position:relative; z-index:1;
  animation:fadeInUp .5s var(--ease-spring) both;
}

.auth-header {
  text-align:center;
  margin-bottom:32px;
}

.auth-header .brand-logo {
  justify-content:center;
  margin-bottom:12px;
  font-size:1.2rem;
}

.auth-header p {
  color:var(--zinc-500);
  font-size:.875rem;
}

.auth-form {
  display:flex; flex-direction:column;
  gap:20px;
}

.input-group {
  display:flex; flex-direction:column;
  gap:7px;
}

.input-group label {
  font-size:.8125rem;
  font-weight:500;
  color:var(--zinc-400);
  letter-spacing:.01em;
}

.auth-form .btn-primary {
  margin-top:4px;
  padding:12px 20px;
  font-size:.875rem;
  font-weight:600;
  transition:all var(--t-fast);
}
.auth-form .btn-primary:hover {
  box-shadow:0 4px 20px rgba(255,255,255,.1);
}

.auth-footer {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-top:28px;
  padding-top:24px;
  border-top:1px solid var(--border-subtle);
}

.error-msg {
  padding:10px 14px;
  background:rgba(239,68,68,.08);
  border:1px solid rgba(239,68,68,.15);
  border-radius:var(--radius-sm);
  color:#f87171;
  font-size:.8125rem;
  display:none;
}

/* Password strength */
.password-strength {
  display:flex; gap:4px;
  margin-top:4px;
}
.strength-bar {
  flex:1; height:3px;
  background:var(--zinc-800);
  border-radius:var(--radius-full);
  transition:background var(--t-fast);
}
.strength-bar.weak { background:#ef4444; }
.strength-bar.medium { background:#f59e0b; }
.strength-bar.strong { background:#10b981; }

@media (max-width:480px) {
  .auth-card { padding:28px 20px; }
}