/* login-page-css */
:root{
  --primary-color:#771D1D;
  --hover-color-primary:#400202;
}
.login_wrapper {
  display: flex;
  justify-content: center;
  align-items: center; 
}

.login-card {
  display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border: 1px solid #ddd;
    border-radius: .5rem;
    padding: 4rem 2rem;
    max-width: 350px;
    min-width: 350px;
}
#mobilelogin-msg {
  font-size: 1.6rem;
  font-weight: 500;
  color: red;
  margin-bottom: 3rem;
  display: none;
}

.login_input {
  margin-top: 3rem;
  display: flex;
  flex-direction: column;
  width: 100%;
}

.login_input form {
  display: flex;
  flex-direction: column;
  margin-top: 2rem;
}

.login_input form>span {
  margin: 1rem 0;
}
.login_input form input[type=text] {
  font-size: 16px;
  width: 100%;
  height: 45px;
  border: 1px solid #ddd;
  margin-bottom: 1.6rem;
  border-radius: .4rem;
  outline: none;
}

.login_input form input[type='text'],
.login_input form input[type='number'] {
  border: 1px solid #ddd;
  padding: 1rem !important;
  border-radius: 0.25rem !important;
  margin-bottom: 1rem;
  font-size: 16px;
  height:auto !important;
  outline: none; 
  -moz-appearance: textfield;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"]:focus {
  border: 3px solid #ffb800 !important;
}

.login_input form button {
  background-color:var(--primary-color) !important ;
  color: #fff !important;
    padding: 1.6rem !important;
    font-size: 1.6rem !important;
    cursor: pointer !important;
    border-radius: .4rem !important;
    width: 100%;
}
.fixblocksocial {
  display: flex;
  justify-content: center;
}

.google {
  background-color: #efefed;
  color: #333;
  padding: 10px;
  text-decoration: none;
  border-radius: 43px;
  border: 1px solid #ddd;
  display: flex;
  justify-content: center;
  align-items: center;
}
.google img {
  margin-right: 1rem;
  width: 30px;
}

.login_anotherway {
  margin: 1rem 0 2rem 0;
  display: flex;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  gap: 15px;
}

.login_anotherway span {
  font-size: 18px;
}

.login_anotherway a {
  text-decoration: none;
}

.text-danger {
  color: red;
}

.login_input form small {
  margin-bottom: 0.25rem;
}

.otpInput {
  display: flex;
  justify-content: space-between;
  gap: 15px;
}

.otpInput input {
  width: 25px;
  text-align: center;
  font-size: 20px !important;
}

.reotp {
  margin: 1rem 0;
  text-decoration: none;
  text-align: center;
  color: var(--primary-color);
}

.resendotp {
  margin: 1rem 0;
  display: flex;
  gap: 15px;
}

.resendotp #resend {
  color: #ACACAC;
}

.resendotp .active#resend {
  color: var(--primary-color);
  cursor: pointer;
}