/* VibeWarden brand colors: purple #7C3AED -> cyan #06B6D4 */
:root {
  --vw-purple: #7C3AED;
  --vw-cyan: #06B6D4;
}

/* Hero gradient on the landing page */
.md-typeset .hero-gradient {
  background: linear-gradient(135deg, var(--vw-purple) 0%, var(--vw-cyan) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Make the primary color match our exact brand purple */
[data-md-color-primary=deep-purple] {
  --md-primary-fg-color: #7C3AED;
  --md-primary-fg-color--light: #9D65F5;
  --md-primary-fg-color--dark: #5B21B6;
}

[data-md-color-accent=cyan] {
  --md-accent-fg-color: #06B6D4;
}

/* Match fonts with landing page */
.md-typeset {
  font-family: system-ui, -apple-system, sans-serif;
}

/* ===== Shared top navigation bar (injected by theme-sync.js) ===== */

#vw-topbar {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #FFFFFF;
  border-bottom: 1px solid #E8E5F0;
  padding: 12px 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 16px;
  line-height: 1.5;
}

[data-md-color-scheme="slate"] #vw-topbar {
  background: #0F0E1A;
  border-bottom-color: #2A2840;
}

.vw-topbar-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.vw-topbar-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 18px;
  color: #0F0E1A;
  text-decoration: none;
}

.vw-topbar-logo:hover { text-decoration: none; }

.vw-topbar-logo img {
  width: 28px;
  height: 28px;
}

[data-md-color-scheme="slate"] .vw-topbar-logo {
  color: #E0DEF0;
}

.vw-topbar-nav {
  display: flex;
  align-items: center;
  gap: 24px;
}

.vw-topbar-nav a {
  color: #4A4A6A;
  text-decoration: none;
  font-size: 14.4px;
  font-weight: 500;
}

.vw-topbar-nav a:hover {
  color: #8B5CF6;
  text-decoration: none;
}

.vw-topbar-nav a.vw-active {
  color: #7C3AED;
  font-weight: 600;
}

[data-md-color-scheme="slate"] .vw-topbar-nav a {
  color: #9A9ABB;
}

[data-md-color-scheme="slate"] .vw-topbar-nav a:hover {
  color: #8B5CF6;
}

[data-md-color-scheme="slate"] .vw-topbar-nav a.vw-active {
  color: #8B5CF6;
}

.vw-theme-toggle {
  background: none;
  border: 1px solid #E8E5F0;
  border-radius: 8px;
  padding: 6.4px;
  cursor: pointer;
  color: #4A4A6A;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  transition: border-color 0.2s, color 0.2s;
}

.vw-theme-toggle:hover {
  border-color: #7C3AED;
  color: #7C3AED;
}

.vw-theme-toggle svg {
  width: 18px !important;
  height: 18px !important;
}

[data-md-color-scheme="slate"] .vw-theme-toggle {
  border-color: #2A2840;
  color: #9A9ABB;
}

[data-md-color-scheme="slate"] .vw-theme-toggle:hover {
  border-color: #8B5CF6;
  color: #8B5CF6;
}

/* ===== Hide MkDocs native header elements that duplicate the shared bar ===== */

/* Hide the logo, palette toggle, and source repo from MkDocs header
   since they're now in the shared top bar */
.md-header .md-header__button.md-logo,
.md-header .md-header__button[for="__palette_0"],
.md-header .md-header__button[for="__palette_1"],
.md-header [data-md-component="palette"],
.md-header .md-header__source {
  display: none;
}

/* Restyle remaining MkDocs header as a secondary nav (search + title) */
.md-header {
  position: sticky;
  box-shadow: none;
}

[data-md-color-scheme="default"] .md-header {
  background: #F8F7FC;
  color: #0F0E1A;
}

[data-md-color-scheme="default"] .md-header .md-header__title,
[data-md-color-scheme="default"] .md-header .md-header__topic {
  color: #0F0E1A;
}

[data-md-color-scheme="default"] .md-header .md-search__input {
  background: #FFFFFF;
  color: #0F0E1A;
}

[data-md-color-scheme="default"] .md-header .md-header__button {
  color: #4A4A6A;
}

/* Tabs restyle */
[data-md-color-scheme="default"] .md-tabs {
  background: #F8F7FC;
  border-bottom: 1px solid #E8E5F0;
}

[data-md-color-scheme="default"] .md-tabs__link {
  color: #4A4A6A;
}

[data-md-color-scheme="default"] .md-tabs__link--active,
[data-md-color-scheme="default"] .md-tabs__item--active .md-tabs__link {
  color: #7C3AED;
}

/* Dark mode secondary header — slightly lighter than topbar for visual separation */
[data-md-color-scheme="slate"] .md-header {
  background: #1A1830;
  color: #E0DEF0;
}

[data-md-color-scheme="slate"] .md-tabs {
  background: #1A1830;
  border-bottom: 1px solid #2A2840;
}

[data-md-color-scheme="slate"] .md-tabs__link {
  color: #9A9ABB;
}

[data-md-color-scheme="slate"] .md-tabs__link--active,
[data-md-color-scheme="slate"] .md-tabs__item--active .md-tabs__link {
  color: #8B5CF6;
}

/* Logo image transparency */
.md-header .md-logo img {
  background: transparent;
  object-fit: contain;
}