.modal-bgColor{
    background-color: #97144d;
}

.modal-bodyDesgin{
    align-items: center; 
    text-align: center; 
    background-color: whitesmoke;
}

.otp_Headline{
    font-size: 35px; 
    color: #97144d; 
    font-weight: bold;
}

.otp_LabelText{
    font-size: 12px; 
    color: gray; 
    font-weight: bold;
}

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

.otp-input {
    width: 55px;
    height: 55px;
    text-align: center;
    font-size: 22px;
    border: 2px solid #ccc;
    border-radius: 5px;
}

.otp-input:focus {
    border-color: #007bff;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
    outline: none;
}

.otp-verify-btn {
    width: 50%; 
    border-radius: 15px; 
    background-color: #97144d; 
    color: whitesmoke; 
    font-size: 20px; font-weight: bold;
    margin-top: 1.5rem
}

/* Shake animation */
.shake {
    animation: shake 0.3s;
}
@keyframes shake {
    0% { transform: translateX(0px); }
    25% { transform: translateX(-5px); }
    50% { transform: translateX(5px); }
    75% { transform: translateX(-5px); }
    100% { transform: translateX(0px); }
}

#timer {
    text-align: center; 
    font-size: 12px; 
    color: #97144d; 
    font-weight: bold;
}

.otp-Resend{
    display:none; 
    font-size: 12px; 
    color: #97144d; 
    font-weight: bold; 
    cursor:pointer;
}

.modal-lower .modal-dialog{
   margin-top: 70px !important;
}