body {
  background-color: #f7f9fb;
}

.card {
  border-radius: 1rem;
}

button {
  border-radius: 2rem;
  font-weight: 600;
}

#message {
  transition: all 0.3s ease;
}


#step-otp {
  transition: all 0.3s ease;
}

#step-otp:not(.d-none) {
  transform: scale(1.05);
}

.alert-info {
  background-color: #e9f6ff;
  border-color: #b6e0ff;
  color: #055160;
}



#languageForm {
  position: absolute;
  right: 18px;
  top: 14px;
  z-index: 20;
  display: inline;
}

#languageSelect {
  padding: 6px 10px;
  border-radius: 6px;
  border: 1px solid #d0d7de;
  background: #fff;
  font-size: 14px;
}


@media (max-width: 480px) {
  #languageForm {
    right: 8px;
    top: 8px;
  }
  #languageSelect { font-size: 13px; }
}


.visually-hidden {
  position: absolute !important;
  height: 1px; width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

.forgot-card {
  width: 90%;
  max-width: 600px; 
  border-radius: 1rem;
  background: #ffffff;
  border: 1px solid #e3e6ea;
  transition: all 0.3s ease-in-out;
}

#step-otp {
  animation: fadeIn 0.4s ease-in-out;
  align-items: center;

}

#step-otp input.form-control {
  font-size: 1.1rem;
  padding: 0.8rem 1rem;
}

.d-grid{
  align-items: center;
}

#verifyOtpBtn {
  font-size: 1.05rem;
  padding: 0.75rem;
  font-weight: 600;
  width : 50%;
  justify-content: center;
}

#verifyOTPinfo{
  justify-content: center;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: scale(0.98);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
