/*
 * FlexVault documentation theme.
 * Palette and typography match the main site at https://fxv.dev.
 * The body font (Inter) is loaded by Zensical via [project.theme.font];
 * Geist (used for headings) is imported here.
 */

@import url("https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&display=swap");

/* Brand blue as the primary/accent color in both light and dark schemes. */
[data-md-color-scheme="default"],
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #1260e8;
  --md-primary-fg-color--light: #3d82f0;
  --md-primary-fg-color--dark: #0c47a8;
  --md-accent-fg-color: #0082f3;
}

/* Dark scheme tuned to the fxv.dev near-black background and stroke. */
[data-md-color-scheme="slate"] {
  --md-default-bg-color: #0a0a0a;
  --md-default-fg-color: #fafafa;
  --md-typeset-color: #fafafa;
}

/* Headings use Geist; body text falls back to the Zensical text font (Inter). */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-typeset h5,
.md-typeset h6 {
  font-family: "Geist", var(--md-text-font, "Inter"), sans-serif;
}

/*
 * Logo: the dark-mode mark is configured in zensical.toml and used by default.
 * When the light scheme is active, swap in the light-mode mark, whose slate
 * accents read against a white background. This covers both the header logo and
 * the one in the mobile navigation drawer.
 */
[data-md-color-scheme="default"] .md-header__button.md-logo img,
[data-md-color-scheme="default"] .md-nav__button.md-logo img {
  content: url("../images/icon_lightmode.png");
}

/*
 * Mermaid gitGraph colors are NOT set here.
 *
 * Zensical renders each mermaid diagram into a closed shadow root
 * (div.mermaid -> attachShadow({mode:"closed"})), so page stylesheets cannot
 * reach the generated SVG at all - specificity and !important make no
 * difference. Only inherited custom properties cross that boundary, which is
 * why the --md-mermaid-* variables work for flowcharts and sequence diagrams.
 *
 * gitGraph has no such variables, so its palette is set per diagram with a
 * %%{init: {"themeVariables": ...}}%% directive in the Markdown instead.
 */