/*
 * Aligns the generated Help surface with the authenticated Baukosten-Cockpit application without changing Zensical markup.
 */
:root {
  --md-text-font: "General Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

:root > * {
  --md-primary-fg-color: var(--color-primary);
  --md-primary-fg-color--light: var(--color-focus);
  --md-primary-fg-color--dark: var(--color-primary-dark);
  --md-accent-fg-color: var(--color-primary);
  --md-accent-fg-color--transparent: rgba(var(--rgb-primary), .12);
  --md-default-fg-color: var(--color-text);
  --md-default-fg-color--light: var(--color-text-secondary);
  --md-default-fg-color--lighter: var(--color-text-muted);
  --md-default-fg-color--lightest: var(--color-border);
  --md-default-bg-color: var(--color-page-bg);
  --md-default-bg-color--light: var(--color-surface);
  --md-default-bg-color--lighter: var(--color-surface-soft);
  --md-default-bg-color--lightest: var(--color-secondary-bg);
  --md-typeset-a-color: var(--color-primary-hover);
  --md-code-fg-color: var(--color-text);
  --md-code-bg-color: var(--color-surface-soft);
  --md-footer-fg-color: var(--color-text-secondary);
  --md-footer-bg-color: transparent;
  --md-footer-bg-color--dark: rgba(var(--rgb-surface), .82);
}

body {
  background:
    radial-gradient(circle at 8% -8%, rgba(var(--rgb-primary), .13) 0, rgba(var(--rgb-primary), 0) 34%),
    radial-gradient(circle at 92% 2%, rgba(var(--rgb-chart-mint), .12) 0, rgba(var(--rgb-chart-mint), 0) 32%),
    linear-gradient(180deg, var(--color-page-bg) 0%, var(--color-nav-active-bg) 100%);
  color: var(--color-text);
}

.md-grid {
  max-width: 1440px;
}

.md-header {
  background: rgba(var(--rgb-surface), .88);
  color: var(--color-text);
  border-bottom: 1px solid rgba(var(--rgb-border), .86);
  box-shadow: 0 10px 30px rgba(var(--rgb-text), .06);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}

.md-header__button,
.md-header__title {
  color: var(--color-text);
}

.md-header__button:hover,
.md-header__button:focus-visible {
  color: var(--color-primary);
}

.md-main__inner {
  margin-top: 1.5rem;
}

.md-sidebar__inner {
  margin-bottom: 1rem;
  padding: .7rem;
  background: rgba(var(--rgb-surface), .72);
  border: 1px solid var(--color-border);
  border-radius: 16px;
  box-shadow: 0 10px 24px rgba(var(--rgb-text), .045);
}

.md-nav__title {
  color: var(--color-text);
  font-weight: 700;
}

.md-nav__link {
  padding: .45rem .6rem;
  color: var(--color-text-secondary);
  border-radius: 12px;
}

.md-nav__link:hover,
.md-nav__link:focus-visible {
  background: rgba(var(--rgb-focus), .08);
  color: var(--color-text);
}

.md-nav__link--active,
.md-nav__item--active > .md-nav__link {
  background: linear-gradient(135deg, rgba(var(--rgb-focus), .10), rgba(var(--rgb-chart-mint), .08));
  color: var(--color-primary-dark);
  box-shadow: 0 8px 20px rgba(var(--rgb-text), .045);
}

.md-content__inner {
  margin-bottom: 2rem;
  padding: 2rem 2.25rem;
  background: rgba(var(--rgb-surface), .94);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.md-typeset h1 {
  margin-bottom: 1rem;
  color: var(--color-text);
  font-size: 1.45rem;
  font-weight: 700;
  letter-spacing: -.025em;
}

.md-typeset h2 {
  margin-top: 2.2rem;
  padding-bottom: .45rem;
  color: var(--color-text);
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -.015em;
  border-bottom: 1px solid var(--color-border);
}

.md-typeset h3 {
  color: var(--color-text);
  font-size: 1rem;
  font-weight: 700;
}

.md-typeset p,
.md-typeset li {
  line-height: 1.65;
}

.md-typeset a {
  color: var(--color-primary-hover);
  text-decoration-thickness: .08em;
  text-underline-offset: .15em;
}

.md-typeset a:hover,
.md-typeset a:focus-visible {
  color: var(--color-primary-dark);
}

.md-typeset blockquote {
  margin-left: 0;
  padding: 1rem 1.1rem;
  background: var(--color-secondary-bg);
  color: var(--color-text-secondary);
  border-left: .25rem solid var(--color-primary);
  border-radius: 0 14px 14px 0;
}

.md-typeset__table {
  overflow: hidden;
  background: var(--color-surface);
  border: 0;
  border-radius: 0;
}

.md-typeset__table table:not([class]) {
  width: 100%;
  margin: 0;
  background: var(--color-surface);
  border: 0;
  border-collapse: separate;
  border-spacing: 0;
}

.md-typeset table:not([class]) th {
  background: var(--color-table-header-bg);
  color: var(--color-table-header-text);
  font-weight: 700;
}

.md-typeset table:not([class]) td {
  background: var(--color-table-row-bg);
  color: var(--color-text);
}

.md-typeset table:not([class]) th,
.md-typeset table:not([class]) td {
  padding: .75rem .9rem;
  border-color: var(--color-table-border);
}

.md-typeset code {
  color: var(--color-text);
  background: var(--color-surface-soft);
  border-radius: 6px;
}

.md-typeset pre > code {
  border: 1px solid var(--color-border);
  border-radius: 14px;
  box-shadow: 0 10px 24px rgba(var(--rgb-text), .045);
}

.md-typeset .admonition,
.md-typeset details {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 16px;
  box-shadow: 0 10px 24px rgba(var(--rgb-text), .045);
}

.md-footer {
  background: transparent;
  color: var(--color-text-secondary);
}

.md-footer-meta {
  background: rgba(var(--rgb-surface), .82);
  border-top: 1px solid rgba(var(--rgb-border), .86);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

.md-top {
  background: var(--color-primary);
  color: var(--color-on-primary);
  border-radius: 14px;
  box-shadow: var(--shadow-primary);
}

.md-top:hover,
.md-top:focus-visible {
  background: var(--color-primary-hover);
  color: var(--color-on-primary);
}

.md-header__button:focus-visible,
.md-nav__link:focus-visible,
.md-typeset a:focus-visible,
.md-top:focus-visible {
  outline: 3px solid var(--color-primary-dark);
  outline-offset: 2px;
}

/* Match the Zensical layout below 1220 px. */
@media screen and (max-width: 76.234375em) {
  .md-main__inner {
    margin-top: 1rem;
  }

  .md-content__inner {
    padding: 1.6rem;
    border-radius: 18px;
  }
}

/* Match the Zensical mobile layout below 720 px. */
@media screen and (max-width: 44.984375em) {
  .md-content__inner {
    margin-bottom: 1rem;
    padding: 1.25rem 1rem;
    border-radius: 16px;
  }

  .md-typeset h1 {
    font-size: 1.35rem;
  }

  .md-typeset h2 {
    font-size: 1.1rem;
  }

  .md-typeset table:not([class]) th,
  .md-typeset table:not([class]) td {
    padding: .65rem .7rem;
  }
}