/* Header contrast modes for layouts where content/hero extends underneath the overlay header.
   Scoped only by explicit .header-on-* classes on the shared header component. */

.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item > .aux-item-content,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item > .aux-item-content .aux-menu-label,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item > .aux-item-content .aux-menu-icon,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item > .aux-item-content [class*="auxicon-"],
.aux-elementor-header.header-on-dark .chb-mobile-brand-name,
.aux-elementor-header.header-on-dark .aux-burger-box,
.aux-elementor-header.header-on-dark .aux-burger-box .aux-burger {
  color: #fff !important;
}

.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item:hover > .aux-item-content,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item.current-menu-item > .aux-item-content,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item.current_page_item > .aux-item-content,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item > .aux-item-content:focus-visible,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item:hover > .aux-item-content .aux-menu-label,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item.current-menu-item > .aux-item-content .aux-menu-label,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item.current_page_item > .aux-item-content .aux-menu-label,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item > .aux-item-content:focus-visible .aux-menu-label {
  color: #fff !important;
}

.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item > .aux-item-content::before,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item > .aux-item-content::after,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item .aux-submenu-indicator,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item .aux-submenu-indicator::before,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item .aux-submenu-indicator::after {
  color: #fff !important;
  border-color: #fff !important;
}

.aux-elementor-header.header-on-dark .chb-lang-switcher {
  background: rgba(0, 0, 0, 0.18) !important;
  border-color: rgba(255, 255, 255, 0.45) !important;
}

.aux-elementor-header.header-on-dark .chb-lang-btn {
  color: rgba(255, 255, 255, 0.82) !important;
}

.aux-elementor-header.header-on-dark .chb-lang-btn:hover,
.aux-elementor-header.header-on-dark .chb-lang-btn:focus-visible {
  color: #fff !important;
}

.aux-elementor-header.header-on-dark .chb-lang-btn.active {
  color: #fff !important;
  background: var(--chb-accent) !important;
}

/* Phlox renders the three burger strokes as borders, not backgrounds. */
.aux-elementor-header.header-on-dark .aux-burger-box .aux-burger::before,
.aux-elementor-header.header-on-dark .aux-burger-box .aux-burger::after,
.aux-elementor-header.header-on-dark .aux-burger-box .aux-burger span,
.aux-elementor-header.header-on-dark .aux-burger-box .aux-burger span.mid-line {
  border-color: #fff !important;
}

.aux-elementor-header.header-on-dark .aux-logo-anchor img {
  filter: brightness(0) invert(1);
}

.aux-elementor-header.header-on-dark .aux-burger-box:focus-visible,
.aux-elementor-header.header-on-dark .chb-lang-btn:focus-visible,
.aux-elementor-header.header-on-dark .aux-master-menu > .menu-item > .aux-item-content:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}

/* Mobile location-page behavior:
   - closed over a dark hero: the normal header-on-dark burger rule stays white;
   - fullscreen menu open: restore the site's normal light-panel/dark-ink treatment.
   The existing menu script exposes the open state through inline display:block on .aux-fs-popup. */
@media (max-width: 767px) {
  .aux-elementor-header.header-on-dark:has(.aux-fs-popup[style*="display: block"]) .chb-mobile-brand-name,
  .aux-elementor-header.header-on-dark:has(.aux-fs-popup[style*="display: block"]) .aux-burger-box,
  .aux-elementor-header.header-on-dark:has(.aux-fs-popup[style*="display: block"]) .aux-burger-box .aux-burger,
  .aux-elementor-header.header-on-dark .aux-fs-popup .aux-master-menu > .menu-item > .aux-item-content,
  .aux-elementor-header.header-on-dark .aux-fs-popup .aux-master-menu > .menu-item > .aux-item-content .aux-menu-label,
  .aux-elementor-header.header-on-dark .aux-fs-popup .aux-master-menu > .menu-item > .aux-item-content .aux-menu-icon,
  .aux-elementor-header.header-on-dark .aux-fs-popup .aux-master-menu > .menu-item > .aux-item-content [class*="auxicon-"] {
    color: #0c0c0c !important;
  }

  .aux-elementor-header.header-on-dark:has(.aux-fs-popup[style*="display: block"]) .aux-burger-box .aux-burger::before,
  .aux-elementor-header.header-on-dark:has(.aux-fs-popup[style*="display: block"]) .aux-burger-box .aux-burger::after,
  .aux-elementor-header.header-on-dark:has(.aux-fs-popup[style*="display: block"]) .aux-burger-box .aux-burger span,
  .aux-elementor-header.header-on-dark:has(.aux-fs-popup[style*="display: block"]) .aux-burger-box .aux-burger span.mid-line {
    border-color: #0c0c0c !important;
  }

  .aux-elementor-header.header-on-dark:has(.aux-fs-popup[style*="display: block"]) .aux-logo-anchor img {
    filter: none !important;
  }

  .aux-elementor-header.header-on-dark:has(.aux-fs-popup[style*="display: block"]) .chb-lang-switcher {
    background: transparent !important;
    border-color: #0c0c0c !important;
  }

  .aux-elementor-header.header-on-dark:has(.aux-fs-popup[style*="display: block"]) .chb-lang-btn {
    color: #7a8392 !important;
  }

  .aux-elementor-header.header-on-dark:has(.aux-fs-popup[style*="display: block"]) .chb-lang-btn.active {
    color: #fff !important;
    background: var(--chb-accent) !important;
  }

  .aux-elementor-header.header-on-dark .aux-fs-popup .aux-panel-close,
  .aux-elementor-header.header-on-dark .aux-fs-popup .aux-close,
  .aux-elementor-header.header-on-dark .aux-fs-popup .aux-cross-symbol {
    color: #0c0c0c !important;
    border-color: #0c0c0c !important;
  }

  .aux-elementor-header.header-on-dark .aux-fs-popup .aux-close::before,
  .aux-elementor-header.header-on-dark .aux-fs-popup .aux-close::after,
  .aux-elementor-header.header-on-dark .aux-fs-popup .aux-cross-symbol::before,
  .aux-elementor-header.header-on-dark .aux-fs-popup .aux-cross-symbol::after {
    background-color: #0c0c0c !important;
    border-color: #0c0c0c !important;
  }
}

/* Explicit light mode hook. The current site default is already dark text on light backgrounds,
   so this class intentionally inherits the existing header styling without global overrides. */
.aux-elementor-header.header-on-light {
  --chb-header-contrast-mode: light;
}