/* =====================================================================================================================
   Client portal sign-in page on phones and small tablets. Desktop is untouched (everything is inside a media query).
   - 16px fields (iOS zooms the page on anything smaller) and fingertip-sized controls
   - the password eye, "Forgot password?" and "Back to Gringotts" get a bigger touch area without changing how they look
   ===================================================================================================================== */

@media (max-width: 768px), (pointer: coarse) {
  .form-input { font-size: 16px; }
}

@media (max-width: 768px) {
  .form-input { min-height: 46px; }
  .password-field .form-input { padding-right: 50px; }
  .eye-btn { right: 3px; padding: 11px; }
  .forgot-password { display: inline-block; padding: 12px 0 12px 14px; margin: -12px 0; font-size: 14px; }
  .badge-link { padding: 12px 0 12px 14px; margin: -12px 0; }
  .btn-login { min-height: 48px; }
  .chip-btn { min-height: 40px; padding: 6px 12px; }
}

@supports (min-height: 100dvh) {
  body, .login-wrapper { min-height: 100dvh; }
}