/* SourceHub UI tokens mapped onto Keycloak's PatternFly Admin Console. */
:root {
  --sh-white: #fff;
  --sh-snow: #fcfcfc;
  --sh-eclipse: #27272a;
  --sh-background: #f5f5f5;
  --sh-foreground: var(--sh-eclipse);
  --sh-surface: var(--sh-white);
  --sh-surface-secondary: #efeff0;
  --sh-surface-tertiary: #e8e8ea;
  --sh-muted: #71717a;
  --sh-muted-canvas: #686870;
  --sh-accent: #1684f8;
  --sh-accent-hover: #0b70d1;
  --sh-action: #0b70d1;
  --sh-action-hover: #0969c3;
  --sh-accent-soft: #e9f3ff;
  --sh-accent-soft-foreground: #075eaf;
  --sh-success: #30a46c;
  --sh-success-muted: #ebf9f1;
  --sh-warning: #f5a524;
  --sh-warning-muted: #fff7df;
  --sh-danger: #e5484d;
  --sh-danger-muted: #fff0f0;
  --sh-border: #e4e4e7;
  --sh-separator: #ebebed;
  --sh-radius-sm: .75rem;
  --sh-radius: 1rem;
  --sh-radius-lg: 1.5rem;
  --sh-radius-action: 1.5rem;
  --sh-shadow: 0 2px 4px rgb(0 0 0 / 4%), 0 1px 2px rgb(0 0 0 / 6%), 0 0 1px rgb(0 0 0 / 6%);
  --sh-shadow-field: 0 1px 2px rgb(39 39 42 / 4%);
  --sh-shadow-overlay: 0 2px 8px rgb(0 0 0 / 6%), 0 -6px 12px rgb(0 0 0 / 3%), 0 14px 28px rgb(0 0 0 / 8%);

  --pf-v5-global--FontFamily--sans-serif: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --pf-v5-global--Color--100: var(--sh-foreground);
  --pf-v5-global--Color--200: var(--sh-muted);
  --pf-v5-global--BackgroundColor--100: var(--sh-surface);
  --pf-v5-global--BackgroundColor--200: var(--sh-background);
  --pf-v5-global--BackgroundColor--300: var(--sh-surface-secondary);
  --pf-v5-global--BorderColor--100: var(--sh-border);
  --pf-v5-global--BorderColor--200: var(--sh-separator);
  --pf-v5-global--primary-color--100: var(--sh-accent);
  --pf-v5-global--primary-color--200: var(--sh-accent-hover);
  --pf-v5-global--link--Color: var(--sh-accent-soft-foreground);
  --pf-v5-global--link--Color--hover: var(--sh-accent-hover);
  --pf-v5-global--BoxShadow--sm: var(--sh-shadow);
  --pf-v5-global--BoxShadow--md: var(--sh-shadow-overlay);
  --pf-v5-global--BoxShadow--lg: var(--sh-shadow-overlay);
  color-scheme: light;
}

html,
body,
#app {
  min-height: 100%;
  background: var(--sh-background);
  color: var(--sh-foreground);
  font-family: var(--pf-v5-global--FontFamily--sans-serif);
}

body {
  margin: 0;
  font-size: .875rem;
}

/* Masthead */
.pf-v5-c-masthead {
  min-height: 4rem;
  border-bottom: 1px solid var(--sh-border);
  background: var(--sh-surface);
  color: var(--sh-foreground);
  box-shadow: none;
}

.pf-v5-c-masthead__content,
.pf-v5-c-masthead .pf-v5-c-toolbar,
.pf-v5-c-masthead .pf-v5-c-toolbar__content,
.pf-v5-c-masthead .pf-v5-c-toolbar__content-section {
  background: var(--sh-surface);
  color: var(--sh-foreground);
}

.pf-v5-c-masthead__brand {
  display: inline-flex;
  height: 4rem;
  align-items: center;
  padding-inline: 1rem;
  border-radius: 0;
}

.keycloak__pageheader_brand {
  width: 9.5rem;
  height: 2.5rem;
  object-fit: contain;
  object-position: left center;
}

.pf-v5-c-masthead .pf-v5-c-button.pf-m-plain,
.pf-v5-c-masthead .pf-v5-c-menu-toggle.pf-m-plain {
  color: var(--sh-muted);
}

.pf-v5-c-masthead .pf-v5-c-button.pf-m-plain:hover,
.pf-v5-c-masthead .pf-v5-c-menu-toggle.pf-m-plain:hover {
  background: var(--sh-surface-secondary);
  color: var(--sh-foreground);
}

.pf-v5-c-masthead .pf-v5-c-toolbar__item:has(> .pf-v5-c-avatar) {
  display: none;
}

.keycloak__dashboard_icon {
  width: 6rem;
  height: 6rem;
  border-radius: 1.75rem;
  padding: 1.25rem;
  background: var(--sh-accent-soft);
  object-fit: contain;
}

/* Sidebar */
.pf-v5-c-page__sidebar,
.keycloak__page_nav__nav {
  border-right: 1px solid var(--sh-border);
  background: var(--sh-surface);
  color: var(--sh-foreground);
  box-shadow: none;
}

.pf-v5-c-page__sidebar-body {
  padding-block: .75rem 1rem;
}

.pf-v5-c-nav {
  background: transparent;
  color: var(--sh-foreground);
}

.pf-v5-c-nav__section {
  margin-top: .375rem;
  border-color: var(--sh-separator) !important;
}

.pf-v5-c-nav__section + .pf-v5-c-nav__section {
  margin-top: 1rem;
  border-top: 1px solid var(--sh-separator);
  padding-top: .875rem;
}

.pf-v5-c-nav__section::before,
.pf-v5-c-nav__section::after,
.pf-v5-c-nav__section-title::before,
.pf-v5-c-nav__section-title::after {
  background: var(--sh-separator) !important;
}

.pf-v5-c-nav__section-title {
  padding: .5rem 1rem .375rem;
  border-color: var(--sh-separator) !important;
  color: var(--sh-muted);
  font-size: .75rem;
  font-weight: 600;
  line-height: 1.25rem;
}

.pf-v5-c-nav__section-title:first-child {
  color: var(--sh-foreground);
  font-size: .8125rem;
}

.pf-v5-c-nav__list {
  padding-inline: .75rem;
}

.pf-v5-c-nav__link {
  min-height: 2.375rem;
  margin-block: .125rem;
  border: 0;
  border-radius: var(--sh-radius-sm);
  padding: .5rem .75rem;
  background: transparent;
  color: var(--sh-foreground);
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.25rem;
}

.pf-v5-c-nav__link::after {
  display: none;
}

.pf-v5-c-nav__link:hover,
.pf-v5-c-nav__link:focus-visible {
  background: var(--sh-surface-secondary);
  color: var(--sh-foreground);
}

.pf-v5-c-nav__link.pf-m-current,
.pf-v5-c-nav__item.pf-m-current > .pf-v5-c-nav__link,
.pf-v5-c-nav__link[aria-current="page"] {
  background: var(--sh-accent-soft) !important;
  color: var(--sh-accent-soft-foreground) !important;
  font-weight: 600;
}

.pf-v5-c-label {
  border: 0;
  border-radius: 999px;
  background: var(--sh-accent-soft);
  color: var(--sh-accent-soft-foreground);
}

.pf-v5-c-label.pf-m-green { background: var(--sh-success-muted); color: #18794e; }
.pf-v5-c-label.pf-m-gold, .pf-v5-c-label.pf-m-orange { background: var(--sh-warning-muted); color: #8a5700; }
.pf-v5-c-label.pf-m-red { background: var(--sh-danger-muted); color: #b42328; }

/* Page canvas and hierarchy */
.pf-v5-c-page,
.pf-v5-c-page__main {
  background: var(--sh-background);
  color: var(--sh-foreground);
}

.pf-v5-c-page__main-breadcrumb {
  padding: 1.25rem 2rem 0;
  background: transparent;
}

.pf-v5-c-page__main-section,
.pf-v5-c-page__main-section.pf-m-light,
.pf-v5-c-page__main-section.pf-m-dark-100,
.pf-v5-c-page__main-section.pf-m-dark-200 {
  background: transparent;
  color: var(--sh-foreground);
}

.pf-v5-c-page__main-section.pf-m-light {
  padding: 1.75rem 2rem 1rem;
}

.pf-v5-c-page__main-section h1,
.pf-v5-c-title.pf-m-3xl {
  color: var(--sh-foreground);
  font-size: clamp(1.625rem, 2.4vw, 2.125rem);
  font-weight: 650;
  letter-spacing: -.04em;
  line-height: 1.15;
}

.pf-v5-c-page__main-section h2,
.pf-v5-c-title.pf-m-2xl {
  color: var(--sh-foreground);
  font-weight: 600;
  letter-spacing: -.025em;
}

.pf-v5-c-content,
.pf-v5-c-content p {
  color: var(--sh-foreground);
}

.pf-v5-c-content small,
.pf-v5-c-helper-text,
.pf-v5-c-form__helper-text,
.pf-v5-c-empty-state__body {
  color: var(--sh-muted);
}

#view-header-subkey p {
  color: var(--sh-muted-canvas);
}

/* Surfaces */
.pf-v5-c-card,
.pf-v5-c-panel,
.pf-v5-c-data-list,
.pf-v5-c-tree-view,
.pf-v5-c-wizard,
.pf-v5-c-accordion {
  overflow: hidden;
  border: 0;
  border-radius: var(--sh-radius-lg);
  background: var(--sh-surface);
  box-shadow: var(--sh-shadow);
}

.pf-v5-c-card__header,
.pf-v5-c-card__body,
.pf-v5-c-card__footer,
.pf-v5-c-panel__header,
.pf-v5-c-panel__main,
.pf-v5-c-panel__footer {
  border-color: var(--sh-separator);
}

.pf-v5-c-table,
.pf-v5-c-table tr,
.pf-v5-c-table th,
.pf-v5-c-table td {
  border-color: var(--sh-separator);
}

.pf-v5-c-table {
  background: var(--sh-surface);
  color: var(--sh-foreground);
}

.pf-v5-c-table :is(th, td) {
  color: var(--sh-foreground);
}

.pf-v5-c-table thead,
.pf-v5-c-table > thead > tr {
  background: var(--sh-surface-secondary);
}

.pf-v5-c-table tbody tr:hover {
  background: color-mix(in srgb, var(--sh-accent-soft) 38%, transparent);
}

.pf-v5-c-data-list__item,
.pf-v5-c-data-list__item-row,
.pf-v5-c-accordion__toggle,
.pf-v5-c-accordion__expanded-content {
  border-color: var(--sh-separator);
  background: var(--sh-surface);
}

/* Buttons and links */
.pf-v5-c-button {
  display: inline-flex;
  min-height: 2.5rem;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  border-radius: var(--sh-radius-action);
  padding-block: .625rem;
  padding-inline: 1rem;
  font-family: inherit;
  font-size: .875rem;
  font-weight: 600;
  line-height: 1.25rem;
  text-align: center;
  transition: transform 180ms ease, background-color 100ms ease, box-shadow 100ms ease;
}

.pf-v5-c-button::before,
.pf-v5-c-button::after {
  display: none !important;
}

.pf-v5-c-button.pf-m-primary {
  border: 0;
  background: var(--sh-action);
  color: #fff;
  box-shadow: 0 8px 18px rgb(11 112 209 / 16%);
}

.pf-v5-c-button.pf-m-primary:hover { background: var(--sh-action-hover); }

.pf-v5-c-button.pf-m-secondary,
.pf-v5-c-button.pf-m-tertiary {
  border: 0;
  background: var(--sh-surface-secondary);
  color: var(--sh-foreground);
  box-shadow: none;
}

.pf-v5-c-button.pf-m-secondary:hover,
.pf-v5-c-button.pf-m-tertiary:hover { background: var(--sh-surface-tertiary); }

/* PatternFly control buttons otherwise retain their system-dark background. */
.pf-v5-c-button.pf-m-control {
  border: 1px solid var(--sh-border);
  border-radius: var(--sh-radius-sm);
  background: var(--sh-surface);
  color: var(--sh-foreground);
  box-shadow: var(--sh-shadow-field);
}

.pf-v5-c-button.pf-m-control:is(:hover, :focus-visible, :active, .pf-m-expanded) {
  background: var(--sh-surface-secondary);
  color: var(--sh-foreground);
}

.pf-v5-c-button.pf-m-danger { border: 0; background: var(--sh-danger); color: #fff; }
.pf-v5-c-button.pf-m-link { color: var(--sh-accent-soft-foreground); }
.pf-v5-c-button.pf-m-plain { border-radius: var(--sh-radius-sm); color: var(--sh-muted); }
.pf-v5-c-button.pf-m-plain:hover { background: var(--sh-surface-secondary); color: var(--sh-foreground); }
.pf-v5-c-button:active:not(:disabled) { transform: scale(.97); }

.pf-v5-c-button:is(:disabled, .pf-m-disabled, [aria-disabled="true"]) {
  color: var(--sh-muted) !important;
  opacity: .5;
  box-shadow: none;
}

.pf-v5-c-menu-toggle.pf-m-plain {
  color: var(--sh-muted) !important;
}

a { color: var(--sh-accent-soft-foreground); }
a:hover { color: var(--sh-accent-hover); }

/* Fields and selectors */
.pf-v5-c-form-control,
.pf-v5-c-menu-toggle,
.pf-v5-c-select__toggle,
.pf-v5-c-select__toggle-button,
.pf-v5-c-text-input-group {
  min-height: 2.5rem;
  border: 1px solid var(--sh-border);
  border-radius: var(--sh-radius-sm);
  background: var(--sh-surface);
  color: var(--sh-foreground);
  box-shadow: var(--sh-shadow-field);
}

.pf-v5-c-form-control::before,
.pf-v5-c-form-control::after,
.pf-v5-c-text-input-group__text::before,
.pf-v5-c-text-input-group__text::after,
.pf-v5-c-menu-toggle::before,
.pf-v5-c-menu-toggle::after,
.pf-v5-c-select__toggle::before,
.pf-v5-c-select__toggle::after {
  display: none;
}

.pf-v5-c-form-control:hover,
.pf-v5-c-menu-toggle:hover,
.pf-v5-c-select__toggle:hover {
  border-color: #d9d9de;
  background: var(--sh-snow);
}

.pf-v5-c-form-control:focus-within,
.pf-v5-c-menu-toggle:focus-visible,
.pf-v5-c-select__toggle:focus-visible,
.pf-v5-c-text-input-group:focus-within {
  border-color: color-mix(in srgb, var(--sh-accent) 55%, white);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--sh-accent) 15%, transparent), var(--sh-shadow-field);
  outline: 0;
}

.pf-v5-c-form-control > :is(input, textarea, select),
.pf-v5-c-text-input-group__text-input {
  color: var(--sh-foreground);
  font-family: inherit;
}

.pf-v5-c-text-input-group__icon {
  color: var(--sh-muted);
}

/* The group owns the focus ring; avoid a second outline around its input. */
.pf-v5-c-text-input-group__text-input:focus-visible {
  outline: 0 !important;
}

.pf-v5-c-form-control :is(input, textarea)::placeholder,
.pf-v5-c-text-input-group__text-input::placeholder {
  color: var(--sh-muted);
  opacity: 1;
}

.pf-v5-c-check__input,
.pf-v5-c-radio__input {
  accent-color: var(--sh-accent);
}

/* Tabs, menus and overlays */
.pf-v5-c-tabs {
  border: 0;
  background: transparent;
}

.pf-v5-c-tabs.pf-m-box .pf-v5-c-tabs__item {
  margin-right: .25rem;
  border: 0;
  border-radius: var(--sh-radius-sm);
  background: transparent;
}

.pf-v5-c-tabs.pf-m-box .pf-v5-c-tabs__item::before,
.pf-v5-c-tabs.pf-m-box .pf-v5-c-tabs__item::after {
  display: none !important;
}

.pf-v5-c-tabs.pf-m-box .pf-v5-c-tabs__item:hover { background: var(--sh-surface-secondary); }
.pf-v5-c-tabs.pf-m-box .pf-v5-c-tabs__item.pf-m-current { background: var(--sh-surface); box-shadow: var(--sh-shadow); }
.pf-v5-c-tabs__link { color: var(--sh-muted); }
.pf-v5-c-tabs__item.pf-m-current .pf-v5-c-tabs__link { color: var(--sh-accent-soft-foreground); font-weight: 600; }

.pf-v5-c-menu,
.pf-v5-c-dropdown__menu,
.pf-v5-c-select__menu,
.pf-v5-c-popover__content,
.pf-v5-c-tooltip__content {
  overflow: hidden;
  border: 0;
  border-radius: var(--sh-radius-lg);
  background: var(--sh-surface);
  color: var(--sh-foreground);
  box-shadow: var(--sh-shadow-overlay);
}

.pf-v5-c-menu__item,
.pf-v5-c-dropdown__menu-item,
.pf-v5-c-select__menu-item {
  border-radius: var(--sh-radius-sm);
  color: var(--sh-foreground);
}

.pf-v5-c-menu__item:hover,
.pf-v5-c-dropdown__menu-item:hover,
.pf-v5-c-select__menu-item:hover { background: var(--sh-surface-secondary); }

.pf-v5-c-modal-box {
  overflow: hidden;
  border-radius: var(--sh-radius-lg);
  background: var(--sh-surface);
  color: var(--sh-foreground);
  box-shadow: var(--sh-shadow-overlay);
}

.pf-v5-c-backdrop { background: rgb(0 0 0 / 50%); backdrop-filter: blur(10px); }

/* Feedback and status */
.pf-v5-c-banner.pf-m-gold {
  border-bottom: 1px solid #f1dfad;
  background: var(--sh-warning-muted);
  color: #6f4600;
}

.pf-v5-c-alert {
  border: 0;
  border-radius: var(--sh-radius-lg);
  background: var(--sh-surface);
  box-shadow: var(--sh-shadow-overlay);
}

.pf-v5-c-alert.pf-m-success { color: #18794e; }
.pf-v5-c-alert.pf-m-warning { color: #8a5700; }
.pf-v5-c-alert.pf-m-danger { color: #b42328; }

.pf-v5-c-empty-state {
  border-radius: var(--sh-radius-lg);
  background: var(--sh-surface);
}

.pf-v5-c-progress__indicator { background: var(--sh-accent); }
.pf-v5-c-spinner { color: var(--sh-accent); }

/* Keyboard and motion */
:is(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--sh-accent);
  outline-offset: 2px;
}

@media (max-width: 48rem) {
  .pf-v5-c-page__main-breadcrumb { padding-inline: 1rem; }
  .pf-v5-c-page__main-section.pf-m-light { padding-inline: 1rem; }
  .keycloak__pageheader_brand { width: 8rem; }

  .pf-v5-l-grid:has(> .keycloak__dashboard_welcome_tab) {
    display: flex;
    margin-inline: 0 !important;
    padding: 0 1.5rem 1.5rem;
    flex-direction: column;
  }

  .pf-v5-l-grid:has(> .keycloak__dashboard_welcome_tab) > *,
  .keycloak__dashboard_welcome_tab {
    width: 100% !important;
    max-width: 34rem;
  }

  .pf-v5-l-grid:has(> .keycloak__dashboard_welcome_tab) > .pf-v5-c-action-list {
    display: flex;
    flex-wrap: wrap;
  }

  .pf-v5-l-grid:has(> .keycloak__dashboard_welcome_tab) > .pf-m-10-col .pf-v5-c-button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}
