/*
 * Brand overrides on top of Keycloak's built-in "keycloak.v2" login theme.
 * Anything not set here is inherited, so new Keycloak pages are styled
 * automatically.
 */

:root {
    --brand-color: #93c01c;
    --brand-color-hover: #93c01c;

    /* Consumed by keycloak.v2: full page background and the accent line on the card. */
    --keycloak-bg-logo-url: url('../img/background.jpg');
    --keycloak-card-top-color: var(--brand-color);

    --pf-v5-global--link--Color: var(--brand-color);
    --pf-v5-global--link--Color--hover: var(--brand-color-hover);
}

/*
 * PatternFly declares --pf-v5-c-button--m-primary--BackgroundColor on the
 * .pf-v5-c-button selector itself, so it has to be overridden at component level:
 * a value set on :root would never win.
 */
.pf-v5-c-button.pf-m-primary {
    --pf-v5-c-button--m-primary--BackgroundColor: var(--brand-color);
    --pf-v5-c-button--m-primary--hover--BackgroundColor: var(--brand-color-hover);
    --pf-v5-c-button--m-primary--focus--BackgroundColor: var(--brand-color-hover);
    --pf-v5-c-button--m-primary--active--BackgroundColor: var(--brand-color-hover);
}

/*
 * keycloak.v2 renders the realm display name into #kc-header-wrapper. Draw the
 * brand logo there instead; font-size:0 hides the display name should a realm set
 * one, and .kc-logo-text is hidden so a display name containing Keycloak's own
 * logo markup cannot produce a second logo.
 */
#kc-header-wrapper {
    height: 100px;
    margin: 0 auto var(--pf-v5-global--spacer--xl);
    background-image: url('../img/logo.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    font-size: 0;
}

#kc-header-wrapper .kc-logo-text {
    display: none;
}

/* The previous theme hid the language chooser. */
.pf-v5-c-login__main-header-utilities {
    display: none;
}

/*
 * Terms/privacy hint rendered by footer.ftl. The surrounding footer band has no
 * padding of its own, so the text would otherwise sit flush against the card edges.
 */
#kc-terms-hint {
    padding: var(--pf-v5-global--spacer--lg) var(--pf-v5-global--spacer--xl);
    font-size: var(--pf-v5-global--FontSize--sm);
    color: var(--pf-v5-global--Color--200);
}

#kc-terms-hint p {
    margin: 0;
}

/*
 * keycloak.v2 tints non-Google social icons for a dark card. The theme is pinned
 * to light mode (darkMode=false), so that filter has to be undone for visitors
 * whose operating system asks for dark.
 */
@media (prefers-color-scheme: dark) {
    #kc-social-providers svg:not(.google) {
        filter: none;
    }
}