.keycloak__realm_selector_dropdown__toggle {
  --pf-c-dropdown__toggle--Color: var(--pf-c-nav__link--m-current--Color);
  --pf-c-dropdown__toggle--BackgroundColor: var(
    --pf-global--BackgroundColor--dark-100
  );
  --pf-c-dropdown__toggle--before--BorderTopColor: var(
    --pf-global--BorderColor--200
  );
  --pf-c-dropdown__toggle--before--BorderRightColor: var(
    --pf-global--BorderColor--200
  );
  --pf-c-dropdown__toggle--before--BorderBottomColor: var(
    --pf-global--BorderColor--100
  );
  --pf-c-dropdown__toggle--before--BorderLeftColor: var(
    --pf-global--BorderColor--200
  );
  width: 100%;
}

.keycloak__realm_selector__context_selector {
  --pf-c-context-selector__toggle--Color: var(--pf-c-nav__link--m-current--Color);
}

.keycloak__realm_selector__dropdown {
  width: 100%;
}

.keycloak__realm_selector__list-item-split {
  width: 100%;
  text-align: left;
}

/* the last child is the realm selector button, and this is the only way to style the li around it */
.keycloak__realm_selector__context_selector li:last-child {
  position: sticky;
  bottom: 0;
  background-color: var(--pf-c-context-selector__menu--BackgroundColor);
}

.keycloak__page_nav__nav_item__realm-selector {
  margin-top: var(--pf-c-nav__link--PaddingTop);
  padding-right: var(--pf-c-nav__link--PaddingRight);
  margin-bottom: var(--pf-c-nav__link--PaddingBottom);
  padding-left: var(--pf-c-nav__link--PaddingLeft);
}