/** * Native theme menus (Bootstrap .navbar-nav / .nav-menu) tagged with data-builder-nav-menu-id. * Keeps primary header links on one row unless overridden by inline styles from the editor. */ header ul.navbar-nav[data-builder-nav-menu-id], header ul.nav-menu[data-builder-nav-menu-id], [role="banner"] ul.navbar-nav[data-builder-nav-menu-id], [role="banner"] ul.nav-menu[data-builder-nav-menu-id], [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id], [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id], .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id], .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; list-style: none; margin: 0; padding-left: 0; /* Match editor.php #editor-preview-frame native nav: builder-nav-menu-widget.js sets --bnmw-link-* */ gap: var(--bnmw-link-row-gap, 4px) var(--bnmw-link-gap, 12px); } /* * preview.php wraps the page in #builder-gsp-preview-root; responsive-parity / template rules may * target #builder-gsp-preview-root .nav-menu with higher specificity than header ul... alone. * Mirror editor's #editor-preview-frame block so desktop spacing matches the editor canvas. */ #builder-gsp-preview-root header ul.navbar-nav[data-builder-nav-menu-id], #builder-gsp-preview-root header ul.nav-menu[data-builder-nav-menu-id], #builder-gsp-preview-root [role="banner"] ul.navbar-nav[data-builder-nav-menu-id], #builder-gsp-preview-root [role="banner"] ul.nav-menu[data-builder-nav-menu-id], #builder-gsp-preview-root [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id], #builder-gsp-preview-root [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id], #builder-gsp-preview-root .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id], #builder-gsp-preview-root .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; list-style: none; margin: 0; padding-left: 0; gap: var(--bnmw-link-row-gap, 4px) var(--bnmw-link-gap, 12px); } /* Native mobile toggle (injected by builder-nav-menu-widget.js) */ .builder-native-nav-menu-toggle { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 42px !important; height: 38px !important; border: 1px solid rgba(15, 23, 42, 0.16) !important; border-radius: 8px !important; background: var(--bnmw-toggle-bg, #f3f4f6) !important; color: var(--bnmw-toggle-icon, #111827) !important; padding: 0 !important; cursor: pointer !important; line-height: 1 !important; } .builder-native-nav-menu-toggle__icon { display: block !important; width: 20px !important; height: 20px !important; color: var(--bnmw-toggle-icon, #111827) !important; pointer-events: none; } header ul.navbar-nav[data-builder-nav-menu-id] > li, header ul.nav-menu[data-builder-nav-menu-id] > li, [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li, [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li, [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li, [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li, .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li, .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li { float: none; width: auto; max-width: none; display: inline-flex; align-items: center; flex: 0 0 auto; } #builder-gsp-preview-root header ul.navbar-nav[data-builder-nav-menu-id] > li, #builder-gsp-preview-root header ul.nav-menu[data-builder-nav-menu-id] > li, #builder-gsp-preview-root [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li, #builder-gsp-preview-root [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li, #builder-gsp-preview-root [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li, #builder-gsp-preview-root [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li, #builder-gsp-preview-root .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li, #builder-gsp-preview-root .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li { float: none; width: auto; max-width: none; display: inline-flex; align-items: center; flex: 0 0 auto; } /* * Desktop row: link padding + colour vars match editor.php #editor-preview-frame (lines ~14724+). * Vars are set by builder-nav-menu-widget.js applyLinkMetricVars / applyColorVars on the ul. * Mobile/collapsed menus use stricter selectors inside @media (max-width: 991px) below. */ header ul.navbar-nav[data-builder-nav-menu-id] > li > a, header ul.nav-menu[data-builder-nav-menu-id] > li > a, [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li > a, [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li > a, [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li > a, [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li > a, .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li > a, .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li > a { padding: var(--bnmw-link-pad-y, 8px) var(--bnmw-link-pad-x, 10px); color: var(--bnmw-link, inherit); background: var(--bnmw-link-bg, transparent); transition: color 0.2s ease, background-color 0.2s ease, transform 0.2s ease, opacity 0.2s ease; } header ul.navbar-nav[data-builder-nav-menu-id] > li > a:hover, header ul.nav-menu[data-builder-nav-menu-id] > li > a:hover, [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li > a:hover, [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li > a:hover, [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li > a:hover, [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li > a:hover, .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li > a:hover, .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li > a:hover { color: var(--bnmw-link-hover, inherit); background: var(--bnmw-link-hover-bg, transparent); } header ul.navbar-nav[data-builder-nav-menu-id] > li.active > a, header ul.nav-menu[data-builder-nav-menu-id] > li.active > a, header ul.navbar-nav[data-builder-nav-menu-id] > li > a[aria-current="page"], header ul.nav-menu[data-builder-nav-menu-id] > li > a[aria-current="page"], [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li.active > a, [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li.active > a, [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li > a[aria-current="page"], [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li > a[aria-current="page"], [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li.active > a, [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li.active > a, [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li > a[aria-current="page"], [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li > a[aria-current="page"], .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li.active > a, .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li.active > a, .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li > a[aria-current="page"], .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li > a[aria-current="page"] { color: var(--bnmw-link-active, inherit); background: var(--bnmw-link-active-bg, transparent); } #builder-gsp-preview-root header ul.navbar-nav[data-builder-nav-menu-id] > li > a, #builder-gsp-preview-root header ul.nav-menu[data-builder-nav-menu-id] > li > a, #builder-gsp-preview-root [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li > a, #builder-gsp-preview-root [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li > a, #builder-gsp-preview-root [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li > a, #builder-gsp-preview-root [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li > a, #builder-gsp-preview-root .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li > a, #builder-gsp-preview-root .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li > a { padding: var(--bnmw-link-pad-y, 8px) var(--bnmw-link-pad-x, 10px); color: var(--bnmw-link, inherit); background: var(--bnmw-link-bg, transparent); transition: color 0.2s ease, background-color 0.2s ease, transform 0.2s ease, opacity 0.2s ease; } #builder-gsp-preview-root header ul.navbar-nav[data-builder-nav-menu-id] > li > a:hover, #builder-gsp-preview-root header ul.nav-menu[data-builder-nav-menu-id] > li > a:hover, #builder-gsp-preview-root [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li > a:hover, #builder-gsp-preview-root [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li > a:hover, #builder-gsp-preview-root [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li > a:hover, #builder-gsp-preview-root [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li > a:hover, #builder-gsp-preview-root .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li > a:hover, #builder-gsp-preview-root .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li > a:hover { color: var(--bnmw-link-hover, inherit); background: var(--bnmw-link-hover-bg, transparent); } #builder-gsp-preview-root header ul.navbar-nav[data-builder-nav-menu-id] > li.active > a, #builder-gsp-preview-root header ul.nav-menu[data-builder-nav-menu-id] > li.active > a, #builder-gsp-preview-root header ul.navbar-nav[data-builder-nav-menu-id] > li > a[aria-current="page"], #builder-gsp-preview-root header ul.nav-menu[data-builder-nav-menu-id] > li > a[aria-current="page"], #builder-gsp-preview-root [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li.active > a, #builder-gsp-preview-root [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li.active > a, #builder-gsp-preview-root [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li > a[aria-current="page"], #builder-gsp-preview-root [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li > a[aria-current="page"], #builder-gsp-preview-root [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li.active > a, #builder-gsp-preview-root [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li.active > a, #builder-gsp-preview-root [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li > a[aria-current="page"], #builder-gsp-preview-root [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li > a[aria-current="page"], #builder-gsp-preview-root .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li.active > a, #builder-gsp-preview-root .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li.active > a, #builder-gsp-preview-root .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li > a[aria-current="page"], #builder-gsp-preview-root .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li > a[aria-current="page"] { color: var(--bnmw-link-active, inherit); background: var(--bnmw-link-active-bg, transparent); } /** * Desktop: primary submenus — avoid sideways layout from inline-flex rows, clip from overflow, * and theme !important on .dropdown-menu. Hover reveals children without relying on BS dropdown JS. */ @media (min-width: 992px) { header .navbar-collapse, header #navbar, header nav, [role="banner"] .navbar-collapse, [role="banner"] #navbar, [role="banner"] nav, [data-builder-global-region="header"] .navbar-collapse, [data-builder-global-region="header"] nav, .wpo-site-header .navbar-collapse, .wpo-site-header #navbar, .wpo-site-header nav, header .navigation-holder, [role="banner"] .navigation-holder, .wpo-site-header .navigation-holder { overflow: visible !important; } header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown, header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown, [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown, [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown, [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown, [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown, .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown, .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown { flex-direction: column; align-items: stretch; align-self: flex-start; position: relative; overflow: visible; } header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu { display: none !important; position: absolute !important; left: 0 !important; right: auto !important; top: 100% !important; float: none !important; transform: none !important; min-width: 200px; z-index: 50000; list-style: none; margin: 0; padding: 8px 0; background: #fff; border-radius: 6px; box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12); visibility: hidden; opacity: 0; pointer-events: none; } header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu { display: block !important; visibility: visible !important; opacity: 1 !important; pointer-events: auto !important; } header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a { display: block; padding: 8px 16px; color: #111827; font-weight: 500; font-size: 0.9375rem; text-transform: none; letter-spacing: normal; white-space: nowrap; } #builder-gsp-preview-root header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown, #builder-gsp-preview-root header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown, #builder-gsp-preview-root [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown, #builder-gsp-preview-root [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown, #builder-gsp-preview-root [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown, #builder-gsp-preview-root [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown, #builder-gsp-preview-root .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown, #builder-gsp-preview-root .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown { flex-direction: column; align-items: stretch; align-self: flex-start; position: relative; overflow: visible; } #builder-gsp-preview-root header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, #builder-gsp-preview-root header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, #builder-gsp-preview-root [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, #builder-gsp-preview-root [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, #builder-gsp-preview-root [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, #builder-gsp-preview-root [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, #builder-gsp-preview-root .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu, #builder-gsp-preview-root .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu { display: none !important; position: absolute !important; left: 0 !important; right: auto !important; top: 100% !important; float: none !important; transform: none !important; min-width: 200px; z-index: 50000; list-style: none; margin: 0; padding: 8px 0; background: #fff; border-radius: 6px; box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12); visibility: hidden; opacity: 0; pointer-events: none; } #builder-gsp-preview-root header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, #builder-gsp-preview-root header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, #builder-gsp-preview-root [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, #builder-gsp-preview-root [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, #builder-gsp-preview-root [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, #builder-gsp-preview-root [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, #builder-gsp-preview-root .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu, #builder-gsp-preview-root .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown:hover > .dropdown-menu { display: block !important; visibility: visible !important; opacity: 1 !important; pointer-events: auto !important; } #builder-gsp-preview-root header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, #builder-gsp-preview-root header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, #builder-gsp-preview-root [role="banner"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, #builder-gsp-preview-root [role="banner"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, #builder-gsp-preview-root [data-builder-global-region="header"] ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, #builder-gsp-preview-root [data-builder-global-region="header"] ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, #builder-gsp-preview-root .wpo-site-header ul.navbar-nav[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a, #builder-gsp-preview-root .wpo-site-header ul.nav-menu[data-builder-nav-menu-id] > li.dropdown > .dropdown-menu > li > a { display: block; padding: 8px 16px; color: #111827; font-weight: 500; font-size: 0.9375rem; text-transform: none; letter-spacing: normal; white-space: nowrap; } } /** * Mobile collapsed header menu: stacked full-width links (colours from * --bnmw-mobile-dd-* on ul[data-builder-nav-menu-id], set by builder-nav-menu-widget.js). */ @media (max-width: 991px) { /* * BNMW-injected toggle only (.builder-native-nav-menu-toggle from builder-nav-menu-widget.js). * Do not paint or reshape theme .navbar-toggler, .meanmenu-reveal, .sidebar__toggle, etc. — * those must stay 100% template-controlled on live sites and in editor preview. */ header .builder-native-nav-menu-toggle, [role="banner"] .builder-native-nav-menu-toggle, [data-builder-global-region="header"] .builder-native-nav-menu-toggle, .wpo-site-header .builder-native-nav-menu-toggle { position: relative !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 42px !important; height: 38px !important; min-width: 42px !important; min-height: 38px !important; padding: 0 !important; border: 1px solid rgba(15, 23, 42, 0.16) !important; border-radius: 8px !important; background: var(--bnmw-toggle-bg, #f3f4f6) !important; color: transparent !important; font-size: 0 !important; line-height: 1 !important; text-indent: -9999px !important; overflow: hidden !important; } header .builder-native-nav-menu-toggle::before, [role="banner"] .builder-native-nav-menu-toggle::before, [data-builder-global-region="header"] .builder-native-nav-menu-toggle::before, .wpo-site-header .builder-native-nav-menu-toggle::before { content: '' !important; position: absolute !important; left: 50% !important; top: 50% !important; width: 20px !important; height: 14px !important; transform: translate(-50%, -50%) !important; background: linear-gradient(#111827, #111827) 0 0 / 100% 2px no-repeat, linear-gradient(#111827, #111827) 0 6px / 100% 2px no-repeat, linear-gradient(#111827, #111827) 0 12px / 100% 2px no-repeat !important; border-radius: 1px !important; z-index: 1 !important; opacity: 1 !important; visibility: visible !important; pointer-events: none !important; } header .builder-native-nav-menu-toggle > *, [role="banner"] .builder-native-nav-menu-toggle > *, [data-builder-global-region="header"] .builder-native-nav-menu-toggle > *, .wpo-site-header .builder-native-nav-menu-toggle > * { opacity: 0 !important; visibility: hidden !important; } .navbar-collapse.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed, .navbar-collapse.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed, .navigation-holder.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed, .navigation-holder.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed, body.builder-mobile-menu-open ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed, body.builder-mobile-menu-open ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed { width: 100%; box-sizing: border-box; margin: 0; padding: 0; gap: 0; background: var(--bnmw-mobile-dd-bg, #5eb8ea); flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important; justify-content: flex-start !important; } .navbar-collapse.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li, .navbar-collapse.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li, .navigation-holder.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li, .navigation-holder.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li, body.builder-mobile-menu-open ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li, body.builder-mobile-menu-open ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li { width: 100%; max-width: none; display: block; float: none; border-bottom: 1px solid var(--bnmw-mobile-dd-divider, rgba(255, 255, 255, 0.22)); } .navbar-collapse.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li:last-child, .navbar-collapse.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li:last-child, .navigation-holder.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li:last-child, .navigation-holder.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li:last-child, body.builder-mobile-menu-open ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li:last-child, body.builder-mobile-menu-open ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li:last-child { border-bottom: none; } .navbar-collapse.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a, .navbar-collapse.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a, .navigation-holder.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a, .navigation-holder.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a, body.builder-mobile-menu-open ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a, body.builder-mobile-menu-open ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a { display: block; width: 100%; box-sizing: border-box; border-radius: 0; padding: 14px 20px; font-weight: 700; font-size: 0.95rem; letter-spacing: 0.04em; text-transform: uppercase; text-decoration: none; color: var(--bnmw-mobile-dd-link, #ffffff); background: transparent; transition: background-color 0.15s ease, color 0.15s ease; } .navbar-collapse.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a:hover, .navbar-collapse.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a:focus-visible, .navbar-collapse.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a:hover, .navbar-collapse.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a:focus-visible, .navigation-holder.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a:hover, .navigation-holder.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a:focus-visible, .navigation-holder.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a:hover, .navigation-holder.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a:focus-visible, body.builder-mobile-menu-open ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a:hover, body.builder-mobile-menu-open ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a:focus-visible, body.builder-mobile-menu-open ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a:hover, body.builder-mobile-menu-open ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li > a:focus-visible { color: var(--bnmw-mobile-dd-link-hover, #ffffff); background: var(--bnmw-mobile-dd-bg-hover, #111111); text-decoration: none; } .navbar-collapse.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li.active > a, .navbar-collapse.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li.active > a, .navigation-holder.collapse.show ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li.active > a, .navigation-holder.collapse.show ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li.active > a, body.builder-mobile-menu-open ul.navbar-nav[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li.active > a, body.builder-mobile-menu-open ul.nav-menu[data-builder-nav-menu-id].builder-native-nav-menu--collapsed > li.active > a { color: var(--bnmw-mobile-dd-link-hover, #ffffff); background: var(--bnmw-mobile-dd-bg-hover, #111111); } /* * Template-native primary menus (e.g. ul.navigation, ul.nav.navbar-nav) often have no * data-builder-nav-menu-id — stack all direct