/* Match Sign In logo sizing */
.auth-page .centered-logo {
  width: clamp(96px, 18vw, 140px);
  height: auto;
}

/* Give the outer card the same rounded look and enable container queries */
.auth-card {
  border-radius: 2rem;
  overflow: hidden;
  container-type: inline-size;   /* enables container queries below */
  container-name: auth;
}

/* Inherit rounding inside the card body */
.auth-card .card-body {
  border-radius: inherit;
}

/* Page layout helpers (same feel as Sign In) */
.auth-page {
  padding-block: 1.25rem;
}
@media (min-height: 640px) {
  .auth-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
  }
}

/* --- Container query-driven refinements (match sign-in.css) --- */
@container auth (max-width: 360px) {
  .auth-card .card-body { padding: 1rem 1.25rem; }
  .auth-card .form-control { font-size: 0.95rem; }
  .auth-card .btn { padding-block: .7rem; }
}

@container auth (min-width: 420px) {
  .auth-card .card-body { padding: 1.5rem 1.75rem; }
}

@container auth (min-width: 560px) {
  .auth-card .card-body { padding: 2rem 2.25rem; }
  .auth-card .card-title,
  .auth-card .h4,
  .auth-card h1 { font-size: 1.35rem; }
}

/* Keep controls comfy on phones, tidy on large screens */
@media (min-width: 992px) {
  .auth-card .form-control {
    font-size: 1rem;
    padding-top: .6rem;
    padding-bottom: .6rem;
  }
}

/* Optional: make the “Sign up / Log in” CTA buttons consistent */
.auth-card .btn-outline-primary.btn-sm.w-100 {
  padding-block: .6rem;
  border-radius: .75rem;
}