:root {
  --compassiome-green: #236b61;
  --compassiome-green-dark: #185249;
  --pf-v5-global--primary-color--100: var(--compassiome-green);
  --pf-v5-global--primary-color--200: var(--compassiome-green-dark);
  --pf-v5-global--link--Color: var(--compassiome-green);
  --pf-v5-global--link--Color--hover: var(--compassiome-green-dark);
  color-scheme: light;
}

html,
body {
  background: #f3f7f6;
  color: #17201f;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.pf-v5-c-masthead,
.pf-v5-c-page__header {
  background: #ffffff;
  border-bottom: 1px solid #c9d5d2;
}

.pf-v5-c-brand img,
.pf-v5-c-masthead__brand img {
  height: 2.5rem;
  width: 2.5rem;
}

.pf-v5-c-button.pf-m-primary {
  background-color: var(--compassiome-green);
}

.pf-v5-c-button.pf-m-primary:hover,
.pf-v5-c-button.pf-m-primary:focus-visible {
  background-color: var(--compassiome-green-dark);
}

a,
.pf-v5-c-button.pf-m-link {
  color: var(--compassiome-green);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible {
  outline: 0.2rem solid rgb(35 107 97 / 35%);
  outline-offset: 0.15rem;
}

/*
 * Keycloak's signing-in view combines PatternFly split layouts with credential
 * data lists. These containers must be allowed to shrink before their content
 * can wrap at the WCAG reflow boundary; the upstream max-width utility alone
 * leaves a min-content width wider than a 320 CSS-pixel viewport.
 */
.pf-v5-c-page,
.pf-v5-c-page__main,
.pf-v5-c-page__main-section,
.pf-v5-c-data-list,
.pf-v5-c-data-list__item,
.pf-v5-c-data-list__item-row,
.pf-v5-c-data-list__item-content,
.pf-v5-c-data-list__cell,
.pf-v5-l-split,
.pf-v5-l-split__item {
  max-inline-size: 100%;
  min-inline-size: 0;
}

.pf-v5-c-data-list__cell,
.pf-v5-c-data-list__cell-text,
.cred-title {
  overflow-wrap: anywhere;
}

@media (max-width: 22rem) {
  /*
   * Keycloak replaces the labeled create action with an unlabeled icon menu
   * below its large breakpoint. Keep the existing named action visible so the
   * narrow layout remains operable and understandable without pointer context.
   */
  .pf-v5-u-float-right:has(> [data-testid$="/create"]) {
    float: none !important;
    max-inline-size: 100%;
  }

  .pf-v5-u-float-right > .pf-v5-c-menu-toggle.pf-v5-u-display-none-on-lg {
    display: none !important;
  }

  .pf-v5-u-float-right > [data-testid$="/create"] {
    display: inline-flex !important;
    max-inline-size: 100%;
    white-space: normal;
  }

  .pf-v5-l-split,
  .pf-v5-c-data-list__item-row,
  .pf-v5-c-data-list__item-content {
    flex-wrap: wrap;
  }

  .pf-v5-c-page__main-section {
    padding-inline: 1rem;
  }

  .pf-v5-c-data-list__item-action {
    margin-inline-start: 0;
  }
}