/* Only confirmed UI presets are bridged. Literal white remains literal white. */
html[data-vh-theme="enabled"][data-theme="dark"] {
  --wp--preset--color--base: var(--vh-color-bg);
  --wp--preset--color--contrast: var(--vh-color-text);
  --wp--preset--color--primary: var(--vh-color-text);
  --wp--preset--color--light: var(--vh-color-surface);
  --wp--preset--color--accent: var(--vh-color-accent-text);
  --wp--preset--color--secondary: var(--vh-color-accent-text-secondary);
  --wp--preset--color--custom-hover: var(--vh-color-accent-text-hover);
  --wp--preset--color--secondary-950: var(--vh-color-text-secondary);
  --wp--preset--color--secondary-900: var(--vh-color-text-secondary);
  --wp--preset--color--secondary-800: var(--vh-color-text-secondary);
  --wp--preset--color--secondary-700: var(--vh-color-text-secondary);
  --wp--preset--color--secondary-600: var(--vh-color-text-muted);
  --wp--preset--color--secondary-500: var(--vh-color-text-muted);
  --wp--preset--color--secondary-400: var(--vh-color-text-muted);
  --wp--preset--color--secondary-300: var(--vh-color-text-muted);
  --wp--preset--color--secondary-200: var(--vh-color-border-subtle);
  --wp--preset--color--secondary-100: var(--vh-color-border-subtle);
  --wp--preset--color--secondary-50: var(--vh-color-border-subtle);
}
html[data-vh-theme="enabled"][data-theme="dark"],
html[data-vh-theme="enabled"][data-theme="dark"] body {
  background-color: var(--vh-color-bg);
  color: var(--vh-color-text);
}
html[data-vh-theme="enabled"][data-theme="dark"] .wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay),
html[data-vh-theme="enabled"][data-theme="dark"] .wp-block-navigation .wp-block-navigation__submenu-container {
  background-color: var(--vh-color-menu-bg);
  color: var(--vh-color-text);
  border-color: var(--vh-color-border-subtle);
}
html[data-vh-theme="enabled"][data-theme="dark"] :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--vh-color-focus);
  outline-offset: 3px;
}
@media (forced-colors: active) {
  .vh-appearance select:focus-visible { outline-color: Highlight; }
}

/* Explicit variant of the verified black-only VoteHub wordmark (header and
   the footer's site logo block). */
html[data-vh-theme="enabled"][data-theme="dark"] .wp-header-image img[src$="/votehub-logo.svg"],
html[data-vh-theme="enabled"][data-theme="dark"] img.custom-logo[src$="/votehub-logo.svg"] {
  content: url("../images/votehub-logo-dark.svg");
}
/* Text roles are separate from black cover overlays and white button labels. */
html[data-vh-theme="enabled"][data-theme="dark"] .has-black-color,
html[data-vh-theme="enabled"][data-theme="dark"] .has-black-color a:where(:not(.wp-element-button)) {
  color: var(--vh-color-text) !important;
}
/* Core paints the "button inside" search wrapper white with a gray border. */
html[data-vh-theme="enabled"][data-theme="dark"] .wp-block-search__inside-wrapper {
  background: var(--vh-color-field-bg);
  border-color: var(--vh-color-border-control);
}
html[data-vh-theme="enabled"][data-theme="dark"] .wp-block-search__button-only.wp-block-search__searchfield-hidden .wp-block-search__inside-wrapper {
  background: transparent;
}
html[data-vh-theme="enabled"][data-theme="dark"] .wp-block-search__input {
  background-color: var(--vh-color-field-bg);
  color: var(--vh-color-text);
  border-color: var(--vh-color-border-control);
}

/* Datawrapper charts render their own dark variant (embed-theme.js); no white canvas around them. */
html[data-vh-theme="enabled"][data-theme="dark"] iframe[src*="datawrapper.dwcdn.net/"],
html[data-vh-theme="enabled"][data-theme="dark"] iframe[src*="datawrapper.de/"] {
  background-color: transparent;
  color-scheme: dark;
}

/* Redistricting tracker: its saved script paints a white notice chip over the
   map with inline styles, so only !important can reach it. */
html[data-vh-theme="enabled"][data-theme="dark"] #mapWrapper > div[style*="rgba(255, 255, 255, 0.95)"] {
  background: var(--vh-color-surface-raised) !important;
  color: var(--vh-color-text) !important;
}