/* Venkai docs — brand palette lifted from venkai.fr (theme-color #08090b,
   accent #12a2be). Material only accepts named palettes, so `primary: custom`
   resolves through these variables. */

:root {
  --vk-accent: #12a2be;
  --vk-accent-dark: #0e8299;
  --vk-ink: #08090b;
  --vk-ok: #4ade80;
}

[data-md-color-primary="custom"] {
  --md-primary-fg-color: var(--vk-ink);
  --md-primary-fg-color--light: #14171c;
  --md-primary-fg-color--dark: #000000;
  --md-primary-bg-color: #e7eaef;
  --md-primary-bg-color--light: #9aa3b0;
}

[data-md-color-accent="custom"] {
  --md-accent-fg-color: var(--vk-accent);
  --md-accent-fg-color--transparent: rgba(18, 162, 190, 0.1);
  --md-accent-bg-color: #ffffff;
}

[data-md-color-scheme="slate"] {
  --md-default-bg-color: #08090b;
  --md-default-bg-color--light: #0d0f12;
  --md-code-bg-color: #0d0f12;
  --md-typeset-a-color: var(--vk-accent);
}

[data-md-color-scheme="default"] {
  --md-typeset-a-color: var(--vk-accent-dark);
}

/* Status chips used across the docs to mark what is Stable / Beta /
   Experimental / Planned. Written as inline spans so they survive in search. */
.vk-status {
  display: inline-block;
  padding: 0.08rem 0.45rem;
  border-radius: 0.6rem;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  vertical-align: middle;
  border: 1px solid currentColor;
}
.vk-status.stable { color: #16a34a; }
.vk-status.beta { color: var(--vk-accent-dark); }
.vk-status.experimental { color: #d97706; }
.vk-status.planned { color: #6b7280; }
[data-md-color-scheme="slate"] .vk-status.stable { color: var(--vk-ok); }
[data-md-color-scheme="slate"] .vk-status.beta { color: var(--vk-accent); }

/* No table overrides here on purpose.
   Material already ships `display:inline-block; max-width:100%; overflow:auto`
   on bare tables — that IS the narrow-screen scroll. An earlier version of this
   file set `display:table` to "fix" table layout and silently removed it, so
   wide API tables pushed the whole page sideways on mobile. Leave it alone. */

.md-typeset .mermaid {
  margin: 1.2rem 0;
}