body {
    padding:0;
    margin:0;
    background: url(https://plexin.ir/wp-content/plugins/plexin-amradev/src/img/LoginBackground.jpg);
    background-repeat: no-repeat;
    object-fit: cover;
    backdrop-filter: blur(2px);
    background-position: center;
    min-height:100vh !important;
}
.content-wrap {
    width:100%;
    min-height:80vh;
    display:flex;
    align-items:center;
    justify-content:center;
}
.login-wrap {
    background:rgba(255,255,255,0.6);
    backdrop-filter:blur(25px);
    --moz--backdrop-filter: blur(25px);
    --webkit--backdrop-filter:blur(25px);
    padding:8% 6%;
    display:flex;
    flex-direction:column;
    gap:30px;
    border-radius:15px;
    align-items:center;
}
p.loginHeader {
    font-weight:700;
    padding:0;
    margin:0;
}
input[type=tel].whiteInput {
    border:1px;
    border-radius:15px;
    padding:10px;
    direction: ltr;
    margin: 0;
    appearance: textfield;
    -moz-appearance: textfield;
    box-shadow:0px 0px 1px rgba(0,0,0,0.3);
}
input[type=tel].whiteInput::-webkit-outer-spin-button,
input[type=tel].whiteInput::-webkit-inner-spin-button,input[type=text]#otp::-webkit-outer-spin-button,
input[type=text]#otp::-webkit-inner-spin-button {
    -webkit-appearance: none;
}
input[type=tel].whiteInput:focus {
    outline:none;
    box-shadow:2px 2px 5px rgba(255,255,255,0.5), 4px 4px 5px #FF6F00;
}
button#sendVerify, button#otpLogin, button#otpSignup {
    background: #FF6F00;
    border: 1px;
    border-radius: 10px;
    padding: 5% 15%;
    color: #fff;
    font-weight: 600;
    box-shadow:-4px 4px rgba(0,0,0,0.7);
}
button#sendVerify:hover,button#otpLogin:hover, button#otpSignup:hover {
    box-shadow:0 0 transparent;
}
.veifyOtp {
    direction:ltr;
    display:flex;
    flex-direction:row;
    gap:10px;
    width:80%;
    justify-content:center;
    align-items:center;
}
input[type=text]#otp {
    padding: 2px;
    text-align: center;
    width: 50px;
    height: 50px;
    font-size: 1.3em;
    border: 1px;
    border-radius: 15px;
    box-shadow:0px 0px 1px rgba(0,0,0,0.3);
}
input[type="text"]#otp:focus {
    outline:none;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.5);
}
#userName {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
#userName select {
    border: 1px;
    padding: 10px;
    border-radius: 15px;
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.3);
}
#userName input[type="text"] {
    border:0;
    border-radius: 10px;
    padding: 5px 10px;
    outline: 0;
}
#userBirthday {
    display: flex;
    flex-direction: row;
    gap: 15px;
}
#userBirthday select, #userBirthday input {
    border: 1px;
    padding: 10px;
    border-radius: 15px;
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.3);
}
#userBirthday input {
    width:70px;
}