:root {
  /* Brand purples mirror the workspace web app (brand-600/700/800) so the console matches the product. */
  --pf-v5-global--primary-color--100: #7f56d9;
  --pf-v5-global--primary-color--200: #6941c6;
  --pf-v5-global--primary-color--dark-100: #7f56d9;
  --pf-v5-global--active-color--100: #7f56d9;
  --pf-v5-global--active-color--400: #b692f6;
  --pf-v5-global--link--Color: #6941c6;
  --pf-v5-global--link--Color--hover: #53389e;
  --pf-v5-global--link--Color--dark: #6941c6;
  --pf-v5-global--link--Color--dark--hover: #53389e;

  --ml-chrome: #1e0956;
  --ml-chrome-hover: rgba(255, 255, 255, 0.06);
  --ml-chrome-current: rgba(255, 255, 255, 0.12);
  --ml-chrome-divider: rgba(255, 255, 255, 0.1);
  --ml-chrome-text: rgba(255, 255, 255, 0.8);
  --ml-chrome-muted: #b692f6;
}

.pf-v5-c-masthead {
  --pf-v5-c-masthead--BackgroundColor: var(--ml-chrome);
  /* Outline of the user menu toggle; PatternFly's black-800 disappears on purple. */
  --pf-v5-c-masthead--item-border-color--base: rgba(255, 255, 255, 0.24);
}
/* The brand-600 hover/expanded underline is too low-contrast on the dark chrome. */
.pf-v5-c-masthead .pf-v5-c-toolbar {
  --pf-v5-global--active-color--100: #b692f6;
}

.pf-v5-c-page {
  --pf-v5-c-page__sidebar--BackgroundColor: var(--ml-chrome);
}

.pf-v5-c-page__sidebar .pf-v5-c-nav {
  --pf-v5-c-nav__link--Color: var(--ml-chrome-text);
  --pf-v5-c-nav__link--hover--Color: #ffffff;
  --pf-v5-c-nav__link--focus--Color: #ffffff;
  --pf-v5-c-nav__link--active--Color: #ffffff;
  --pf-v5-c-nav__link--m-current--Color: #ffffff;

  --pf-v5-c-nav__link--hover--BackgroundColor: var(--ml-chrome-hover);
  --pf-v5-c-nav__link--focus--BackgroundColor: var(--ml-chrome-hover);
  --pf-v5-c-nav__link--active--BackgroundColor: var(--ml-chrome-current);
  --pf-v5-c-nav__link--m-current--BackgroundColor: var(--ml-chrome-current);
  --pf-v5-c-nav__item--m-current--not--m-expanded__link--BackgroundColor: var(--ml-chrome-current);

  --pf-v5-c-nav__link--m-current--after--BorderColor: #b692f6;
  --pf-v5-c-nav__link--before--BorderColor: transparent;

  /* Nav-level section title = the realm header row at the top of the sidebar. */
  --pf-v5-c-nav__section-title--Color: #ffffff;
  --pf-v5-c-nav__section-title--BorderBottomColor: var(--ml-chrome-divider);
  --pf-v5-c-nav--c-divider--BackgroundColor: var(--ml-chrome-divider);
}

.pf-v5-c-page__sidebar .pf-v5-c-nav__section {
  --pf-v5-c-nav__section-title--Color: var(--ml-chrome-muted);
  --pf-v5-c-nav__section-title--BorderBottomColor: transparent;
  --pf-v5-c-nav__section-title--FontSize: 0.75rem;
  --pf-v5-c-nav__section-title--MarginBottom: 0;
}
.pf-v5-c-page__sidebar .pf-v5-c-nav__section > .pf-v5-c-nav__section-title {
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.pf-v5-c-page__sidebar .pf-v5-c-nav > .pf-v5-c-nav__section-title {
  font-weight: 600;
}

/* Keycloak renders the "Current realm" pill as a PatternFly blue label. */
.pf-v5-c-page__sidebar .pf-v5-c-label.pf-m-blue {
  --pf-v5-c-label--BackgroundColor: rgba(182, 146, 246, 0.18);
  --pf-v5-c-label__content--Color: #f4ebff;
  --pf-v5-c-label__content--before--BorderColor: rgba(182, 146, 246, 0.45);
  --pf-v5-c-label--FontSize: 0.75rem;
  font-weight: 400;
  margin-inline-start: 0.5rem;
}
