/* -- Brand -- */
:root {
    --brand-logo:          url("../img/yve.svg");
    --brand-accent:        #C1F5D6; /* --schemes-light-primaryContainer */
    --brand-primary:       #236A4C; /* --schemes-light-primary */
    --brand-text:          #002113; /* --schemes-light-onPrimaryContainer */
}


/* ============================================================
 * Keycloak variable bindings — do not edit below this line
 * ============================================================ */

:root {
    --keycloak-logo-url:        var(--brand-logo);
    --keycloak-logo-height:     60px;
    --keycloak-logo-width:      220px;
    --keycloak-card-top-color:  var(--brand-accent);
}

/* ============================================================
 * Component overrides
 * ============================================================ */

.login-pf body {
    background: none;
    background-color: #ffffff;
}

.pf-v5-c-login__main {
    border-radius: 24px;
    background-color: var(--brand-accent);
    color: var(--brand-text);
}

.pf-v5-c-login__main-header {
    border-top-left-radius: 24px;
    border-top-right-radius: 24px;
    border-top: 4px solid var(--brand-primary);
    column-gap: 0;
}

.pf-v5-c-title {
    color: var(--brand-text);
}

.pf-v5-c-form__label-text {
    color: var(--brand-text);
}

.pf-v5-c-button {
    border-radius: 24px;
}

.pf-v5-c-button.pf-m-primary {
    background-color: var(--brand-primary);
    color: #ffffff;
}

.pf-v5-c-button.pf-m-control, .pf-v5-c-button.pf-m-control:active, .pf-v5-c-button.pf-m-control:focus {
    background-color: var(--brand-primary);
    color: #ffffff;
    --pf-v5-c-button--m-control--after--BorderBottomColor: transparent;
    --pf-v5-c-button--m-control--hover--after--BorderBottomColor: transparent;
}

.pf-v5-c-form-control {
    border-radius: 24px;
    background-color: #ffffff;
    --pf-v5-c-form-control--after--BorderBottomColor: transparent;
    --pf-v5-c-form-control--focus--after--BorderBottomColor: transparent;
    --pf-v5-c-form-control--hover--after--BorderBottomColor: transparent;
}

.pf-v5-c-form-control>select {
    border-radius: 24px;
    background-color: var(--brand-primary);
    color: #ffffff;
    padding-left: 15px;
}

.pf-v5-c-accordion {
    border-radius: 24px;
}

.pf-v5-c-form-control>:is(input,textarea) {
    color: #000000;
}

.pf-v5-c-form-control__toggle-icon {
    color: #ffffff;
}

.pf-v5-c-input-group {
    --pf-v5-c-input-group__item--BorderLeftColor: transparent;
    column-gap: 10px;
}

.pf-v5-c-check__label {
    color: var(--brand-text);
}

.pf-m-error {
    font-weight: bold;
}

.pf-v5-c-alert {
    border-radius: 24px;
}

div.kc-logo-text {
    background-position: center;
}

.pf-v5-c-form__helper-text a {
    color: var(--brand-text);
}

.pf-v5-u-color-200 {
    color: var(--brand-text) !important;
}

.pf-v5-c-button.pf-m-secondary {
    --pf-v5-c-button--after--BorderColor: var(--brand-text) !important;
    --pf-v5-c-button--hover--BorderColor: var(--brand-text);
    color: var(--brand-text);
}
