/* Shared visual system for login and registration pages. */
.savtel-auth-page {
  min-height: calc(100vh - 110px);
  padding: 76px 24px 96px;
  background: radial-gradient(circle at 18% 0%, #e2f2ff 0, #f7f9fc 36%);
  color: #071a3a;
}

.savtel-auth-shell {
  width: min(1024px, 100%);
  grid-template-columns: minmax(0, 1fr) minmax(390px, 438px);
  gap: clamp(42px, 7vw, 72px);
}

.savtel-auth-intro { align-self: center; }
.savtel-auth-intro h1 { font-size: clamp(32px, 4vw, 38px); letter-spacing: -1.2px; }
.savtel-auth-intro > p { margin-bottom: 28px; line-height: 1.55; }
.savtel-auth-intro ul { gap: 13px; margin: 0 0 28px; }
.savtel-auth-intro li { display: flex; align-items: center; font-size: 14px; font-weight: 600; }
.savtel-auth-intro li::before { content: "\f00c"; flex: 0 0 18px; font-family: "Font Awesome 6 Free"; font-size: 10px; font-weight: 900; }
.savtel-auth-rating { min-height: 46px; padding: 12px 16px; }
.savtel-auth-shell > .max-w-md { max-width: none; }

.savtel-auth-shell .glass-card {
  padding: 32px;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 18px 35px rgba(26, 57, 97, .10);
}

/* Removes the old decorative icon while preserving the form and its behavior. */
.savtel-auth-shell .glass-card > .text-center:first-child > div:first-child { display: none; }
.savtel-auth-shell .glass-card > .text-center:first-child { margin-bottom: 30px; }
.savtel-auth-shell .glass-card > .text-center:first-child h1 { margin-bottom: 8px; font-size: 20px; line-height: 1.25; }
.savtel-auth-shell .glass-card > .text-center:first-child p { font-size: 14px; }

.savtel-auth-shell form > div { margin-bottom: 20px; }
.savtel-auth-shell .form-label { margin-bottom: 8px; font-size: 13px; font-weight: 700; }
.savtel-auth-shell .form-control { width: 100%; min-height: 46px; padding: 13px 15px; font-size: 14px; }
.savtel-auth-shell .form-control:focus { border-color: #3158b3; background: #fff; box-shadow: 0 0 0 3px rgba(49, 88, 179, .12); }
.savtel-auth-shell .btn-primary, .savtel-auth-shell .btn-secondary { width: 100%; min-height: 44px; justify-content: center; }
.savtel-auth-shell .btn-secondary { background: #fff; border-radius: 999px; }
.savtel-login-form .savtel-contact-options { display: none; }

/* The authentication screens follow the light reference layout, independently
   of the global theme preference used by the rest of the site. */
html:not(.light) .savtel-auth-page { background: radial-gradient(circle at 18% 0%, #e2f2ff 0, #f7f9fc 36%); color: #071a3a; }
html:not(.light) .savtel-auth-shell .glass-card, html:not(.light) .savtel-auth-rating { background: #fff; border-color: #d8e1ee; }
html:not(.light) .savtel-auth-shell .glass-card > .text-center:first-child h1, html:not(.light) .savtel-auth-shell .form-label { color: #071a3a; }
html:not(.light) .savtel-auth-shell .glass-card > .text-center:first-child p, html:not(.light) .savtel-auth-shell p { color: #617391; }
html:not(.light) .savtel-auth-shell .form-control { background: #f7f9fc; border-color: #d8e1ee; color: #071a3a !important; }

@media (max-width: 800px) {
  .savtel-auth-page { padding: 45px 16px 70px; }
  .savtel-auth-shell { grid-template-columns: 1fr; gap: 36px; }
  .savtel-auth-intro { order: 2; }
  .savtel-auth-shell > .max-w-md { order: 1; }
}