/* WordPress theme behavior overrides (header / mobile menu). */

[data-vts-header].is-scrolled,
[data-vts-header]:has([data-vts-menu-panel].is-open) {
  border-bottom-color: var(--border);
  background-color: color-mix(in oklab, var(--background) 90%, transparent);
  backdrop-filter: blur(12px);
}

[data-vts-header].is-scrolled .vts-logo-mark,
[data-vts-header]:has([data-vts-menu-panel].is-open) .vts-logo-mark {
  background-color: var(--ink);
  color: var(--ink-foreground);
}

[data-vts-header].is-scrolled .vts-logo-word,
[data-vts-header]:has([data-vts-menu-panel].is-open) .vts-logo-word {
  color: var(--foreground);
}

[data-vts-header].is-scrolled .vts-nav-link,
[data-vts-header]:has([data-vts-menu-panel].is-open) .vts-nav-link,
[data-vts-header].is-scrolled a.vts-header-phone,
[data-vts-header]:has([data-vts-menu-panel].is-open) a.vts-header-phone {
  color: var(--muted-foreground);
}

[data-vts-header].is-scrolled .vts-nav-link:hover,
[data-vts-header]:has([data-vts-menu-panel].is-open) .vts-nav-link:hover,
[data-vts-header].is-scrolled a.vts-header-phone:hover,
[data-vts-header]:has([data-vts-menu-panel].is-open) a.vts-header-phone:hover {
  color: var(--foreground);
}

[data-vts-header].is-scrolled .vts-header-cta,
[data-vts-header]:has([data-vts-menu-panel].is-open) .vts-header-cta {
  background: var(--ink);
  color: var(--ink-foreground);
}

[data-vts-header].is-scrolled [data-vts-menu-toggle],
[data-vts-header]:has([data-vts-menu-panel].is-open) [data-vts-menu-toggle] {
  border-color: var(--border);
}

[data-vts-header].is-scrolled [data-vts-menu-toggle] span > span,
[data-vts-header]:has([data-vts-menu-panel].is-open) [data-vts-menu-toggle] span > span {
  background-color: var(--foreground);
}

[data-vts-menu-panel] {
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}

[data-vts-menu-panel].is-open {
  pointer-events: auto;
  opacity: 1;
  visibility: visible;
}

.admin-bar [data-vts-header] {
  top: 32px;
}

@media (max-width: 782px) {
  .admin-bar [data-vts-header] {
    top: 46px;
  }
}