@font-face {
  font-family: "Geist";
  src: url("../fonts/geist.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Geist Mono";
  src: url("../fonts/geist-mono.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --synapse-background: #fafaf8;
  --synapse-surface: #ffffff;
  --synapse-surface-muted: #f3f4f1;
  --synapse-foreground: #1a1f22;
  --synapse-muted-foreground: #5c646a;
  --synapse-border: #e7e8e3;
  --synapse-primary: #1a7d64;
  --synapse-primary-hover: #14634f;
  --synapse-primary-foreground: #ffffff;
  --synapse-accent: #eaf3ef;
  --synapse-accent-foreground: #12463a;
  --synapse-attention: #9c3d27;
  --synapse-masthead: #ffffff;
  --synapse-masthead-foreground: #1a1f22;
  --synapse-shadow-md: 0 6px 16px rgb(16 20 22 / 0.08);
  --synapse-shadow-lg: 0 16px 40px rgb(16 20 22 / 0.12);
  --pf-v5-global--primary-color--100: var(--synapse-primary);
  --pf-v5-global--primary-color--200: var(--synapse-primary-hover);
  --pf-v5-global--link--Color: var(--synapse-primary);
  --pf-v5-global--link--Color--hover: var(--synapse-primary-hover);
  --pf-v5-global--BackgroundColor--100: var(--synapse-surface);
  --pf-v5-global--BackgroundColor--200: var(--synapse-surface-muted);
  --pf-v5-global--Color--100: var(--synapse-foreground);
  --pf-v5-global--Color--200: var(--synapse-muted-foreground);
  --pf-v5-global--BorderColor--100: var(--synapse-border);
  --pf-v5-global--FontFamily--sans-serif: "Geist", system-ui, sans-serif;
  --pf-v5-global--FontFamily--heading--sans-serif: "Geist", system-ui, sans-serif;
  --pf-v5-global--BorderRadius--sm: 10px;
}

html,
body,
#app {
  min-height: 100%;
  background: var(--synapse-background);
  color: var(--synapse-foreground);
  font-family: "Geist", system-ui, sans-serif;
  font-feature-settings: "cv11", "ss01";
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.pf-v5-c-page {
  background:
    radial-gradient(circle at 58% 8%, rgb(26 125 100 / 0.12), transparent 32rem),
    var(--synapse-background);
}

.pf-v5-c-masthead {
  --pf-v5-c-masthead--BackgroundColor: var(--synapse-masthead);
  --pf-v5-c-masthead--c-toolbar--BackgroundColor: var(--synapse-masthead);
  --pf-v5-c-toolbar--BackgroundColor: var(--synapse-masthead);
  border-bottom: 1px solid var(--synapse-border);
  background-color: var(--synapse-masthead);
  color: var(--synapse-masthead-foreground);
  box-shadow: 0 1px 2px rgb(16 20 22 / 0.04);
}

.pf-v5-c-masthead__main,
.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-color: transparent;
  color: inherit;
}

.pf-v5-c-masthead .pf-v5-c-button.pf-m-plain,
.pf-v5-c-masthead .pf-v5-c-menu-toggle {
  background: transparent;
  color: inherit;
}

.pf-v5-c-masthead .pf-v5-c-menu-toggle::before {
  border-color: var(--synapse-border);
}

.pf-v5-c-brand img,
[data-testid="page-header"] img {
  width: 148px;
  max-height: 38px;
}

.pf-v5-c-page__sidebar,
.pf-v5-c-page__sidebar-body {
  border-inline-end: 1px solid var(--synapse-border);
  background: var(--synapse-surface);
}

.pf-v5-c-nav__link {
  margin: 3px 10px;
  border-radius: 0;
  color: var(--synapse-muted-foreground);
  font-weight: 550;
}

.pf-v5-c-nav__link:hover,
.pf-v5-c-nav__link:focus,
.pf-v5-c-nav__link.pf-m-current {
  background: var(--synapse-accent);
  color: var(--synapse-accent-foreground);
}

.pf-v5-c-nav__link.pf-m-current::after {
  border-color: var(--synapse-primary);
}

.pf-v5-c-page__main-section {
  background: transparent;
}

.pf-v5-c-page__main-section.pf-m-light {
  background-color: transparent;
}

.pf-v5-c-content h1,
.pf-v5-c-content h2,
.pf-v5-c-title,
[data-testid="page-heading"] {
  color: var(--synapse-foreground);
  font-family: "Geist", system-ui, sans-serif;
  font-weight: 680;
  letter-spacing: -0.035em;
}

[data-testid="page-heading"] {
  font-size: clamp(1.75rem, 4vw, 2.25rem);
}

.pf-v5-c-title {
  color: var(--synapse-foreground);
  font-family: "Geist", system-ui, sans-serif;
  font-weight: 650;
  letter-spacing: -0.015em;
}

.pf-v5-c-card,
.pf-v5-c-data-list,
.pf-v5-c-table,
.pf-v5-c-modal-box {
  border: 1px solid var(--synapse-border);
  border-radius: 14px;
  background: var(--synapse-surface);
  box-shadow: var(--synapse-shadow-md);
}

.pf-v5-c-data-list {
  overflow: hidden;
  box-shadow: none;
}

.pf-v5-c-data-list__item,
.pf-v5-c-table tr {
  border-color: var(--synapse-border);
}

.pf-v5-c-data-list__item {
  background: var(--synapse-surface-muted);
}

.pf-v5-c-data-list__item-row {
  min-height: 58px;
}

.pf-v5-c-data-list__cell {
  padding-block: 14px;
  color: var(--synapse-muted-foreground);
}

.cred-title {
  font-size: 1rem;
  font-weight: 650;
}

.pf-v5-c-form-control,
.pf-v5-c-select__toggle,
.pf-v5-c-text-input-group {
  min-height: 44px;
  border-color: var(--synapse-border);
  border-radius: 10px;
  background: var(--synapse-surface);
  color: var(--synapse-foreground);
  font-family: inherit;
  font-size: 16px;
}

.pf-v5-c-form-control:focus-within,
.pf-v5-c-select__toggle:focus,
.pf-v5-c-text-input-group:focus-within {
  border-color: var(--synapse-primary);
  box-shadow: 0 0 0 3px rgb(26 125 100 / 0.24);
}

.pf-v5-c-button {
  min-height: 40px;
  border-radius: 999px;
  font-family: inherit;
  font-weight: 650;
}

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

.pf-v5-c-button.pf-m-primary:hover,
.pf-v5-c-button.pf-m-primary:focus {
  background: var(--synapse-primary-hover);
}

.pf-v5-c-button.pf-m-secondary,
.pf-v5-c-button.pf-m-tertiary {
  border-color: var(--synapse-border);
  color: var(--synapse-foreground);
}

.pf-v5-c-button.pf-m-link {
  color: var(--synapse-primary);
}

.pf-v5-c-button:focus-visible,
.pf-v5-c-nav__link:focus-visible,
a:focus-visible {
  box-shadow: 0 0 0 3px rgb(26 125 100 / 0.28);
  outline: 2px solid transparent;
}

.pf-v5-c-alert {
  border-radius: 10px;
  box-shadow: var(--synapse-shadow-md);
}

.pf-v5-c-label,
.pf-v5-c-chip {
  border-radius: 999px;
}

code,
.pf-v5-c-code-block,
.pf-v5-c-clipboard-copy {
  font-family: "Geist Mono", ui-monospace, monospace;
}

html.pf-v5-theme-dark {
  --synapse-background: #0e1113;
  --synapse-surface: #161a1d;
  --synapse-surface-muted: #1e2429;
  --synapse-foreground: #eceff1;
  --synapse-muted-foreground: #aab1b7;
  --synapse-border: #30373d;
  --synapse-primary: #2fa98a;
  --synapse-primary-hover: #45b99b;
  --synapse-primary-foreground: #08120e;
  --synapse-accent: #1b2b26;
  --synapse-accent-foreground: #cdece2;
  --synapse-attention: #e19a84;
  --synapse-masthead: #13211f;
  --synapse-masthead-foreground: #eceff1;
  --synapse-shadow-md: 0 6px 16px rgb(0 0 0 / 0.34);
  --synapse-shadow-lg: 0 16px 40px rgb(0 0 0 / 0.44);
  --pf-v5-global--BackgroundColor--100: var(--synapse-surface);
  --pf-v5-global--BackgroundColor--200: var(--synapse-surface-muted);
  --pf-v5-global--Color--100: var(--synapse-foreground);
  --pf-v5-global--Color--200: var(--synapse-muted-foreground);
  --pf-v5-global--BorderColor--100: var(--synapse-border);
}

html.pf-v5-theme-dark .pf-v5-c-page {
  background:
    radial-gradient(circle at 58% 8%, rgb(47 169 138 / 0.16), transparent 32rem),
    var(--synapse-background);
}

html.synapse-theme-dark .pf-v5-c-brand img,
html.synapse-theme-dark [data-testid="page-header"] img {
  filter: grayscale(1) brightness(0) invert(1);
}

@media (max-width: 768px) {
  .pf-v5-c-page__main-section {
    padding: 20px 16px;
  }

  .pf-v5-c-card,
  .pf-v5-c-data-list,
  .pf-v5-c-table {
    border-radius: 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/*
 * Audit F-48: an e-mail address is changed in Synapse (profile), never here.
 * Synapse refuses to move an address that carries a privilege; this console's
 * "Update email" would move it behind Synapse's back. The login theme's
 * update-email.ftl refuses the console-started action as well; hiding the
 * button keeps people from walking into that refusal.
 */
#update-email-btn {
  display: none !important;
}