.otp-text{
    font-family: Montserrat;
    font-size: 12px;
    position: absolute;
    top: 129%;
}
.TnC-block{
display: flex;
align-items: center;
gap: 7px;
margin: 10px 0px;
transition: all 0.3s ease;
.TnC-text{
    font-size: 14px;
}
.TnC-checkbox{
    width: 25px;
    height: 25px;
    margin-top: 2px;
}
}
.mobile-input-wrapper {
display: flex;
gap: 10px;
position: relative;
}

.send-otp-btn {
background: none;
color: #007bff;
border: none;    
cursor: pointer;
font-size: 14px;
width: 32%;
}

.send-otp-btn:disabled {
background: #ccc;
cursor: not-allowed;
}

.otp-modal {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.7);
z-index: 1000;
justify-content: center;
align-items: center;
color: black;
font-family: 'BR4-Extrabold';
}

.otp-modal-content {
background: white;
padding: 30px;
border-radius: 10px;
text-align: center;
width: 500px;
}

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

.otp-input {
width: 50px;
height: 50px;
text-align: center;
font-size: 24px;
border: 1px solid #ccc;
border-radius: 4px;
transition: border-color 0.3s;
}

.otp-input.filled {
border-color: #ff0000;
}

.otp-input.complete {
border-color: #00ff00;
}

.error-message {
color: #ff0000;
margin: 10px 0;
display: none;
font-size: 14px;
}

@keyframes shake {
0%, 100% { transform: translateX(0); }
25% { transform: translateX(-5px); }
75% { transform: translateX(5px); }
}

.shake {
animation: shake 0.4s ease-in-out;
}

.resend-container {
margin: 15px 0;
}

.resend-btn {
color: #007bff;
border: none;
background: none;
cursor: pointer;
}

.resend-btn:disabled {
color: #ccc;
cursor: not-allowed;
}

.verify-btn {
padding: 10px 30px;
background: #007bff;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
}

.success-modal {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.7);
z-index: 1000;
justify-content: center;
align-items: center;
color: black;
font-family: 'BR4-Extrabold';

}

.success-modal-content {
background: white;
padding: 30px;
border-radius: 10px;
text-align: center;
width: 400px;
height: 300px;
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
}

.success-icon {
width: 60px;
height: 60px;                
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 30px;
margin: 0 auto 15px;
}

#txt_message {
opacity: 0.5;
pointer-events: none;
}

#txt_message.verified {
opacity: 1;
pointer-events: auto;
}

@media (min-width:768px){
.otp-input-container {
    margin: 44px 0;
}
.otp-header{
    margin-bottom: 44px;
}
.otp-input{
    width: 70px;
    height: 70px;
}
.success-modal-content{
    width: 500px;
    height: 400px;
}
}

.mobile-input-wrapper.verified {
opacity: 0.5;
pointer-events: none;
}

.mobile-input-wrapper.verified input,
.mobile-input-wrapper.verified button {        
cursor: not-allowed;
}

#lblErrormobile{
    display: block;
    color: black;
}

#lblErrorTnC {
    display: none;
    color: #ff0000;
    font-size: 12px;
    margin-top: 5px;
    width: 100%;
}