.login-parent-component{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 70vh;
    margin: 0;
}

.login-container,
.register-container,
.code-confirm-container,
.recover-account-container,
.input-newpassword-container {
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border: 1px solid #0d9c06;
    text-align: center;
}

.login-container button:hover,
.register-container button:hover,
.code-confirm-container button:hover,
.recover-account-container button:hover,
.input-newpassword-container button:hover {
    background-color: #347808;
}

.lbl-signup{
    cursor: pointer;
    color: #7cff0f
}

.lbl-btn{
    cursor: pointer;
}

.forgot-password{
    display: block;
}

.logo {
    margin-bottom: 20px;
}

.login-footer{
    text-align: center;
    display: inline-grid;
}

.login-label-forgot-password{
    color: #49991f;
    text-align: center;
    margin-top: 25px;
}
.telegram-login {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #0088cc;
    margin-top: 10px;
    padding: 10px;
    border-radius: 4px;
    cursor: pointer;
    color: white;
    text-decoration: none;
}
.telegram-login svg {
    width: 20px;
    height: 20px;
    margin-right: 10px;
    vertical-align: middle;
    display: inline-flex;
}
.reset-password {
    margin-top: 10px;
    color: #007bff;
    text-decoration: none;
}
.reset-password:hover {
    text-decoration: underline;
}


.timeSpan{
    width: 60px;
    padding: 9px;
}
.timeSpan span{
    color: #62ff58;
}

.login-footer button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 16px;
    width: 100%;
    margin: 5px 0;
}

.login-footer button svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

/* .style3 {
    display: block;
    margin: 8px 0;
    color: #49991f;
} */