:root {
  --pf-v5-global--BackgroundColor--100: rgba(13, 28, 33, 0.8);
  --pf-v5-global--BackgroundColor--200: rgba(32, 56, 66, 0.6);
  --pf-v5-global--BackgroundColor--dark-100: rgba(13, 28, 33, 1);

  --pf-v5-global--Color--100: rgb(246, 252, 254);
  --pf-v5-global--Color--200: rgb(152, 164, 176);

  --pf-v5-global--primary-color--100: rgb(68, 190, 231);
  --pf-v5-global--primary-color--200: rgb(24, 148, 188);
  --pf-v5-c-menu-toggle--after--BorderBottomColor: var(
    --pf-v5-global--primary-color--100
  );

  --pf-v5-c-label__icon--Color: var(
    --pf-v5-global--primary-color--100,
    rgb(68, 190, 231)
  );
  --pf-v5-c-label__content--Color: var(
    --pf-v5-global--primary-color--100,
    rgb(68, 190, 231)
  );
  --pf-v5-c-label__content--before--BorderColor: var(
    --pf-v5-global--primary-color--100
  );
  --pf-v5-c-label__content--link--hover--before--BorderColor: var(
    --pf-v5-global--primary-color--100
  );
  --pf-v5-c-label__content--link--focus--before--BorderColor: var(
    --pf-v5-global--primary-color--100
  );
  --pf-v5-c-label--m-outline__content--Color: var(
    --pf-v5-global--primary-color--100
  );
  --pf-v5-c-label--m-outline__content--before--BorderColor: var(
    --pf-v5-c-label--m-outline--m-blue__content--before--BorderColor
  );
  --pf-v5-c-label--m-outline__content--link--hover--before--BorderColor: var(
    --pf-v5-c-label--m-outline--m-blue__content--link--hover--before--BorderColor
  );
  --pf-v5-c-label--m-outline__content--link--focus--before--BorderColor: var(
    --pf-v5-c-label--m-outline--m-blue__content--link--focus--before--BorderColor
  );
  --pf-v5-c-label--m-editable__content--before--BorderColor: var(
    --pf-v5-c-label--m-blue__content--before--BorderColor
  );
  --pf-v5-c-label--m-editable__content--hover--before--BorderColor: var(
    --pf-v5-c-label--m-blue__content--before--BorderColor
  );
  --pf-v5-c-label--m-editable__content--focus--before--BorderColor: var(
    --pf-v5-c-label--m-blue__content--before--BorderColor
  );

  --pf-v5-global--link--Color: var(
    --pf-v5-global--primary-color--100,
    rgb(68, 190, 231)
  );

  --pf-v5-c-button--m-primary--BackgroundColor: rgb(68, 190, 231);
  --pf-v5-c-button--m-primary--Color: rgb(0, 0, 0);
}

body {
  background-color: rgba(13, 28, 33, 1) !important;
  background-image: linear-gradient(
    to top right,
    rgb(13, 28, 33) 0%,
    transparent 80%,
    transparent 100%
  ) !important;
  color: rgb(246, 252, 254) !important;
  font-family: Inter, system-ui, sans-serif !important;
}

.pf-v5-c-page,
.pf-v5-c-page__main-section,
.pf-v5-c-page__main {
  background-color: transparent !important;
}

.pf-v5-c-card {
  background-color: rgba(32, 56, 66, 0.6) !important;
  border: 1px solid rgba(42, 54, 61, 0.5) !important;
  border-radius: 0.5rem !important;
  color: rgb(246, 252, 254) !important;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;
}

.pf-v5-c-card__title,
.pf-v5-c-card__header,
.pf-v5-c-card__body,
.pf-v5-c-card__footer {
  color: inherit !important;
}

.pf-v5-c-form-control {
  background-color: rgba(0, 0, 0, 0.5) !important;
  border: 1px solid rgba(42, 54, 61, 0.5) !important;
  color: rgb(246, 252, 254) !important;
  border-radius: 0.5rem !important;
}

.pf-v5-c-form-control:focus {
  border-color: var(
    --pf-v5-global--primary-color--100,
    rgb(68, 190, 231)
  ) !important;
  box-shadow: 0 0 0 2px rgba(68, 190, 231, 0.5) !important;
}

.pf-v5-c-page__sidebar,
.pf-v5-c-page__header,
.pf-v5-c-masthead {
  background-color: rgba(13, 28, 33, 0.9) !important;
  border-right: 1px solid rgba(42, 54, 61, 0.5) !important;
  border-bottom: 1px solid rgba(42, 54, 61, 0.5) !important;
}

.pf-v5-c-nav__link {
  color: rgb(152, 164, 176) !important;
}

.pf-v5-c-nav__link:hover,
.pf-v5-c-nav__link.pf-m-current {
  color: var(--pf-v5-global--primary-color--100, rgb(68, 190, 231)) !important;
}

.pf-v5-c-button.pf-m-primary {
  background-color: var(
    --pf-v5-global--primary-color--100,
    rgb(68, 190, 231)
  ) !important;
  color: rgb(0, 0, 0) !important;
  border-radius: 0.5rem !important;
  font-weight: 600 !important;
}

.pf-v5-c-button.pf-m-secondary {
  background-color: transparent !important;
  color: var(--pf-v5-global--primary-color--100, rgb(68, 190, 231)) !important;
  border: 1px solid var(--pf-v5-global--primary-color--100, rgb(68, 190, 231)) !important;
  border-radius: 0.5rem !important;
}

/* Data Tables */
.pf-v5-c-table {
  background-color: transparent !important;
}

.pf-v5-c-table tr {
  border-bottom: 1px solid rgba(42, 54, 61, 0.5) !important;
}

.pf-v5-c-table th,
.pf-v5-c-table td {
  color: rgb(246, 252, 254) !important;
}

/* Modals */
.pf-v5-c-modal-box {
  background-color: rgba(32, 56, 66, 0.9) !important;
  border: 1px solid rgba(42, 54, 61, 0.5) !important;
  color: rgb(246, 252, 254) !important;
}

/* Toolbars */
.pf-v5-c-toolbar {
  background-color: rgba(13, 28, 33, 0.9) !important;
  border-bottom: 1px solid rgba(42, 54, 61, 0.5) !important;
}

/* Data Lists */
.pf-v5-c-data-list,
.pf-v5-c-data-list__item {
  background-color: rgba(20, 35, 42, 0.7) !important;
  border: 1px solid rgba(42, 54, 61, 0.5) !important;
}
.pf-v5-c-data-list__item-row {
  color: rgb(246, 252, 254) !important;
}

input {
  color: #f3f3f3 !important;
}

.pf-v5-c-page__main-breadcrumb {
  background-color: transparent !important;
}

.pf-v5-c-form__group.pf-m-action {
  background-color: #111 !important;
}

img.keycloak__pageheader_brand,
.pf-v5-c-masthead__brand img {
  width: 100%;
  height: max-content;
  max-width: 150px;
  max-height: 100px;
}

.pf-v5-c-data-list__expandable-content-body {
  background-color: rgba(255, 255, 255, 0.05);
  margin: 0.5rem 0 0 0;
  border-radius: 0.5rem;
}

.pf-v5-c-masthead__content .pf-v5-c-menu-toggle {
  background-color: transparent !important;
  border: none !important;
}

.pf-v5-c-masthead__content .pf-v5-c-menu-toggle::before {
  display: none !important;
}

.pf-v5-c-masthead__content .pf-v5-c-menu-toggle::after {
  display: none !important;
}