/* Login CSS */

.login-top-nav a { color: #2C5F77 !important; }
.login-top-nav a:hover { color: #BB2463 !important; }

.login-img img { transition: transform 0.3s ease;}
.login-img img:hover { transform: scale(1.1);}

.login-header { background-image: url(../images/loginBG.svg); background-size: cover; background-position: center; }
.login-con-info a { color: #2a2a2a !important;}

.login-form { background-color: #fff; box-shadow: 0px 2px 2px #2a2a2a; border-radius: 20px; padding: 20px; text-align: center; transition: transform 0.3s ease !important;}
.login-form:hover { transform: scale(1.05) !important;}

.login-form img { width: 15%; }
.login-form h5, h1 { background: linear-gradient(to bottom, #2C5F77, #52B0DD); background-clip:content-box; -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.login-form h5 span { font-family: "Joti One", serif !important; }

.input-labels a {color: #1100FF; padding-left: 275px;}
.input-labels a:hover { color: #C45A34 ;}

.input-field { border-radius: 50px ; border: none; background: none; padding: 10px 0px 12px !important; width: 80%; height: 44px; }
input::placeholder {color: #1A3947;}


.input-wrapper { position: relative; border-radius: 50px ; border: none; background-color: #D5DFE4; width: 410px; padding-left: 0px;}

.input-wrapper:hover { background-color: #bddeee; }
input:focus {
  outline: none;       /* Removes default blue border */
}

.input-wrapper .icon {
  position: absolute;
  top: 50%;
  left: 12px;
  right: 12px;
  transform: translateY(-50%);
  color: #1A3947;
  pointer-events: none;
}

.login-cir-div { box-shadow: 0px 1px 1px #2a2a2a; color: none !important; padding: 0px;}

.login-icons { width: auto !important; padding: 0px !important; transition: transform 0.3s ease;}
.login-icons:hover { transform: scale(1.2);}

.back-arrow { padding: 0px 580px 0px 0px !important;}



/* Success CSS */

.success-container { background-image: url(../images/successBG.svg); background-size: cover; background-position: center; border-radius: 10px;}
.success-container img { width: 20%; animation: zoomInOut 2s ease-in-out infinite; transform-origin: center;}

@keyframes zoomInOut {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1); /* smooth zoom in */
  }
  100% {
    transform: scale(1);
  }
}



/* OTP CSS */

.otp-container {
  display: flex;
  gap: 10px;
  justify-content: center;
}

.otp-input {
  width: 45px;
  height: 45px;
  border-radius: 50px !important;
  background-color: #2C5F77;
  color: #fff;
  text-align: center;
  font-size: 20px;
  border: 1px solid #ccc;
  border-radius: 6px;
}

.otp-input:focus {
  outline: none;
  border-color: #1A3947;
  box-shadow: 0 0 5px rgba(26,57,71,0.3);
}

.width-invi { width: 410px !important; color: #fff;}



/* Choose CSS */

.Choose-h6 { color: #C45A34;}
.usericon { margin-left: -24px ;}