/* VectorLabz — tactical HUD docs theme (navy + brass). Overrides Material/Zensical
   palette variables for both schemes; dark ("slate") is the default. */

:root {
  --vl-brass: #b58a3e;
  --vl-brass-bright: #d9b36b;
  --vl-navy: #0b1220;
  --vl-navy-2: #0f1a2e;
}

/* Brass as the primary + accent across both light and dark schemes. */
[data-md-color-scheme="slate"],
[data-md-color-scheme="default"] {
  --md-primary-fg-color: var(--vl-brass);
  --md-primary-fg-color--light: var(--vl-brass-bright);
  --md-primary-fg-color--dark: #8a6a2e;
  --md-accent-fg-color: var(--vl-brass-bright);
  --md-typeset-a-color: var(--vl-brass-bright);
}

/* Dark scheme → deep navy surfaces + subtle brass hairlines (the HUD look). */
[data-md-color-scheme="slate"] {
  --md-default-bg-color: var(--vl-navy);
  --md-default-fg-color: #dbe4f0;
  --md-default-fg-color--light: #aab6c8;
  --md-code-bg-color: #0a101c;
  --md-code-fg-color: #e6d3a8;
  --md-footer-bg-color: #070c16;
  --md-primary-bg-color: var(--vl-navy);
}

/* Header: navy glass with a brass underline. */
.md-header {
  background: color-mix(in oklab, var(--vl-navy) 88%, transparent);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid color-mix(in oklab, var(--vl-brass) 35%, transparent);
}
.md-header--shadow { box-shadow: 0 1px 0 color-mix(in oklab, var(--vl-brass) 25%, transparent); }

/* Wordmark + tabs in brass. */
.md-header__title, .md-tabs { letter-spacing: 0.02em; }
.md-tabs__link--active, .md-nav__link--active { color: var(--vl-brass-bright); }

/* Grid cards → glass panels with a brass edge on hover. */
.md-typeset .grid.cards > ul > li,
.md-typeset .grid > .card {
  border: 1px solid color-mix(in oklab, var(--vl-brass) 22%, transparent);
  border-radius: 10px;
  background: color-mix(in oklab, var(--vl-navy-2) 70%, transparent);
  transition: border-color .2s ease, transform .2s ease;
}
.md-typeset .grid.cards > ul > li:hover {
  border-color: var(--vl-brass);
  transform: translateY(-2px);
}

/* Admonitions: brass note/tip accents. */
.md-typeset .admonition, .md-typeset details {
  border-left: 2px solid color-mix(in oklab, var(--vl-brass) 60%, transparent);
  border-radius: 8px;
}

/* Code blocks: navy with a hairline. */
[data-md-color-scheme="slate"] .md-typeset pre > code {
  border: 1px solid color-mix(in oklab, var(--vl-brass) 15%, transparent);
  border-radius: 8px;
}

/* Buttons / active states pick up the brass accent automatically via --md-accent. */