/* Import shared brand colors (copied during build from docs/shared/colors.css) */
@import url('./colors.css');

.md-typeset [data-development-docs][hidden] {
  display: none;
}

/* Map brand colors to MkDocs Material variables */
/* Light mode: light blue header */
[data-md-color-scheme="default"] {
  --md-primary-fg-color: #4a8bc2;
  --md-primary-fg-color--light: var(--brand-primary-light);
  --md-primary-fg-color--dark: var(--brand-primary-dark);
}

/* Dark mode: dark blue header to match logo, lighter links */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #0b3a66;
  --md-typeset-a-color: #6ba3d6;
}

/* Logo sizing */
.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  height: 1.6rem;
}

/* Never shred identifiers: Material's `code { word-break: break-word }` lets a
   value key wrap mid-token in narrow table columns (`haproxyVersio\nn`). Keep
   inline-code tokens whole inside tables — wide tables scroll horizontally in
   Material's scrollwrap instead. */
.md-typeset table:not([class]) code {
  word-break: normal;
}

/* Mermaid renders client-side: without this, the raw diagram definition
   flashes as a code block before the SVG replaces it. The <pre> only exists
   pre-render (or on a parse failure, which the authoring probe catches). */
.md-typeset pre.mermaid > code {
  visibility: hidden;
}

.md-typeset .docs-version-note {
  border-left: .15rem solid var(--md-default-fg-color--lighter);
  padding: .3rem .7rem;
  font-size: .7rem;
}

/* ---- per-page feedback line (overrides/main.html) ------------------------ */
.hx-feedback {
  margin-top: 2.4em; padding-top: .8em;
  border-top: 1px solid var(--md-default-fg-color--lightest);
  font-size: .64rem; color: var(--md-default-fg-color--light);
}

/* ---- mobile: keep code blocks and tables inside the text margins -------- */
/* Material full-bleeds .highlight / pre / table scrollwraps edge-to-edge on
   phones (margin: 0 -.8rem). Every other element keeps the 16px side margin,
   which makes the bleed read as a layout bug rather than a feature. Restore
   the margins and the rounded corners the bleed variant drops. */
@media screen and (max-width: 45em) {
  .md-content__inner .highlight,
  .md-content__inner > pre,
  .md-content__inner .md-typeset__scrollwrap {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .md-content__inner .highlight code,
  .md-content__inner .highlight pre,
  .md-content__inner > pre code {
    border-radius: .1rem;
  }
}