.login-pf body {
    background: #efefef;

    --pf-global--primary-color--100: #d0021b;
    --pf-global--primary-color--200: #920113;
    --pf-global--primary-color--light-100: #de4e5f;
    --pf-global--primary-color--dark-100: #d0021b;
}

#kc-header {
    color: inherit;
}

.pf-c-button {
    font-weight: bold;
}

#kc-header-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

#kc-header-wrapper::before {
    content: '';
    background-image: url('../img/logo.png');
    width: 48px;
    height: 48px;
    display: inline-block;
    background-size: contain;
}

#kc-info-wrapper {
    font-size: 14px;
    font-weight: 600;
}

#kc-info-wrapper:has(.info) {
    background: #4767af;
    color: #fff;
}

@media (max-width: 767px) {
    #kc-header-wrapper {
        justify-content: flex-start;
    }

    #kc-header-wrapper::before {
        width: 32px;
        height: 32px;
    }
}

#try-another-way {
    display: block;
    margin-top: 8px;
}

.otp-icon {
    display: inline-block;
    content: url('../img/otp-icon-sm.svg');
    height: 1.4em;
    vertical-align: -0.25em;
}

.auto-register-form-display-name i {
    width: 100%;
}

.auto-register-form-display-name i::before {
    content: url('../img/otp-icon-lg.svg');
    display: inline-block;
    width: 100%;
}

.auth-username-password-form-display-name i::before {
    content: url('../img/password-icon-lg.svg');
    display: inline-block;
    width: 100%;
}