@import '../variables.css';
@import '../base.css';
@import '../layout.css';
@import '../components.css';

#request-new-code {
    display: flex;
    flex-direction: column;
    text-align: center;

    & p {
        font-size: 17px;
    }
}

#kc-logout {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 0.5rem;

    & a {
        color: var(--error-color);

        & :hover {
            text-decoration: none;
            color: var(--error-color);
        }
    }
}

.kc-form-login__logo {
    margin: 1rem 0 1.5rem 0;
}

#kc-otp {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 1rem 2rem 1.2rem 2rem;
    max-width: 350px;
}

#otp-form {
    width: 100%;
    max-width: 440px;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0;
    padding: 0 0.5rem;
}

#otp-form .kc-form-login__logo {
    align-self: center;
}

#otp-form .kc-form-description {
    width: 100%;
}

#otp-form .pf-c-form__group,
#otp-form .kcFormGroupClass {
    width: 100%;
    max-width: 100%;
}

#request-new-code {
    text-align: center;
    width: 100%;
}

.kc-form-description {
    margin-bottom: 1rem;
}

.kc-form-description p {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.4;
    font-weight: 500;
    color: var(--text-dark) !important;
}

#kc-form-buttons {
  width: 100%;
}

#kc-form-options {
    width: 80%;
    display: flex;
    flex-direction: column;
    margin: 0 auto;
}

#kc-content-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}