/**
 * 12D – WordPress Menu
 *
 * File assets/css/wordpress-menu.css
 *
 * Detailed Elementor styling controls follow in Phase 3C.
 */

.d12-wordpress-menu,
.d12-wordpress-menu * {
  box-sizing: border-box;
}

.d12-wordpress-menu {
  --d12-menu-dropdown-gap: 0px;

  --d12-menu-dropdown-radius-tl: 0;
  --d12-menu-dropdown-radius-tr: 0;
  --d12-menu-dropdown-radius-br: 0;
  --d12-menu-dropdown-radius-bl: 0;

  --d12-menu-caret-spacing: 2px;

  --d12-menu-main-normal-text: var(--e-global-color-text);

  --d12-menu-main-focus-text: var(
    --d12-menu-accent-hover,
    var(--e-global-color-accent)
  );

  --d12-menu-main-focus-background: transparent;

  /*
 * The ordinary component border remains independent from the keyboard
 * Focus Indicator. A visible Focus border is therefore opt-in through
 * Elementor's Border controls.
 */
  --d12-menu-main-focus-border: transparent;

  /*
 * Keyboard Focus Indicator.
 *
 * Uses Accent Hover by default, matching the shared 12D interaction-state
 * palette while remaining independent from the ordinary component border.
 */
  --d12-menu-main-focus-indicator: var(
    --d12-menu-accent-hover,
    var(--e-global-color-accent)
  );

  --d12-menu-main-current-text: var(--d12-menu-white);
  --d12-menu-main-current-background: var(--e-global-color-accent);

  --d12-menu-main-hover-text: var(--d12-menu-white);
  --d12-menu-main-hover-background: var(
    --d12-menu-accent-hover,
    var(--e-global-color-accent)
  );

  /*
   * Dropdown item semantic state palette.
   *
   * Elementor controls override these variables per widget instance.
   * Clearing an override restores these component defaults.
   */
  --d12-menu-dropdown-normal-text: var(--e-global-color-text);
  --d12-menu-dropdown-normal-background: transparent;

  --d12-menu-dropdown-hover-text: var(--d12-menu-white);
  --d12-menu-dropdown-hover-background: var(
    --d12-menu-accent-hover,
    var(--e-global-color-accent)
  );

  --d12-menu-dropdown-focus-text: var(
    --d12-menu-accent-hover,
    var(--e-global-color-accent)
  );
  --d12-menu-dropdown-focus-background: transparent;
  --d12-menu-dropdown-focus-border: var(
    --d12-menu-accent-hover,
    var(--e-global-color-accent)
  );

  --d12-menu-dropdown-current-text: var(--d12-menu-white);
  --d12-menu-dropdown-current-background: var(--e-global-color-accent);

  /*
   * Mobile Menu item semantic state palette.
   *
   * Elementor controls override these variables per widget instance.
   * Clearing an override restores these component defaults.
   */
  --d12-menu-mobile-normal-text: var(--e-global-color-text);
  --d12-menu-mobile-normal-background: transparent;

  --d12-menu-mobile-hover-text: var(--d12-menu-white);
  --d12-menu-mobile-hover-background: var(
    --d12-menu-accent-hover,
    var(--e-global-color-accent)
  );

  --d12-menu-mobile-focus-text: var(
    --d12-menu-accent-hover,
    var(--e-global-color-accent)
  );
  --d12-menu-mobile-focus-background: transparent;

  --d12-menu-mobile-current-text: var(--d12-menu-white);
  --d12-menu-mobile-current-background: var(--e-global-color-accent);

/*
 * Mobile toggle semantic state palette.
 *
 * The toggle follows the same Normal / Hover / Focus color model as the
 * navigation items. Elementor controls may override each variable per widget.
 */
  --d12-menu-toggle-normal-icon: var(--e-global-color-text);
  --d12-menu-toggle-normal-background: transparent;
  --d12-menu-toggle-normal-border: transparent;

  --d12-menu-toggle-hover-icon: var(--d12-menu-white);
  --d12-menu-toggle-hover-background: var(
    --d12-menu-accent-hover,
    var(--e-global-color-accent)
  );
  --d12-menu-toggle-hover-border: transparent;

  --d12-menu-toggle-focus-icon: var(
    --d12-menu-accent-hover,
    var(--e-global-color-accent)
  );
  --d12-menu-toggle-focus-background: transparent;
  --d12-menu-toggle-focus-border: transparent;

/*
 * Mobile toggle border geometry is shared across states.
 */
  --d12-menu-toggle-border-style: none;
  --d12-menu-toggle-border-width: 1px;
  --d12-menu-toggle-border-radius: 0;

/*
 * Desktop submenu caret semantic state palette.
 *
 * Normal preserves the historical inherited caret appearance. Hover remains
 * visually inherited by default. Focus follows the shared 12D Focus palette:
 * Accent Hover foreground/border with a transparent background.
 *
 * Elementor Caret controls can override each value per widget instance.
 */
  --d12-menu-caret-normal-icon: inherit;
  --d12-menu-caret-normal-background: transparent;
  --d12-menu-caret-normal-border: transparent;

  --d12-menu-caret-hover-icon: inherit;
  --d12-menu-caret-hover-background: transparent;
  --d12-menu-caret-hover-border: transparent;

  --d12-menu-caret-focus-icon: var(
    --d12-menu-accent-hover,
    var(--e-global-color-accent)
  );
  --d12-menu-caret-focus-background: transparent;
  --d12-menu-caret-focus-border: var(
    --d12-menu-accent-hover,
    var(--e-global-color-accent)
  );

  position: relative;
  width: 100%;
}

.d12-wordpress-menu
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:hover {
  background-color: var(--d12-menu-main-hover-background);
}

.d12-wordpress-menu
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:hover
  > .d12-wordpress-menu__link,
.d12-wordpress-menu
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:hover
  > .d12-wordpress-menu__submenu-toggle {
  color: var(--d12-menu-main-hover-text);
}

/*
 * Keep the widget hidden until JavaScript has resolved its configured
 * responsive breakpoint and applied the correct desktop or mobile mode.
 */
.d12-wordpress-menu:not(.is-initialized) {
  visibility: hidden;
}

.d12-wordpress-menu.is-initialized {
  visibility: visible;
}

.d12-wordpress-menu__toggle {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 0.4em;
  margin: 0;
  padding: 0.5rem;
  color: inherit;
  background: transparent;
  border: 0;
  cursor: pointer;
}

/*
 * Mobile toggle semantic states.
 *
 * The toggle is a component-owned button. Theme and global button styles
 * must not override colors explicitly resolved by the widget's
 * Normal / Hover / Focus controls.
 *
 * Border geometry remains shared across states; only border color changes.
 */
.d12-wordpress-menu > .d12-wordpress-menu__toggle {
  color: var(--d12-menu-toggle-normal-icon) !important;
  background-color: var(--d12-menu-toggle-normal-background) !important;
  border-color: var(--d12-menu-toggle-normal-border) !important;
}

.d12-wordpress-menu > .d12-wordpress-menu__toggle:hover {
  color: var(--d12-menu-toggle-hover-icon) !important;
  background-color: var(--d12-menu-toggle-hover-background) !important;
  border-color: var(--d12-menu-toggle-hover-border) !important;
}

.d12-wordpress-menu > .d12-wordpress-menu__toggle:focus-visible {
  color: var(--d12-menu-toggle-focus-icon) !important;
  background-color: var(--d12-menu-toggle-focus-background) !important;
  border-color: var(--d12-menu-toggle-focus-border) !important;
  outline: 2px solid var(--d12-menu-toggle-focus-icon);
  outline-offset: 2px;
}

.d12-wordpress-menu__toggle-icon {
  display: inline-flex;
  width: 1em;
  height: 1em;
  flex: 0 0 1em;
  align-items: center;
  justify-content: center;
  color: inherit;
  fill: currentColor;
}

.d12-wordpress-menu__toggle-icon svg {
  color: inherit;
  fill: currentColor;
}

.d12-wordpress-menu__toggle-icon--close {
  display: none;
}

.d12-wordpress-menu.is-menu-open .d12-wordpress-menu__toggle-icon--open {
  display: none;
}

.d12-wordpress-menu.is-menu-open .d12-wordpress-menu__toggle-icon--close {
  display: inline-flex;
}

.d12-wordpress-menu__panel {
  width: 100%;
}

.d12-wordpress-menu__list,
.d12-wordpress-menu__submenu {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
  outline: 0;
  box-shadow: none;
}

/*
 * The top-level menu list itself never has a border.
 *
 * Do not apply this reset to submenu panels, because their border is
 * controlled through Elementor's Dropdown → Border controls.
 */
.d12-wordpress-menu__list {
  border: 0 !important;
}

/*
 * Prevent generic WordPress/theme .menu styles from adding a visible edge
 * to the mobile navigation list.
 */
.d12-wordpress-menu.is-mobile > .d12-wordpress-menu__panel,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list {
  border-inline-start: 0 !important;
  margin-inline-start: 0 !important;
  padding-inline-start: 0 !important;
  box-shadow: none !important;
}

/*
 * Prevent theme or global list styles from adding spacing between
 * dropdown items.
 *
 * Normal provides the baseline Dropdown Item state. Elementor controls
 * can override the component variables for an individual widget instance.
 */
.d12-wordpress-menu__submenu > .d12-wordpress-menu__item {
  margin: 0;
  border-color: transparent;
  background-color: var(--d12-menu-dropdown-normal-background);
}

.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link,
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link:visited,
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__submenu-toggle {
  color: var(--d12-menu-dropdown-normal-text) !important;
}

/*
 * Dropdown Item Hover state.
 *
 * Hover is pointer-only and remains independent from keyboard Focus.
 */
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item:hover {
  background-color: var(--d12-menu-dropdown-hover-background);
}

.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item:hover
  > .d12-wordpress-menu__link,
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item:hover
  > .d12-wordpress-menu__submenu-toggle {
  color: var(--d12-menu-dropdown-hover-text) !important;
}

/*
 * Dropdown Item keyboard Focus state.
 *
 * Only direct :focus-visible descendants activate this state, matching the
 * Main Menu architecture. Pointer clicks therefore do not masquerade as
 * keyboard Focus.
 */
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item:has(> .d12-wordpress-menu__link:focus-visible),
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item:has(
    > .d12-wordpress-menu__submenu-toggle:focus-visible
  ) {
  background-color: var(--d12-menu-dropdown-focus-background);
  border-color: var(--d12-menu-dropdown-focus-border) !important;
}

.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item:has(> .d12-wordpress-menu__link:focus-visible)
  > .d12-wordpress-menu__link,
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item:has(> .d12-wordpress-menu__link:focus-visible)
  > .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item:has(
    > .d12-wordpress-menu__submenu-toggle:focus-visible
  )
  > .d12-wordpress-menu__link,
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item:has(
    > .d12-wordpress-menu__submenu-toggle:focus-visible
  )
  > .d12-wordpress-menu__submenu-toggle {
  color: var(--d12-menu-dropdown-focus-text) !important;
}

/*
 * Dropdown Item Current state.
 *
 * Custom menu items are deliberately excluded from current-menu-item because
 * WordPress may mark same-page/custom URL entries as current even though they
 * do not represent the persistent page state used by this component.
 */
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .current-menu-item:not(.menu-item-type-custom),
.d12-wordpress-menu .d12-wordpress-menu__submenu > .current_page_item {
  background-color: var(--d12-menu-dropdown-current-background);
}

.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .current-menu-item:not(.menu-item-type-custom)
  > .d12-wordpress-menu__link,
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .current_page_item
  > .d12-wordpress-menu__link,
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .current-menu-item:not(.menu-item-type-custom)
  > .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  > .current_page_item
  > .d12-wordpress-menu__submenu-toggle {
  color: var(--d12-menu-dropdown-current-text) !important;
}

/*
 * Keep first and last submenu item backgrounds inside the rounded panel
 * without clipping nested fly-out submenus.
 */
.d12-wordpress-menu.is-desktop
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item:first-child,
.d12-wordpress-menu.is-desktop
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item:first-child
  > .d12-wordpress-menu__link {
  border-start-start-radius: var(--d12-menu-dropdown-radius-tl);
  border-start-end-radius: var(--d12-menu-dropdown-radius-tr);
}

.d12-wordpress-menu.is-desktop
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item:last-child,
.d12-wordpress-menu.is-desktop
  .d12-wordpress-menu__submenu
  > .d12-wordpress-menu__item:last-child
  > .d12-wordpress-menu__link {
  border-end-start-radius: var(--d12-menu-dropdown-radius-bl);
  border-end-end-radius: var(--d12-menu-dropdown-radius-br);
}

.d12-wordpress-menu__list {
  display: flex;
  align-items: center;
}

.d12-wordpress-menu--align-left .d12-wordpress-menu__list {
  justify-content: flex-start;
}

.d12-wordpress-menu--align-center .d12-wordpress-menu__list {
  justify-content: center;
}

.d12-wordpress-menu--align-right .d12-wordpress-menu__list {
  justify-content: flex-end;
}

.d12-wordpress-menu--align-justify
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item {
  flex: 1 1 0;
  text-align: center;
}

.d12-wordpress-menu__item {
  position: relative;

  /*
   * Keep state borders geometrically present without exposing a theme or
   * browser border color when Elementor has no explicit color configured.
   *
   * Elementor-generated controls can override the border type, width, and
   * state-specific colors for an individual widget instance.
   */
  border-style: solid;
  border-width: 1px;
  border-color: transparent;
}

.d12-wordpress-menu__link {
  display: inline-flex;
  align-items: center;
}

.d12-wordpress-menu__submenu-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  color: inherit;
  background: transparent;
  border: 0;
  cursor: pointer;
}

/*
 * Desktop spacing between the menu label and the submenu caret.
 */
.d12-wordpress-menu.is-desktop .d12-wordpress-menu__submenu-toggle {
  margin-inline-start: var(--d12-menu-caret-spacing);
}

/*
 * Prevent theme button hover/focus styles from affecting submenu toggles.
 * Hello Elementor applies button hover backgrounds unless they are reset.
 */
.d12-wordpress-menu__submenu-toggle:hover,
.d12-wordpress-menu__submenu-toggle:focus,
.d12-wordpress-menu__submenu-toggle:active,
.d12-wordpress-menu__submenu-toggle:focus-visible {
  color: inherit;
  background: transparent;
  border: 0;
  box-shadow: none;
  transform: none;
  appearance: none;
  -webkit-appearance: none;
}

.d12-wordpress-menu__indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: inherit;
  font-style: normal;
  font-weight: inherit;
  line-height: 1;
  white-space: nowrap;
  transition: transform 180ms ease;
}

/*
 * Desktop mode
 */

.d12-wordpress-menu.is-desktop > .d12-wordpress-menu__toggle {
  display: none;
}

.d12-wordpress-menu.is-desktop > .d12-wordpress-menu__panel {
  display: block;
}

.d12-wordpress-menu.is-desktop .d12-wordpress-menu__submenu {
  display: none;
  position: absolute;
  inset-block-start: calc(100% + var(--d12-menu-dropdown-gap));
  inset-inline-start: 0;
  z-index: 1000;

  width: 12rem;
  margin: 0;
  padding: 0;

  /*
   * Safe base state. Elementor's Dropdown → Border controls override these
   * declarations when a border type, width, or color is configured.
   */
  border-style: none;
  border-width: 0;
  border-color: transparent;

  border-radius: var(--d12-menu-dropdown-radius-tl)
    var(--d12-menu-dropdown-radius-tr) var(--d12-menu-dropdown-radius-br)
    var(--d12-menu-dropdown-radius-bl);

  background-clip: padding-box;
}

/*
 * Desktop dropdown alignment relative to the parent menu item.
 * These rules affect only first-level desktop dropdowns.
 */
.d12-wordpress-menu--dropdown-align-left.is-desktop
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__submenu {
  inset-inline-start: 0;
  inset-inline-end: auto;
  transform: none;
}

.d12-wordpress-menu--dropdown-align-center.is-desktop
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__submenu {
  inset-inline-start: 50%;
  inset-inline-end: auto;
  transform: translateX(-50%);
}

.d12-wordpress-menu--dropdown-align-right.is-desktop
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__submenu {
  inset-inline-start: auto;
  inset-inline-end: 0;
  transform: none;
}

.d12-wordpress-menu.is-desktop
  .d12-wordpress-menu__submenu
  .d12-wordpress-menu__submenu {
  inset-block-start: 0;
  inset-inline-start: 100%;
}

.d12-wordpress-menu.is-desktop
  .d12-wordpress-menu__item.is-submenu-open
  > .d12-wordpress-menu__submenu {
  display: block;
}

/*
 * Mobile mode
 */

.d12-wordpress-menu.is-mobile > .d12-wordpress-menu__toggle {
  display: inline-flex;
}

.d12-wordpress-menu.is-mobile > .d12-wordpress-menu__panel {
  display: none;
}

.d12-wordpress-menu.is-mobile.is-menu-open > .d12-wordpress-menu__panel {
  display: block;
}

.d12-wordpress-menu.is-mobile .d12-wordpress-menu__list {
  display: block;
  width: 100%;
}

.d12-wordpress-menu.is-mobile .d12-wordpress-menu__item {
  width: 100%;
}

.d12-wordpress-menu.is-mobile
  .d12-wordpress-menu__item:not(.menu-item-has-children) {
  display: block;
}

.d12-wordpress-menu.is-mobile
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link {
  display: flex;
  width: 100%;
  min-width: 0;
}

/*
 * Parent links must share their row with the independent submenu toggle.
 */
.d12-wordpress-menu.is-mobile
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item.menu-item-has-children
  > .d12-wordpress-menu__link {
  width: auto;
}

.d12-wordpress-menu.is-mobile .d12-wordpress-menu__submenu {
  display: none;
  position: static;
  width: 100%;
}

.d12-wordpress-menu.is-mobile
  .d12-wordpress-menu__item.is-submenu-open
  > .d12-wordpress-menu__submenu {
  display: block;
}

.d12-wordpress-menu.is-mobile > .d12-wordpress-menu__panel {
  position: absolute;
  inset-block-start: 100%;
  z-index: 10000;
  overflow: visible;
}

/*
 * Mobile dropdown width modes.
 *
 * Full width spans the viewport, independently of the widget/container
 * width. Contained remains constrained to the widget itself.
 */
.d12-wordpress-menu--mobile-full.is-mobile > .d12-wordpress-menu__panel {
  inset-inline-start: var(--d12-menu-viewport-offset, 0px);
  width: var(--d12-menu-viewport-width, 100vw);
  max-width: none;
}

.d12-wordpress-menu--mobile-contained.is-mobile > .d12-wordpress-menu__panel {
  inset-inline-start: 0;
  width: 100%;
  max-width: 100%;
}

/*
 * Keep the mobile menu above subsequent page content without changing
 * the height of the Elementor header container.
 */
.d12-wordpress-menu.is-mobile.is-menu-open {
  z-index: 10000;
}

/*
 * Reduced motion
 */

@media (prefers-reduced-motion: reduce) {
  .d12-wordpress-menu__indicator {
    transition: none;
  }
}

/*
 * Base link normalization.
 *
 * Top-level menu links inherit the component's semantic Normal text color.
 * Elementor's Main Menu → Normal → Text Color control can override the
 * component variable for an individual widget instance.
 */
.d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link,
.d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link:visited,
.d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__submenu-toggle {
  color: var(--d12-menu-main-normal-text);
  text-decoration: none;
}

.d12-wordpress-menu__link,
.d12-wordpress-menu__link:visited {
  text-decoration: none;
}

/*
 * Prevent theme or Elementor global Link Hover/Focus typography from changing
 * menu-item geometry. Typography belongs to the widget's own Typography
 * controls and must remain stable across interaction states.
 */
.d12-wordpress-menu .d12-wordpress-menu__link:hover,
.d12-wordpress-menu .d12-wordpress-menu__link:focus {
  text-decoration: none;
  line-height: inherit !important;
}

/*
 * Main Menu keyboard Focus state.
 *
 * Focus is intentionally based on :focus-visible so pointer clicks do not
 * activate keyboard Focus styling.
 */
.d12-wordpress-menu__list
  > .d12-wordpress-menu__item:has(> .d12-wordpress-menu__link:focus-visible) {
  background-color: var(--d12-menu-main-focus-background);
  border-color: var(--d12-menu-main-focus-border) !important;
}

.d12-wordpress-menu__list
  > .d12-wordpress-menu__item:has(
    > .d12-wordpress-menu__submenu-toggle:focus-visible
  ) {
  border-color: transparent !important;
}

.d12-wordpress-menu.is-desktop
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:has(> .d12-wordpress-menu__link:focus-visible)
  > .d12-wordpress-menu__link,
.d12-wordpress-menu.is-desktop
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:has(> .d12-wordpress-menu__link:focus-visible)
  > .d12-wordpress-menu__submenu-toggle {
  color: var(--d12-menu-main-focus-text);
}

/*
 * Main Menu Current state.
 *
 * WordPress current-item classes represent the persistent semantic state.
 * Historical Elementor control IDs containing "active" are retained only
 * for backward compatibility.
 */
.d12-wordpress-menu__list > .current-menu-item,
.d12-wordpress-menu__list > .current-menu-parent,
.d12-wordpress-menu__list > .current-menu-ancestor,
.d12-wordpress-menu__list > .current_page_item,
.d12-wordpress-menu__list > .current_page_parent,
.d12-wordpress-menu__list > .current_page_ancestor {
  background-color: var(--d12-menu-main-current-background);
}

.d12-wordpress-menu
  .d12-wordpress-menu__list
  > .current-menu-item
  > .d12-wordpress-menu__link,
.d12-wordpress-menu
  .d12-wordpress-menu__list
  > .current-menu-parent
  > .d12-wordpress-menu__link,
.d12-wordpress-menu
  .d12-wordpress-menu__list
  > .current-menu-ancestor
  > .d12-wordpress-menu__link,
.d12-wordpress-menu
  .d12-wordpress-menu__list
  > .current_page_item
  > .d12-wordpress-menu__link,
.d12-wordpress-menu
  .d12-wordpress-menu__list
  > .current_page_parent
  > .d12-wordpress-menu__link,
.d12-wordpress-menu
  .d12-wordpress-menu__list
  > .current_page_ancestor
  > .d12-wordpress-menu__link,
.d12-wordpress-menu
  .d12-wordpress-menu__list
  > .current-menu-item
  > .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu
  .d12-wordpress-menu__list
  > .current-menu-parent
  > .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu
  .d12-wordpress-menu__list
  > .current-menu-ancestor
  > .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu
  .d12-wordpress-menu__list
  > .current_page_item
  > .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu
  .d12-wordpress-menu__list
  > .current_page_parent
  > .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu
  .d12-wordpress-menu__list
  > .current_page_ancestor
  > .d12-wordpress-menu__submenu-toggle {
  color: var(--d12-menu-main-current-text);
}

/*
 * Main Menu keyboard Focus Indicator.
 *
 * The top-level destination link is the independently focusable keyboard
 * target, so the Focus Indicator belongs to that link rather than to its
 * structural parent menu item.
 *
 * The indicator remains independent from the ordinary Focus-state border.
 *
 * !important is required on the outline because themes such as OceanWP apply
 * !important focus-outline declarations to generic links. The 12D component
 * must retain ownership of its explicitly configured Focus Indicator.
 */
.d12-wordpress-menu
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link:focus-visible {
  outline: 2px solid var(--d12-menu-main-focus-indicator, currentColor) !important;
  outline-offset: 2px !important;
  border-radius: inherit;
}

/*
 * Submenu caret semantic states.
 *
 * Caret color controls are shared across desktop and mobile because they are
 * non-responsive Elementor controls. The disclosure button remains an
 * independent interactive control while its parent navigation item retains
 * its own semantic state.
 */
.d12-wordpress-menu .d12-wordpress-menu__submenu-toggle {
  color: var(--d12-menu-caret-normal-icon);
  background-color: var(--d12-menu-caret-normal-background);
}

.d12-wordpress-menu .d12-wordpress-menu__submenu-toggle:hover {
  color: var(--d12-menu-caret-hover-icon);
  background-color: var(--d12-menu-caret-hover-background);
  border-color: var(--d12-menu-caret-hover-border);
}

/*
 * The caret's own keyboard Focus state takes precedence over the semantic
 * state of its parent menu item. This affects only the independently focused
 * disclosure button; the destination link retains its own menu-item state.
 *
 * !important is required for the icon color because the existing Mobile Menu
 * Focus architecture deliberately uses !important to resolve Current + Focus
 * precedence on direct top-level controls.
 */
.d12-wordpress-menu .d12-wordpress-menu__submenu-toggle:focus-visible {
  color: var(--d12-menu-caret-focus-icon) !important;
  background-color: var(--d12-menu-caret-focus-background) !important;
  outline: 2px solid var(--d12-menu-caret-focus-border);
  outline-offset: 2px;
}

/*
 * When keyboard focus moves from a top-level destination link to its separate
 * submenu toggle, hide the parent item's Focus border so only the exact
 * focused control is indicated. This avoids two simultaneous focus borders.
 */
.d12-wordpress-menu__list
  > .d12-wordpress-menu__item:has(
    > .d12-wordpress-menu__submenu-toggle:focus-visible
  ) {
  border-color: transparent !important;
}

/*
 * Freeze theme-induced border changes on menu links and submenu-toggle
 * buttons. Submenu-toggle transforms are also isolated from theme styles,
 * while menu-link transforms remain available to shared D12 Hover Effects.
 */
.d12-wordpress-menu a,
.d12-wordpress-menu a:hover,
.d12-wordpress-menu a:focus,
.d12-wordpress-menu a:active {
  border: none;
}

.d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu__submenu-toggle:hover,
.d12-wordpress-menu__submenu-toggle:focus,
.d12-wordpress-menu__submenu-toggle:active {
  border: none;
  transform: none;
}

/*
 * Parent menu items contain:
 * 1. the destination link,
 * 2. the independent submenu toggle,
 * 3. the submenu on the following row.
 */
.d12-wordpress-menu__item.menu-item-has-children {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.d12-wordpress-menu__item.menu-item-has-children > .d12-wordpress-menu__link {
  flex: 0 1 auto;
  min-width: 0;
}

.d12-wordpress-menu__submenu-toggle {
  flex: 0 0 auto;
  min-width: 2rem;
  min-height: 2rem;
}

/*
 * Mobile parent items use an explicit grid so the submenu toggle cannot
 * wrap underneath the parent label.
 */
.d12-wordpress-menu.is-mobile .d12-wordpress-menu__item.menu-item-has-children {
  display: grid;
  align-items: center;
}

/* Far-right mode: label fills the row and toggle stays at the right edge. */
.d12-wordpress-menu--indicator-edge.is-mobile
  .d12-wordpress-menu__item.menu-item-has-children {
  grid-template-columns: minmax(0, 1fr) auto;
}

/* Next-to-label mode: toggle remains immediately beside the label. */
.d12-wordpress-menu--indicator-next.is-mobile
  .d12-wordpress-menu__item.menu-item-has-children {
  grid-template-columns: minmax(0, max-content) auto minmax(0, 1fr);
  column-gap: var(--d12-mobile-indicator-spacing, 8px);
}

.d12-wordpress-menu.is-mobile
  .d12-wordpress-menu__item.menu-item-has-children
  > .d12-wordpress-menu__link {
  grid-column: 1;
  width: auto;
  min-width: 0;
}

.d12-wordpress-menu.is-mobile
  .d12-wordpress-menu__item.menu-item-has-children
  > .d12-wordpress-menu__submenu-toggle {
  grid-column: 2;
  width: auto !important;
  min-width: 2rem;
  margin-inline-start: 0;
}

.d12-wordpress-menu.is-mobile
  .d12-wordpress-menu__item.menu-item-has-children
  > .d12-wordpress-menu__submenu {
  grid-column: 1 / -1;
  width: 100%;
}

/*
 * Make submenu links fill the available row so Elementor's submenu text
 * alignment control can align labels left, center, or right.
 */

/* Items without a nested submenu use the complete submenu row. */
.d12-wordpress-menu
  .d12-wordpress-menu__submenu
  .d12-wordpress-menu__item:not(.menu-item-has-children)
  > .d12-wordpress-menu__link {
  display: flex;
  width: 100%;
}

/*
 * Items with children reserve space for the independent submenu toggle.
 * On desktop and in mobile far-right mode, the destination link fills the
 * remaining row width.
 */
.d12-wordpress-menu.is-desktop
  .d12-wordpress-menu__submenu
  .d12-wordpress-menu__item.menu-item-has-children
  > .d12-wordpress-menu__link,
.d12-wordpress-menu--indicator-edge.is-mobile
  .d12-wordpress-menu__submenu
  .d12-wordpress-menu__item.menu-item-has-children
  > .d12-wordpress-menu__link {
  display: flex;
  flex: 1 1 auto;
  width: auto;
}

/*
 * In mobile next-to-label mode, keep the nested submenu indicator beside
 * its label rather than pushing it to the far edge.
 */
.d12-wordpress-menu--indicator-next.is-mobile
  .d12-wordpress-menu__submenu
  .d12-wordpress-menu__item.menu-item-has-children
  > .d12-wordpress-menu__link {
  display: flex;
  flex: 0 1 auto;
  width: auto;
}

/*
 * Mobile Menu item semantic states.
 *
 * These rules apply only to direct top-level Mobile Menu items. Dropdown
 * items continue to use the independent Dropdown semantic state palette.
 */

/* Normal */
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item {
  background-color: var(--d12-menu-mobile-normal-background);
}

.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link:visited,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__submenu-toggle {
  color: var(--d12-menu-mobile-normal-text);
}

/* Hover */
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:hover {
  background-color: var(--d12-menu-mobile-hover-background);
}

.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:hover
  > .d12-wordpress-menu__link,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:hover
  > .d12-wordpress-menu__submenu-toggle {
  color: var(--d12-menu-mobile-hover-text);
}

/* Current */
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current-menu-item,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current-menu-parent,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current-menu-ancestor,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current_page_item,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current_page_parent,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current_page_ancestor {
  background-color: var(--d12-menu-mobile-current-background);
}

.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current-menu-item
  > .d12-wordpress-menu__link,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current-menu-parent
  > .d12-wordpress-menu__link,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current-menu-ancestor
  > .d12-wordpress-menu__link,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current_page_item
  > .d12-wordpress-menu__link,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current_page_parent
  > .d12-wordpress-menu__link,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current_page_ancestor
  > .d12-wordpress-menu__link,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current-menu-item
  > .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current-menu-parent
  > .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current-menu-ancestor
  > .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current_page_item
  > .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current_page_parent
  > .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .current_page_ancestor
  > .d12-wordpress-menu__submenu-toggle {
  color: var(--d12-menu-mobile-current-text) !important;
}

/*
 * Keyboard Focus.
 *
 * Focus follows Current in the cascade intentionally. When an item is both
 * Current and keyboard-focused, Focus provides the temporary visual state
 * while the underlying semantic Current state remains unchanged.
 */
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:has(> .d12-wordpress-menu__link:focus-visible),
.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:has(
    > .d12-wordpress-menu__submenu-toggle:focus-visible
  ) {
  background-color: var(--d12-menu-mobile-focus-background);
}

.d12-wordpress-menu.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:has(> .d12-wordpress-menu__link:focus-visible)
  > .d12-wordpress-menu__link,
.d12-wordpress-menu.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:has(> .d12-wordpress-menu__link:focus-visible)
  > .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:has(
    > .d12-wordpress-menu__submenu-toggle:focus-visible
  )
  > .d12-wordpress-menu__link,
.d12-wordpress-menu.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:has(
    > .d12-wordpress-menu__submenu-toggle:focus-visible
  )
  > .d12-wordpress-menu__submenu-toggle {
  color: var(--d12-menu-mobile-focus-text) !important;
}

/*
 * Mobile submenu-toggle keyboard Focus.
 *
 * Mobile Menu Focus continues to control the destination-link text, but the
 * independently focused submenu toggle owns its Caret Focus icon color.
 *
 * Match the existing Mobile Focus specificity so the Caret Focus color can
 * override the generic Mobile Menu Focus color without affecting desktop.
 */
.d12-wordpress-menu.d12-wordpress-menu.is-mobile
  > .d12-wordpress-menu__panel
  > .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:has(
    > .d12-wordpress-menu__submenu-toggle:focus-visible
  )
  > .d12-wordpress-menu__submenu-toggle:focus-visible {
  color: var(--d12-menu-caret-focus-icon) !important;
}

/*
 * Preserve inherited state color for visited Mobile Menu links.
 */
.d12-wordpress-menu.is-mobile .d12-wordpress-menu__link:visited {
  color: inherit;
}

/*
 * Mobile toggle icon states.
 * Closed: show hamburger only.
 * Open: replace hamburger with close icon.
 */
.d12-wordpress-menu
  > .d12-wordpress-menu__toggle
  .d12-wordpress-menu__toggle-icon--open {
  display: inline-flex !important;
}

.d12-wordpress-menu
  > .d12-wordpress-menu__toggle
  .d12-wordpress-menu__toggle-icon--close {
  display: none !important;
}

.d12-wordpress-menu.is-menu-open
  > .d12-wordpress-menu__toggle
  .d12-wordpress-menu__toggle-icon--open {
  display: none !important;
}

.d12-wordpress-menu.is-menu-open
  > .d12-wordpress-menu__toggle
  .d12-wordpress-menu__toggle-icon--close {
  display: inline-flex !important;
}

/*
 * Desktop main-menu pointer.
 *
 * The pointer applies only to direct children of the top-level menu and is
 * intentionally disabled in mobile mode.
 */

.d12-wordpress-menu {
  --d12-menu-pointer-color: currentColor;
  --d12-menu-pointer-thickness: 2px;
  --d12-menu-pointer-width: 70%;
  --d12-menu-pointer-offset: 3px;
  --d12-menu-pointer-radius: 0;
  --d12-menu-pointer-duration: 250ms;
}

/*
 * Link-based pointer modes:
 * - Text / Link
 * - Custom width
 */
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-underline
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link {
  position: relative;
}

.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-underline
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link::after {
  content: "";
  position: absolute;
  z-index: 1;
  display: block;
  height: var(--d12-menu-pointer-thickness);
  background-color: var(--d12-menu-pointer-color);
  border-radius: var(--d12-menu-pointer-radius);
  pointer-events: none;
  opacity: 0;
  transform: scaleX(1);
  transition:
    opacity var(--d12-menu-pointer-duration) ease,
    transform var(--d12-menu-pointer-duration) ease;
}

/*
 * Text / Link width follows the rendered anchor width, including any link
 * padding configured through Elementor.
 */
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-width-text
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link::after {
  inset-inline-start: 0;
  width: 100%;
}

/*
 * Custom width is centered beneath or above the link.
 */
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-width-custom
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link::after {
  inset-inline-start: 50%;
  width: var(--d12-menu-pointer-width);
  margin-inline-start: calc(var(--d12-menu-pointer-width) / -2);
}

/*
 * Full-item mode uses the top-level list item rather than the link. This
 * includes the submenu indicator area where a top-level item has children.
 */
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-underline.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset-inline-start: 0;
  display: block;
  width: 100%;
  height: var(--d12-menu-pointer-thickness);
  background-color: var(--d12-menu-pointer-color);
  border-radius: var(--d12-menu-pointer-radius);
  pointer-events: none;
  opacity: 0;
  transform: scaleX(1);
  transition:
    opacity var(--d12-menu-pointer-duration) ease,
    transform var(--d12-menu-pointer-duration) ease;
}

/*
 * Full-item mode must suppress the link pseudo-element so only one pointer
 * is rendered.
 */
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link::after {
  content: none;
}

/*
 * Pointer position.
 *
 * A positive offset moves a bottom pointer farther downward or a top pointer
 * farther upward.
 */
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-position-bottom
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-position-bottom.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item::after {
  inset-block-end: calc(var(--d12-menu-pointer-offset) * -1);
}

.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-position-top
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-position-top.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item::after {
  inset-block-start: calc(var(--d12-menu-pointer-offset) * -1);
}

/*
 * Animation starting states.
 */
.d12-wordpress-menu--pointer-animation-center
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu--pointer-animation-center.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item::after {
  transform: scaleX(0);
  transform-origin: center;
}

.d12-wordpress-menu--pointer-animation-left
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu--pointer-animation-left.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item::after {
  transform: scaleX(0);
  transform-origin: left center;
}

.d12-wordpress-menu--pointer-animation-right
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu--pointer-animation-right.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item::after {
  transform: scaleX(0);
  transform-origin: right center;
}

/*
 * No-animation mode changes state immediately.
 */
.d12-wordpress-menu--pointer-animation-none
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu--pointer-animation-none.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item::after {
  transition: none;
}

/*
 * Hover state.
 *
 * Pointer Hover is intentionally separate from keyboard Focus.
 */
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:hover
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:hover::after {
  opacity: 1;
  transform: scaleX(1);
}

/*
 * Current state.
 *
 * The historical "active" class name is retained for backward
 * compatibility with existing Elementor documents.
 */
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-active
  .d12-wordpress-menu__list
  > .current-menu-item
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-active
  .d12-wordpress-menu__list
  > .current-menu-parent
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-active
  .d12-wordpress-menu__list
  > .current-menu-ancestor
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-active
  .d12-wordpress-menu__list
  > .current_page_item
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-active
  .d12-wordpress-menu__list
  > .current_page_parent
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-active
  .d12-wordpress-menu__list
  > .current_page_ancestor
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-active.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .current-menu-item::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-active.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .current-menu-parent::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-active.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .current-menu-ancestor::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-active.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .current_page_item::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-active.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .current_page_parent::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-active.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .current-menu-ancestor::after {
  opacity: 1;
  transform: scaleX(1);
}

/*
 * Combined hover and current state.
 *
 * Pointer Hover is intentionally separate from keyboard Focus.
 * The historical "hover-active" class name is retained for
 * backward compatibility with existing Elementor documents.
 */
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:hover
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active
  .d12-wordpress-menu__list
  > .current-menu-item
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active
  .d12-wordpress-menu__list
  > .current-menu-parent
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active
  .d12-wordpress-menu__list
  > .current-menu-ancestor
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active
  .d12-wordpress-menu__list
  > .current_page_item
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active
  .d12-wordpress-menu__list
  > .current_page_parent
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active
  .d12-wordpress-menu__list
  > .current_page_ancestor
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item:hover::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .current-menu-item::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .current-menu-parent::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .current-menu-ancestor::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .current_page_item::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .current_page_parent::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-hover-active.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .current_page_ancestor::after {
  opacity: 1;
  transform: scaleX(1);
}

/*
 * Always-visible state.
 */
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-always
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item
  > .d12-wordpress-menu__link::after,
.d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-display-always.d12-wordpress-menu--pointer-width-full
  .d12-wordpress-menu__list
  > .d12-wordpress-menu__item::after {
  opacity: 1;
  transform: scaleX(1);
}

/*
 * Respect the visitor's reduced-motion preference.
 */
@media (prefers-reduced-motion: reduce) {
  .d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-underline
    .d12-wordpress-menu__list
    > .d12-wordpress-menu__item
    > .d12-wordpress-menu__link::after,
  .d12-wordpress-menu.is-desktop.d12-wordpress-menu--pointer-underline.d12-wordpress-menu--pointer-width-full
    .d12-wordpress-menu__list
    > .d12-wordpress-menu__item::after {
    transition: none;
  }
}

/*
 * Fully isolate submenu-toggle buttons from theme button styles.
 *
 * Hello Elementor applies global button colors that may otherwise affect
 * submenu indicators when the menu is rendered outside Theme Builder.
 */
.d12-wordpress-menu .d12-wordpress-menu__submenu-toggle,
.d12-wordpress-menu .d12-wordpress-menu__submenu-toggle:hover,
.d12-wordpress-menu .d12-wordpress-menu__submenu-toggle:focus,
.d12-wordpress-menu .d12-wordpress-menu__submenu-toggle:focus-visible,
.d12-wordpress-menu .d12-wordpress-menu__submenu-toggle:active,
.d12-wordpress-menu .d12-wordpress-menu__submenu-toggle[aria-expanded="true"] {
  width: auto !important;
  max-width: none;
  margin-block: 0;
  padding: 0;
  border: 0 !important;
  border-radius: 0;
  box-shadow: none !important;
  transform: none;
  appearance: none;
  -webkit-appearance: none;
}

/*
 * Fully isolate the mobile hamburger button from global theme button
 * styling without overriding component-owned colors or border controls.
 *
 * Border geometry is controlled by the Mobile Toggle → Border controls.
 * Border color remains state-specific and is therefore intentionally not
 * reset in this isolation rule.
 */
.d12-wordpress-menu > .d12-wordpress-menu__toggle,
.d12-wordpress-menu > .d12-wordpress-menu__toggle:hover,
.d12-wordpress-menu > .d12-wordpress-menu__toggle:focus,
.d12-wordpress-menu > .d12-wordpress-menu__toggle:focus-visible,
.d12-wordpress-menu > .d12-wordpress-menu__toggle:active,
.d12-wordpress-menu.is-menu-open > .d12-wordpress-menu__toggle {
  width: auto;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0.5rem;
  line-height: 1;

  border-style: var(--d12-menu-toggle-border-style, none) !important;
  border-width: var(--d12-menu-toggle-border-width, 1px) !important;
  border-radius: var(--d12-menu-toggle-border-radius, 0) !important;

  box-shadow: none !important;
  transform: none;
  appearance: none;
  -webkit-appearance: none;
}

/*
 * Prevent theme list markers from appearing in the mobile menu.
 */
.d12-wordpress-menu__list,
.d12-wordpress-menu__submenu,
.d12-wordpress-menu__item {
  list-style: none !important;
}

.d12-wordpress-menu__item::marker {
  content: "";
}

/* End of file wordpress-menu.css */