/* ========================================
MOBILE ONLY STYLES
add and modify varibales for mobile breakpoint
========================================= */
html.dwc-mobile {
  --mobile-menu-width: min(450px, 100%);
  --menu-item-font-size: 18px;
  --dropdown-item-font-size: var(--menu-item-font-size);
  --back-text-font-size: 16px;
  --menu-item-hover-border-bg: initial;
}

/* ======================================= 
  GENERAL NAV STYLES 
========================================= */
:root {
  /* ========================
 GENERAL COLORS/BACKGROUND
  ======================== */
  --primary-clr: orangered;
  --header-bg: white;
  --dropdown-content-bg: white;
  --mobile-menu-bg: white;
  --mobile-menu-topbar-bg: white;


  /* ===============================
   GENERAL WIDTH | HEIGHT | SPACINGS
  ================================== */
  --mobile-menu-width: min(300px, 100%); /* mobile & offcanvas */
  --multilevel-dropdown-width: 200px;  
  --dropdown-content-gap: 1px; /* header -> dropdown gap, add unit (e.g. 0px) */
  --header-min-height: 60px;
  --fullscreen-mobile-menu-top-height: 60px;  
  --top-offset: 40px; /* when nav is below header */ 
  --dropdown-content-default-width: 1080px;  /* preview width & default width for dropdown content */


  /* ==============================================
    GENERAL BORDERS | SHADOWS | OVERLAY BACKDROP
  ================================================= */
  /* dropdown content */
  --dropdown-content-border-radius: 0px;
  --dropdown-content-shadow: 0px 5px 15px -10px rgb(0 0 0 / 0%);  
  --dropdown-content-border-size: 1px; /* at least 1px */
  --dropdown-content-border-color: var(--dropdown-content-bg);   

  /* overlay backdrop */
  --nav-overlay-backdrop-blur: 0px;
  --nav-overlay-backdrop-clr: rgba(0, 0, 0, 0.3);

  /* sidebar nav */
  --sidebar-shadow: 0px 0px 2px rgba(0, 0, 0, 0.7);

  /* radius for special mobile style on overlay header*/
  --mobile-menu-radius: var(--overlay-header-radius);

  /* 	mobile & offcanvas */
  --slide-out-speed: 1.3;


  /* ===============================
  MENU TOGGLE - Hamburger 
  (additional settings at line 202)
  ================================== */
  --menu-toggle-clr: var(--menu-item-clr);
  --menu-close-toggle-clr: var(--menu-item-clr);
  --menu-toggle-hover-clr: var(--menu-item-hover-clr);


  /* ========================
  MENU ITEMS
  ======================== */
  /* DEFAULT STATE */
  --menu-item-clr: #000;
  --menu-item-font-size: 14px;
  --menu-item-font-weight: 500;
  --menu-item-bg: initial; 

  /* HOVER STATE */
  --menu-item-hover-clr: var(--primary-clr);
  --menu-item-hover-bg: initial;
  --menu-item-hover-border-bg: var(--menu-item-active-border-bg);
  --menu-item-hover-border-height: var(--menu-item-active-border-height);

  /* ACTIVE STATE 
  (to exclude a link from this style, 
  add .dwc-exclude to its container)*/
  --menu-item-active-clr: var(--menu-item-hover-clr);
  --menu-item-active-bg: initial;
  --menu-item-active-border-bg: var(--primary-clr);
  --menu-item-active-border-height: 2px;

  /* PADDING | GAP */
  --menu-item-inline-padding: 1.1rem;
  --menu-item-block-padding: 1rem;
  --menu-items-gap: 0;

  /* BORDERS | RADIUS */
  --menu-item-border: 1px solid rgba(0, 0, 0, 0.1);
  --menu-item-radius: 0;
  
  /* CHEVRON (dropdown arrow) */
  --chevron-size: 14px;
  --chevron-clr: var(--menu-item-clr);
  --chevron-hover-clr: var(--menu-item-hover-clr);


  /* ========================
  MULTILEVEL DROPDOWN LINKS
  ======================== */
  /* DEFAULT STATE */
  --dropdown-item-clr: var(--menu-item-clr);
  --dropdown-item-font-size: var(--menu-item-font-size);
  --dropdown-item-bg: initial;
  --dropdown-indent-bg: rgb(0 0 0 / 5%);
  --dropdown-heading-clr: var(--primary-clr);

  /* HOVER STATE */
  --dropdown-item-hover-clr: var(--menu-item-hover-clr);
  --dropdown-item-hover-bg: white;

  /* EXPANDED STATE (PARENT) - mobile */
  /* when [data-submenu-reveal="expand"] */
  --dropdown-expanded-clr: white;
  --dropdown-expanded-bg: black;

  /* PADDING | GAP | INDENT */
  --dropdown-item-inline-padding: var(--menu-item-inline-padding);
  --dropdown-item-block-padding: var(--menu-item-block-padding);
  --dropdown-indent: 0.6rem;
  --dropdown-indent-item-pad-offset: 0.5;
  --dropdown-indent-line: solid 1px rgb(0 0 0 / 25%);

  /* OTHERS */
  --dropdown-inactive-overlay: rgb(0 0 0 / 10%);


  /* ========================
  MENU CTA BUTTON (ALL BUTTONS)
  ======================== */
  /* all cta buttons max width on mobile */
  --cta-width: 100%;

  /* gap offset between 2 or 3 cta buttons on mobile/offcanvas/sidebar*/
  --cta-gap-offset: 0;

  /* gap between breakout cta and menu toggle on mobile */
  --cta-breakout-gap: 20px;


  /* ========================
  MENU CTA BUTTON (LAST BUTTON)
  ======================== */
  /* DEFAULT STATE */
  --menu-cta-clr: white;
  --menu-cta-bg: black;
  --menu-cta-inline-padding: calc(var(--menu-item-inline-padding) * 1.3);
  --menu-cta-block-padding: var(--menu-item-block-padding);
  --menu-cta-border: none;
  --menu-cta-radius: 0em;

  /* HOVER STATE */
  --menu-cta-hover-clr: white;
  --menu-cta-hover-bg: var(--primary-clr);


  /* ========================
  MENU CTA BUTTON (SECOND BUTTON)
  ======================== */
  /* DEFAULT STATE */
  --menu-cta-2-clr: white;
  --menu-cta-2-bg: black;
  --menu-cta-2-inline-padding: var(--menu-cta-inline-padding);
  --menu-cta-2-block-padding: var(--menu-cta-block-padding);
  --menu-cta-2-border: var(--menu-cta-border);
  --menu-cta-2-radius: var(--menu-cta-radius);

  /* HOVER STATE */
  --menu-cta-2-hover-clr: white;
  --menu-cta-2-hover-bg: var(--primary-clr);


  /* ========================
  MENU CTA BUTTON (THIRD BUTTON)
  ======================== */
  /* DEFAULT STATE */
  --menu-cta-3-clr: white;
  --menu-cta-3-bg: black;
  --menu-cta-3-inline-padding: var(--menu-cta-inline-padding);
  --menu-cta-3-block-padding: var(--menu-cta-block-padding);
  --menu-cta-3-border: var(--menu-cta-border);
  --menu-cta-3-radius: var(--menu-cta-radius);

  /* HOVER STATE */
  --menu-cta-3-hover-clr: white;
  --menu-cta-3-hover-bg: var(--primary-clr);


  /* ========================
  MENU TOGGLE - Hamburger additional settings
  ======================== */
  --open-icon-size: 40px;
  --open-icon-line-height: 4px;
  --icon-line-gap: 0.7em;   /* gap between the lines*/
  --open-icon-line-variance: 9px;  /* line width variation, e.g. 0 = same width*/
  --open-icon-align: 0;  /* 0 = right | auto = left */
  --open-icon-horizontal-offset: 0px; /* nudge icon left or right from edge of screen*/
  --open-icon-close-offset: 1.2; /* nudge icon left or right when close icon is active */


  /* ======================================
  ADAPTIVE HEIGHT/ STRIPE BG COLOR/BORDER
  ========================================= */
  --adaptive-height-bg: #fff;
  --adaptive-height-border: 1px solid #fff;
  --adaptive-height-shadow: 0 0 30px rgb(39 50 59 / 10%);


  /* ========================
  STRIPE - when [data-optimize-stripe="true"]
  ======================== */
  --stripe-border-radius: 10px;


  /* ========================
  MOBILE/OFFCANVAS MENU
  ======================== */
  --mobile-menu-ttf: cubic-bezier(0.8, 0.07, 0.2, 0.95);
  /* Transition timing function */


  /* =================
  OVERLAY HEADER
  ================== */
  --overlay-header-width: 1400px;
  --overlay-header-inset: 1rem;
  --overlay-header-bg: rgb(255 255 255 / 100%);
  --overlay-header-bg-active: rgb(255 255 255 / 100%);
  --overlay-header-blur: 10px;
  --overlay-header-radius: 1rem;
  --overlay-header-shadow: 0px 2px 20px rgb(0 0 0 / 20%);
  --overlay-offset-padding: clamp(5rem, 1.875rem + 12.5vw, 11.25rem);


  /* ========================
  BACK TEXT
  ======================== */
  --back-text-clr: var(--menu-item-clr);
  --back-text-font-size: 12px;
  --back-text-font-weight: 600;
  --back-text-transform: uppercase;
  --back-text-bg: var(--mobile-menu-topbar-bg);


  /* ========================
  SIDEBAR NAV - OVERLAY MODE
  ======================== */
  --overlay-sidebar-radius: 1rem;
  --overlay-sidebar-bg: rgb(255 255 255 / 80%);
  --overlay-sidebar-shadow: 0 0 30px rgb(39 50 59 / 10%);
  --overlay-sidebar-inset: 12px;


  /* ======== DO NOT EDIT THIS VARIABLES! ======== */
  --iw: calc(var(--open-icon-size) - var(--open-icon-line-variance));
  --aw: calc(var(--iw) - var(--open-icon-line-variance));  
  --caret-size: calc(var(--dropdown-content-gap) + var(--dropdown-content-border-size));
  --dropdown-content-border: solid var(--dropdown-content-border-color) var(--dropdown-content-border-size); 
}


/* SIDEBAR BACK TEXT BAR HEIGHT WHEN BACK TEXT OVERLAYS LOGO */
#brx-header:has([data-sidebar-back-text-on-logo="true"]) {
  --top-offset: var(--mobile-menu-top-height);
}


/* ========================
  STICKY HEADER STYLES
add variables to modify for sticky header
  ======================== */
.sticky.scrolling {
  /* add your sticky styles variable here */
}

/* ========================
DROPDOWN ITEM IS BUTTON OR ICON 
======================== */

[data-is-button]>.brx-submenu-toggle {
  --menu-item-bg: black;
  --menu-item-clr: white;
  --menu-item-hover-clr: white;
  --menu-item-hover-bg: black;
  --menu-item-radius: 50vw;
  --menu-item-hover-border-height: 0;
  --chevron-size: 0;
  --chevron-color: white;
  --menu-item-inline-padding: 1.5rem;
  --menu-item-block-padding: 1rem;
  /* mobile only*/
  --menu-item-width: 200px;
  --menu-item-border: solid 1px transparent;
  --menu-item-hover-border: solid 1px transparent;

}

[data-is-icon]>.brx-submenu-toggle {
  --menu-item-bg: black;
  --menu-item-clr: white;
  --menu-item-hover-clr: white;
  --menu-item-hover-bg: black;
  --icon-clr: white;
  --icon-hover-clr: white;
  --icon-size: 14px;
  --menu-item-inline-padding: 1.1rem;
  --button-max-diameter: 45px;
  --menu-item-radius: 50vw;
  --menu-item-border: solid 1px transparent;
  --menu-item-hover-border: solid 1px transparent;
}

/* ========== NAV STYLES END ============== */



/* ======= STICKY HEADER WITH OVERLAY SPECIAL STYLES ===== */

/* SVG STYLES BEFORE SCROLLING - REVERTS TO INITIAL VALUES WHEN DROPDOWN IS OPEN */
html:not(.dwc-mobile):has([data-sticky-overlay-special-style="true"]) .bricks-is-frontend .sticky:not(.scrolling) .dwc-nest-header:not(:has(.brxe-dropdown.open)) :is(path, .cls-1):not(:is(.brx-submenu-toggle path)) {
  fill: white;
}



/* STYLES BEFORE SCROLLING  - REVERTS TO INITIAL VALUES WHEN DROPDOWN IS OPEN */
html:not(.dwc-mobile):has([data-sticky-overlay-special-style="true"]) .bricks-is-frontend .sticky:not(.scrolling) .dwc-nest-header:not(:has(.brxe-dropdown.open)) {
  --menu-item-clr: white;
  --chevron-clr: white;
  --menu-item-hover-clr: white;
  --menu-item-hover-border-bg: white;
  --overlay-header-bg: transparent;
  --overlay-header-shadow: none;
}

/* STYLES BEFORE SCROLLING */
html:not(.dwc-mobile):has([data-sticky-overlay-special-style="true"]) .bricks-is-frontend .sticky:not(.scrolling) {
  --link-transition: 0s;
  --transition: 0.2s;
}


/* STYLES WHEN SCROLLING */
html:not(.dwc-mobile):has([data-sticky-overlay-special-style="true"]) .bricks-is-frontend .sticky.scrolling {
  --overlay-header-bg: white;
}

/* STYLES WHEN SCROLLING :HOVER*/
html:not(.dwc-mobile):has([data-sticky-overlay-special-style="true"]) .bricks-is-frontend .sticky.scrolling .dwc-nest-header:has(.brxe-dropdown.open) {
  /* add and update variable here */

}


/* DEFAULT STYLES FOR OVERLAY HEADER  */
html:not(.dwc-mobile):has([data-sticky-overlay-special-style="true"]) .bricks-is-frontend .sticky {
  --menu-item-hover-bg: initial;
  --menu-item-bg: initial;
  --overlay-header-inset: 0;
  --overlay-header-width: 100%;
  --overlay-header-radius: 0;
}

/* RESET STICKY HEADER TRANSITION*/
html:not(.dwc-mobile):has([data-sticky-overlay-special-style="true"]) .bricks-is-frontend #brx-header.sticky .dwc-nest-header {
  transition: var(--transition);
}


/* ======= END STICKY HEADER WITH OVERLAY SPECIAL STYLES ===== */



/* ======== CHANGE postid-xxxx TO THIS TEMPLATE'S ID ========= */

/*hide sidebar in builder */
:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header:not(.postid-23338 *, :has(.dwc-sidebar) *) {
  display: none !important;
}

[data-builder-window] #brx-header:has([data-offcanvas="true"]):not(.postid-23338 *, :has(.dwc-sidebar) *) :is(.dwc-nav-wrapper, .dwc-nest-menu) {
  display: none !important;
}


:is(.brx-header-left, .brx-header-right)[data-builder-window] :is(#brx-content, #brx-footer):not(.postid-23338 *, :has(.dwc-sidebar) *) {
  margin: unset !important;
}

[data-builder-mode]:is(.brx-header-left, .brx-header-right).postid-23338::before {
  display: none
}
const MegaMenuCONFIG = {
  // Minimum width threshold for desktop behavior,
  // should be 1px larger than mobile (max-width) breakpoint in the "MENU Styles/Options" CSS code block
  //IMPORTANT: Also change min-width in the "MEGA MENU Codes" CSS code block
  minWidth: 1201,

  // automatically open the current menu panel/dropdown (mobile, offcanvas & sidebar)
  menuAutoExpansion: true,

  swipeToClose: true,

  // show or hide swipe to close hint
  toolTip: true,

  // adaptive height animation
  adaptiveHeight: 0,

  // Stripe menu animation
  stripeStyle: 0,

  headerSelector: '.dwc-nest-header',
  nestMenuSelector: '.dwc-nest-menu',

  closeNavOnClick: 1,
  closeOnHashClickOnly: 0,
  breakinToNavList: 0, /*do not enable if using last item is button*/

  // Selectors (e.g. .class-name, #id_name, tag-name, .complex > selectors etc.) that should NOT close the navigation when clicked
  // Separate multiple selectors with a comma e.g. '.class-one, #id_one, tag'
  closeNavOnClickExclude: '.js-wpml-ls-item-toggle',

  // New properties for dropdown positioning
  shiftFactor: 1,  // Factor to shift overflow
  minOverflow: 10,   // Minimum overflow threshold 
  reinitializeOnURLchange: false, //when using page transition API
  
  //move backdrop overlay element Inside header
  //placing it inside header will allow backdrop overlay/blur to affect header, but won't work when data-overlay-header is enabled. 
  overlayInsideHeader:0

};

// Centered Logo Configuration
const CenteredLogoCONFIG = {
  enable: 0,
  centerGuide: 1,
  forceCenteredLogo: 1,
  // move the navigation left 
  // or right using negative or positive value
  centerNudge: 0,
  // allow centered logo when no. of 
  // menu items are odd e.g. 5 or 7
  allowOddItems: 1,
  // place logo 'before' or 'after' the odd menu item
  roundOffFactor: 'before'
};
/* DO NOT ADD ANY CODE IN THIS CODE BLOCK */

/*MOBILE MENU/OFFCANVAS/SIDEBAR STYLES*/




@media only screen and (max-width: 1200px) {
    .desktop-centered header:has([data-fix-centered-logo-fouc="true"]) {
        opacity: 0;
    }

    .dwc-nest-menu__logo[data-breakout-link] {
        margin-inline-end: auto
    }
  
/*mobile logo*/
  .dwc-nest-menu__mobile-logo > :is(svg, img) {
    height: 100%;
}
  
  .dwc-nest-menu__mobile-logo:not([data-show-mobile-logo="true"] .dwc-nest-menu__mobile-logo){
  display: none;
}


[data-sidebar-back-text-on-logo="true"] .dwc-nest-menu__mobile-logo {      
   --dwc-nest-header-height: var(--mobile-menu-top-height);
}

    /*special mobile menu styles for overlay header UPDATED */

    .dwc-mobile .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"] .brx-nav-nested-items {
        transform: translateY(-100%);
    }


    .dwc-mobile .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"].brx-open .brx-nav-nested-items {
        transform: translateY(0%);
    }

    .dwc-mobile .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"] .brx-nav-nested-items {
        transition: 0.45s;
        transition-timing-function: var(--mobile-menu-ttf);
        inset-block-start: calc(min(var(--overlay-header-radius), 2em) * -1);
    }


    .dwc-mobile .bricks-is-frontend [data-overlay-header-mobile="true"] .dwc-nest-menu[data-slide-in-direction="top"][data-submenu-reveal="expand"][data-match-overlay-header-width="true"] .brx-nav-nested-items {
        inset-block-start: calc(var(--dwc-nest-header-height) / -2);
    }


    .dwc-mobile .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"] .brx-nav-nested-items {
        --mobile-menu-width: 100% !important;
        inline-size: var(--mobile-menu-width);
        border-bottom-left-radius: min(var(--mobile-menu-radius), 2em);
        border-bottom-right-radius: min(var(--mobile-menu-radius), 2em);
        padding-block-start: calc(var(--dwc-nest-header-height) / 2);
        overflow-x: hidden;
    }

    .dwc-mobile .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"][data-submenu-reveal="expand"] .brx-nav-nested-items {
        max-block-size: fit-content;
    }

    .dwc-mobile .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"] .dwc-nav-wrapper {
        transform: translateY(0%);
        border-radius: min(var(--overlay-header-radius), 2em);
        overflow: hidden !important;
        inset-block-start: var(--overlay-header-inset);

    }

    .dwc-mobile .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"].brx-open .dwc-nav-wrapper {
        transform: translateY(0%);
    }

    .dwc-mobile .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"] :is(.dwc-nav-wrapper) {
        --mobile-menu-width: min(calc(100% - (var(--overlay-header-inset) * 2)), 100%) !important;
        inline-size: var(--mobile-menu-width) !important;
        inset-inline-end: var(--overlay-header-inset) !important;
        block-size: calc(100dvb - (var(--overlay-header-inset) * 2));
    }

    .dwc-mobile .dwc-nest-menu.brxe-nav-nested[data-slide-in-direction="top"][data-match-overlay-header-width="true"] .brxe-dropdown:not(.open) .brx-dropdown-content:not([data-builder-mode] .brx-dropdown-content) {
        height: 0;
    }


    .dwc-mobile .dwc-nest-header:has(.dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"]) {
        padding-inline: initial
    }


    .dwc-mobile .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"] .dwc-nest-menu-top {
        border-block-end: initial;
    }


    /* .dwc-mobile .dwc-nest-header:has(.dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"]:not([data-submenu-reveal="expand"])) .dwc-nest-nav-items:has(.open.active) .brx-submenu-toggle>button:not(.brxe-dropdown.open.active .brx-submenu-toggle > button) {
opacity: 0;
} */

    .dwc-mobile .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"][data-submenu-reveal="slide"] .brx-has-megamenu.brxe-dropdown .brx-dropdown-content:not([data-hide-close-bar="true"] ul, [data-submenu-reveal="expand"].brx-has-megamenu ul) {
        inset-block-start: min(var(--overlay-header-radius), 2em) !important;
        padding-block-start: 50px;
    }


    .dwc-mobile .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"][data-submenu-reveal="slide"] .brxe-dropdown:not(.brx-has-megamenu, [data-submenu-reveal="expand"]) .brx-dropdown-content:not([data-hide-close-bar="true"] ul),
    .bricks-is-frontend [data-submenu-reveal="slide"].brxe-dropdown .brx-dropdown-content:not([data-hide-close-bar="true"] ul) {
        inset-block-start: min(var(--overlay-header-radius), 2em) !important;
        padding-block-start: 50px;
    }


    .dwc-mobile .dwc-nest-menu[data-submenu-reveal="slide"][data-slide-in-direction="top"][data-match-overlay-header-width="true"] .open.active>.brx-submenu-toggle>button:not([data-hide-close-bar="true"] button, [data-submenu-reveal="expand"] button, .open.active:has(.open.active)>.brx-submenu-toggle > button) {
        z-index: 9999;
        min-inline-size: 100%;
        min-block-size: 50px;
        inset-block-start: min(var(--overlay-header-radius), 2em);
    }


    .dwc-mobile .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"][data-submenu-reveal="slide"] .brxe-dropdown:not(:is([data-submenu-reveal="expand"], .brx-has-megamenu)) .brx-dropdown-content:not([data-submenu-reveal="expand"] *),
    .bricks-is-frontend [data-submenu-reveal="slide"].brxe-dropdown:not(.brx-has-megamenu) .brx-dropdown-content {
        min-block-size: 100%;
    }



    .dwc-mobile .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"][data-submenu-reveal="slide"] .brxe-dropdown.brx-has-megamenu:not(:is([data-submenu-reveal="expand"])) .brx-dropdown-content:not([data-submenu-reveal="expand"] .brx-dropdown-content)>li {
        padding-block-end: 40px;
    }

    .dwc-mobile .dwc-nest-header[data-overlay-header-mobile="true"]>div {
        padding-inline: var(--menu-item-inline-padding);
        border-radius: var(--overlay-header-radius);
    }

    /* special style UPDATED ends*/



    .dwc-nest-menu .brx-nav-nested-items {
        width: var(--mobile-menu-width);
    }

    /*  unset default values */

    [data-offcanvas="true"] .open:has(.open) .brx-dropdown-content::before {
        display: none !important;
    }

    [data-offcanvas="true"] .brx-nav-nested-items {
        flex-wrap: nowrap;
    }

    .dwc-nest-menu .brx-nav-nested-items {
        gap: 0;
    }


    .dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(.open) .brx-dropdown-content:not([data-builder-mode] .brx-dropdown-content) {
        display: flex;
        visibility: hidden;
    }

    [data-overlay-header="true"] .dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(.open) .brx-dropdown-content:not([data-builder-mode] .brx-dropdown-content),
    .dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(.open) .brx-dropdown-content:not([data-builder-mode] .brx-dropdown-content) {
        min-inline-size: 0 !important;
    }

    .dwc-nest-menu.brxe-nav-nested.brx-open .brxe-dropdown>.brx-dropdown-content {
        overflow-y: auto;
    }

    .dwc-nest-menu .brx-nav-nested-items {
        flex-direction: column !important;
        flex-wrap: nowrap;

    }

    .dwc-nest-toggle--open.brxe-toggle {
        display: flex !important;
        place-items: center;
    }

    .dwc-nest-menu .brx-nav-nested-items {
        position: relative !Important;
        background: var(--mobile-menu-bg) !important;
        align-items: stretch;
        flex: 1;
    }





    .dwc-nest-menu .brx-nav-nested-items:not(.brx-open .brx-nav-nested-items) {
        transform: unset
    }

    .dwc-nest-menu .brxe-dropdown:not(.brx-has-megamenu)>.brx-dropdown-content {
        transform: translateZ(0);
        transform: unset;
    }

    .dwc-nest-menu.brxe-nav-nested.brx-closing .brx-nav-nested-items {
        opacity: unset !important;
        visibility: unset !important;
    }

    .dwc-nest-menu.brxe-nav-nested .brx-nav-nested-items {
        overflow-y: auto;
        scrollbar-width: none;
        justify-content: flex-start !important;
    }


    /* set new values  */

    .dwc-nav-wrapper {
        position: fixed;
        inset-block: 0;
        inset-inline-end: 0;
        transform: translateX(100%);
        background-color: var(--mobile-menu-bg);
        transition: 0.45s;
        transition-timing-function: var(--mobile-menu-ttf);
        z-index: 1;
        flex-wrap: nowrap;
        inline-size: var(--mobile-menu-width);
        visibility: hidden;
    }

   

    .brx-open .dwc-nav-wrapper {
        transform: translateX(0%);
        visibility: visible;
    }



    .dwc-nest-menu-top {
        background-color: var(--mobile-menu-topbar-bg);
        border-block-end: var(--menu-item-border);
        min-block-size: var(--dwc-nest-header-height);
        display: flex;
        flex-direction: row;
        align-items: center;
    }



    .dwc-nest-menu .brxe-dropdown.brx-has-megamenu,
    .dwc-nest-menu .brxe-dropdown:not(.brx-has-megamenu)>.menu-item>a {
        border-block-end: var(--menu-item-border);
    }

    .dwc-nest-menu .brxe-dropdown:not(.brx-has-megamenu):not(.open, :has(.open)),
    .dwc-nest-menu .brxe-dropdown:not(.brx-has-megamenu) >.brxe-dropdown:not(.open, :has(.open)) {
        border-block-end: var(--menu-item-border);
    }



    /* MENU CTA (LAST BUTTON) */

    :is([data-last-item-is-button="true"], [data-last-item-is-button="true-2"], [data-last-item-is-button="true-3"]).dwc-nest-menu .brx-nav-nested-items>.menu-item:last-of-type,
    :is([data-last-item-is-button="true-2"], [data-last-item-is-button="true-3"]).dwc-nest-menu .brx-nav-nested-items>.menu-item:nth-last-of-type(-n+2),
    [data-last-item-is-button="true-3"].dwc-nest-menu .brx-nav-nested-items>.menu-item:nth-last-of-type(-n+3) {
        padding-inline: var(--menu-item-inline-padding) !important;
        padding-block: var(--menu-item-block-padding) !important;
        inline-size: 100%;
        margin-inline: auto;
        max-inline-size: var(--cta-width);
    }

    [data-last-item-is-button="true-2"].dwc-nest-menu .brx-nav-nested-items>.menu-item:nth-last-of-type(-n+2)+li {
        padding-block-start: var(--cta-gap-offset) !important
    }

    [data-last-item-is-button="true-3"].dwc-nest-menu .brx-nav-nested-items>.menu-item:nth-last-of-type(-n+3)+li {
        padding-block-start: var(--cta-gap-offset) !important
    }


    :is([data-last-item-is-button="true"], [data-last-item-is-button="true-2"], [data-last-item-is-button="true-3"]).dwc-nest-menu .brx-nav-nested-items>.menu-item:last-of-type a,
    :is([data-last-item-is-button="true-2"], [data-last-item-is-button="true-3"]).dwc-nest-menu .brx-nav-nested-items>.menu-item:nth-last-of-type(-n+2) a,
    [data-last-item-is-button="true-3"].dwc-nest-menu .brx-nav-nested-items>.menu-item:nth-last-of-type(-n+3) a {
        justify-content: center;
    }



    /* MOBILE MENU SLIDE IN DIRECTION */
    .bricks-is-frontend [data-slide-in-direction="left"] .dwc-nav-wrapper {
        transform: translateX(-100%);
        inset-inline-start: 0;
        overflow: hidden;
    }

    /* RTL */
    [dir="rtl"] .bricks-is-frontend [data-slide-in-direction="left"] .dwc-nav-wrapper {
        inset-inline-start: initial;
        inset-inline-end: 0;
    }

    [dir="rtl"] .bricks-is-frontend [data-slide-in-direction="left"] .dwc-nav-wrapper {
        inset-inline-start: initial;
        inset-inline-end: 0;
    }

    [dir="rtl"] .bricks-is-frontend [data-submenu-reveal="slide"][data-slide-in-direction="left"] .open.active>.brx-submenu-toggle button:not([data-hide-close-bar="true"] button, [data-submenu-reveal="expand"] button),

    [dir="rtl"] .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="left"] [data-submenu-reveal="slide"].open.active>.brx-submenu-toggle button:not([data-hide-close-bar="true"] button, [data-submenu-reveal="expand"] button) {
        inset-inline-start: initial;
        inset-inline-end: 0;
        justify-content: flex-end;
    }




    .bricks-is-frontend [data-slide-in-direction="left"].brx-open .dwc-nav-wrapper {
        transform: translateX(0);
    }

    /* SLIDE IN TOP */
    .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="top"].brx-open .dwc-nav-wrapper,
    .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="left top"].brx-open .dwc-nav-wrapper {
        transform: translateY(0%);
    }

    .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="top"] .dwc-nav-wrapper,
    .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="left top"] .dwc-nav-wrapper {
        transform: translateY(-100%);
    }

    /* SLIDE IN BOTTOM */

    .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="bottom"].brx-open .dwc-nav-wrapper,
    .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="left bottom"].brx-open .dwc-nav-wrapper {
        transform: translateY(0%);
    }

    .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="bottom"] .dwc-nav-wrapper,
    .bricks-is-frontend .dwc-nest-menu[data-slide-in-direction="left bottom"] .dwc-nav-wrapper {
        transform: translateY(100%);
    }

    .bricks-is-frontend [data-slide-in-direction="left bottom"] .dwc-nav-wrapper,
    .bricks-is-frontend [data-slide-in-direction="left top"] .dwc-nav-wrapper {
        inset-inline-start: 0;
        overflow: hidden;
    }


    .dwc-nest-menu.brxe-nav-nested .brxe-dropdown>.brx-dropdown-content::-webkit-scrollbar-track,
    .dwc-nest-menu .brx-nav-nested-items::-webkit-scrollbar-track {
        border-radius: 50vw;
        background-color: transparent;
    }

    .dwc-nest-menu.brxe-nav-nested .brxe-dropdown>.brx-dropdown-content::-webkit-scrollbar,
    .dwc-nest-menu .brx-nav-nested-items::-webkit-scrollbar {
        inline-size: 0px;
        background-color: transparent;
    }

    .dwc-nest-menu.brxe-nav-nested .brxe-dropdown>.brx-dropdown-content::-webkit-scrollbar-thumb,
    .dwc-nest-menu .brx-nav-nested-items::-webkit-scrollbar-thumb {
        border-radius: 50vw;
        background-color: #55565d;
    }

    /* SCROLLBARS END */



    /*  SLIDE IN DIRECTION - DROPDOWN ITEMS*/
    .bricks-is-frontend [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(:is([data-submenu-reveal="expand"])) .brx-dropdown-content:not([data-submenu-reveal="expand"] *),
    .bricks-is-frontend [data-submenu-reveal="slide"].brxe-dropdown .brx-dropdown-content {
        max-block-size: unset;
        position: absolute !important;
        opacity: 1;
        transition-duration: 0.45s !important;
        transition-timing-function: var(--mobile-menu-ttf);
        padding-block-end: 50px;
    }

    .bricks-is-frontend .dwc-nest-menu [data-submenu-reveal="expand"].brx-has-megamenu>ul {
        position: static !important;
        padding-block-end: 0 !important;
        transition: 0.3s ease-in-out !important;
    }



    .bricks-is-frontend [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brx-has-megamenu.brxe-dropdown .brx-dropdown-content:not([data-submenu-reveal="expand"].brx-has-megamenu ul) {
        inset: 0 !important;
        transform: translateX(100%);
        transition-property: opacity, transform, visibility;
        min-block-size: calc(100dvb - var(--dwc-nest-header-height));
        position: fixed !important;
    }

    .bricks-is-frontend [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brx-has-megamenu.brxe-dropdown .brx-dropdown-content:not([data-hide-close-bar="true"] ul, [data-submenu-reveal="expand"].brx-has-megamenu ul) {
        inset-block-start: var(--dwc-nest-header-height) !important;
    }

    .bricks-is-frontend :is([data-slide-in-direction="left"], [data-slide-in-direction="left bottom"], [data-slide-in-direction="left top"])[data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brx-has-megamenu.brxe-dropdown .brx-dropdown-content:not([data-submenu-reveal="expand"].brx-has-megamenu ul),
    .bricks-is-frontend.brx-header-left [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brx-has-megamenu.brxe-dropdown .brx-dropdown-content:not([data-submenu-reveal="expand"].brx-has-megamenu ul) {
        transform: translateX(-100%);
    }

    .bricks-is-frontend :is([data-slide-in-direction="left"], [data-slide-in-direction="left bottom"], [data-slide-in-direction="left top"], [data-submenu-reveal="slide"]).dwc-nest-menu.brx-open .brx-has-megamenu.brxe-dropdown.open>.brx-dropdown-content:not([data-submenu-reveal="expand"].brx-has-megamenu ul) {
        transform: translateX(0) !important;
    }

    html:not(.dwc-mobile) .bricks-is-frontend:is(.brx-header-left, .brx-header-right) :is([data-slide-in-direction="left"], [data-slide-in-direction="left bottom"], [data-slide-in-direction="left top"], [data-submenu-reveal="slide"]).dwc-nest-menu .brx-has-megamenu.brxe-dropdown.open>.brx-dropdown-content:not([data-submenu-reveal="expand"].brx-has-megamenu ul) {
        transform: translateX(0) !important;
        visibility: visible;
    }

    /*  SLIDE IN  - mult-level DROPDOWN ITEMS*/
    .bricks-is-frontend [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(:is([data-submenu-reveal="expand"], .brx-has-megamenu)) .brx-dropdown-content:not([data-submenu-reveal="expand"] *),
    .bricks-is-frontend [data-submenu-reveal="slide"].brxe-dropdown:not(.brx-has-megamenu) .brx-dropdown-content {
        inset-block: 0 !important;
        inline-size: 100%;
        transition-property: inset-inline-start, visibility, opacity;
        inset-inline-start: 100% !important;
        min-block-size: 100dvb;
        position: fixed !important;
    }

    .bricks-is-frontend :is([data-slide-in-direction="left"], [data-slide-in-direction="left bottom"], [data-slide-in-direction="left top"])[data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(.brx-has-megamenu, .open, [data-submenu-reveal="expand"]) .brx-dropdown-content:not([dir="rtl"] .brx-dropdown-content),
    .bricks-is-frontend :is([data-slide-in-direction="left"], [data-slide-in-direction="left bottom"], [data-slide-in-direction="left top"]) [data-submenu-reveal="slide"].brxe-dropdown:not(.brx-has-megamenu, .open) .brx-dropdown-content:not([dir="rtl"] .brx-dropdown-content),
    .bricks-is-frontend.brx-header-left [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(.brx-has-megamenu, [data-submenu-reveal="expand"], .open) .brx-dropdown-content:not([dir="rtl"] .brx-dropdown-content) {
        inset-inline-start: -100% !important;
    }

    /* RTL */
    [dir="rtl"] .brx-header-right.bricks-is-frontend [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested:not([data-slide-in-direction="left"], [data-slide-in-direction="left bottom"], [data-slide-in-direction="left top"]) .brxe-dropdown:not(.brx-has-megamenu, [data-submenu-reveal="expand"]) .brx-dropdown-content,
    [dir="rtl"] .brx-header-right.bricks-is-frontend .dwc-nest-menu:not([data-slide-in-direction="left"], [data-slide-in-direction="left bottom"], [data-slide-in-direction="left top"]) [data-submenu-reveal="slide"].brxe-dropdown:not(.brx-has-megamenu) .brx-dropdown-content,
    [dir="rtl"] .bricks-is-frontend [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested:not([data-slide-in-direction="left"], [data-slide-in-direction="left bottom"], [data-slide-in-direction="left top"]) .brxe-dropdown:not(.brx-has-megamenu, [data-submenu-reveal="expand"], .open) .brx-dropdown-content,
    [dir="rtl"] .bricks-is-frontend .dwc-nest-menu:not([data-slide-in-direction="left"], [data-slide-in-direction="left bottom"], [data-slide-in-direction="left top"]) [data-submenu-reveal="slide"].brxe-dropdown:not(.brx-has-megamenu, .open) .brx-dropdown-content {
        inset-inline-start: -100% !important;
    }

    [dir="rtl"] .brx-header-left.bricks-is-frontend :is([data-slide-in-direction="left"], [data-slide-in-direction="left bottom"], [data-slide-in-direction="left top"])[data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(.brx-has-megamenu, .open) .brx-dropdown-content,
    [dir="rtl"] .brx-header-left.bricks-is-frontend :is([data-slide-in-direction="left"], [data-slide-in-direction="left bottom"], [data-slide-in-direction="left top"]) [data-submenu-reveal="slide"].brxe-dropdown:not(.brx-has-megamenu, .open) .brx-dropdown-content,
    [dir="rtl"] .brx-header-left.bricks-is-frontend [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(.brx-has-megamenu, [data-submenu-reveal="expand"], .open) .brx-dropdown-content {
        inset-inline-start: 100% !important;
    }



    .bricks-is-frontend [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(.brx-has-megamenu, [data-submenu-reveal="expand"]) .brx-dropdown-content:not([data-hide-close-bar="true"] ul),
    .bricks-is-frontend [data-submenu-reveal="slide"].brxe-dropdown .brx-dropdown-content:not([data-hide-close-bar="true"] ul) {
        inset-block-start: var(--dwc-nest-header-height) !important;
    }

    .bricks-is-frontend [data-submenu-reveal="slide"].brxe-nav-nested.brx-open .brxe-dropdown.open:not(.brx-has-megamenu, [data-submenu-reveal="expand"])>.brx-dropdown-content,
    .bricks-is-frontend .brx-open [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content,
    .bricks-is-frontend .brx-open [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content .open>.brx-dropdown-content {
        inset-inline-start: 0 !important;
    }

    html:not(.dwc-mobile) .bricks-is-frontend:is(.brx-header-left, .brx-header-right) [data-submenu-reveal="slide"].brxe-nav-nested .brxe-dropdown.open:not(.brx-has-megamenu, [data-submenu-reveal="expand"])>.brx-dropdown-content,
    html:not(.dwc-mobile) .bricks-is-frontend:is(.brx-header-left, .brx-header-right) [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content,
    html:not(.dwc-mobile) .bricks-is-frontend:is(.brx-header-left, .brx-header-right) [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content .open>.brx-dropdown-content {
        inset-inline-start: 0 !important;
        visibility: visible;
    }

    .bricks-is-frontend .dwc-nest-menu .brxe-dropdown {
        position: static;
    }


    .bricks-is-frontend [data-submenu-reveal="slide"] .brx-submenu-toggle button svg:not([data-submenu-reveal="expand"] svg) {
        transform: rotate(270deg)
    }


    /*  EXPAND  - mult-level DROPDOWN ITEMS*/
    .bricks-is-frontend .dwc-nest-menu .brxe-dropdown[data-submenu-reveal="expand"]:not(.brx-has-megamenu)>.brx-dropdown-content>li,
    .bricks-is-frontend .dwc-nest-menu .brxe-dropdown[data-submenu-reveal="expand"]:not(.brx-has-megamenu)>.brx-dropdown-content>.brxe-dropdown .brx-dropdown-content>li,
    .bricks-is-frontend .dwc-nest-menu[data-submenu-reveal="expand"] .brxe-dropdown:not(.brx-has-megamenu, .open) .brx-dropdown-content>.menu-item:not([data-submenu-reveal="slide"] li) {
        transform: translateY(-100px);
        opacity: 0;
        transition: transform 0s, opacity 0s
    }

    .bricks-is-frontend .dwc-nest-menu .brxe-dropdown.open[data-submenu-reveal="expand"]:not(.brx-has-megamenu)>.brx-dropdown-content>li,
    .bricks-is-frontend .dwc-nest-menu .brxe-dropdown.open[data-submenu-reveal="expand"]:not(.brx-has-megamenu)>.brx-dropdown-content>.brxe-dropdown.open .brx-dropdown-content>li,
    .bricks-is-frontend .dwc-nest-menu[data-submenu-reveal="expand"] .brxe-dropdown:not(.brx-has-megamenu).open>.brx-dropdown-content>.menu-item {
        transform: translateY(0);
        opacity: 1 !important;
        transition: transform 0.4s, opacity 0.4s
    }

    /* MOBILE LOGO */
    .dwc-nest-menu:not([data-submenu-reveal="expand"]):has(.brxe-dropdown.open) .dwc-nest-menu__mobile-logo {
        opacity: 0;
        transition: 0s;
    }

    .dwc-nest-menu__mobile-logo {
        opacity: 1;
        transition: opacity 0.45s 0.15s var(--mobile-menu-ttf);
    }

    .dwc-nest-menu__mobile-logo:not(.brx-header-left *, .brx-header-right *) {
        min-block-size: var(--dwc-nest-header-height);
    }

    .brx-header-left .dwc-nest-menu__mobile-logo,
    .brx-header-right .dwc-nest-menu__mobile-logo {
        min-block-size: var(--top-offset);
    }

    :where(.brx-header-left, .brx-header-right) #brx-header:has([data-sidebar-back-text-on-logo="true"]) .dwc-nest-menu__logo {
        display: none;
    }

    :where(.brx-header-left, .brx-header-right) #brx-header:has([data-sidebar-back-text-on-logo="true"]) .dwc-nest-menu__mobile-logo {
        display: flex;
    }

    /* DROPDOWN INDENT */


    .dwc-nest-menu[data-submenu-reveal="expand"] .brxe-dropdown:not(.brx-has-megamenu)>.brx-dropdown-content:not(.brxe-dropdown[data-submenu-reveal="slide"] .brx-dropdown-content),
    .dwc-nest-menu .brxe-dropdown[data-submenu-reveal="expand"]:not(.brx-has-megamenu) .brx-dropdown-content {
        padding-inline-start: var(--dropdown-indent) !important;
        padding-inline-end: calc(var(--dropdown-indent) * 0) !important;
        border-left: var(--dropdown-indent-line);
        background-color: var(--dropdown-indent-bg)
    }


    .dwc-nest-menu[data-submenu-reveal="expand"] .brxe-dropdown:not(.brx-has-megamenu)>.brx-dropdown-content:not(.brxe-dropdown[data-submenu-reveal="slide"] *)>*> :is(a, .brx-submenu-toggle),
    .dwc-nest-menu .brxe-dropdown[data-submenu-reveal="expand"]:not(.brx-has-megamenu)>.brx-dropdown-content>*> :is(a, .brx-submenu-toggle) {
        padding-inline-start: calc(var(--dropdown-item-inline-padding) * var(--dropdown-indent-item-pad-offset)) !important;
    }


    .dwc-nest-menu[data-submenu-reveal="expand"] .brxe-dropdown.open>.brx-submenu-toggle,
    .dwc-nest-menu [data-submenu-reveal="expand"].brxe-dropdown.open>.brx-submenu-toggle {
        background-color: var(--dropdown-expanded-bg);
        color: var(--dropdown-expanded-clr);
    }

    .dwc-nest-menu[data-submenu-reveal="expand"] .brxe-dropdown.open>.brx-submenu-toggle svg, 
.dwc-nest-menu [data-submenu-reveal="expand"].brxe-dropdown.open>.brx-submenu-toggle svg{
    color: var(--dropdown-expanded-clr) !important;
}


    /* BACK BUTTON POSITIONING */
    .bricks-is-frontend [data-submenu-reveal="slide"] .open.active>.brx-submenu-toggle button:not([data-hide-close-bar="true"] button, [data-submenu-reveal="expand"] button),
    .bricks-is-frontend [data-submenu-reveal="slide"].open.active>.brx-submenu-toggle button:not([data-hide-close-bar="true"] button, [data-submenu-reveal="expand"] button) {
        min-inline-size: 70%;
        position: fixed;
        inset-block-start: 0;
        transform: translateY(0%) !important;
        inset-inline-start: var(--menu-item-inline-padding);
        color: var(--back-text-clr);
        text-transform: var(--back-text-transform);
        letter-spacing: 1px;
        /* padding-inline: 1rem !important; */
        z-index: 1000;
        font-size: var(--back-text-font-size);
        font-weight: var(--back-text-font-weight);
        background-color: var(--back-text-bg);
        min-block-size: calc(var(--dwc-nest-header-height) - 2px);
        -webkit-animation: dwc-nest-fade-in 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.3s both;
        animation: dwc-nest-fade-in 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.3s both;
    }




    /* BACK BUTTON TEXT, (ATTR SET BY JS) */
    .bricks-is-frontend [data-submenu-reveal="slide"] .open.active>.brx-submenu-toggle button[data-back-text="auto"]:not([data-submenu-reveal="expand"] button, [data-hide-close-bar="true"] button):after,
    .bricks-is-frontend [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-submenu-toggle button[data-back-text="auto"]:not([data-hide-close-bar="true"] button):after {
        content: attr(data-text);
    }

    /* FORCE TO USE 'BACK' AS BACK BUTTON TEXT */

    .bricks-is-frontend .dwc-nest-menu:not([data-submenu-reveal="expand"]) .brxe-dropdown.open:not([data-submenu-reveal="expand"])>.brx-submenu-toggle button:not([data-back-text="auto"])::after {
        content: attr(data-back-text) !important;
    }

    .dwc-nest-menu:not([data-submenu-reveal="expand"]) .brxe-dropdown:not([data-submenu-reveal="expand"]) .brx-submenu-toggle button[aria-expanded] {
        transition: unset !important;
    }

    /* BACK BUTTON CHEVRON ARROW direction */
    .bricks-is-frontend [data-submenu-reveal="slide"] .brxe-dropdown.open>.brx-submenu-toggle button svg:not([data-submenu-reveal="expand"] svg),
    .bricks-is-frontend [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-submenu-toggle button svg {
        transform: rotate(90deg);
        margin-inline-end: 0.5em;
        inline-size: 10px;
    }

    /* RTL */
    [dir="rtl"] .bricks-is-frontend [data-submenu-reveal="slide"] .brxe-dropdown.open:not([data-submenu-reveal="expand"])>.brx-submenu-toggle button svg,
    [dir="rtl"] .bricks-is-frontend [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-submenu-toggle button svg {
        order: 2;
        margin-inline-end: initial;
        margin-inline-start: 0.5em;
    }




    /* overlay back button on logo*/
    body:has(.brx-open .open.active:not([data-submenu-reveal="expand"], [data-submenu-reveal="expand"] .open)) [data-mobile-top-transparent="true"]:not([data-submenu-reveal="expand"], [data-below-header="true"]) .dwc-nest-menu-top {
        background-color: var(--mobile-menu-topbar-bg) !important;
        -webkit-animation: dwc-nest-fade-in 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.2s both;
        animation: dwc-nest-fade-in 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.2s both;
    }

    body:has([data-submenu-reveal="slide"].brxe-dropdown.open, [data-submenu-reveal="slide"] .brxe-dropdown.open:not([data-submenu-reveal="expand"], [data-submenu-reveal="expand"] .open)) [data-mobile-top-transparent="true"] .dwc-nest-menu-top:not([data-below-header="true"] *) {
        background-color: var(--mobile-menu-topbar-bg) !important;
    }

    .dwc-mobile [data-mobile-top-transparent="true"] .dwc-nav-wrapper:not([data-below-header="true"] .dwc-nav-wrapper, [data-show-mobile-logo="true"] .dwc-nav-wrapper, [data-fullscreen-mobile-menu="true"] .dwc-nav-wrapper) {
        background-color: transparent !important;
    }


    .dwc-mobile [data-mobile-top-transparent="true"] .dwc-nest-menu-top:not([data-below-header="true"] *, [data-show-mobile-logo="true"] *) {
        background-color: transparent !important;
    }




    /* MENU BELOW HEADER */
     .bricks-is-frontend [data-below-header="true"].dwc-nest-menu .dwc-nav-wrapper {
    inset-block-start: calc(var(--dwc-nest-header-height) + var(--wp-admin--admin-bar--height, 0px));
}

    [data-below-header="true"] .dwc-nest-menu-top {
        min-block-size: var(--top-offset);
    }

    .bricks-is-frontend [data-below-header="true"] .brxe-dropdown.open>.brx-submenu-toggle button:not([data-hide-close-bar="true"] button, [data-submenu-reveal="expand"] button) {
        min-block-size: calc(var(--top-offset) - 1px);
        padding-block: 0 !important;
    }


    .bricks-is-frontend [data-below-header="true"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(.brx-has-megamenu) .brx-dropdown-content:not([data-hide-close-bar="true"] ul),
    .bricks-is-frontend [data-submenu-reveal="slide"].brxe-dropdown .brx-dropdown-content:not([data-hide-close-bar="true"] ul) {
        inset-block-start: calc(var(--top-offset) + 1px) !important;
    }

    .bricks-is-frontend [data-below-header="true"].dwc-nest-menu.brxe-nav-nested .brx-has-megamenu.brxe-dropdown .brx-dropdown-content:not([data-hide-close-bar="true"] ul, [data-submenu-reveal="expand"].brx-has-megamenu ul) {
        inset-block-start: calc(var(--top-offset) + 1px) !important;
    }

    .dwc-nest-menu[data-below-header="true"] .dwc-nest-menu__mobile-logo {
        display: none;
    }



    /* tooltip */

    .dwc-nest-tooltip:not(.dwc-nav-wrapper:has(.open.active) .dwc-nest-tooltip, .dwc-tabbed-nav-list__li.active ~ .dwc-nest-tooltip) {
        opacity: 0 !important;
    }


    @keyframes slideIn {
        0% {
            transform: translateX(-100%);
            opacity: 0;
        }

        100% {
            transform: translateX(0);
            opacity: 1;
        }
    }

    @keyframes fadeOut {
        0% {
            transform: translateX(0);
            opacity: 1;
        }

        100% {
            transform: translateX(50%);
            opacity: 0;
        }
    }

    .dwc-nest-tooltip {
        animation: slideIn 0.4s ease-in-out both, fadeOut 0.4s ease-in-out 2s both;
        text-transform: initial;
    }


    /* EXPAND DROP DOWN */
    /* EXPAND MEGA MENU DROP DOWN */

    [data-submenu-reveal="expand"] .brx-has-megamenu .brx-dropdown-content {
        display: grid !important;
        grid-template-rows: 0fr;
        grid-template-columns: 1fr;
        transition: 0.3s ease-in-out;
        overflow: hidden;
        position: static;
        visibility: visible;
        opacity: 1;
    }

    [data-submenu-reveal="expand"] .brx-has-megamenu.brxe-dropdown.open.active .brx-dropdown-content {
        grid-template-rows: 1fr;
        grid-template-columns: 1fr;

    }

    [data-submenu-reveal="expand"] .brx-has-megamenu .brx-dropdown-content> :is(div, li) {
        padding-block: 0 !important;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    [data-submenu-reveal="expand"] .brx-has-megamenu .brx-dropdown-content :is(div, li):not([data-submenu-reveal="slide"] *) {
        flex-wrap: nowrap !important;
        min-block-size: 0 !important;
    }

    [data-submenu-reveal="expand"] .brx-has-megamenu.brxe-dropdown.open.active .brx-dropdown-content> :is(div, li) {
        opacity: 1;
        transition: opacity 0.25s 0.25s ease;
    }

    /* EXPAND MEGA MENU DROP DOWN -- MODULAR*/

    [data-submenu-reveal="expand"].brx-has-megamenu .brx-dropdown-content {
        display: grid !important;
        grid-template-rows: 0fr;
        grid-template-columns: 1fr;
        transition: 0.3s ease-in-out;
        overflow: hidden;
        position: static;
        visibility: visible;
        opacity: 1;
    }

    [data-submenu-reveal="expand"].brx-has-megamenu.brxe-dropdown.open.active .brx-dropdown-content {
        grid-template-rows: 1fr;
        grid-template-columns: 1fr;
    }

    [data-submenu-reveal="expand"].brx-has-megamenu .brx-dropdown-content> :is(div, li) {
        padding-block: 0 !important;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    [data-submenu-reveal="expand"].brx-has-megamenu .brx-dropdown-content :is(div, li) {
        flex-wrap: nowrap !important;
        min-block-size: 0 !important;
    }

    [data-submenu-reveal="expand"].brx-has-megamenu.brxe-dropdown.open.active .brx-dropdown-content> :is(div, li) {
        opacity: 1;
        transition: opacity 0.8s 0.25s ease;
    }

    /* HIDE TOP CLOSE BAR */
    [data-hide-close-bar='true'] .dwc-nest-menu-top {
        display: none;
    }



    /* hide close button, bring main hamburger to front */

    .dwc-nest-menu .brxe-toggle {
        position: relative;
    }

    [data-mobile-top-transparent="true"]:not(:has(.brxe-dropdown.open)) .brxe-toggle[aria-label="Open Menu"] {
        z-index: 9999;
    }

    [data-show-toggle-always="true"] .brxe-toggle[aria-label="Open Menu"] {
        z-index: 9999;
    }

    .dwc-nest-menu:not([data-mobile-top-transparent="true"], [data-below-header="true"]) .brxe-toggle[aria-label="Close Menu"] {
        display: grid;
        place-items: center;
        height: 100%;
    }

    .dwc-nest-menu .brx-nav-nested-items>.brxe-dropdown>.brx-dropdown-content {
        transform: unset;
    }

    .dwc-nest-menu .brx-nav-nested-items>.brxe-dropdown.open>.brx-dropdown-content {
        transform: unset;
    }

    .dwc-stripe-style .dwc-nest-header::after,
    .dwc-stripe-style .dwc-nest-header::before {
        display: none !important;
    }


    /* builder */
    [data-builder-mode] .dwc-nest-menu-top {
        min-block-size: 80px !important;
    }

    [data-builder-mode] .dwc-nest-nav-items {
        overflow-y: scroll;
    }

    /* in builder ends*/

    /*==========RTL=============*/

    [dir=rtl] .bricks-is-frontend [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested:not([data-slide-in-direction="right"]) .brx-has-megamenu.brxe-dropdown .brx-dropdown-content:not([data-submenu-reveal="expand"].brx-has-megamenu ul) {
        transform: translateX(-100%);
    }

    [dir=rtl] nav:not(.brx-open, [data-slide-in-direction="right"]) .dwc-nav-wrapper {
        transform: translateX(-100%);
    }

    [dir=rtl] .bricks-is-frontend [data-submenu-reveal="slide"] .brx-submenu-toggle button svg:not([data-submenu-reveal="expand"] svg) {
        transform: rotate(-270deg);
    }

    /* ================== BRICKS RESET LAYER ========================== */

    @layer bricks.reset {

        /* multilevel dropdown slide in */


        .bricks-is-frontend [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(:is([data-submenu-reveal="expand"], .brx-has-megamenu)) .brx-dropdown-content:not([data-submenu-reveal="expand"] *, .brx-header-left *, .brx-header-right *),
        .bricks-is-frontend [data-submenu-reveal="slide"].brxe-dropdown:not(.brx-has-megamenu) .brx-dropdown-content:not(.brx-header-left *, .brx-header-right *) {
            inset-inline-start: 100% !important;
        }

        [dir=rtl] .bricks-is-frontend [data-slide-in-direction="right"][data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(:is([data-submenu-reveal="expand"], .brx-has-megamenu), .open) .brx-dropdown-content:not([data-submenu-reveal="expand"] *),
        [dir=rtl] .bricks-is-frontend [data-slide-in-direction="right"][data-submenu-reveal="slide"].brxe-dropdown:not(.brx-has-megamenu, .open) .brx-dropdown-content {
            inset-inline-start: -100% !important;
        }

        .bricks-is-frontend [data-submenu-reveal="slide"][data-slide-in-direction^="left"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(:is([data-submenu-reveal="expand"], .brx-has-megamenu)) .brx-dropdown-content:not([data-submenu-reveal="expand"] *, .brx-header-left *, .brx-header-right *),
        .bricks-is-frontend [data-submenu-reveal="slide"].brxe-dropdown:not(.brx-has-megamenu) .brx-dropdown-content:not(.brx-header-left *, .brx-header-right *) {
            inset-inline-start: -100% !important;
        }

        /*sidebar*/
        .bricks-is-frontend:is(.brx-header-right, brx-header-left) [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(:is([data-submenu-reveal="expand"], .brx-has-megamenu, .open)) .brx-dropdown-content:not([data-submenu-reveal="expand"] *, .-brx-header-left *, .-brx-header-right *),
        .bricks-is-frontend:is(.brx-header-right, brx-header-left) [data-submenu-reveal="slide"].brxe-dropdown:not(.brx-has-megamenu, .open) .brx-dropdown-content:not(.brx-header-left *, .brx-header-right *) {
            inset-inline-start: 100% !important;
        }





        .bricks-is-frontend [data-submenu-reveal="slide"].brxe-nav-nested.brx-open .brxe-dropdown.open:not(.brx-has-megamenu, [data-submenu-reveal="expand"])>.brx-dropdown-content,
        .bricks-is-frontend .brx-open [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content,
        .bricks-is-frontend .brx-open [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content .open>.brx-dropdown-content {
            inset-inline-start: 0 !important;
        }


        .bricks-is-frontend [data-submenu-reveal="slide"][data-slide-in-direction^="left"].brxe-nav-nested.brx-open .brxe-dropdown.open:not(.brx-has-megamenu, [data-submenu-reveal="expand"])>.brx-dropdown-content,
        .bricks-is-frontend [data-slide-in-direction^="left"] .brx-open [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content,
        .bricks-is-frontend [data-slide-in-direction^="left"] .brx-open [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content .open>.brx-dropdown-content {
            inset-inline-start: 0 !important;
        }

        /*sidebar*/
        .bricks-is-frontend:is(.brx-header-right, brx-header-left) [data-submenu-reveal="slide"].brxe-nav-nested .brxe-dropdown.open:not(.brx-has-megamenu, [data-submenu-reveal="expand"])>.brx-dropdown-content,
        .bricks-is-frontend:is(.brx-header-right, brx-header-left) [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content,
        .bricks-is-frontend:is(.brx-header-right, brx-header-left) [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content .open>.brx-dropdown-content {
            inset-inline-start: 0 !important;
        }

        .brx-closing.brxe-nav-nested .brx-nav-nested-items {
            opacity: 1 !important;
        }

        .dwc-nest-menu.brxe-nav-nested.brx-closing .brx-nav-nested-items {
            opacity: unset !important;
            visibility: unset !important;
        }

    }

    /* ================== END BRICKS RESET LAYER ========================== */

}


/* END MEDIA QUERY*/



@media (min-width: 640px) and (max-width: 1200px) {

    /* ================== BRICKS RESET LAYER ========================== */

    @layer bricks.reset {

        /*special mobile style on tablet */

        .dwc-mobile .bricks-is-frontend [data-mobile-special-style="slide-split"] [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(:is([data-submenu-reveal="expand"], .brx-has-megamenu)) .brx-dropdown-content:not([data-submenu-reveal="expand"] *),
        .bricks-is-frontend [data-mobile-special-style="slide-split"] [data-submenu-reveal="slide"].brxe-dropdown:not(.brx-has-megamenu) .brx-dropdown-content {

            inset-inline-start: auto !important;
            inset-inline-end: -100% !important;
        }

        .dwc-mobile .bricks-is-frontend [data-mobile-special-style="slide-split"] [data-submenu-reveal="slide"].brxe-nav-nested.brx-open .brxe-dropdown.open:not(.brx-has-megamenu, [data-submenu-reveal="expand"])>.brx-dropdown-content,
        .bricks-is-frontend [data-mobile-special-style="slide-split"] .brx-open [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content,
        .bricks-is-frontend [data-mobile-special-style="slide-split"] .brx-open [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content .open>.brx-dropdown-content {
            inset-inline-end: 0% !important;
            inset-inline-start: auto !important;
        }



    }

    /* ================== END BRICKS RESET LAYER ========================== */
}

/* END MEDIA QUERY*/
@media (min-width: 1201px){
  .dwc-mobile header{
      display: none;
  }  
  
  @layer bricks.reset{
.brx-dropdown-content:not(.brx-submenu-positioned) {
    display: flex!important;
}
}

  
  /* CENTERED LOGO*/

  /*force center align for centered logo menu */

.dwc-nest-header__container.dwc-logo-is-centered {
    justify-content: center;
}
  
  .dwc-logo-is-centered .dwc-nest-menu .brx-nav-nested-items{
  justify-content: center;
}


/*remvoe bricks default margin left*/
#brx-header .dwc-logo-is-centered .dwc-nest-menu li:not(.brx-dropdown-content *){
  
    margin-inline: 0 !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* prevent logo from shrinking on sceen resize*/
#brx-header .dwc-logo-is-centered .dwc-header-logo-item{
   flex-shrink: 0;
} 

.dwc-center-guide {
  background-color: rgba(132, 255, 0, 0.32);
  position: fixed;
  top: 0;
  bottom: 0;  
  align-self: center;
  height: 100dvb;
  z-index: 9999;
  pointer-events: none;
}
  
  body:not(:has([data-fix-centered-logo-fouc="true"])) .dwc-center-guide::before {
    content: 'To fix FOUC on the header, Go to Header Pro div > Attribute > data-fix-centered-logo-fouc, set the value to "true"';
    position: absolute;
    top: 30vh;
    padding: 1rem;
   background-color: white;
 
}

.dwc-logo-is-centered .dwc-menu-wrap{
  inline-size:100%
}


  
  .dwc-nest-header .brx-nav-nested-items {    
    transition-property: opacity,transform;   
}
  
  body.adaptive-height-active:has([data-fix-centered-logo-fouc="true"]):not(:has(.dwc-logo-is-centered))::before {
    content: 'Go to the Header Pro section > Attribute > data-fix-centered-logo-fouc, remove the value "true" OR enable Centered Logo';
}
  

}

/*=======================================  MIN WIDTH MEDIA QUERY ENDS  ==============================================================*/

  body:has([data-overlay-header="true"]) .dwc-nest-menu-overlay {   
    inset-block-start: 0 ;  
}

/*fix centered logo fouc*/
  html:not(.dwc-mobile)  .bricks-is-frontend header:has([data-fix-centered-logo-fouc="true"]):not(.desktop-centered header) {
    opacity: 0;
}



/*end fix fouc*/

.dwc-adaptive-height:not(.dwc-stripe-style){
    --dropdown-content-gap: 0 
}

html:not(.dwc-mobile) .bricks-is-frontend:not(.brx-header-right, .brx-header-left) .dwc-nest-menu:not([data-offcanvas="true"]) .brxe-dropdown:not(.brx-has-megamenu) .brx-dropdown-content:not(.brx-dropdown-content .brx-dropdown-content){
  inset-inline-start: 0 !important;
}



html:not(.dwc-mobile) .bricks-is-frontend .dwc-nest-menu .brx-dropdown-content .brx-dropdown-content:not(.brx-sub-submenu-overflow-right, .brx-submenu-overflow-right){
inset-inline-start: 100% !important;
}


html:not(.dwc-mobile) .bricks-is-frontend .dwc-nest-menu .brxe-dropdown:not(.brx-has-megamenu) .brx-dropdown-content{
    min-inline-size: var(--multilevel-dropdown-width) !important;    
}

html:not(.dwc-mobile) .bricks-is-frontend .dwc-nest-menu .brx-dropdown-content{ 
  box-shadow: var(--dropdown-content-shadow);
}

html:not(.dwc-mobile) .bricks-is-frontend:not(.brx-header-left, .brx-header-right) .dwc-nest-menu:not([data-offcanvas="true"]) .brx-has-megamenu .brx-dropdown-content > *{ 
  max-block-size: calc(95dvb - calc(var(--dwc-nest-header-height) + var(--wp-admin--admin-bar--height, 0px)));
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin !important;
}


.dwc-nest-menu[data-submenu-reveal="expand"] .brx-nav-nested-items > .brxe-dropdown:not([data-submenu-reveal="slide"], .brx-has-megamenu)  > .brx-submenu-toggle {
transform: translateY(0);
z-index: 9999;
}


:is([data-submenu-reveal="expand"][data-offcanvas="true"]) .brxe-dropdown:not(.brx-has-megamenu) .brx-dropdown-content,
:is(.brx-header-right, .brx-header-left) [data-submenu-reveal="expand"] .brxe-dropdown:not(.brx-has-megamenu) .brx-dropdown-content{
inset-block-start: 0;
transition: 0s;
min-inline-size: var(--mobile-menu-width);
}

.dwc-nest-toggle--open.brxe-toggle .brxa-inner:before {   
block-size: var(--open-icon-line-height);
inset-inline-end: var(--open-icon-align);       
}

.dwc-nest-toggle--open.brxa--vortex .brxa-inner:before {   
inline-size: var(--open-icon-size);      
}

.dwc-nest-toggle--open.brxa--vortex .brxa-inner:not(.is-active .brxa-inner):before {   
inset-block-start: calc(var(--icon-line-gap) * -1); 
}

.dwc-nest-toggle--open.brxa--vortex .brxa-inner:not(.is-active .brxa-inner):after {   
inset-block-end: calc(var(--icon-line-gap) * -1); 
}

.dwc-nest-toggle--open.brxe-toggle .brxa-inner{
block-size: var(--open-icon-line-height);
inset-inline-end:  var(--open-icon-horizontal-offset);      
}

.dwc-nest-toggle--open.brxa--vortex .brxa-inner{
inline-size:var(--iw);    
}

.dwc-nest-toggle--open.brxe-toggle .brxa-inner:after {   
block-size: var(--open-icon-line-height);
inset-inline-end:  var(--open-icon-align);
}

.dwc-nest-toggle--open.brxa--vortex .brxa-inner:after {   
inline-size: var(--aw);
}


.dwc-nest-toggle--open.brxa--vortex.is-active .brxa-inner:after, 
.dwc-nest-toggle--open.brxa--vortex.is-active .brxa-inner {
    inline-size: calc(var(--iw) * var(--open-icon-close-offset));
}


.dwc-nest-toggle--open.brxa--vortex .brxa-wrap{
inline-size: var(--open-icon-size)
}

.dwc-nest-menu .brxa-inner, 
.dwc-nest-menu .brxa-inner:after, 
.dwc-nest-menu .brxa-inner:before{
background-color: var(--menu-toggle-clr)
}

.dwc-nest-menu.brxe-nav-nested .brxe-toggle[aria-label="Close Menu"] i{
color: var(--menu-close-toggle-clr)
}

.dwc-nest-menu .brxa-wrap:hover .brxa-inner,
.dwc-nest-menu .brxa-wrap:hover .brxa-inner:after, 
.dwc-nest-menu .brxa-wrap:hover .brxa-inner:before {
background-color: var(--menu-toggle-hover-clr) !important
}

/* icon animation */

.dwc-nest-toggle--open.brxa--vortex .brxa-inner {
transition-duration: .3s;
transition-timing-function: ease-in-out;
}

.dwc-nest-toggle--open.brxa--vortex.is-active .brxa-inner {
transform: rotate(225deg);
transition-timing-function: ease-in-out;
}

.dwc-nest-toggle--open.brxa--vortex.is-active .brxa-inner:before {
opacity: 0;
inset-block-start: calc(var(--icon-line-gap) * -1);
inline-size: 0px !important;   
}

.dwc-nest-toggle--open .brxa-inner:before {
transition-duration: 0.25s;
transition-property: inline-size, tansform !important;

}



/* MENU ITEMS SPACING AND COLOR*/
/* Shared styles for both menu types */
.dwc-nest-menu .brx-nav-nested-items > li > a:not(.dwc-nest-menu__logo),
.dwc-nest-menu .brx-nav-nested-items > li .brx-submenu-toggle,
.dwc-nest-menu .brx-dropdown-content > .menu-item > a {
font-weight: var(--menu-item-font-weight);
font-size: var(--menu-item-font-size);
color: var(--menu-item-clr);
background-color: var(--menu-item-bg);
inline-size: 100%;
}

.dwc-nest-menu .brx-dropdown-content > .brxe-dropdown > .brx-submenu-toggle,
.dwc-nest-menu .brx-dropdown-content > .menu-item > a {
  --menu-item-font-size: var(--dropdown-item-font-size)
}

/* Specific padding for nested menu items */
.dwc-nest-menu .brx-nav-nested-items > li > a,
.dwc-nest-menu .brx-nav-nested-items > li.brx-has-megamenu .brx-submenu-toggle {
padding-block: var(--menu-item-block-padding);
padding-inline: var(--menu-item-inline-padding) !important;
}

/* Specific padding for dropdown items */

.dwc-nest-menu .brx-dropdown-content > .menu-item > a {
  padding-block: var(--dropdown-item-block-padding);
  padding-inline: var(--dropdown-item-inline-padding) !important;
}

.dwc-nest-menu .brx-nav-nested-items > .brxe-dropdown:not(.brx-has-megamenu) li .brx-submenu-toggle{
padding-block: var(--dropdown-item-block-padding);
  padding-inline: var(--dropdown-item-inline-padding) !important;
}

.dwc-nest-menu .brx-nav-nested-items > li:not(.brx-has-megamenu) .brx-submenu-toggle:not(.brxe-dropdown li .brx-submenu-toggle){
padding-block: var(--menu-item-block-padding);
  padding-inline: var(--menu-item-inline-padding) !important;

}
/* .dwc-nest-menu .brx-dropdown-content > .menu-item > a,
.dwc-nest-menu .brx-nav-nested-items > li:not(.brx-has-megamenu) .brx-submenu-toggle {
padding-block: var(--dropdown-item-block-padding);
padding-inline: var(--dropdown-item-inline-padding) !important;
} */

.dwc-nest-menu .brx-dropdown-content > .menu-item > a:not([aria-current="page"], li:hover > *),
li:not(.brx-has-megamenu) .brx-submenu-toggle:not( .brx-nav-nested-items > li > *, li:hover > *, .open.active *) {
color: var(--dropdown-item-clr) !important;
}


/* DROPDOWN MENU ITEMS BG COLOR */
.dwc-nest-menu .brx-dropdown-content > .menu-item > a:not(.brx-has-megamenu a),
li:not(.brx-has-megamenu) .brx-submenu-toggle:not( .brx-nav-nested-items > li > *) {
background-color: var(--dropdown-item-bg)
}

/* DROPDOWN BG COLOR */
.dwc-nest-menu .brxe-dropdown:not(.brx-has-megamenu) .brx-dropdown-content {
background-color: var(--dropdown-content-bg);
}

/* HOVER STYLES */
.dwc-nest-menu .brx-nav-nested-items > li:hover > a,
.dwc-nest-menu .brx-nav-nested-items > li:hover > .brx-submenu-toggle,
.dwc-nest-menu .brx-dropdown-content > li:hover > .brx-submenu-toggle,
.dwc-nest-menu .brx-dropdown-content > .menu-item:hover > a {
color: var(--menu-item-hover-clr);
background-color: var(--menu-item-hover-bg)
}

.dwc-nest-nav-dropdown-link:hover {
color: var(--menu-item-hover-clr);
}

.dwc-nest-menu .brx-nav-nested-items > li > a:not([data-last-item-is-button="true"] .brx-nav-nested-items > .menu-item:last-of-type a, [data-last-item-is-button="true-2"] .brx-nav-nested-items > .menu-item:nth-last-of-type(-n+2) a, [data-last-item-is-button="true-3"] .brx-nav-nested-items > .menu-item:nth-last-of-type(-n+3) a, .dwc-nest-menu__logo):hover::before,
body:not(.brx-header-left, .brx-header-right) .dwc-nest-menu .brx-nav-nested-items > li > a:not([data-last-item-is-button="true"] .brx-nav-nested-items > .menu-item:last-of-type a, [data-last-item-is-button="true-2"] .brx-nav-nested-items > .menu-item:nth-last-of-type(-n+2) a, [data-last-item-is-button="true-3"] .brx-nav-nested-items > .menu-item:nth-last-of-type(-n+3) a, .dwc-nest-menu__logo):focus-visible::before,
.dwc-nest-menu .brx-nav-nested-items > li:hover > .brx-submenu-toggle::before,
body:not(.brx-header-left, .brx-header-right) .dwc-nest-menu .brx-nav-nested-items > li:focus-within > .brx-submenu-toggle::before{
    content: '';
    background-color: var(--menu-item-hover-border-bg);
    inline-size: 100%;
    block-size: var(--menu-item-hover-border-height);
    position: absolute;
    inset-block-start: calc(100% - var(--menu-item-hover-border-height));
    inset-inline-start: 0;
}

.dwc-nest-menu .brx-nav-nested-items > li.menu-item:has(> a),
.dwc-nest-menu .brx-nav-nested-items > li.menu-item:has(> .brx-submenu-toggle) {
   position: relative; 
}

/* ACTIVE STYLES */
/* links and dropdwon active styles */
.dwc-nest-menu .brx-nav-nested-items a[aria-current="page"]:not(.brxe-button, .dwc-exclude, .dwc-exclude a, li:hover > a, a:hover, .dwc-nest-menu__logo, 
[data-last-item-is-button="true"] .brx-nav-nested-items > .menu-item:last-of-type a, 
[data-last-item-is-button="true-2"] .brx-nav-nested-items > .menu-item:nth-last-of-type(-n+2) a, 
[data-last-item-is-button="true-3"] .brx-nav-nested-items > .menu-item:nth-last-of-type(-n+3) a),
.dwc-nest-menu .brx-nav-nested-items > li:has([aria-current="page"]:not(.dwc-exclude)):not(li:hover) > .brx-submenu-toggle {
color: var(--menu-item-active-clr);
background-color: var(--menu-item-active-bg);
}

.dwc-nest-menu .brx-nav-nested-items .brx-submenu-toggle > a[aria-current="page"]{   
  background-color: initial !important;  
}

.dwc-nest-menu .brx-nav-nested-items a[aria-current="page"]:not(.brxe-button, .dwc-exclude, .dwc-exclude a, .dwc-nest-menu__logo),
.dwc-nest-menu .brx-nav-nested-items > li .brx-submenu-toggle{
  position: relative;
}

.dwc-nest-menu .brx-nav-nested-items a[aria-current="page"]:not(.brxe-button, .dwc-exclude, .dwc-exclude a, [data-last-item-is-button="true"] .brx-nav-nested-items > .menu-item:last-of-type a, 
[data-last-item-is-button="true-2"] .brx-nav-nested-items > .menu-item:nth-last-of-type(-n+2) a, 
[data-last-item-is-button="true-3"] .brx-nav-nested-items > .menu-item:nth-last-of-type(-n+3) a, .dwc-nest-menu__logo, .brx-submenu-toggle > a)::before,
.dwc-nest-menu .brx-nav-nested-items > li:has([aria-current="page"]:not(.dwc-exclude)) > .brx-submenu-toggle::before{
  content: '';
  background-color: var(--menu-item-active-border-bg);
  inline-size: 100%;
  block-size: var(--menu-item-active-border-height);
  position: absolute; 
  inset-block-start: calc(100% - var(--menu-item-active-border-height));
  inset-inline-start: 0;  
}

.dwc-nest-menu .brx-nav-nested-items > li:has([aria-current="page"]:not(.dwc-exclude)) > .brx-submenu-toggle > :is(a:not(.dwc-nest-menu__logo), svg, button, span){
color: var(--menu-item-active-clr);
}


/* DROPDOWN HOVER BG */
.dwc-nest-menu .brx-dropdown-content > li:hover > .brx-submenu-toggle:not(.brx-has-megamenu *), 
.dwc-nest-menu .brx-dropdown-content > li:hover > a:not(.brx-has-megamenu a){
background-color: var(--dropdown-item-hover-bg) ;
color: var(--dropdown-item-hover-clr);
}


.dwc-nest-menu.brxe-nav-nested .brx-submenu-toggle {
justify-content: space-between;
}

/* DROPDOWN INDENT */

:is(.dwc-mobile, .brx-header-left, .brx-header-right, body:has([data-offcanvas="true"])) 
:is([data-submenu-reveal="expand"])
.brxe-dropdown:not(.brx-has-megamenu) > 
.brx-dropdown-content:not(.brxe-dropdown[data-submenu-reveal="slide"] *) {
padding-inline-start: var(--dropdown-indent) !important;
padding-inline-end: calc(var(--dropdown-indent) * 0) !important;
border-left: var(--dropdown-indent-line);  
background-color: var(--dropdown-indent-bg)
}

:is(.dwc-mobile, .brx-header-left, .brx-header-right, body:has([data-offcanvas="true"])) 
:is([data-submenu-reveal="expand"]) 
.brxe-dropdown:not(.brx-has-megamenu) > 
.brx-dropdown-content:not(.brxe-dropdown[data-submenu-reveal="slide"] *) > * > :is(a, .brx-submenu-toggle){
padding-inline-start: calc(var(--dropdown-item-inline-padding) * var(--dropdown-indent-item-pad-offset)) !important;
}

/* :is(.dwc-mobile, .brx-header-left, .brx-header-right, body:has([data-offcanvas="true"])) 
:is([data-submenu-reveal="expand"]) 
.open.active.brxe-dropdown > .brx-submenu-toggle{
background-color: var(--dropdown-expanded-bg);
color: var(--dropdown-expanded-clr);
} */

:is(.dwc-mobile, .brx-header-left, .brx-header-right, body:has([data-offcanvas="true"])) 
:is([data-submenu-reveal="expand"]) 
.open.active.brxe-dropdown > .brx-submenu-toggle svg:not(.open.active.brxe-dropdown:hover > .brx-submenu-toggle svg){
color: var(--dropdown-expanded-clr);
}


/* MENU ITEMS COLOR */
.dwc-nest-menu .brx-nav-nested-items > li .brx-submenu-toggle :where(span, a, svg) {
color: inherit;
font-weight: inherit;
} 

/* CHEVRON */
.dwc-nest-menu .brx-nav-nested-items > li:not(li:has([aria-current="page"]:not(.dwc-exclude)), li:hover) .brx-submenu-toggle svg{
color: var(--chevron-clr);
}

.dwc-nest-menu .brx-nav-nested-items > li .brx-submenu-toggle svg{
  font-size: var(--chevron-size);
  color: var(--chevron-clr);
  }
  .dwc-nest-menu .brx-nav-nested-items > li:has([aria-current="page"]:not(.dwc-exclude)) > .brx-submenu-toggle svg,
.dwc-nest-menu .brx-nav-nested-items  li:hover > .brx-submenu-toggle svg{  
  color: var(--chevron-hover-clr);
  }

[data-align-dropdown-top="true"] .brx-dropdown-content .brxe-dropdown { 
position: static;   
}

.brx-dropdown-content:not(.brx-has-megamenu .brx-dropdown-content) {
padding-inline-end: 0 !important;
}


/*OVERLAY*/
html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) :is(.brxe-code, .dwc-nest-menu-overlay),
body:has([data-hide-overlay="true"]) .dwc-nest-menu-overlay,
[data-builder-mode] .dwc-nest-menu-overlay {
display: none;
}

.bricks-is-frontend #brx-header .dwc-nest-menu[data-offcanvas="true"]:not([data-submenu-reveal = 'slide']) .brxe-dropdown:not(.open.active) > .brx-dropdown-content > .brxe-dropdown:not([data-submenu-reveal = 'slide'] *){
visibility: hidden;
}

/* builder */

[data-builder-mode] [data-offcanvas="true"] .dwc-nest-menu-top {
min-block-size: 80px !important;
}



/* ===========DESKTOP ONLY ============== */

:is( html:not(.dwc-mobile) .dwc-nest-header:not([data-overlay-header="true"]) [data-mobile-top-transparent="true"]) :is(.dwc-nest-menu-top:not([data-below-header="true"] *, :has(.open.active)), 
.dwc-nav-wrapper:not([data-below-header="true"] *, :has(.open.active))) {
  background-color: transparent !important;
}


html:not(.dwc-mobile):has(:is([data-last-item-is-button-alignment="center"], [data-last-item-is-button-alignment="left"])[data-last-item-is-button="true"]) :is(.dwc-menu-wrap, .dwc-nest-menu){
inline-size: 100%;
}

html:not(.dwc-mobile) [data-last-item-is-button-alignment="center"][data-last-item-is-button="true"].dwc-nest-menu:not(.brx-open) .dwc-nest-nav-items > li:is(:last-of-type, :first-of-type){
margin-inline-start: auto;
}

html:not(.dwc-mobile) [data-last-item-is-button-alignment="left"][data-last-item-is-button="true"].dwc-nest-menu:not(.brx-open) .dwc-nest-nav-items > li:is(:last-of-type) {
margin-inline-start: auto;
}

html:not(.dwc-mobile) .dwc-nest-tooltip {
    display: none !important;
    clip: rect(1px,1px,1px,1px);
    word-wrap: normal!important;
    border: 0;
    clip-path: inset(50%);
    height: 1px !important;
    margin: -1px;
    overflow: hidden;
    overflow-wrap: normal!important;
    padding: 0 !important;
    width: 1px;
}


html:not(.dwc-mobile)  .open:has(.open) .open:has(.brxe-dropdown:hover) .brx-dropdown-content:not(.brx-header-left *, .brx-header-right *, [data-offcanvas="true"] *)  {
box-shadow: 0px 10px 30px -10px rgba(0, 0, 0, 30%);
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right) .brxe-nav-nested .brxe-dropdown.open>.brx-dropdown-content {
  display: flex;
  min-width: auto;
  opacity: 1;
  overflow-y: auto;
  position: static;
  visibility: visible;
  
}

/* EXTEND DROPDWON BUTTON TO AVOID LOSING FOCUS/CLOSING ON DROPDOWN CONTENT */


html:not(.dwc-mobile) body:not(.brx-header-right, .brx-header-left) .dwc-nest-menu:not([data-offcanvas="true"]) .open .brx-dropdown-content .brxe-dropdown:has( > .brx-sub-submenu-overflow-right):hover::after {
    inset-inline-end: 100%;
    inset-inline-start: auto;
}

html:not(.dwc-mobile) body:not(.brx-header-right, .brx-header-left) .dwc-nest-menu:not([data-offcanvas="true"]) .open  .brx-dropdown-content .brxe-dropdown:not(.brxe-dropdown:has( > .brx-sub-submenu-overflow-right)):hover::after {   
   inset-inline-start: 100%;
}


html:not(.dwc-mobile) body:not(.brx-header-right, .brx-header-left) .dwc-nest-menu:not([data-offcanvas="true"]) .open  .brx-dropdown-content .brxe-dropdown:hover::after {
    content: "";
    position: absolute;
    inset-block-end: 0;
    block-size: 100%;
    inline-size: 100%;
    z-index: -1;
 inset-inline-end: auto;
}


/*DIM DROPDOWN PARENT WHOSE CHILD DROPDOWN CONTENT IS SHOWING  */
html:not(.dwc-mobile) .open:has(.open) >  .brx-dropdown-content:not(.brx-header-left *, .brx-header-right *)::before {
content: "";
position: absolute;
inset: 0;
background-color: var(--dropdown-inactive-overlay);
pointer-events: none;
border-radius: var(--dropdown-content-border-radius);
z-index: 1;
}

html:not(.dwc-mobile) .open:has(.open) >   .brxe-dropdown:not(.open, .brx-header-left *, .brx-header-right *){
    position: static;
}
html:not(.dwc-mobile) .open:has(.open) > .brxe-dropdown:not(.open, .brx-header-left *, .brx-header-right *) > ul{
    opacity: 0;
    transition: 0s
}

html:not(.dwc-mobile) .brxe-dropdown.open:not(.brx-has-megamenu, .brx-header-left *, .brx-header-right *){   
     z-index: 1; 
}

/* LAST BUTTON LEFT PADDDING ON DESKTOP */
html:not(.dwc-mobile) [data-last-item-is-button="true"].dwc-nest-menu .brx-nav-nested-items > .menu-item:last-of-type {
padding-inline-start: var(--menu-item-inline-padding);
}

/* hide toggle with back button appears */
html:not(.dwc-mobile) body:has(.brxe-dropdown.open) [data-offcanvas="true"] .brxe-toggle[aria-label="Open Menu"] {
z-index: 1;
}

/* fades in close button when the main toggle is covered by the back button */
html:not(.dwc-mobile) body:has(.brxe-dropdown.open) [data-offcanvas="true"] .brxe-toggle[aria-label="Close Menu"]:not([data-submenu-reveal="expand"] *){
opacity: 1;
}

html:not(.dwc-mobile) [data-mobile-top-transparent="true"][data-offcanvas="true"]:not([data-show-mobile-logo="true"]) .brxe-toggle[aria-label="Close Menu"] {
opacity: 0;
}

html:not(.dwc-mobile) [data-show-mobile-logo="true"] .dwc-nav-wrapper{
  z-index: 9999
  }

html:not(.dwc-mobile) [data-offcanvas="true"].dwc-nest-menu .brxe-toggle {
display: flex;
}

/* STRIPE STYLE */
html:not(.dwc-mobile) .dwc-stripe-style .brxe-dropdown.brx-has-megamenu .brx-dropdown-content:not([data-offcanvas="true"] .brx-has-megamenu .brx-dropdown-content, .brx-header-left .brx-has-megamenu .brx-dropdown-content, .brx-header-right .brx-has-megamenu .brx-dropdown-content) {
background: transparent !important;
}

html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu > .brx-submenu-toggle:not([data-offcanvas="true"] .brx-submenu-toggle, .brx-header-left .brx-submenu-toggle, .brx-header-right .brx-submenu-toggle),
html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu > .brx-submenu-toggle:not([data-offcanvas="true"] .brx-submenu-toggle, .brx-header-left .brx-submenu-toggle, .brx-header-right .brx-submenu-toggle) > a,
html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu > .brx-submenu-toggle:not([data-offcanvas="true"] .brx-submenu-toggle, .brx-header-left .brx-submenu-toggle, .brx-header-right .brx-submenu-toggle) > button {
cursor: default;
}

/* handles translate and opacity animation for stripe style on desktop */
/*
html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu.open .brx-dropdown-content:not([data-offcanvas="true"] .brx-has-megamenu .brx-dropdown-content, .brx-header-left .brx-has-megamenu .brx-dropdown-content, .brx-header-right .brx-has-megamenu .brx-dropdown-content) > * {
transform: translateX(0);
}

html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu.open .brx-dropdown-content:not([data-offcanvas="true"] .brx-has-megamenu .brx-dropdown-content, .brx-header-left .brx-has-megamenu .brx-dropdown-content, .brx-header-right .brx-has-megamenu .brx-dropdown-content) > * {
transition: transform 0.4s, opacity 0s 0.15s;
opacity: 1;
}

html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu .brx-dropdown-content:not([data-offcanvas="true"] .brx-has-megamenu .brx-dropdown-content, .brx-header-left .brx-has-megamenu .brx-dropdown-content, .brx-header-right .brx-has-megamenu .brx-dropdown-content) > * {
transition: transform 0.4s, opacity 0s;
opacity: 0;
}

html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu.open + .brx-has-megamenu .brx-dropdown-content:not([data-offcanvas="true"] .brx-has-megamenu .brx-dropdown-content, .brx-header-left .brx-has-megamenu .brx-dropdown-content, .brx-header-right .brx-has-megamenu .brx-dropdown-content) > * {
transform: translateX(5%);
}

html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu:has(+ .brx-has-megamenu.open) .brx-dropdown-content:not([data-offcanvas="true"] .brx-has-megamenu .brx-dropdown-content, .brx-header-left .brx-has-megamenu .brx-dropdown-content, .brx-header-right .brx-has-megamenu .brx-dropdown-content) > * {
transform: translateX(-5%);
}
*/

/* handles translate and opacity animation for stripe style on desktop - NEW */
html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu.open .brx-dropdown-content:not([data-offcanvas="true"] .brx-has-megamenu .brx-dropdown-content, .brx-header-left .brx-has-megamenu .brx-dropdown-content, .brx-header-right .brx-has-megamenu .brx-dropdown-content) > * > *{
transform: translateX(0);
}

html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu .brx-dropdown-content:not([data-offcanvas="true"] .brx-has-megamenu .brx-dropdown-content, .brx-header-left .brx-has-megamenu .brx-dropdown-content, .brx-header-right .brx-has-megamenu .brx-dropdown-content) > * > *{
transition: transform 0.4s;
}

html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu.open + .brx-has-megamenu .brx-dropdown-content:not([data-offcanvas="true"] .brx-has-megamenu .brx-dropdown-content, .brx-header-left .brx-has-megamenu .brx-dropdown-content, .brx-header-right .brx-has-megamenu .brx-dropdown-content) > * > *{
transform: translateX(50px);
}

html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu:has(+ .brx-has-megamenu.open) .brx-dropdown-content:not([data-offcanvas="true"] .brx-has-megamenu .brx-dropdown-content, .brx-header-left .brx-has-megamenu .brx-dropdown-content, .brx-header-right .brx-has-megamenu .brx-dropdown-content) > * > *{
transform: translateX(-50px);
}

html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu.open .brx-dropdown-content:not([data-offcanvas="true"] .brx-has-megamenu .brx-dropdown-content, .brx-header-left .brx-has-megamenu .brx-dropdown-content, .brx-header-right .brx-has-megamenu .brx-dropdown-content) > * {   
    overflow-x: hidden;
}


/* mobile logo */
html:not(.dwc-mobile) .dwc-nest-menu__mobile-logo:not([data-offcanvas="true"]:not(.brx-header-left *, .brx-header-right *) .dwc-nest-menu__mobile-logo) {
display: none;
}


/* prevent fouc when offcanvas is enabled and anime height */
body.bricks-is-frontend:has([data-offcanvas="true"])
.dwc-nav-wrapper:not(.sidebar-ready .dwc-nav-wrapper){
display: none;
}

.dwc-mobile [data-hide-close-bar = 'true'] .dwc-nav-wrapper{
inset-block-start: var(--dwc-nest-header-height) 
}

:is(.brx-header-left, .brx-header-right) .dwc-nest-header::before{
display: none;
}

/* mobile menu from top behind header */
.dwc-mobile :is([data-slide-in-direction="top"], [data-slide-in-direction="top left"]):not([data-match-overlay-header-width="true"]) .dwc-nav-wrapper:has(.brxe-dropdown.open.active) {
  z-index: unset !important;
}

.dwc-mobile :is([data-slide-in-direction="top"], [data-slide-in-direction="top left"]) .dwc-nav-wrapper {
z-index: -1;
}

.dwc-mobile .dwc-nest-header__container:has(:is([data-slide-in-direction="top"], [data-slide-in-direction="top left"])) {
  background-color: var(--header-bg)
}

/************************************
MENU HEIGHT/ STRIPE STYLE
************************************/

:is([data-builder-mode], .brx-header-right, .brx-header-left) .dwc-nest-header::after,
body:has([data-offcanvas="true"]) .dwc-nest-header::after {
display: none;
}

.dwc-nest-header:not(:is(.dwc-adaptive-height, .dwc-stripe-style) .dwc-nest-header)::after{
display: none;
}


html:not(.dwc-mobile) .dwc-nest-header::after {
  display: none;
  content: '';
  min-block-size: 0;
  inset-inline-start: 0;
  inline-size: 100%;
  transition-delay: 0.1s !important;
  pointer-events: none;
  transition: inline-size 0.2s,
    block-size 0.2s,
    opacity 0.2s,
    inset-inline-start 0.2s,
    transform 0.2s !important;
  will-change: block-size, inline-size, inset-inline-start, transform, opacity;
  contain: layout paint;
  z-index: -1;
}

html:not(.dwc-mobile) .dwc-nest-header[data-overlay-header="true"][data-overlay-header-optimize-adaptive-height="true"]::after {
  position: fixed;
}

html:not(.dwc-mobile) .dwc-adaptive-height:not(.dwc-stripe-style) .dwc-nest-header[data-overlay-header="true"][data-overlay-header-optimize-adaptive-height="true"]::after {
  inset-block-start: 0;
}

html:not(.dwc-mobile) .dwc-nest-header:not([data-overlay-header="true"][data-overlay-header-optimize-adaptive-height="true"])::after {
  position: absolute;
  inset-block-end: calc(100% - var(--dwc-nest-header-height));
  block-size: 1000px;
  transform: translateY(calc(var(--dropdown-menu-height) * 1.01)) translateZ(0);
}


html:not(.dwc-mobile) .adaptive-height-active:is(.dwc-stripe-style, .dwc-adaptive-height) .dwc-nest-header::after {
  display: block;
}

.dwc-nest-menu .brx-has-megamenu .brx-dropdown-content:not(.show-nav .brx-dropdown-content, [data-builder-mode] .brx-dropdown-content){
  display:none
}

html:not(.dwc-mobile) body:has(.brx-has-megamenu.open) .dwc-nest-header::after {
transition-delay: 0s !important;
}

/* STRIPE STYLE */
html:not(.dwc-mobile) .dwc-stripe-style.bricks-is-frontend .brx-has-megamenu .brx-dropdown-content:not([data-offcanvas="true"] .brx-dropdown-content),
html:not(.dwc-mobile) .dwc-adaptive-height.bricks-is-frontend .brx-has-megamenu .brx-dropdown-content:not([data-offcanvas="true"] .brx-dropdown-content) {
transition-delay: 0s;
box-shadow: none !important;
transition-duration: 0s;
}

html:not(.dwc-mobile) .dwc-stripe-style.bricks-is-frontend .brx-has-megamenu .brx-dropdown-content:not([data-offcanvas="true"] .brx-dropdown-content) {
overflow-x: hidden;
}

html:not(.dwc-mobile) .dwc-stripe-style .open.brx-has-megamenu .brx-dropdown-content:not([data-offcanvas="true"] .brx-dropdown-content),
html:not(.dwc-mobile) .dwc-adaptive-height .open.brx-has-megamenu .brx-dropdown-content:not([data-offcanvas="true"] .brx-dropdown-content) {
transition-delay: 0.1s;
transition-duration: .2s;
}


html:not(.dwc-mobile) .dwc-stripe-style .open.brx-has-megamenu:not([data-offcanvas="true"] .brx-has-megamenu)::before {
    content: '';
    position: absolute;
    inset-block-start: 100%;
    block-size: calc(var(--dwc-nest-header-height)* 0.5);
    inline-size: min(var(--dropdown-menu-width), 40vw);
    transform: translateX(-50%);
    inset-inline-start: 0;
}

html:not(.dwc-mobile) .dwc-stripe-style .brx-nav-nested-items>.brxe-dropdown.brx-has-megamenu>.brx-dropdown-content:not([data-offcanvas="true"] .brx-dropdown-content) {
overflow-x: hidden;
border-radius: var(--stripe-border-radius);
}


html:not(.dwc-mobile) .dwc-nest-header {
position: relative;
}

html:not(.dwc-mobile) .dwc-stripe-style .dwc-nest-header::before {
content: '';
inline-size: calc(max(var(--dropdown-content-gap) + 2.5px, 16px) * 1.1);
block-size: calc(max(var(--dropdown-content-gap) + 2.5px, 16px) * 1.1);
background-color: var(--adaptive-height-bg);
position: absolute;
inset-block-start: 100%;
transition: 0s;
transition-property: inset-inline-start, transform, opacity;
inset-inline-start: var(--navlink-midpoint);
transform: translateX(-50%) rotate(45deg) translateY(calc(50% + 0px));
pointer-events: none;
border-top: var(--adaptive-height-border);
border-left: var(--adaptive-height-border);
z-index: 999;
}

html:not(.dwc-mobile) .dwc-stripe-style .dwc-nest-header:has(.brxe-dropdown.brx-has-megamenu.open:hover)::before {
  transition: 
    opacity 0.2s 0.1s, 
    transform 0.2s 0s,
  inset-inline-start 0.2s 0s;
}

html:not(.dwc-mobile) .dwc-nest-header::before{
opacity: 0 ;
}

html:not(.dwc-mobile) .dwc-nest-header.hide-menu-animation::after {
  opacity: 0 !important;
  }

html:not(.dwc-mobile) .dwc-stripe-style .dwc-nest-header.show-menu-animation:has(.brx-has-megamenu:hover)::before,
html:not(.dwc-mobile) .dwc-nest-header.show-menu-animation::after {
opacity: 1;
}

html:not(.dwc-mobile) .dwc-nest-header.show-menu-animation::after {
  box-shadow: var(--adaptive-height-shadow)
  }


html:not(.dwc-mobile) .dwc-stripe-style .dwc-nest-header::after {
border: var(--adaptive-height-border);
}




html:not(.dwc-mobile) .dwc-stripe-style .dwc-nest-header::after {
inset-inline-start: calc(var(--dropdown-menu-x) - 2.5rem);
inline-size: calc(var(--dropdown-menu-width) + 5rem);
transform: unset;
inset-block-start: calc(var(--dwc-nest-header-height) + max(var(--dropdown-content-gap), 16px));
block-size: var(--dropdown-menu-height);
z-index: 1;
opacity: 0;
}

html:not(.dwc-mobile) .dwc-stripe-style:has(.brx-has-megamenu.open):not(:has([data-optimize-stripe=true])) .dwc-nest-header::after {
block-size: calc(var(--dropdown-menu-height) + 0rem) !important;
opacity: 1;
}

/* hide nav content until js is ready*/
html:not(.dwc-mobile) .dwc-stripe-style .brx-has-megamenu>.brx-dropdown-content:not(.show-nav .brx-dropdown-content, [data-offcanvas="true"] .brx-dropdown-content) {
opacity: 0;
}



body:has(.brx-has-megamenu.open) .sticky .dwc-nest-header::after {
background-color: var(--adaptive-height-bg) !important;
}

body:has(.brx-has-megamenu.open) .brx-sticky .dwc-nest-header::after {
  background-color: var(--adaptive-height-bg) !important;
  }

.dwc-nest-header::after {
background-color: var(--adaptive-height-bg) !important;
opacity: 0;
}

html:not(.dwc-mobile) .dwc-stripe-style:has([data-optimize-stripe=true]) .dwc-nest-header::after {
inset-inline-start: calc(var(--dropdown-menu-x) - 1.5px);
inline-size: calc(var(--dropdown-menu-width) + 2.5px);
/*transform: unset;*/
block-size: calc(var(--dropdown-menu-height) + 3px) !important;
z-index: 1;
border-radius: var(--stripe-border-radius);
transform: translateZ(0);
opacity: 1
}


html:not(.dwc-mobile) .dwc-stripe-style:has([data-optimize-stripe=true]) .dwc-nest-header::after {
border: var(--adaptive-height-border);
}


html:not(.dwc-mobile) :not(.brx-header-left, .brx-header-right).dwc-stripe-style:has([data-optimize-stripe=true]) .brx-nav-nested-items>.brxe-dropdown.brx-has-megamenu>.brx-dropdown-content:not([data-offcanvas="true"] .brx-dropdown-content) {
transform: translateY(16px) !important; 
inset-block-start: 100%;
}


.dwc-nest-header:not(.show-nav .dwc-nest-header)::after {
display: none;
}

/* STRIP FIX FOR DYNAMIC NAV  */
html:not(.dwc-mobile) 
:not(.brx-header-left, .brx-header-right).dwc-stripe-style:has([data-optimize-stripe=true]) 
.brx-nav-nested-items> li > .brxe-dropdown.brx-has-megamenu>.brx-dropdown-content:not([data-offcanvas="true"] .brx-dropdown-content) {
    transform: translateY(max(calc(var(--dropdown-content-gap) + 2.5px), 17px)) !important;
    inset-block-start: 100%;   
}


html:not(.dwc-mobile) .dwc-stripe-style .show-menu-animation .dwc-nest-header:has(.brx-has-megamenu:hover)::before, 
html:not(.dwc-mobile) .show-menu-animation::after {
    opacity: 1;
}

html:not(.dwc-mobile) .hide-menu-animation .dwc-nest-header::after {
    opacity: 0 !important;
}

html:not(.dwc-mobile) .dwc-stripe-style:has([data-optimize-stripe=true]) .dwc-nest-header::after {
     block-size: calc(var(--dropdown-menu-height) + 6px) !important; 
}


/****************
MENU OVERLAY
***************/

.dwc-nest-menu-overlay {
position: fixed;
inline-size: 100%;
block-size: 100%;
inset-inline-start: 0;
inset-block-end: 0;
background: var(--nav-overlay-backdrop-clr) !important;
z-index: 2;   
opacity: 0;
transition: 0.4s;
backdrop-filter: blur(var(--nav-overlay-backdrop-blur));
}

html:not(.dwc-mobile) .dwc-nest-header:has(.dwc-nest-menu-overlay) .brxe-nav-nested{
    z-index: 3
}

[data-overlay-header=true].dwc-nest-header .dwc-nest-menu-overlay{
    display: none;
} 

body:not(:has([data-overlay-header-optimize-adaptive-height="true"][data-overlay-header="true"])) .dwc-nest-menu-overlay  {
  inset-block-start: var(--dwc-nest-header-height);
}

.logged-in:not(:has([data-overlay-header-optimize-adaptive-height="true"][data-overlay-header="true"])) .dwc-nest-menu-overlay:not(:has(+ .x-header)) {
  inset-block-start: calc(var(--dwc-nest-header-height) + var(--wp-admin--admin-bar--height, 0px));
  }

body:has([data-overlay-header-optimize-adaptive-height="true"][data-overlay-header="true"], [data-overlay-on-header="true"]) .dwc-nest-menu-overlay  {
  inset-block-start: 0 !important;
}








.dwc-nest-menu-overlay {
pointer-events: none;
}

.no-scroll .dwc-nest-menu-overlay {
opacity: 1;  
}

:is(.brx-header-right, .brx-header-left) .dwc-nest-header__container {
padding-inline: 0
}



/*fade in back button*/
@-webkit-keyframes dwc-nest-fade-in {
0% {
  opacity: 0;
}
100% {
  opacity: 1;
}
}
@keyframes slide-in-right {
0% {
  opacity: 0;
}
100% {   
  opacity: 1;
}
}

/* configurable menu and submenu slide out speed */
.dwc-mobile .bricks-is-frontend [data-submenu-reveal="slide"].dwc-nest-menu :is(.brx-dropdown-content, .dwc-nav-wrapper),
.bricks-is-frontend :is([data-submenu-reveal="slide"][data-offcanvas="true"]).dwc-nest-menu :is(.brx-dropdown-content, .dwc-nav-wrapper),
:is(.bricks-is-frontend.brx-header-right, .bricks-is-frontend.brx-header-left) :is([data-submenu-reveal="slide"]).dwc-nest-menu :is(.brx-dropdown-content, .dwc-nav-wrapper){
transition-duration: calc(0.5s / var(--slide-out-speed)) !important;    
}

#brx-header{
--content-gap: 0;
--at-container-gap: 0;
}


/* overlay header */
html:not(.dwc-mobile) .bricks-is-frontend 
#brx-header:has([data-overlay-header = "true"]) {
padding: var(--overlay-header-inset);  
}

html:not(.dwc-mobile) .bricks-is-frontend 
#brx-header:has([data-overlay-header = "true"]):not(.sticky, .brx-sticky) {
position: absolute;
inset-block-start: 0;
inset-inline: 0; 
}

html:not(.dwc-mobile) .bricks-is-frontend #brx-header > 
.dwc-nest-header[data-overlay-header = "true"]{
border-radius: var(--overlay-header-radius);
background-color: var(--overlay-header-bg);
box-shadow: var(--overlay-header-shadow);
max-inline-size: var(--overlay-header-width);
}


html:not(.dwc-mobile) .bricks-is-frontend #brx-header > 
.dwc-nest-header[data-overlay-header = "true"]:not(:has([data-offcanvas="true"])){
backdrop-filter: blur(var(--overlay-header-blur));
}


html:not(.dwc-mobile) .bricks-is-frontend #brx-header:has(.open) > 
.dwc-nest-header[data-overlay-header = "true"]{
background-color: var(--overlay-header-bg-active) !important;
}

/* overlay on mobile */
.dwc-mobile .bricks-is-frontend 
#brx-header:has([data-overlay-header-mobile = "true"]) {
padding: var(--overlay-header-inset);  
}

.dwc-mobile .bricks-is-frontend 
#brx-header:has([data-overlay-header-mobile = "true"]):not(.sticky, .brx-sticky) {
position: absolute;
inset-block-start: 0;
inset-inline: 0; 
}

.dwc-mobile .bricks-is-frontend #brx-header > 
.dwc-nest-header[data-overlay-header-mobile = "true"]{
border-radius: var(--overlay-header-radius);
background-color: var(--overlay-header-bg);
box-shadow: var(--overlay-header-shadow);
max-inline-size: var(--overlay-header-width);
}

/*offset hero top padding when overlay header is active */
#brx-header:has([data-offset-section-padding="true"]) + main > :is(section, div) {
  padding-block-start: var(--overlay-offset-padding);
}

/* menu height anime on overlay header  */

html:not(.dwc-mobile) .bricks-is-frontend.dwc-adaptive-height:not(.dwc-stripe-style) #brx-header:has([data-overlay-header = "true"]) .dwc-nest-header::after {
border-radius: min(var(--overlay-header-radius), 2em);
inset-block-end: calc(100% + var(--overlay-header-inset));
opacity: 1;    
}

html:not(.dwc-mobile) .bricks-is-frontend:is(.dwc-adaptive-height):not(.dwc-stripe-style)
#brx-header:has([data-overlay-header = "true"]:not([data-overlay-header-optimize-adaptive-height="true"])) 
.dwc-nest-header.show-menu-animation::after {
    transform: translateY( calc((var(--dropdown-menu-height) + (var(--dwc-nest-header-height) * 1.5)))) translateZ(0)
}

html:not(.dwc-mobile) .bricks-is-frontend:is(.dwc-adaptive-height):not(.dwc-stripe-style) #brx-header:has([data-overlay-header="true"][data-overlay-header-optimize-adaptive-height="true"]) .dwc-nest-header.show-menu-animation::after {
  block-size: calc((var(--dropdown-menu-height) + (var(--dwc-nest-header-height) * 1.5)));
}

/* we need to reposition the overlay outside the header */
html:not(.dwc-mobile) .bricks-is-frontend:has( .dwc-nest-menu .open):not(:has([data-offcanvas="true"])) .dwc-nest-menu-overlay{
  opacity: 1;
 }

/*menu items border radius desktop only*/
html:not(.dwc-mobile) .dwc-nest-menu .brx-nav-nested-items > li > 
:is(a:not([data-last-item-is-button="true"] .brx-nav-nested-items > .menu-item:last-of-type a, [data-last-item-is-button="true-2"] .brx-nav-nested-items > .menu-item:nth-last-of-type(-n+2) a, [data-last-item-is-button="true-3"] .brx-nav-nested-items > .menu-item:nth-last-of-type(-n+3) a, .dwc-nest-menu__logo ), .brx-submenu-toggle){
border-radius: var(--menu-item-radius);
}

html:not(.dwc-mobile) .dwc-nest-menu .brx-nav-nested-items {
  gap: var(--menu-items-gap);
}

/* dynamic dropdown conten width and position */

html:not(.dwc-mobile) :is(:not(.brx-header-left, .brx-header-right)).bricks-is-frontend .dwc-nest-menu:not([data-offcanvas="true"]) .brx-has-megamenu .brx-dropdown-content:not([data-use-selector="true"]) {
  min-inline-size: var(--dropdown-content-width, var(--dropdown-content-default-width)) !important;
  inset-inline-start: var(--left-position)!important;
}

html:not(.dwc-mobile) :is(:not(.brx-header-left, .brx-header-right)).bricks-is-frontend .dwc-nest-menu:not([data-offcanvas="true"]) .brx-dropdown-content {
  border-radius: var(--dropdown-content-border-radius);
}

.dwc-nest-header{
  position: relative;
  z-index: 9999;
  
}

/* optimize multi row header*/
.dwc-mobile .dwc-nest-header[data-fullscreen-mobile-menu="true"]{
  --dwc-nest-header-height:var(--fullscreen-mobile-menu-top-height) !important
}

.dwc-mobile .dwc-nest-header[data-fullscreen-mobile-menu="true"] .dwc-nest-menu-top:not([data-below-header="true"] *) {
    background-color: var(--mobile-menu-topbar-bg) !important;
   align-items: center !important;
  animation: none !important;
}

.dwc-mobile .dwc-nest-header[data-fullscreen-mobile-menu="true"] .dwc-nav-wrapper{
  z-index: 99999
}

.dwc-mobile .dwc-nest-header[data-fullscreen-mobile-menu="true"] .dwc-nest-menu-top .brxe-toggle {
    display: block;
}


.dwc-mobile .dwc-nest-header[data-fullscreen-mobile-menu="true"]:not([data-hide-mobile-logo="true"]) .dwc-nest-menu__mobile-logo {
    display: flex;
}

/* overlay header on multirow*/
html:not(.dwc-mobile) .dwc-nest-header[data-fullscreen-mobile-menu="true"][data-overlay-header="true"] > div:first-child{
    border-top-left-radius: var(--overlay-header-radius);
   border-top-right-radius: var(--overlay-header-radius);
}

/* BricksExtras support*/

html:not(.dwc-mobile) #brx-header .brxe-xheaderrow:has(.dwc-nest-header){
    position: relative;
    z-index:1;
}

html:not(.dwc-mobile) #brx-header .brxe-xheaderrow:first-child{
    position: relative;
    z-index: 99991;
}




[data-x-overlay]:not([data-x-overlay="none"]) .dwc-nest-header{
background: var(--x-overlay-header-background)!important;
 }

html:not(.dwc-mobile) .brxe-xheaderrow .dwc-nest-header::after {
  block-size: 1000px;
}



/* in builder */
[data-builder-mode] [data-offcanvas="true"] .dwc-nest-toggle--open{
display: none !important;
}

[data-builder-mode] [data-offcanvas="true"] .dwc-nest-menu-top{
  display: none;
}


:is(.brx-header-left, .brx-header-right) [data-builder-mode] .brx-nav-nested-items,
[data-builder-mode] .brx-open.dwc-nest-menu[data-offcanvas="true"] .brx-nav-nested-items {
  overflow-y: auto;
  scrollbar-width: thin !important;
  justify-content: flex-start !important;
box-shadow: var(--sidebar-shadow);
}


:is(.brx-header-left, .brx-header-right) [data-builder-mode] .dwc-nav-wrapper,
[data-builder-mode] [data-offcanvas="true"] .dwc-nav-wrapper {
  inset-inline-end: auto ;
  inset-inline-start: 0;
}

/* preview dropdown content width in builder*/

[data-builder-mode]:not(.brx-header-left, .brx-header-right) .dwc-nest-menu:not(.brx-open) .brx-has-megamenu .brx-dropdown-content:not([data-offcanvas="true"] .brx-dropdown-content, .brx-open .brx-dropdown-content){
  min-inline-size:var(--dropdown-content-width, var(--dropdown-content-default-width)) !important;  
  transform: translatex(50px);
  border: dotted #00b0f4 2px
}

[data-builder-mode]:not(.brx-header-left, .brx-header-right) .dwc-nest-menu .brx-has-megamenu .brx-dropdown-content:not([data-offcanvas="true"] .brx-dropdown-content, .brx-open .brx-dropdown-content):not([data-hide-instruction="true"])::after{
    content: 'Set dropdown Content width value in dropdown Content ATTRIBUTES > data-content-width, do not add a unit e.g. px. Leave empty to use global content width, set in Nav Nestable ATTRIBUTES > data-global-content-width. | Set alignment in ATTRIBUTES > data-content-align, values: left, right, center. This aligns the dropdown content to the dropdown button, leave empty to align center to the header. aligments are applied on frontend only. | TIP: click here to select dropdown Content';
    position: absolute;
    inset-block-start: 102%;
    color: #e1e1e1;
    font-size: 12px;    
    letter-spacing: 0.5px;
    line-height: 1.5;
    background: #2b2b2b;
    min-block-size: fit-content;
    padding: 1em;
}

/*set alignment for sidebar edit on desktop*/
:is(.brx-header-left, .brx-header-right)[data-builder-mode] .dwc-nest-menu.brxe-nav-nested .brx-nav-nested-items,
[data-builder-mode] .dwc-nest-menu.brxe-nav-nested[data-offcanvas="true"] .brx-nav-nested-items {
    justify-content: flex-start !important;
}

[data-builder-mode]:is(.brx-header-left, .brx-header-right)::before {
    content: 'To view sidebar, go to the MENU Styles/Options code block CSS, scroll to the end, and replace all the postid-xxxx in the CSS rules with this template post id';   
}


:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nest-menu:not(.brx-open)::after {
    content: 'To edit Sidebar, select the Nav (Nestable), go to the CONTENT tab > MOBILE MENU, enable "Keep open while styling" | TIP: click here to select Nav (Nestable)';
    position: absolute;    
    padding-inline-start: 20px;
    color: #e1e1e1;
    font-size: 12px;    
    line-height: 1.5;
    background: #2b2b2b;
    min-block-size: fit-content;
    padding: 1em;
    inline-size: 250px;
}

.brx-header-left[data-builder-window] #brx-header .dwc-nest-menu:not(.brx-open)::after {
  inset-inline-start: 100%;
}

.brx-header-right[data-builder-window] #brx-header .dwc-nest-menu:not(.brx-open)::after {
  inset-inline-end: 100%;
}

[data-builder-window] #brx-header .dwc-nest-menu[data-offcanvas="true"]:not(.brx-open)::after{
     content: 'To edit in Offcanvas mode, select the Nav (Nestable), go to the CONTENT tab > MOBILE MENU, enable "Keep open while styling" | TIP: click here to select Nav (Nestable)';
    position: absolute;
    inset-block-start: 100%;
    padding-block-start: 20px;
    color: #e1e1e1;
    font-size: 12px;    
    line-height: 1.5;
    background: #2b2b2b;
    min-block-size: fit-content;
    padding: 1em;
    inline-size: 250px;
}

@media (max-width: 1200px){
  [data-builder-window] #brx-header .dwc-nest-menu[data-offcanvas="true"]:not(.brx-open)::after{
     content: 'To edit in Offcanvas mode, select the Nav (Nestable), go to the CONTENT tab > MOBILE MENU, enable "Keep open while styling" ';
    position: absolute;
    inset-inline-start: var(--mobile-menu-width);
    padding-inline-start: 20px;
  }
}

[data-builder-mode] [data-offcanvas="true"]:not(.brx-open) .dwc-nav-wrapper {
    transform: translateX(0);
    visibility: visible;
}

[data-builder-window] [data-last-item-is-button="true"][data-offcanvas="true"].dwc-nest-menu .brx-nav-nested-items > .menu-item:last-of-type {
  padding-inline: var(--menu-item-inline-padding) !important;
  padding-block: var(--menu-item-block-padding) !important;
}


/* === */

:is(.brx-header-left, .brx-header-right)[data-builder-window]  .brxe-nav-nested .brxe-dropdown .brx-dropdown-content:not(.brx-open .brx-dropdown-content) {
    display: none;
}


:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nest-menu.brxe-nav-nested .brx-nav-nested-items {   
    scrollbar-width: none;
}


/* stripe style fix*/
html:not(.dwc-mobile) .dwc-stripe-style:not(.brx-header-left, .brx-header-right) .dwc-nest-header__container:not(:has([data-offcanvas="true"])) {
    align-items: stretch !important;
  }
  
  html:not(.dwc-mobile) .dwc-stripe-style:not(.brx-header-left, .brx-header-right) .dwc-nest-menu:not([data-offcanvas="true"]) .dwc-nav-wrapper,
  html:not(.dwc-mobile) .dwc-stripe-style:not(.brx-header-left, .brx-header-right) .dwc-nest-menu:not([data-offcanvas="true"]) .brx-nav-nested-items,
  html:not(.dwc-mobile) .dwc-stripe-style:not(.brx-header-left, .brx-header-right) .dwc-nest-menu:not([data-offcanvas="true"]) .brx-nav-nested-items > .brxe-dropdown,
  html:not(.dwc-mobile) .dwc-stripe-style:not(.brx-header-left, .brx-header-right) .dwc-nest-menu:not([data-offcanvas="true"]) .brx-nav-nested-items > .brxe-dropdown > .brx-submenu-toggle,
  html:not(.dwc-mobile) .dwc-stripe-style:not(.brx-header-left, .brx-header-right) .dwc-nest-menu:not([data-offcanvas="true"]) .brx-nav-nested-items > li > 
  a:not([data-last-item-is-button="true"] .menu-item:last-of-type a, [data-last-item-is-button="true-2"] .menu-item:nth-last-of-type(-n+2) a, [data-last-item-is-button="true-3"] .menu-item:nth-last-of-type(-n+3) a, .dwc-nest-menu__logo)
  /* a:not(:is([data-last-item-is-button="true"], [data-last-item-is-button="true-2"], [data-last-item-is-button="true-3"]).dwc-nest-menu .brx-nav-nested-items>:is(.menu-item:last-of-type, .menu-item:nth-last-of-type(-n+2), .menu-item:nth-last-of-type(-n+3)) a) */ { 
    height: 100%;
  }
  
  html:not(.dwc-mobile) .dwc-stripe-style:not(.brx-header-left, .brx-header-right) .dwc-nest-menu:not([data-offcanvas="true"]) .brx-nav-nested-items > li.menu-item {
    height: 100%;
    display: flex;
    align-items: center;
  }



/*fix overlay in boxed mode*/
.brx-boxed .dwc-nest-menu-overlay {
    inline-size: var(--boxed-width, 100%);
}

/*wait for stripe style to load before active */
body:is(.dwc-stripe-style, .dwc-adaptive-height):not(.adaptive-height-active, .brx-header-right, .brx-header-left) .dwc-nest-menu:not([data-offcanvas="true"]) .brx-has-megamenu{
  pointer-events: none;
}


/* LAST CTA BUTTONS */
/* Button styling for FRIST BUTTON*/
:is([data-last-item-is-button="true"], [data-last-item-is-button="true-2"], [data-last-item-is-button="true-3"]).dwc-nest-menu .brx-nav-nested-items > .menu-item:last-of-type a {
    color: var(--menu-cta-clr);
    background-color: var(--menu-cta-bg);
    border-radius: var(--menu-cta-radius) !important;
    padding-inline: var(--menu-cta-inline-padding) !important;
    padding-block: var(--menu-cta-block-padding) !important;
    border: var(--menu-cta-border);
}

:is([data-last-item-is-button="true"], [data-last-item-is-button="true-2"], [data-last-item-is-button="true-3"]).dwc-nest-menu .brx-nav-nested-items > .menu-item:nth-last-of-type(1) a:hover {
    color: var(--menu-cta-hover-clr);
    background-color: var(--menu-cta-hover-bg);
}

/* Button styling for second button*/
:is([data-last-item-is-button="true-2"], [data-last-item-is-button="true-3"]).dwc-nest-menu .brx-nav-nested-items > .menu-item:nth-last-of-type(2) a {
    color: var(--menu-cta-2-clr);
    background-color: var(--menu-cta-2-bg);
    border-radius: var(--menu-cta-2-radius) !important;
    padding-inline: var(--menu-cta-2-inline-padding) !important;
    padding-block: var(--menu-cta-2-block-padding) !important;
    border: var(--menu-cta-2-border);
}

:is([data-last-item-is-button="true-2"], [data-last-item-is-button="true-3"]).dwc-nest-menu .brx-nav-nested-items > .menu-item:nth-last-of-type(2) a:hover {
    color: var(--menu-cta-2-hover-clr);
    background-color: var(--menu-cta-2-hover-bg);
}

/* Button styling for third button */
[data-last-item-is-button="true-3"].dwc-nest-menu .brx-nav-nested-items > .menu-item:nth-last-of-type(3) a {
    color: var(--menu-cta-3-clr);
    background-color: var(--menu-cta-3-bg);
    border-radius: var(--menu-cta-3-radius) !important;
    padding-inline: var(--menu-cta-3-inline-padding) !important;
    padding-block: var(--menu-cta-3-block-padding) !important;
    border: var(--menu-cta-3-border);
}

[data-last-item-is-button="true-3"].dwc-nest-menu .brx-nav-nested-items > .menu-item:nth-last-of-type(3) a:hover {
    color: var(--menu-cta-3-hover-clr);
    background-color: var(--menu-cta-3-hover-bg);
}

/* Adjust padding for all variants in desktop mode */
html:not(.dwc-mobile) [data-last-item-is-button="true"].dwc-nest-menu .brx-nav-nested-items > .menu-item:last-of-type,
html:not(.dwc-mobile) [data-last-item-is-button="true-2"].dwc-nest-menu .brx-nav-nested-items > .menu-item:nth-last-of-type(-n+2),
html:not(.dwc-mobile) [data-last-item-is-button="true-3"].dwc-nest-menu .brx-nav-nested-items > .menu-item:nth-last-of-type(-n+3) {
    padding-inline-start: var(--menu-item-inline-padding);
}

/* Center alignment for single button case */
html:not(.dwc-mobile) [data-last-item-is-button-alignment="center"][data-last-item-is-button="true"].dwc-nest-menu:not(.brx-open) .dwc-nest-nav-items > li:is(:last-of-type, :first-of-type) {
    margin-inline-start: auto;
}

/* Center alignment for two buttons case */
html:not(.dwc-mobile) [data-last-item-is-button-alignment="center"][data-last-item-is-button="true-2"].dwc-nest-menu:not(.brx-open) .dwc-nest-nav-items > li:is(:nth-last-of-type(2), :first-of-type) {
    margin-inline-start: auto;
}

/* Center alignment for three buttons case */
html:not(.dwc-mobile) [data-last-item-is-button-alignment="center"][data-last-item-is-button="true-3"].dwc-nest-menu:not(.brx-open) .dwc-nest-nav-items > li:is(:nth-last-of-type(3), :first-of-type) {
    margin-inline-start: auto;
}

/* Left alignment for single button case */
html:not(.dwc-mobile) [data-last-item-is-button-alignment="left"][data-last-item-is-button="true"].dwc-nest-menu:not(.brx-open) .dwc-nest-nav-items > li:last-of-type {
    margin-inline-start: auto;
}

/* Left alignment for two buttons case */
html:not(.dwc-mobile) [data-last-item-is-button-alignment="left"][data-last-item-is-button="true-2"].dwc-nest-menu:not(.brx-open) .dwc-nest-nav-items > li:nth-last-of-type(2) {
    margin-inline-start: auto;
}

/* Left alignment for three buttons case */
html:not(.dwc-mobile) [data-last-item-is-button-alignment="left"][data-last-item-is-button="true-3"].dwc-nest-menu:not(.brx-open) .dwc-nest-nav-items > li:nth-last-of-type(3) {
    margin-inline-start: auto;
}

/* General width rule for all button cases and alignments */
html:not(.dwc-mobile):has(:is([data-last-item-is-button-alignment="center"], [data-last-item-is-button-alignment="left"]):is([data-last-item-is-button="true"], [data-last-item-is-button="true-2"], [data-last-item-is-button="true-3"])) :is(.dwc-menu-wrap, .dwc-nest-menu) {
    inline-size: 100%;
}



/* align dropdown content to bottom */
html:not(.dwc-mobile) .bricks-is-frontend:not(.brx-header-left, .brx-header-right) .dwc-nest-header__container:has([data-align-content-bottom="true"]):not(:has([data-offcanvas="true"])) {
  align-items: stretch !important;
}

html:not(.dwc-mobile) .bricks-is-frontend:not(.brx-header-left, .brx-header-right) .dwc-nest-menu[data-align-content-bottom="true"]:not([data-offcanvas="true"]) .dwc-nav-wrapper,
html:not(.dwc-mobile) .bricks-is-frontend:not(.brx-header-left, .brx-header-right) .dwc-nest-menu[data-align-content-bottom="true"]:not([data-offcanvas="true"]) .brx-nav-nested-items,
html:not(.dwc-mobile) .bricks-is-frontend:not(.brx-header-left, .brx-header-right) .dwc-nest-menu[data-align-content-bottom="true"]:not([data-offcanvas="true"]) .brx-nav-nested-items > .brxe-dropdown,
html:not(.dwc-mobile) .bricks-is-frontend:not(.brx-header-left, .brx-header-right) .dwc-nest-menu[data-align-content-bottom="true"]:not([data-offcanvas="true"]) .brx-nav-nested-items > .brxe-dropdown > .brx-submenu-toggle,
html:not(.dwc-mobile) .bricks-is-frontend:not(.brx-header-left, .brx-header-right) .dwc-nest-menu[data-align-content-bottom="true"]:not([data-offcanvas="true"]) .brx-nav-nested-items > li > 
a:not([data-last-item-is-button="true"] .menu-item:last-of-type a, [data-last-item-is-button="true-2"] .menu-item:nth-last-of-type(-n+2) a, [data-last-item-is-button="true-3"] .menu-item:nth-last-of-type(-n+3) a, .dwc-nest-menu__logo)
/* a:not(:is([data-last-item-is-button="true"], [data-last-item-is-button="true-2"], [data-last-item-is-button="true-3"]).dwc-nest-menu .brx-nav-nested-items>:is(.menu-item:last-of-type, .menu-item:nth-last-of-type(-n+2), .menu-item:nth-last-of-type(-n+3)) a, .dwc-nest-menu__logo)*/ { 
  height: 100%;
}

html:not(.dwc-mobile) .bricks-is-frontend:not(.brx-header-left, .brx-header-right) .dwc-nest-menu[data-align-content-bottom="true"]:not([data-offcanvas="true"]) .brx-nav-nested-items > li.menu-item {
  height: 100%;
  display: flex;
  align-items: center;
}

/* dropdown content gap */
html:not(.dwc-mobile) body:not(.brx-header-left, .brx-header-right) .dwc-nest-menu:not([data-offcanvas="true"]) .brxe-dropdown.open > .brx-dropdown-content:not(.brx-dropdown-content .brx-dropdown-content) {
 transform: translateY(calc(var(--caret-size) - var(--dropdown-content-border-size))) scaleX(1) scaleY(1);
}

html:not(.dwc-mobile) body:not(.brx-header-left, .brx-header-right) .dwc-nest-menu:not([data-offcanvas="true"]) .brxe-dropdown.open > .brx-dropdown-content .brx-dropdown-content{
  transform: translateY(0) scaleX(1) scaleY(1);
}

html:not(.dwc-mobile) .brx-dropdown-content:not(.open .brx-dropdown-content){
    --dropdown-content-border: solid transparent var(--dropdown-content-border-size);
}



html:not(.dwc-mobile) body:not(.brx-header-right, .brx-header-left) .dwc-nest-menu[data-align-content-bottom="true"][data-caret="true"]:not([data-offcanvas="true"]) .brx-nav-nested-items > .brxe-dropdown.open:not(.dwc-stripe-style .brx-has-megamenu)::after {
    inline-size: calc((var(--dropdown-content-gap) * 1.414) - var(--dropdown-content-border-size));
    aspect-ratio: 1;
    opacity: 1;
    transition: opacity 0.2s 0.1s;
}

html:not(.dwc-mobile) body:not(.brx-header-right, .brx-header-left) .dwc-nest-menu[data-align-content-bottom="true"][data-caret="true"]:not([data-offcanvas="true"]) .brx-nav-nested-items > .brxe-dropdown:not(.dwc-stripe-style .brx-has-megamenu)::after {
    content: '';
    position: absolute;
    background-color: var(--dropdown-content-bg);
    transform: rotate(45deg);
    inset-block-end: calc((-1 * var(--dropdown-content-gap) - (var(--dropdown-content-gap) * 1.414 / 2.2)) + var(--dropdown-content-border-size));
    inset-inline-start: calc(50% - var(
  --dropdown-content-gap));
    opacity: 0;
}


html:not(.dwc-mobile) body:not(.brx-header-right, .brx-header-left) .dwc-nest-menu:not([data-offcanvas="true"]) .brx-nav-nested-items > .brxe-dropdown:not(.dwc-stripe-style .brx-has-megamenu)::after { 
  border-top: var(--dropdown-content-border);
  border-left: var(--dropdown-content-border);
  z-index: 9999;
  inset-block-end: calc(var(--dropdown-content-gap) * -1.55);

}

html:not(.dwc-mobile) body:not(.brx-header-left, .brx-header-right) .dwc-nest-menu:not([data-offcanvas="true"]) .brx-nav-nested-items > .brxe-dropdown:not(.dwc-stripe-style .brx-has-megamenu)  .brx-dropdown-content{
 outline: var(--dropdown-content-border);
} 




/* === ends == */

body:not(.adaptive-height-active) .brxe-dropdown::after{
display: none;
}

/* multi-level dropdwon arrow > */

html:not(.dwc-mobile) body:not(.brx-header-left, .brx-header-right) 
.dwc-nest-menu:not([data-offcanvas="true"])
.brxe-dropdown:not(.brx-has-megamenu) .brxe-dropdown .brx-submenu-toggle button 
svg {
  transform: rotate(270deg);
}


/* align dropwdown in builder */

[data-builder-mode]:not(.brx-header-left, .brx-header-right) .brx-has-megamenu .brx-dropdown-content[data-content-align="left"][preview-alignment="true"]{
left: 0 !important;
right: auto !important;
}

[data-builder-mode]:not(.brx-header-left, .brx-header-right) .brx-has-megamenu .brx-dropdown-content[data-content-align="right"][preview-alignment="true"]{
left: auto !important;
right: 0 !important; 
}

[data-builder-mode]:not(.brx-header-left, .brx-header-right) .dwc-nest-menu:not(.brx-open) .brx-has-megamenu .brx-dropdown-content[data-content-align="center"][preview-alignment="true"]{
left: 50% !important;
transform: translatex(-50%) !important;
}


/* BREAKOUT ITEM */
.dwc-nest-menu > [data-breakout-link]:not(.dwc-nest-menu__logo){
      color: var(--menu-cta-clr);
    background-color: var(--menu-cta-bg);
    border-radius: var(--menu-cta-radius) !important;
    padding-inline: var(--menu-cta-inline-padding) !important;
    padding-block: var(--menu-cta-block-padding) !important;
    border: var(--menu-cta-border);   
}

.dwc-nest-menu > [data-breakout-link="before"],
.dwc-nest-menu > [data-breakout-link]:not([data-breakout-link="after"], .dwc-nest-menu__logo){   
  margin-inline-end: var(--cta-breakout-gap);
  margin-inline-start: auto;
}

.dwc-nest-menu > [data-breakout-link="after"]{   
  margin-inline-start: var(--cta-breakout-gap);
  order: 1;
}

.dwc-menu-wrap:has(.dwc-nest-menu__logo[data-breakout-link]),
.brxe-nav-nested:has(.dwc-nest-menu__logo[data-breakout-link]){
inline-size: 100% !important;
}

.dwc-stripe-style .dwc-menu-wrap:has(.dwc-nest-menu__logo[data-breakout-link]), 
.dwc-stripe-style .brxe-nav-nested:has(.dwc-nest-menu__logo[data-breakout-link]) {   
    min-height: var(--header-min-height);
}

.dwc-nest-header__container:has(.brx-nav-nested-items .dwc-nest-menu__logo[data-breakout-link]) { 
  flex-direction: column !important;
  justify-content: center !important;
}


.dwc-nest-menu > [data-breakout-link="after"] + .brxe-toggle[aria-label="Open Menu"]{
    margin-inline-start: auto;
}


/* BREAKIN ITEM */

.dwc-mobile .dwc-nav-wrapper:has([data-breakin]) {
background: linear-gradient(to top, var(--mobile-menu-bg) 0%, var(--mobile-menu-bg) calc(100% - var(--dwc-nest-header-height)), transparent calc(100% - var(--dwc-nest-header-height)), transparent 100%);

}


.dwc-mobile .dwc-nav-wrapper:has([data-breakin]) .breakin-container{
   inline-size: 100%;
}

.dwc-mobile .dwc-nav-wrapper:has([data-breakin="end"]) .breakin-container{
   margin-block-start: auto;
}

html:not(.dwc-mobile) .breakin-container{
display: none;
}



/* ==== DYNAMIC NAV CUSTOM CSS ==== */

[data-builder-mode] .dwc-nest-menu .brx-nav-nested-items > a:not(.dwc-nest-menu__logo){
    font-weight: var(--menu-item-font-weight);
    font-size: var(--menu-item-font-size);
    color: var(--menu-item-clr);
    background-color: var(--menu-item-bg);
    padding-block: var(--menu-item-block-padding);
    padding-inline: var(--menu-item-inline-padding) !important;
  
}


[data-builder-mode] .dwc-nest-menu .brx-dropdown-content > a:not(.brx-has-megamenu a) {
    background-color: var(--dropdown-item-bg);
        padding-block: var(--dropdown-item-block-padding);
    padding-inline: var(--dropdown-item-inline-padding) !important;
        font-weight: var(--menu-item-font-weight);
    font-size: var(--menu-item-font-size);
    color: var(--menu-item-clr);   
    inline-size: 100%;
}

[data-builder-mode] .dwc-nest-menu .brx-dropdown-content > a:hover:not(.brx-has-megamenu a) {
    background-color: var(--dropdown-item-hover-bg);
    color: var(--dropdown-item-hover-clr);
}


body:not([data-builder-mode]) .dwc-nest-menu .brx-nav-nested-items > li:empty{
    visibility: hidden;
}


.dwc-nest-menu .brx-nav-nested-items > * > .brxe-dropdown:not(.brx-has-megamenu) li .brx-submenu-toggle {
    padding-block: var(--dropdown-item-block-padding);
    padding-inline: var(--dropdown-item-inline-padding) !important;
}

/* ==== END DYNAMIC NAV CUSTOM CSS ==== */



/* CARET FIX FOR DYNAMIC MENU STRUCTURE*/


.dwc-nest-menu .brx-nav-nested-items > 
li> .brx-has-megamenu.open > .brx-dropdown-content {
    opacity: 1;
    visibility: visible;
}

html:not(.dwc-mobile) 
body:not(.brx-header-right, .brx-header-left) .dwc-nest-menu[data-align-content-bottom="true"][data-caret="true"]:not([data-offcanvas="true"]) 
.brx-nav-nested-items > li:has(.brx-has-megamenu.open):not(.dwc-stripe-style .brx-nav-nested-items > li)::after {
    inline-size: calc((var(--dropdown-content-gap) * 1.414) - var(--dropdown-content-border-size));
    aspect-ratio: 1;
    opacity: 1;
    transition: opacity 0.2s 0.1s;
}

html:not(.dwc-mobile) 
body:not(.brx-header-right, .brx-header-left) .dwc-nest-menu[data-align-content-bottom="true"][data-caret="true"]:not([data-offcanvas="true"]) 
.brx-nav-nested-items > li:has(.brx-has-megamenu):not(.dwc-stripe-style .brx-nav-nested-items > li)::after {
      content: '';
    position: absolute;
    background-color: var(--dropdown-content-bg);
    transform: rotate(45deg);
    inset-block-end: calc((-1 * var(--dropdown-content-gap) - (var(--dropdown-content-gap) * 1.414 / 2.2)) + var(--dropdown-content-border-size));
    inset-inline-start: calc(50% - var(
  --dropdown-content-gap));
    opacity: 0;
}


html:not(.dwc-mobile) 
.bricks-is-frontend:not(.brx-header-left, .brx-header-right) 
.dwc-nest-menu[data-align-content-bottom="true"]:not([data-offcanvas="true"]) 
.brx-nav-nested-items > li {
    height: 100%;
    display: flex;
    align-items: center;
}

html:not(.dwc-mobile) 
.bricks-is-frontend:not(.brx-header-left, .brx-header-right) .dwc-nest-menu[data-align-content-bottom="true"]:not([data-offcanvas="true"]) 
.brx-nav-nested-items > li > .brxe-dropdown > .brx-submenu-toggle,
html:not(.dwc-mobile) 
.bricks-is-frontend:not(.brx-header-left, .brx-header-right) .dwc-nest-menu[data-align-content-bottom="true"]:not([data-offcanvas="true"]) 
.brx-nav-nested-items > li > .brxe-dropdown{
height: 100%
    }

.brx-nav-nested-items > li:has(> a),
.brx-nav-nested-items > li:has(> .brx-submenu-toggle) {
    position: relative;
}

/* END CARET FIX FOR DYNAMIC MENU STRUCTURE*/

/* SPECIAL MOBILE STYLES TABLET ONLY */


@media (min-width: 640px) and (max-width: 1200px) {

    /* mega menu */
    .dwc-mobile .bricks-is-frontend [data-mobile-special-style="slide-split"] .dwc-nav-wrapper {
        --mobile-menu-width: min(720px, 100%);
      align-items: flex-end;
    }

    .dwc-mobile .bricks-is-frontend [data-mobile-special-style="slide-split"] [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brx-has-megamenu.brxe-dropdown .brx-dropdown-content:not([data-hide-close-bar="true"] ul, [data-submenu-reveal="expand"].brx-has-megamenu ul) {
        inline-size: min(400px, 100%);
        box-shadow: 0px 0px 15px -10px #000000b3
    }

     .dwc-mobile .bricks-is-frontend [data-mobile-special-style="slide-split"] [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brx-has-megamenu.brxe-dropdown .brx-dropdown-content:not([data-submenu-reveal="expand"].brx-has-megamenu ul) {
        inset-inline-end: 0 !important;
        inset-inline-start: auto !important;
        inset-block-start: 0 !important;
    }

/*dropdown*/


     .dwc-mobile .bricks-is-frontend [data-mobile-special-style="slide-split"] [data-submenu-reveal="slide"].dwc-nest-menu.brxe-nav-nested .brxe-dropdown:not(:is([data-submenu-reveal="expand"], .brx-has-megamenu)) .brx-dropdown-content:not([data-submenu-reveal="expand"] *),
     .dwc-mobile .bricks-is-frontend [data-mobile-special-style="slide-split"] [data-submenu-reveal="slide"].brxe-dropdown:not(.brx-has-megamenu) .brx-dropdown-content {
        transition-property: inset-inline-start, inset-inline-end, visibility, opacity !important;
        inset-inline-start: auto !important;
        width: 400px;
        box-shadow: 0px 0px 15px -10px #000000b3;
        inset-block-start: 0 !important;
        inset-inline-end: -100% !important;
    }

     .dwc-mobile .bricks-is-frontend [data-mobile-special-style="slide-split"] [data-submenu-reveal="slide"].brxe-nav-nested.brx-open .brxe-dropdown.open:not(.brx-has-megamenu, [data-submenu-reveal="expand"])>.brx-dropdown-content,
     .dwc-mobile .bricks-is-frontend [data-mobile-special-style="slide-split"] .brx-open [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content,
     .dwc-mobile .bricks-is-frontend [data-mobile-special-style="slide-split"] .brx-open [data-submenu-reveal="slide"].brxe-dropdown.open>.brx-dropdown-content .open>.brx-dropdown-content {
        inset-inline-end: 0% !important;
        inset-inline-start: auto !important;
    }

  /*active styles*/
   .dwc-mobile  body:not(.brx-header-right, .brx-header-left) [data-mobile-special-style="slide-split"] .brx-nav-nested-items > li > .brx-has-megamenu.open > .brx-submenu-toggle{
    background-color: var(--menu-item-active-bg);
}

 .dwc-mobile  body:not(.brx-header-right, .brx-header-left) [data-mobile-special-style="slide-split"]  .brx-nav-nested-items > li.open > .brx-submenu-toggle{
    background-color: var(--menu-item-active-bg);
}
    

}

/* END SPECIAL MOBILE STYLES TABLET ONLY */


/* OVERLAY HEADER NO TOP GAP */

    .bricks-is-frontend [data-overlay-header-no-top-gap="true"] .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"] .dwc-nav-wrapper {
        inset-block-start: 0 !important;
        }
        
        .bricks-is-frontend [data-overlay-header-no-top-gap="true"] .dwc-nest-menu[data-slide-in-direction="top"][data-match-overlay-header-width="true"] .brx-nav-nested-items {
             inset-block-start: calc((var(--dwc-nest-header-height) / 2) * -1) !important;
        }
        
        .bricks-is-frontend [data-overlay-header-no-top-gap="true"] .dwc-nest-menu[data-submenu-reveal="slide"][data-slide-in-direction="top"][data-match-overlay-header-width="true"] .open.active>.brx-submenu-toggle > button:not([data-hide-close-bar="true"] button, [data-submenu-reveal="expand"] button, .open.active:has(.open.active)>.brx-submenu-toggle > button) {
          inset-block-start: calc(var(--dwc-nest-header-height) / 2);
           
        }
        
        .bricks-is-frontend #brx-header > 
        .dwc-nest-header[data-overlay-header-no-top-gap="true"] {
            border-top-left-radius: 0 !important;
            border-top-right-radius: 0 !important;
        }
        
         .bricks-is-frontend 
        #brx-header:has([data-overlay-header-no-top-gap="true"]) {
            padding-block-start: 0 !important;
        }

/* END OVERLAY HEADER NO TOP GAP */


/* DROPDOWN ITEM IS BUTTON OR ICON */

/* IS ICON */
.brxe-dropdown[data-is-icon]{
  padding-inline: var(--menu-item-inline-padding);
}

/* remove the underline */
.brxe-dropdown[data-is-icon] > .brx-submenu-toggle::before{
display: none;
}

/* general styling */
.dwc-nest-menu .brx-nav-nested-items > .brxe-dropdown[data-is-icon] > .brx-submenu-toggle{
       height: auto !important;
    width: auto;
  min-width: var(--button-max-diameter);    
    aspect-ratio: 1;
    border-radius: var(--menu-item-radius) !important;
    padding: 0 !important;
    margin-inline-start: auto;
    margin-block: auto;
    transition: 0.4s;
  border: var(--menu-item-border)
}


.dwc-nest-menu .brx-nav-nested-items > .brxe-dropdown[data-is-icon]:hover > .brx-submenu-toggle{
  border: var(--menu-item-hover-border)
}

.dwc-mobile .dwc-nest-menu .brx-nav-nested-items > .brxe-dropdown[data-is-icon] > .brx-submenu-toggle{
max-width: var(--button-max-diameter);
}


/* centralize */
.brxe-dropdown[data-is-icon] > .brx-submenu-toggle > button{
  margin: auto;
  color: var(--icon-clr);
  font-size: var(--icon-size);
}

.brxe-dropdown[data-is-icon]:hover > .brx-submenu-toggle > button{
  color: var(--icon-hover-clr);
}

/* reset rotation on icon when hovered */
.brxe-dropdown[data-is-icon] > .brx-submenu-toggle button[aria-expanded="true"] > * {
    transform: rotateZ(0deg);
}

/* reset margin left on mobile*/
.dwc-mobile .dwc-nest-menu .brx-nav-nested-items > .brxe-dropdown[data-is-icon] > .brx-submenu-toggle{
 margin-inline-start: initial;
}

/* remove inner span from document flow and hide visually*/

.brxe-dropdown[data-is-icon] > .brx-submenu-toggle > span{
      clip: rect(1px,1px,1px,1px);
    word-wrap: normal!important;
    border: 0;
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    overflow-wrap: normal!important;
    padding: 0;
    position: absolute!important;
    width: 1px;
}

/* IS ICON ENDS */

/* IS BUTTON */

.brxe-dropdown[data-is-button] > .brx-submenu-toggle{
  height: auto !important;
    margin-block: auto;
  border-radius: var(--menu-item-radius) !important;
    max-width: var(--menu-item-width); 
  border: var(--menu-item-border);
}

.brxe-dropdown[data-is-button]:hover > .brx-submenu-toggle { 
    border: var(--menu-item-hover-border);
}


/* centralize text in span */

.brxe-dropdown[data-is-button] > .brx-submenu-toggle > span{
  margin-inline: auto;
}

/* remove button from document flow to allow text to centralize, but keep accessible*/
.brxe-dropdown[data-is-button="no-chevron"] > .brx-submenu-toggle > button{
      clip: rect(1px,1px,1px,1px);
    word-wrap: normal!important;
    border: 0;
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    overflow-wrap: normal!important;
    padding: 0;
    position: absolute!important;
    width: 1px;
}

/* block padding on mobile */
.dwc-mobile .brxe-dropdown:is([data-is-icon], [data-is-button]){  
padding-block: var(--menu-item-block-padding);
 padding-inline: var(--menu-item-inline-padding);
}

/* IS BUTTON ENDS */

/* DROPDWON ITEM IS BUTTON OR ICON ENDS */

/* RTL */

html:not(.dwc-mobile) :is(:not(.brx-header-left, .brx-header-right)).bricks-is-frontend .dwc-nest-menu:not([data-offcanvas="true"]) .brx-has-megamenu .brx-dropdown-content:not([data-use-selector="true"]) {
   inset-inline-end: var(--right-position)!important;
}

html:not(.dwc-mobile)[dir=rtl] .dwc-stripe-style .open.brx-has-megamenu:not([data-offcanvas="true"] .brx-has-megamenu)::before {
    transform: translateX(50%); 
}

html:not(.dwc-mobile)[dir=rtl] body:not(.brx-header-left, .brx-header-right) 
.dwc-nest-menu:not([data-offcanvas="true"])
.brxe-dropdown:not(.brx-has-megamenu) .brxe-dropdown .brx-submenu-toggle button 
svg {
    transform: rotate(-270deg);
}




/*RTL ENDS */


/* FIXES */
.dwc-nest-nav-items > li {
    width: auto;
}

li {
  -webkit-tap-highlight-color: transparent;
}

html:not(.dwc-mobile) #brx-header > *:not(.dwc-nest-header){
    z-index: 99999;
    position: relative;
}

/* account for admn bar on mobile menu */
.dwc-mobile .dwc-nav-wrapper {
    inset-block-start: var(--wp-admin--admin-bar--height, 0px);
}

.dwc-mobile .brxe-nav-nested.brx-open .brx-nav-nested-items {
 top:0;
}

    /* fix safari issue on fixed element inside scrollable container */
 .dwc-mobile .dwc-nest-menu.brxe-nav-nested:not([data-submenu-reveal="expand"]) .brx-nav-nested-items:has(.brxe-dropdown.open.active:not([data-submenu-reveal="expand"])){
        overflow-y: hidden;
    } 


[data-builder-window] .dwc-nest-menu{
  --global-width: attr(builder-preview-content-width px);
}

//document.body.classList.add('adaptive-height-active');
document.body.classList.add('show-nav');

function updateMobileClass(minWidth = MegaMenuCONFIG.minWidth) {
    const classList = document.documentElement.classList;
    const viewportWidth = document.documentElement.clientWidth;
    const isMobile = viewportWidth < minWidth;

    if (isMobile) {
        classList.add('dwc-mobile');
    } else {
        classList.remove('dwc-mobile');
    }
}
updateMobileClass();

// Centered Logo functionality
class CenteredLogoController {
    constructor(config = {}) {
        this.config = {
            enable: config.enable ?? CenteredLogoCONFIG.enable,
            allowOddItems: config.allowOddItems ?? CenteredLogoCONFIG.allowOddItems,
            forceCenteredLogo: config.forceCenteredLogo ?? CenteredLogoCONFIG.forceCenteredLogo,
            centerNudge: config.centerNudge ?? CenteredLogoCONFIG.centerNudge,
            roundOffFactor: config.roundOffFactor || CenteredLogoCONFIG.roundOffFactor,
            headerSelector: config.headerSelector || MegaMenuCONFIG.headerSelector
        };

        this.logoListItem = null;
        this.listItems = [];
        this.resizedFinished = null;
        this.isInitialized = false;
    }

    // Method to check if DOM elements are ready
    checkDOMReady() {
        const headerLogo = document.querySelector(`${this.config.headerSelector} .dwc-nest-menu__logo`);
        const headerInner = document.querySelector(`${this.config.headerSelector} .dwc-nest-header__container`);
        const menu = document.querySelector(`${this.config.headerSelector} .dwc-nest-menu`);
        const listParent = document.querySelector(`${this.config.headerSelector} .brx-nav-nested-items`);

        return headerLogo && headerInner && menu && listParent;
    }

    // Early initialization attempt
    initializeEarly() {
        if (!this.config.enable || this.isInitialized) return;

        // Try immediate initialization if elements are ready
        if (this.checkDOMReady()) {
            document.body.classList.add('dom-ready')
            this.setupElements();
            this.initialize();
            return;
        }

        // If not ready, use polling with shorter intervals for faster response
        const pollForElements = () => {
            if (this.checkDOMReady()) {
                this.setupElements();
                this.initialize();
                return;
            }
            // Poll every 10ms for very fast response
            setTimeout(pollForElements, 10);
        };

        pollForElements();
    }

    setupElements() {
        this.elements = {
            headerLogo: document.querySelector(`${this.config.headerSelector} .dwc-nest-menu__logo`),
            headerInner: document.querySelector(`${this.config.headerSelector} .dwc-nest-header__container`),
            menu: document.querySelector(`${this.config.headerSelector} .dwc-nest-menu`),
            listParent: document.querySelector(`${this.config.headerSelector} .brx-nav-nested-items`)
        };
    }

    initialize() {

        if (!this.config.enable || this.isInitialized) {
            return;
        }

        // Ensure elements are set up before proceeding
        if (!this.elements) {
            this.setupElements();
        }

        // Check if all required elements exist
        if (!this.elements.headerLogo || !this.elements.headerInner ||
            !this.elements.menu || !this.elements.listParent) {
            return;
        }

        this.isInitialized = true;

        // Create logo list item
        this.logoListItem = document.createElement('li');
        this.logoListItem.classList.add('dwc-header-logo-item');

        // Get list items excluding those with toggle divs, and exclude empty li
        this.listItems = Array.from(this.elements.listParent.children).filter(item => {
            const hasToggleDiv = item.querySelector('.brx-toggle-div');
            const isEmpty = item.matches('li:empty');
            const hasExclude = item.querySelector('.dwc-exclude')
            return !hasToggleDiv && !isEmpty && !hasExclude;
        });


        // Calculate position
        const halfIndex = this.listItems.length / 2;
        const logoOrder = this.roundHalfIndex(halfIndex, this.config.roundOffFactor);
        this.logoListItem.style.order = logoOrder;


        // Apply centering immediately
        this.centerLogo(logoOrder);



        // Add resize listener
        window.addEventListener('resize', this.centerLogo.bind(this, logoOrder));
    }

    roundHalfIndex(halfIndex, roundOffFactor) {
        if (roundOffFactor === 'before') {
            return Math.floor(halfIndex + 1);
        } else {
            return Math.ceil(halfIndex + 1);
        }
    }

    centerLogo(logoOrder) {
        if (!this.config.allowOddItems && this.listItems.length % 2 !== 0) {
            return;
        }

        clearTimeout(this.resizedFinished);

        this.resizedFinished = setTimeout(() => {
            const isDesktop = window.innerWidth >= MegaMenuCONFIG.minWidth;

            if (isDesktop) {
                document.body.classList.add('desktop-centered')
                let listID = 1;

                // Set order for list items
                this.listItems.forEach(listItem => {
                    if (!listItem.dataset.id) {
                        listItem.dataset.id = listID++;
                    }
                    this.logoListItem.style.order = logoOrder;
                    listItem.style.order = listItem.getAttribute('data-id');
                });

                if (!this.elements.listParent.contains(this.logoListItem) ||
                    !this.elements.listParent.contains(this.elements.headerLogo)) {

                    this.elements.listParent.prepend(this.logoListItem);
                    this.logoListItem.append(this.elements.headerLogo);
                    this.elements.headerInner.classList.add('dwc-logo-is-centered');

                    const logoBounds = this.elements.headerLogo.getBoundingClientRect();
                    const viewportWidth = document.documentElement.clientWidth;
                    const logoWidth = this.elements.headerLogo.offsetWidth;
                    const distanceRight = logoBounds.x;

                    // Force center if needed
                    if (this.config.forceCenteredLogo) {
                        const rightOffset = ((distanceRight + (logoWidth / 2)) + this.config.centerNudge) - (viewportWidth / 2);
                        const offsetMargin = rightOffset * 2;
                        this.elements.menu.style.marginRight = offsetMargin + 'px';
                    }

                    if (CenteredLogoCONFIG.centerGuide) {
                        if (document.body.classList.contains('logged-in')) {
                            // Check if the indicator already exists
                            if (!document.querySelector('.dwc-center-guide')) {
                                const indicatorEl = document.createElement('div')
                                indicatorEl.classList.add('dwc-center-guide')
                                indicatorEl.style.width = this.elements.headerLogo.offsetWidth + 'px';
                                document.body.appendChild(indicatorEl)
                            }
                        }
                    }

                }

            } else {
                document.body.classList.remove('desktop-centered');
                this.elements.headerInner.classList.add('dwc-logo-is-centered');
                this.elements.menu.style.marginRight = null;
                this.elements.headerInner.prepend(this.elements.headerLogo);
                this.logoListItem.style.order = null;
                this.listItems.forEach(listItem => {
                    listItem.style.order = null;
                });
            }
        }, 500);
    }
}

class MenuAnimationController {
    constructor(config = {}) {
        this.config = {
            minWidthThreshold: config.minWidthThreshold || MegaMenuCONFIG.minWidth,
            stripeStyle: config.stripeStyle ?? MegaMenuCONFIG.stripeStyle,
            adaptiveHeight: config.adaptiveHeight ?? MegaMenuCONFIG.adaptiveHeight,
            toolTip: config.toolTip ?? MegaMenuCONFIG.toolTip,
            menuAutoExpansion: config.menuAutoExpansion ?? MegaMenuCONFIG.menuAutoExpansion,
            headerSelector: config.headerSelector || MegaMenuCONFIG.headerSelector,
            megaMenuLinksSelector: `${config.headerSelector || MegaMenuCONFIG.headerSelector} .brx-has-megamenu`,
            offCanvasSelector: `${config.headerSelector || MegaMenuCONFIG.headerSelector} .dwc-nest-menu[data-offcanvas="true"]`,
            shiftFactor: config.shiftFactor ?? MegaMenuCONFIG.shiftFactor,  // Added shiftFactor
            minOverflow: config.minOverflow ?? MegaMenuCONFIG.minOverflow   // Added minOverflow
        };

        this.megaMenuLinks = document.querySelectorAll(this.config.megaMenuLinksSelector);
        this.header = document.querySelector(this.config.headerSelector);

        this.maxMenuWidth = 0;
        this.maxMenuHeight = 0;
        this.headerTimeoutId = null;
        this.mobileMenuTimeoutId = null;

        this.applyConfigClasses();
    }

    applyConfigClasses() {
        if (MegaMenuCONFIG.stripeStyle) {
            document.body.classList.add('dwc-stripe-style');
        }
        if (MegaMenuCONFIG.adaptiveHeight) {
            document.body.classList.add('dwc-adaptive-height');
        }

        if (this.header) {
            this.header.style.setProperty('--stripe-style-enabled', this.config.stripeStyle ? '1' : '0');
            this.header.style.setProperty('--height-animation-enabled', this.config.adaptiveHeight ? '1' : '0');
        }
    }
    /*
    isAboveMinWidth() {
        return window.innerWidth >= this.config.minWidthThreshold;
    }
    */

    getViewportWidth() {
        // Check if window exists (for SSR/Node environments)
        if (typeof window === 'undefined') return 0;

        return window.innerWidth ||
            document.documentElement?.clientWidth ||
            document.body?.clientWidth ||
            0;
    }

    isAboveMinWidth() {
        return this.getViewportWidth() >= this.config.minWidthThreshold;
    }


    isOffCanvas() {
        return !!document.querySelector(this.config.offCanvasSelector);
    }

    hasHeaderClass() {
        return document.body.classList.contains('brx-header-left') ||
            document.body.classList.contains('brx-header-right');
    }

    updateMenuVariables() {
        if (!this.isAboveMinWidth() || !this.header) return;

        // Cache RTL detection for performance - only check once per method call
        const isRTLLayout = this.isRTL ? this.isRTL() : false;

        let menuOpened = false;
        let menuWidth = 0;
        let menuHeight = 0;
        let menuOffset = 0; // Renamed for direction-agnostic naming

        this.megaMenuLinks.forEach(link => {
            if (link.classList.contains('open')) {
                requestAnimationFrame(() => {
                    let dropdownMenu = link.querySelector('.brx-dropdown-content');
                    let nestHeader = link.closest(this.config.headerSelector);

                    if (dropdownMenu) {
                        // Get dimensions (direction-agnostic)
                        menuWidth = dropdownMenu.offsetWidth;
                        menuHeight = dropdownMenu.offsetHeight;

                        // RTL-aware offset calculation
                        if (isRTLLayout) {
                            // RTL: Calculate offset from right edges
                            // Formula: distance from header's right edge to menu's right edge
                            const headerRect = nestHeader.getBoundingClientRect();
                            const menuRect = dropdownMenu.getBoundingClientRect();
                            menuOffset = (headerRect.right - menuRect.right) + window.scrollX;
                        } else {
                            // LTR: Original left-based calculation (unchanged for backwards compatibility)
                            menuOffset = Number(dropdownMenu.getBoundingClientRect().left) - Number(nestHeader.getBoundingClientRect().left) + window.scrollX;
                        }

                        // Update maximum dimensions (direction-agnostic)
                        this.maxMenuWidth = Math.max(this.maxMenuWidth, menuWidth);
                        this.maxMenuHeight = Math.max(this.maxMenuHeight, menuHeight);

                        // Calculate scaling factors (direction-agnostic)
                        let scaleX = menuWidth / this.maxMenuWidth;
                        let scaleY = menuHeight / this.maxMenuHeight;

                        // Set adaptive height if enabled (direction-agnostic)
                        if (this.config.adaptiveHeight || this.config.stripeStyle) {
                            this.header.style.setProperty('--dropdown-menu-height', `${menuHeight}px`);
                        }

                        // Set stripe-style variables with RTL awareness
                        if (this.config.stripeStyle) {
                            // Position variable - RTL-aware naming and calculation
                            if (isRTLLayout) {
                                // Set RTL-specific position variable
                                this.header.style.setProperty('--dropdown-menu-x-rtl', `${menuOffset}px`);
                                // Also set the standard variable for CSS that expects it
                                this.header.style.setProperty('--dropdown-menu-x', `${menuOffset}px`);
                            } else {
                                // LTR: Use standard left-based positioning
                                this.header.style.setProperty('--dropdown-menu-x', `${menuOffset}px`);
                                // Clear any RTL variable that might exist
                                this.header.style.removeProperty('--dropdown-menu-x-rtl');
                            }

                            // Set dimension and scaling variables (direction-agnostic)
                            this.header.style.setProperty('--dropdown-menu-width', `${menuWidth}px`);
                            this.header.style.setProperty('--dropdown-menu-max-width', `${this.maxMenuWidth}px`);
                            this.header.style.setProperty('--dropdown-menu-max-height', `${this.maxMenuHeight}px`);
                            this.header.style.setProperty('--dropdown-menu-scale-x', scaleX.toString());
                            this.header.style.setProperty('--dropdown-menu-scale-y', scaleY.toString());

                            // Set direction indicator for CSS usage
                            this.header.style.setProperty('--dropdown-menu-direction', isRTLLayout ? 'rtl' : 'ltr');
                        }
                    }
                });

                menuOpened = true;
                this.header.classList.add('show-menu-animation');
                this.header.classList.remove('hide-menu-animation');
            }
        });

        // Handle menu closing (unchanged logic, direction-agnostic)
        if (!menuOpened) {
            const hasAdaptiveHeight = document.body.classList.contains('dwc-adaptive-height');
            const hasStripeStyle = document.body.classList.contains('dwc-stripe-style');

            if (hasAdaptiveHeight && !hasStripeStyle) {
                this.header.style.setProperty('--dropdown-menu-height', '0px');
            }

            this.header.style.setProperty('--dropdown-menu-scale-y', '0');

            if (this.header) {
                this.header.classList.add('hide-menu-animation');
                this.header.classList.remove('show-menu-animation');
            }
        }
    }


    updateDropdownPositions() {
    const viewportWidth = document.documentElement.clientWidth;
    if (viewportWidth < this.config.minWidthThreshold) return; // Run only on desktop

    const dropdowns = document.querySelectorAll(`${this.config.headerSelector} .dwc-nest-menu .brx-has-megamenu .brx-dropdown-content`);
    const defaultElement = document.querySelector('#brx-header');
    const defaultRect = defaultElement ? defaultElement.getBoundingClientRect() : null;
    const isRTL = this.isRTL();

    requestAnimationFrame(() => {
        // Handle vertical positioning (global top or stripe style)
        this.handleVerticalPositioning();

        // Handle width and horizontal alignment positioning
        dropdowns.forEach((dropdown) => {
            this.setDropdownWidth(dropdown);
            this.positionDropdownHorizontally(dropdown, defaultRect, viewportWidth, isRTL);
        });
    });
}

/**
 * Detect if the document is using RTL (Right-to-Left) layout
 */
isRTL() {
    const htmlDir = document.documentElement.dir?.toLowerCase();
    if (htmlDir) return htmlDir === 'rtl';
    
    const computedDirection = getComputedStyle(document.documentElement).direction;
    return computedDirection === 'rtl';
}

/**
 * Handle vertical positioning for dropdowns (global top positioning or stripe style)
 */
handleVerticalPositioning() {
    const nestMenu = document.querySelector('.dwc-nest-menu');
    const globalTopSelector = nestMenu ? nestMenu.getAttribute('data-global-content-vertical') : null;

    if (globalTopSelector) {
        this.positionDropdownsRelativeToElement(globalTopSelector, 'global top element');
    } else if (this.config.stripeStyle) {
        this.positionDropdownsRelativeToElement('#brx-header', '#brx-header bottom (stripe style)');
    }
}

/**
 * Position dropdowns relative to a specified element
 */
positionDropdownsRelativeToElement(selector, description) {
    const targetElement = document.querySelector(selector);
    if (!targetElement) return;

    const positioningDropdowns = document.querySelectorAll(`${this.config.headerSelector} .dwc-nest-menu .brx-dropdown-content:not(.brx-dropdown-content .brx-dropdown-content)`);
    const targetRect = targetElement.getBoundingClientRect();

    positioningDropdowns.forEach(dropdown => {
        const menuItem = dropdown.closest('.menu-item') || dropdown.parentElement;
        const menuItemRect = menuItem.getBoundingClientRect();
        
        const topPosition = menuItemRect.height + targetRect.bottom - menuItemRect.bottom;
        dropdown.style.top = `${topPosition}px`;
    });

    // console.log(`Positioned dropdowns relative to ${description}`);
}

/**
 * Set dropdown width based on data attributes or global settings
 */
setDropdownWidth(dropdown) {
    // Check for individual data-content-width attribute first
    const localSelector = dropdown.getAttribute('data-content-width');
    
    if (localSelector) {
        this.applyWidthFromSelector(dropdown, localSelector);
        return;
    }

    // Fall back to global data-global-content-width setting
    const nestMenu = document.querySelector('.dwc-nest-menu');
    const globalSelector = nestMenu ? nestMenu.getAttribute('data-global-content-width') : null;
    
    if (globalSelector) {
        this.applyWidthFromSelector(dropdown, globalSelector);
    }
}

/**
 * Apply width to dropdown based on selector (number, CSS value, CSS variable, or element selector)
 */
applyWidthFromSelector(dropdown, selector) {
    // Check if it's a number or value with CSS units
    if (/^\d+(\.\d+)?(px|rem|em|%|vh|vw|ch|ex|cm|mm|in|pt|pc)?$/i.test(selector)) {
        const hasUnit = /\d+(px|rem|em|%|vh|vw|ch|ex|cm|mm|in|pt|pc)$/i.test(selector);
        const widthValue = hasUnit ? selector : `${selector}px`;
        dropdown.style.setProperty('--dropdown-content-width', widthValue);
    }
    // Check if it's a CSS variable (starts with var( and ends with ))
    else if (/^var\(--[\w-]+\)$/.test(selector)) {
        this.applyWidthFromCSSVariable(dropdown, selector);
    }
    // Treat as element selector
    else {
        this.applyWidthFromElement(dropdown, selector);
    }
}

/**
 * Apply width from CSS variable
 */
applyWidthFromCSSVariable(dropdown, variableSelector) {
    const variableName = variableSelector.match(/^var\((--[\w-]+)\)$/)[1];
    const computedValue = getComputedStyle(document.documentElement).getPropertyValue(variableName).trim();

    if (computedValue) {
        const hasUnit = /\d+(px|rem|em|%|vh|vw|ch|ex|cm|mm|in|pt|pc)$/i.test(computedValue);
        const widthValue = hasUnit ? computedValue : `${computedValue}px`;
        dropdown.style.setProperty('--dropdown-content-width', widthValue);
    }
}

/**
 * Apply width from target element
 */
applyWidthFromElement(dropdown, selector) {
    const targetElement = document.querySelector(selector);
    if (targetElement) {
        const targetWidth = targetElement.getBoundingClientRect().width;
        dropdown.style.setProperty('--dropdown-content-width', `${targetWidth}px`);
    }
}

/**
 * Handle horizontal positioning of dropdown with RTL support and overflow management
 * FIXED VERSION - Properly handles RTL overflow prevention
 */
positionDropdownHorizontally(dropdown, defaultRect, viewportWidth, isRTL) {
    const parentLi = dropdown.closest('.brx-has-megamenu.brxe-dropdown');
    if (!parentLi) return;

    const contentAlign = dropdown.getAttribute('data-content-align');
    let actualDropdownWidth = this.getActualDropdownWidth(dropdown);
    const liRect = parentLi.getBoundingClientRect();

    // Constrain width to viewport if dropdown is wider
    if (actualDropdownWidth > viewportWidth) {
        dropdown.style.setProperty('--dropdown-content-width', `${viewportWidth}px`);
        actualDropdownWidth = viewportWidth;
    }

    // Calculate initial position based on alignment and RTL
    let position = this.calculateInitialPosition(dropdown, parentLi, contentAlign, actualDropdownWidth, defaultRect, isRTL);

    // Apply overflow corrections with proper RTL support
    position = this.handleOverflowAdjustments(position, liRect, actualDropdownWidth, viewportWidth, isRTL);

    // Set final position using appropriate CSS property
    if (isRTL) {
        // In RTL, we need to calculate right-based positioning
        const rightPosition = liRect.width - position - actualDropdownWidth;
        dropdown.style.setProperty('--right-position', `${rightPosition}px`);
        dropdown.style.removeProperty('--left-position');
    } else {
        // LTR uses left-based positioning (existing behavior)
        dropdown.style.setProperty('--left-position', `${position}px`);
        dropdown.style.removeProperty('--right-position');
        
        // Fallback for existing CSS that expects --left-position
        if (!dropdown.style.getPropertyValue('--left-position')) {
            dropdown.style.setProperty('--left-position', '0px');
        }
    }
}

/**
 * Get actual dropdown width accounting for CSS transforms
 */
getActualDropdownWidth(dropdown) {
    const computedStyle = getComputedStyle(dropdown);
    const dropdownRect = dropdown.getBoundingClientRect();

    // Extract scale factor from transform
    const transform = computedStyle.transform || computedStyle.webkitTransform;
    let scaleX = 1;

    if (transform && transform !== 'none') {
        const matrix = transform.match(/^matrix\((.+)\)$/);
        if (matrix) {
            const values = matrix[1].split(', ');
            scaleX = parseFloat(values[0]);
        }
    }

    return dropdownRect.width / scaleX;
}

/**
 * Calculate initial dropdown position based on alignment and RTL settings
 * ENHANCED VERSION with improved RTL positioning
 */
calculateInitialPosition(dropdown, parentLi, contentAlign, actualDropdownWidth, defaultRect, isRTL) {
    const validAlignments = ['left', 'center', 'right'];
    const hasValidAlignment = contentAlign && validAlignments.includes(contentAlign);
    const liRect = parentLi.getBoundingClientRect();

    if (!hasValidAlignment) {
        // Default centering behavior
        return this.calculateCenteredPosition(actualDropdownWidth, defaultRect, liRect, isRTL);
    }

    // Apply RTL-aware alignment mapping
    const effectiveAlignment = this.getEffectiveAlignment(contentAlign, isRTL);
    
    // Calculate position relative to parent element
    switch (effectiveAlignment) {
        case 'left':
            return isRTL ? liRect.width : 0;
        case 'right':
            return isRTL ? 0 : (liRect.width - actualDropdownWidth);
        case 'center':
            return (liRect.width - actualDropdownWidth) / 2;
        default:
            return isRTL ? liRect.width : 0;
    }
}


/**
 * Map alignment values for RTL layouts
 */
getEffectiveAlignment(contentAlign, isRTL) {
    if (!isRTL) return contentAlign;
    
    // RTL alignment mapping
    switch (contentAlign) {
        case 'left': return 'right';
        case 'right': return 'left';
        case 'center': return 'center';
        default: return contentAlign;
    }
}


/**
 * Calculate centered position for default alignment
 * ENHANCED VERSION with better RTL support
 */
calculateCenteredPosition(actualDropdownWidth, defaultRect, liRect, isRTL) {
    if (!defaultRect) return isRTL ? liRect.width / 2 : 0;

    const defaultElement = document.querySelector('#brx-header');
    const headerRect = defaultElement ? defaultElement.getBoundingClientRect() : null;

    if (headerRect) {
        const centerOffset = (defaultRect.width - actualDropdownWidth) / 2;
        
        if (isRTL) {
            // RTL: Calculate position relative to parent's right edge
            const headerRightOffset = headerRect.right;
            const liRightOffset = liRect.right;
            return centerOffset - (headerRightOffset - liRightOffset);
        } else {
            // LTR: Calculate position relative to parent's left edge (existing logic)
            const headerLeftOffset = headerRect.left + window.scrollX;
            return centerOffset - (liRect.left - headerLeftOffset);
        }
    }

    return isRTL ? liRect.width / 2 : 0;
}

/**
 * Handle viewport overflow adjustments with proper RTL support
 * COMPLETELY REWRITTEN for accurate RTL edge calculations
 */
handleOverflowAdjustments(position, liRect, actualDropdownWidth, viewportWidth, isRTL) {
    // Calculate edges based on layout direction
    let leftEdge, rightEdge;
    
    if (isRTL) {
        // RTL: position is relative to parent's right edge, calculate absolute edges
        const parentRight = liRect.right;
        rightEdge = parentRight - position;
        leftEdge = rightEdge - actualDropdownWidth;
    } else {
        // LTR: position is relative to parent's left edge (existing logic)
        leftEdge = liRect.left + position;
        rightEdge = leftEdge + actualDropdownWidth;
    }

    let adjustedPosition = position;
    const isViewportConstrained = actualDropdownWidth >= viewportWidth;

    // Check for left viewport overflow
    if (leftEdge < 0) {
        const leftOverflow = Math.abs(leftEdge);
        
        if (isViewportConstrained) {
            // For viewport-constrained dropdowns, use exact positioning
            if (isRTL) {
                // RTL: adjust position to align left edge with viewport
                adjustedPosition = position - leftOverflow;
            } else {
                // LTR: adjust position to align left edge with viewport
                adjustedPosition += leftOverflow;
            }
        } else {
            // For normal dropdowns, use configured shift behavior
            const adjustedOverflow = leftOverflow < this.config.minOverflow ? this.config.minOverflow : leftOverflow;
            if (isRTL) {
                adjustedPosition -= adjustedOverflow * this.config.shiftFactor;
            } else {
                adjustedPosition += adjustedOverflow * this.config.shiftFactor;
            }
        }
    }

    // Recalculate right edge after left adjustments
    let adjustedRightEdge;
    if (isRTL) {
        const parentRight = liRect.right;
        adjustedRightEdge = parentRight - adjustedPosition;
    } else {
        adjustedRightEdge = liRect.left + adjustedPosition + actualDropdownWidth;
    }
    
    // Check for right viewport overflow
    if (adjustedRightEdge > viewportWidth) {
        const rightOverflow = adjustedRightEdge - viewportWidth;
        
        if (isViewportConstrained) {
            // For viewport-constrained dropdowns, position exactly at viewport edge
            if (isRTL) {
                // RTL: adjust position to align right edge with viewport
                adjustedPosition += rightOverflow;
            } else {
                // LTR: adjust position to align right edge with viewport
                adjustedPosition -= rightOverflow;
            }
            
            // Double-check: if this causes opposite overflow, prioritize based on RTL
            let finalLeftEdge, finalRightEdge;
            if (isRTL) {
                const parentRight = liRect.right;
                finalRightEdge = parentRight - adjustedPosition;
                finalLeftEdge = finalRightEdge - actualDropdownWidth;
            } else {
                finalLeftEdge = liRect.left + adjustedPosition;
                finalRightEdge = finalLeftEdge + actualDropdownWidth;
            }
            
            if (finalLeftEdge < 0) {
                if (isRTL) {
                    // In RTL, prioritize right edge - align dropdown to right edge of viewport
                    adjustedPosition = liRect.right - viewportWidth;
                } else {
                    // In LTR, prioritize left edge - align dropdown to left edge of viewport
                    adjustedPosition = -liRect.left;
                }
            }
        } else {
            // For normal dropdowns, use configured shift behavior
            const adjustedOverflow = rightOverflow < this.config.minOverflow ? this.config.minOverflow : rightOverflow;
            if (isRTL) {
                adjustedPosition += adjustedOverflow * this.config.shiftFactor;
            } else {
                adjustedPosition -= adjustedOverflow * this.config.shiftFactor;
            }
        }
    }

    return adjustedPosition;
}

/**
 * Handle dropdowns that are wider than the viewport
 */
handleWideDropdownOverflow(liRect, actualDropdownWidth, viewportWidth, isRTL) {
    // For dropdowns wider than viewport, prioritize showing the start of content
    // In RTL, this means showing the right side; in LTR, the left side
    if (isRTL) {
        // Align to right edge of viewport
        return viewportWidth - liRect.left - actualDropdownWidth;
    } else {
        // Align to left edge of viewport
        return -liRect.left;
    }
}


    setCurrentPageDropdownActive() {
        if (!this.config.menuAutoExpansion) return;

        const isDesktop = window.innerWidth >= this.config.minWidthThreshold;
        const hasSpecialHeader = document.body.classList.contains('brx-header-left') ||
            document.body.classList.contains('brx-header-right');
        const isOffCanvas = !!document.querySelector(this.config.offCanvasSelector);

        if (isDesktop && !hasSpecialHeader && !isOffCanvas) return;

        const currentPageLink = document.querySelector('[aria-current="page"]');

        if (currentPageLink) {
            const parentDropdown = currentPageLink.closest('.brxe-dropdown');
            let tabbedParentDropdown = currentPageLink.closest('.dwc-tabbed-nav-list__li');

            // If tabbedParentDropdown has currentPageLink as a direct child, ignore it
            if (tabbedParentDropdown) {
                const directPageLink = tabbedParentDropdown.querySelector(':scope > a[aria-current="page"]');
                if (directPageLink) {
                    tabbedParentDropdown = null; // Ignore tabbedParentDropdown
                }
            }

            if (parentDropdown) {
                setTimeout(() => {
                    //console.log(tabbedParentDropdown);
                    parentDropdown.classList.add('open', 'active');

                    // Only add 'active' class if tabbedParentDropdown exists
                    if (tabbedParentDropdown) {
                        tabbedParentDropdown.classList.add('active');
                    }

                    const submenuToggle = parentDropdown.querySelector('.brx-submenu-toggle');
                    let button = submenuToggle ? submenuToggle.querySelector('button') : null;
                    const menuToggle = document.querySelector('.dwc-nest-menu .brxe-toggle');

                    if (button) {
                        menuToggle.addEventListener('click', () => {
                            setTimeout(() => {
                                const submenuIsOpen = parentDropdown.classList.contains('open', 'active');
                                if (submenuIsOpen) {
                                    button.setAttribute('aria-expanded', 'true');
                                }
                            }, 100);
                        });
                    }

                    setTimeout(() => {
                        currentPageLink.scrollIntoView({
                            behavior: 'smooth',
                            block: 'nearest'
                        });
                    }, 600);
                }, 700);
            }
        }
    }

    updateChevronPosition(targetLink) {
        if (!this.config.stripeStyle) return;

        requestAnimationFrame(() => {
            let headerElement = document.querySelector(this.config.headerSelector);
            if (!headerElement) {
                console.error('Chevron parent element not found.');
                return;
            }

            // Cache RTL detection for performance within this animation frame
            const isRTLLayout = this.isRTL ? this.isRTL() : false;

            // Get element dimensions and positions
            let linkRect = targetLink.getBoundingClientRect();
            let headerRect = headerElement.getBoundingClientRect();

            // Calculate link midpoint (geometric center - always the same regardless of direction)
            let linkMidpoint = linkRect.left + linkRect.width / 2;

            // RTL-aware reference point calculation
            let headerReferenceOffset, navlinkMidpointOffset, navlinkEdgeOffset;

            if (isRTLLayout) {
                // RTL: Use right edge as reference point
                let headerRightOffset = headerRect.right + window.scrollX;

                // Calculate offsets relative to header's right edge
                navlinkMidpointOffset = headerRightOffset - linkMidpoint;
                navlinkEdgeOffset = headerRightOffset - linkRect.right;
                headerReferenceOffset = headerRightOffset;

                // Set RTL-specific CSS variables
                headerElement.style.setProperty('--chevron-parent-right', `${headerReferenceOffset}px`);
                headerElement.style.setProperty('--navlink-midpoint-rtl', `${navlinkMidpointOffset}px`);
                headerElement.style.setProperty('--navlink-right', `${navlinkEdgeOffset}px`);

                // Set unified variables for CSS that expects them (RTL context)
                headerElement.style.setProperty('--navlink-midpoint', `${navlinkMidpointOffset}px`);
                headerElement.style.setProperty('--navlink-edge', `${navlinkEdgeOffset}px`);

            } else {
                // LTR: Original left-based calculation (unchanged for perfect backwards compatibility)
                let headerLeftOffset = headerRect.left + window.scrollX;

                // Calculate offsets relative to header's left edge (original logic)
                navlinkMidpointOffset = linkMidpoint - headerLeftOffset;
                navlinkEdgeOffset = linkRect.left - headerLeftOffset;
                headerReferenceOffset = headerLeftOffset;

                // Set standard LTR CSS variables (original behavior)
                headerElement.style.setProperty('--chevron-parent-left', `${headerReferenceOffset}px`);
                headerElement.style.setProperty('--navlink-midpoint', `${navlinkMidpointOffset}px`);
                headerElement.style.setProperty('--navlink-left', `${navlinkEdgeOffset}px`);

                // Set unified edge variable for consistency
                headerElement.style.setProperty('--navlink-edge', `${navlinkEdgeOffset}px`);

                // Clean up any RTL variables that might exist from previous state
                headerElement.style.removeProperty('--chevron-parent-right');
                headerElement.style.removeProperty('--navlink-midpoint-rtl');
                headerElement.style.removeProperty('--navlink-right');
            }

            // Set direction-agnostic variables (same for both LTR and RTL)
            headerElement.style.setProperty('--chevron-parent-width', `${headerRect.width}px`);
            headerElement.style.setProperty('--navlink-width', `${linkRect.width}px`);

            // Set direction indicator for CSS conditional logic
            headerElement.style.setProperty('--chevron-direction', isRTLLayout ? 'rtl' : 'ltr');

            // Set boolean flags for easier CSS targeting
            if (isRTLLayout) {
                headerElement.style.setProperty('--is-rtl', '1');
                headerElement.style.removeProperty('--is-ltr');
            } else {
                headerElement.style.setProperty('--is-ltr', '1');
                headerElement.style.removeProperty('--is-rtl');
            }
        });
    }


    updateHeaderHeight() {
        if (this.headerTimeoutId) {
            clearTimeout(this.headerTimeoutId);
        }

        requestAnimationFrame(() => {
            if (this.header) {
                this.headerTimeoutId = setTimeout(() => {
                    let headerHeight = this.header.offsetHeight;
                    document.body.style.setProperty('--dwc-nest-header-height', `${headerHeight}px`);
                }, 300);
            }
        });
    }

    setMobileMenuTopHeight() {
        if (this.mobileMenuTimeoutId) {
            clearTimeout(this.mobileMenuTimeoutId);
        }

        let mobileMenuTop = document.querySelector('.dwc-nest-menu-top');
        if (!mobileMenuTop) {
            console.error('Mobile menu top element not found');
            return;
        }

        this.mobileMenuTimeoutId = setTimeout(() => {
            let menuTopHeight = mobileMenuTop.offsetHeight;
            document.body.style.setProperty('--mobile-menu-top-height', `${menuTopHeight}px`);
        }, 1000);
    }


    updateMobileLogo() {
        let mobileLogo = document.querySelector('.dwc-nest-menu__mobile-logo');
        let desktopLogo = document.querySelector('.dwc-nest-menu__logo');

        if (!mobileLogo) {
            console.error('Mobile logo container not found');
            return;
        }

        if (!desktopLogo) {
            console.error('Desktop logo container not found');
            return;
        }

        // Updated to check for either img or svg in desktop logo
        let desktopLogoElement = desktopLogo.querySelector('img, svg');
        if (!desktopLogoElement) return;

        // Check if mobile logo has an image or SVG
        const currentMobileLogo = mobileLogo.querySelector('img, svg');

        // Store original logo data if not already stored
        if (!mobileLogo.hasAttribute('data-original-logo-type') && currentMobileLogo) {
            // Get logo type (img or svg)
            const logoType = currentMobileLogo.tagName.toLowerCase();
            mobileLogo.setAttribute('data-original-logo-type', logoType);

            if (logoType === 'img') {
                mobileLogo.setAttribute('data-original-logo-src', currentMobileLogo.src);
                mobileLogo.setAttribute('data-original-logo-alt', currentMobileLogo.alt || '');
                mobileLogo.setAttribute('data-original-logo-class', currentMobileLogo.className || '');
            } else if (logoType === 'svg') {
                // Store SVG content as a string
                mobileLogo.setAttribute('data-original-logo-content', currentMobileLogo.outerHTML);
                mobileLogo.setAttribute('data-original-logo-class', currentMobileLogo.getAttribute('class') || '');
            }
        }

        if (this.isAboveMinWidth()) {
            if (currentMobileLogo) {
                mobileLogo.removeChild(currentMobileLogo);
            }

            // Clone desktop logo (either img or svg)
            let newLogo = desktopLogoElement.cloneNode(true);
            newLogo.removeAttribute('id');
            //  mobileLogo.appendChild(newLogo);
        } else {
            // For mobile view
            const originalLogoType = mobileLogo.getAttribute('data-original-logo-type');

            if (!currentMobileLogo) {
                // If no current logo, clone desktop logo
                let mobileLogoElement = desktopLogoElement.cloneNode(true);
                mobileLogoElement.removeAttribute('id');
                mobileLogo.appendChild(mobileLogoElement);
            } else if (originalLogoType) {
                mobileLogo.removeChild(currentMobileLogo);

                if (originalLogoType === 'img') {
                    // Restore original img
                    let mobileLogoImage = document.createElement('img');
                    mobileLogoImage.src = mobileLogo.getAttribute('data-original-logo-src');
                    mobileLogoImage.alt = mobileLogo.getAttribute('data-original-logo-alt') || '';
                    mobileLogoImage.className = mobileLogo.getAttribute('data-original-logo-class') || '';
                    mobileLogo.appendChild(mobileLogoImage);
                } else if (originalLogoType === 'svg') {
                    // Restore original SVG
                    const svgContent = mobileLogo.getAttribute('data-original-logo-content');
                    if (svgContent) {
                        const tempContainer = document.createElement('div');
                        tempContainer.innerHTML = svgContent;
                        const svgElement = tempContainer.querySelector('svg');
                        if (svgElement) {
                            mobileLogo.appendChild(svgElement.cloneNode(true));
                        }
                    }
                }
            }
        }
    }


    initDesktopNav() {
        if (this.isOffCanvas() || !this.header || this.hasHeaderClass()) return;

        let menuElement = this.header.querySelector('.dwc-nest-menu');
        if (menuElement) {
            menuElement.classList.remove('brx-open');
            menuElement.querySelectorAll('.brxe-dropdown').forEach(dropdown => {
                dropdown.classList.remove('active', 'open');
            });
        }
    }

    initializeMaxDimensions() {
        if (!this.isAboveMinWidth()) return;

        this.megaMenuLinks.forEach(link => {
            let dropdown = link.querySelector('.brx-dropdown-content');
            if (dropdown) {
                this.maxMenuWidth = Math.max(this.maxMenuWidth, dropdown.offsetWidth);
                this.maxMenuHeight = Math.max(this.maxMenuHeight, dropdown.offsetHeight + 10);
            }
        });

        this.header.style.setProperty('--dropdown-menu-max-width', `${this.maxMenuWidth}px`);
        this.header.style.setProperty('--dropdown-menu-max-height', `${this.maxMenuHeight}px`);
        this.header.style.setProperty('--dropdown-menu-scale-x', '0');
        this.header.style.setProperty('--dropdown-menu-scale-y', '0');
    }

    resetForMobile() {
        this.header.style.setProperty('--dropdown-menu-scale-x', '0');
        this.header.style.setProperty('--dropdown-menu-scale-y', '0');
        this.header.style.setProperty('--dropdown-menu-width', '0');

        if (this.header) {
            this.header.classList.remove('show-menu-animation', 'hide-menu-animation');
        }
    }

    setBoxedWidthVariable() {
        // Check if body has the brx-boxed class
        if (document.body.classList.contains('brx-boxed')) {
            // Get computed style for the body
            const computedStyle = window.getComputedStyle(document.body);

            // Get the max-width value
            const maxWidth = computedStyle.getPropertyValue('max-width');

            // Set the max-width as a CSS variable on the body
            document.body.style.setProperty('--boxed-width', maxWidth);

            return maxWidth;
        } else {
            return null;
        }
    }

    closeNavOnClick() {
        if (MegaMenuCONFIG.closeNavOnClick) {

            const allLinks = document.querySelectorAll('.dwc-nest-menu a');
            const menuContainer = document.querySelector('.dwc-nest-menu');
            const menuItemLinks = Array.from(allLinks).filter(link => {
                return link.parentElement !== menuContainer;
            });

            const menuToggle = document.querySelector('.dwc-nest-menu .brxe-toggle');

            // Always remove existing event listeners first
            menuItemLinks.forEach(link => {
                const storedHandler = link._clickHandler;
                if (storedHandler) {
                    link.removeEventListener('click', storedHandler);
                    delete link._clickHandler;
                }
            });

            // Check condition - if true, exit without adding new listeners
            if (this.isAboveMinWidth() && !this.isOffCanvas()) return;

            // Helper function to check if element has excluded selector
            const hasExcludedSelector = (element) => {
                if (!MegaMenuCONFIG.closeNavOnClickExclude) return false;

                const excludedSelectors = MegaMenuCONFIG.closeNavOnClickExclude
                    .split(',')
                    .map(selector => selector.trim());

                return excludedSelectors.some(selector => {
                    try {
                        return element.matches(selector);
                    } catch (error) {
                        // Fallback for invalid selectors - log warning and skip
                        console.warn(`Invalid selector: "${selector}"`, error);
                        return false;
                    }
                });
            };

            // Helper function to check if link has a hash
            const hasHashLink = (link) => {
                const href = link.getAttribute('href');
                return href && href.includes('#');
            };

            // Only add new event listeners if the condition is false
            menuItemLinks.forEach(link => {
                // Skip this link if it has any excluded classes
                if (hasExcludedSelector(link)) return;

                // If closeOnHashClickOnly is true, skip links without hash
                if (MegaMenuCONFIG.closeOnHashClickOnly && !hasHashLink(link)) return;

                const clickHandler = () => {
                    if (menuToggle) {
                        menuToggle.click();
                    }
                };

                link._clickHandler = clickHandler;
                link.addEventListener('click', clickHandler);
            });
        }
    }
}

class TooltipManager {
    constructor(config) {
        this.config = {
            toolTip: config.toolTip || false
        };
        this.targetButton = null;
        this.tooltipProcessed = false;
    }

    setBackText() {
        let menuElement = document.querySelector('.dwc-nest-menu');
        let forcedBackText = menuElement.getAttribute('data-back-text')
        document.querySelectorAll('.brx-submenu-toggle').forEach(submenu => {
            const textContent = submenu.textContent.trim();
            const button = submenu.querySelector('.brx-submenu-toggle > button');
            if (button) {
                button.setAttribute('data-text', textContent);
                button.setAttribute('data-back-text', forcedBackText);
            }
        });
    }

    updateTooltipDataText(button) {
        if (!this.config.toolTip) return;

        let menuElement = document.querySelector('.dwc-nest-menu');
        let toolTipBackText = menuElement.getAttribute('data-tooltip-back-text')

        const closestUl = button.closest('.dwc-nav-wrapper, .dwc-tabbed-nav__list-wrapper');
        if (closestUl) {
            const tooltip = closestUl.querySelector('.dwc-nest-tooltip');
            if (tooltip) {
                const buttonText = button.getAttribute('data-text') ||
                    button.querySelector('i')?.getAttribute('data-text');
                tooltip.setAttribute('data-text', buttonText);
                tooltip.innerText = toolTipBackText + ' ' + buttonText;                
            }
            //console.log('button: ', button)
            //console.log('closet ul: ', closestUl)
        }

    }

    addTooltip(button) {
        if (!this.config.toolTip) return;

        let menuElement = document.querySelector('.dwc-nest-menu');
        let toolTipBackText = menuElement.getAttribute('data-tooltip-back-text')

        const closestUl = button.closest('.dwc-nav-wrapper, .dwc-tabbed-nav__list-wrapper');
        if (!closestUl) return;

        this.removeTooltipFrom(closestUl);

        const tooltip = document.createElement('div');
        tooltip.className = 'dwc-nest-tooltip';
        tooltip.innerText = toolTipBackText;
        tooltip.style.position = 'fixed';
        tooltip.style.bottom = '12px';
        tooltip.style.left = '12px';
        tooltip.style.background = 'rgb(0 0 0 / 30%)';
        tooltip.style.color = 'white';
        tooltip.style.padding = '5px 10px';
        tooltip.style.borderRadius = '5px';
        tooltip.style.fontSize = '12px';
        tooltip.style.zIndex = '9999';
        tooltip.style.opacity = '0';
        tooltip.style.transition = 'opacity 1.5s';
        tooltip.style.pointerEvents = 'none';
        closestUl.appendChild(tooltip);

        requestAnimationFrame(() => {
            tooltip.style.opacity = '1';
        });
    }

    removeAllTooltips() {
        document.querySelectorAll('.dwc-nest-tooltip').forEach(tooltip => tooltip.remove());
    }

    removeTooltipFrom(ulElement) {
        const existingTooltip = ulElement.querySelector('.dwc-nest-tooltip');
        if (existingTooltip) existingTooltip.remove();
    }

    setupTooltipObserver() {
        const tooltipObserver = new MutationObserver((mutationsList) => {
            if (this.tooltipProcessed) return;

            for (const mutation of mutationsList) {
                if (mutation.type === 'childList') {
                    for (const node of mutation.addedNodes) {
                        if (node.nodeType === Node.ELEMENT_NODE &&
                            node.classList.contains('dwc-nest-tooltip') &&
                            !this.tooltipProcessed) {
                            const button = document.querySelector('.open.active > .brx-submenu-toggle > button:not(.open .open button)');
                            if (button) {
                                this.updateTooltipDataText(button);
                                this.tooltipProcessed = true;
                                return;
                            }
                        }
                    }
                }
            }
        });

        tooltipObserver.observe(document.body, { childList: true, subtree: true });
    }
}

class SwipeGestureHandler {
    constructor(config) {
        this.config = {
            swipeToClose: config.swipeToClose || false
        };
        this.targetButton = null;
        this.startX = 0;
        this.startY = 0;
        this.endX = 0;
        this.endY = 0;
        
        // Cache RTL detection for performance during touch events
        this.isRTLLayout = null;
        this.cacheRTLStatus();
    }

    /**
     * Cache RTL status and set up listener for direction changes
     */
    cacheRTLStatus() {
        this.isRTLLayout = this.isRTL();
        
        // Listen for potential direction changes (rare but possible)
        const observer = new MutationObserver(() => {
            const newRTLStatus = this.isRTL();
            if (newRTLStatus !== this.isRTLLayout) {
                this.isRTLLayout = newRTLStatus;
            }
        });
        
        observer.observe(document.documentElement, {
            attributes: true,
            attributeFilter: ['dir', 'class', 'style']
        });
    }

    /**
     * Detect if the document is using RTL (Right-to-Left) layout
     * Follows the same pattern as MenuAnimationController
     */
    isRTL() {
        const htmlDir = document.documentElement.dir?.toLowerCase();
        if (htmlDir) return htmlDir === 'rtl';
        
        const computedDirection = getComputedStyle(document.documentElement).direction;
        return computedDirection === 'rtl';
    }

    initialize() {
        if (!this.config.swipeToClose) return;

        document.addEventListener('touchstart', this.handleTouchStart.bind(this));
        document.addEventListener('touchend', this.handleTouchEnd.bind(this));
    }

    handleTouchStart(event) {
        if (!this.isMobileMenuOpen()) return;

        this.startX = event.touches[0].clientX;
        this.startY = event.touches[0].clientY;
    }

    handleTouchEnd(event) {
        if (!this.isMobileMenuOpen()) return;

        this.endX = event.changedTouches[0].clientX;
        this.endY = event.changedTouches[0].clientY;

        const diffX = this.endX - this.startX;
        const diffY = Math.abs(this.endY - this.startY);
        
        // RTL-aware swipe detection
        const isValidSwipe = this.isValidSwipeGesture(diffX, diffY);

        if (isValidSwipe && this.targetButton) {
            this.targetButton.click();
            this.targetButton = null;
        }
    }

    /**
     * Determine if the swipe gesture is valid based on layout direction
     * @param {number} diffX - Horizontal distance (positive = right, negative = left)
     * @param {number} diffY - Vertical distance (absolute value)
     * @returns {boolean} True if the swipe should trigger menu close
     */
    isValidSwipeGesture(diffX, diffY) {
        const swipeThreshold = 50;
        const verticalTolerance = 30;
        
        // Vertical movement must be within tolerance
        if (diffY >= verticalTolerance) return false;

        if (this.isRTLLayout) {
            // RTL: Accept right-to-left swipes (negative diffX)
            return diffX < -swipeThreshold;
        } else {
            // LTR: Accept left-to-right swipes (positive diffX) - existing behavior
            return diffX > swipeThreshold;
        }
    }

    isMobileMenuOpen() {
        return document.querySelector('.dwc-nest-menu')?.classList.contains('brx-open');
    }

    setTargetButton(button) {
        this.targetButton = button;
    }

    /**
     * Get current layout direction (for debugging)
     * @returns {string} 'rtl' or 'ltr'
     */
    getLayoutDirection() {
        return this.isRTLLayout ? 'rtl' : 'ltr';
    }
}

class OffcanvasMenuHandler {
    constructor(config) {
        this.config = config || {};
    }

    applyMobileStyles() {
        let offcanvasMenu = document.querySelector(this.config.offCanvasSelector);
        let hasHeaderPosition = ['brx-header-left', 'brx-header-right'].some(cls =>
            document.body.classList.contains(cls)
        );

        if (!offcanvasMenu && !hasHeaderPosition) return;

        let styleSheet = document.querySelector('[data-stylesheet]');
        if (!styleSheet) return;

        let styleElement = styleSheet.querySelector('style');
        if (!styleElement) return;

        let originalStyles = styleElement.textContent || styleElement.innerText;
        let modifiedStyles = originalStyles.replace(/\(max-width:\s*\d+px\)/g, '(max-width: 5000px)');

        let newStyleElement = document.createElement('style');
        newStyleElement.id = 'dwc-offcanvas-styles';
        newStyleElement.textContent = modifiedStyles;

        document.head.appendChild(newStyleElement);

        setTimeout(() => {
            document.body.classList.add('show-nav');
             document.body.classList.add('sidebar-ready');

        }, 100);

        styleSheet.remove();
    }
}



class MobileMenuScrollReset {
    constructor(config = {}) {
        this.config = {
            minWidthThreshold: config.minWidthThreshold || MegaMenuCONFIG.minWidth,
            headerSelector: config.headerSelector || MegaMenuCONFIG.headerSelector,
            scrollResetDelay: config.scrollResetDelay || 300
        };

        this.menuElement = null;
        this.nestedItemsElement = null;
        this.scrollResetTimeout = null;
        this.isInitialized = false;
    }

    initialize() {
        if (this.isInitialized) return;

        this.menuElement = document.querySelector(`${this.config.headerSelector} .dwc-nest-menu`);
        this.nestedItemsElement = document.querySelector(`${this.config.headerSelector} .brx-nav-nested-items`);

        if (!this.menuElement || !this.nestedItemsElement) {
            console.warn('Mobile menu scroll reset: Required elements not found');
            return;
        }

        this.setupMutationObserver();
        this.isInitialized = true;
    }

    setupMutationObserver() {
        const observer = new MutationObserver((mutations) => {
            mutations.forEach((mutation) => {
                if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
                    this.handleMenuClassChange();
                }
            });
        });

        observer.observe(this.menuElement, {
            attributes: true,
            attributeFilter: ['class']
        });
    }

    handleMenuClassChange() {
        // Only run on mobile
        if (!this.isMobile()) return;

        const isMenuOpen = this.menuElement.classList.contains('brx-open');

        // If menu is now closed, set timeout to reset scroll
        if (!isMenuOpen) {
            this.scheduleScrollReset();
        } else {
            // If menu is opened, cancel any pending scroll reset
            this.cancelScrollReset();
        }
    }

    scheduleScrollReset() {
        // Clear any existing timeout
        this.cancelScrollReset();

        // Set new timeout
        this.scrollResetTimeout = setTimeout(() => {
            this.resetScroll();
        }, this.config.scrollResetDelay);
    }

    cancelScrollReset() {
        if (this.scrollResetTimeout) {
            clearTimeout(this.scrollResetTimeout);
            this.scrollResetTimeout = null;
        }
    }

    resetScroll() {
        if (this.nestedItemsElement && this.isMobile()) {
            this.nestedItemsElement.scrollTop = 0;
        }
    }

    isMobile() {
        return window.innerWidth < this.config.minWidthThreshold;
    }

    // Method to reinitialize (useful for your reinitialize functionality)
    reinitialize() {
        this.cancelScrollReset();
        this.isInitialized = false;
        this.initialize();
    }
}


class MenuSystem {
    constructor(config = {}) {
        this.config = {
            minWidthThreshold: config.minWidthThreshold || MegaMenuCONFIG.minWidth,
            stripeStyle: config.stripeStyle ?? MegaMenuCONFIG.stripeStyle,
            adaptiveHeight: config.adaptiveHeight ?? MegaMenuCONFIG.adaptiveHeight,
            toolTip: config.toolTip ?? MegaMenuCONFIG.toolTip,
            swipeToClose: config.swipeToClose ?? MegaMenuCONFIG.swipeToClose,
            headerSelector: config.headerSelector || MegaMenuCONFIG.headerSelector,
            megaMenuLinksSelector: `${config.headerSelector || MegaMenuCONFIG.headerSelector} .brx-has-megamenu`,
            offCanvasSelector: `${config.headerSelector || MegaMenuCONFIG.headerSelector} .dwc-nest-menu[data-offcanvas="true"]`,
            shiftFactor: config.shiftFactor ?? MegaMenuCONFIG.shiftFactor,
            minOverflow: config.minOverflow ?? MegaMenuCONFIG.minOverflow
        };

        this.animationController = new MenuAnimationController(this.config);
        this.tooltipManager = new TooltipManager(this.config);
        this.swipeHandler = new SwipeGestureHandler(this.config);
        this.offcanvasHandler = new OffcanvasMenuHandler(this.config);
        this.centeredLogoController = new CenteredLogoController(this.config);
        this.mobileScrollReset = new MobileMenuScrollReset(this.config);

        // Flag to track if updateDropdownPositions has been called via user interaction
        this.hasUpdatedDropdowns = false;

        this.centeredLogoController.initializeEarly();
    }


    // New method to handle the DOMContentLoaded logic, replaces former menuSystem.initialize()
    setupMenu() {
        let overlay = document.querySelector('.dwc-nest-menu-overlay');
        if (!overlay) {
            overlay = document.createElement('nav-overlay');
            overlay.className = 'dwc-nest-menu-overlay';
            const overlayParent = document.querySelector('.dwc-nest-header__container');
            const header = document.querySelector('#brx-header');
            if (overlayParent && MegaMenuCONFIG.overlayInsideHeader) {
                overlayParent.parentNode.prepend(overlay, overlayParent);
            } else if (header) {
                header.parentNode.insertBefore(overlay, header);
            }
        }

     
        this.offcanvasHandler.applyMobileStyles();
        this.animationController.updateHeaderHeight();
        this.animationController.initializeMaxDimensions();
        this.animationController.setMobileMenuTopHeight();
        this.animationController.updateMobileLogo();
        this.animationController.setCurrentPageDropdownActive();
        this.tooltipManager.setBackText();
        this.tooltipManager.setupTooltipObserver();
        this.animationController.closeNavOnClick();
        this.centeredLogoController.initialize();
        this.mobileScrollReset.initialize();


        if (this.animationController.isAboveMinWidth()) {
            this.setupDesktopBehavior();
        } else {
            this.swipeHandler.initialize();
        }

        this.setupEventListeners();

        if (!this.animationController.isAboveMinWidth()) {
            this.animationController.resetForMobile();
        }

        setTimeout(() => {
            document.body.classList.add('show-nav');
            this.animationController.updateHeaderHeight();
        }, 0);

        setTimeout(() => {
            document.body.classList.add('adaptive-height-active');
            if (this.animationController.isAboveMinWidth()) {
                this.animationController.updateDropdownPositions();
                this.animationController.setBoxedWidthVariable();
            }
        }, 500);
    }

    // Original initialize method (unchanged) now calls the setupMenu()
    initialize() {
        updateMobileClass(this.config.minWidthThreshold);
        document.addEventListener('DOMContentLoaded', () => {
            this.setupMenu();
        });
        return this;
    }

    // Updated reinitialize method - to call: mainMenu.reinitialize();
    reinitialize() {
        // Reset critical states
        this.centeredLogoController.isInitialized = false;
        this.animationController.maxMenuWidth = 0;
        this.animationController.maxMenuHeight = 0;
        this.tooltipManager.tooltipProcessed = false;

        // Clear breakinto states ← ADD THIS
        const breakintoElements = document.querySelectorAll('[data-breakinto]');
        breakintoElements.forEach(element => {
            breakintoOriginalParents.delete(element);
            breakintoOriginalIndexes.delete(element);
            breakintoItemStates.delete(element);
            element.removeAttribute('data-breakinto-moved');
        });

        // Clear existing timeouts
        if (this.animationController.headerTimeoutId) {
            clearTimeout(this.animationController.headerTimeoutId);
        }
        if (this.animationController.mobileMenuTimeoutId) {
            clearTimeout(this.animationController.mobileMenuTimeoutId);
        }
        if (this.centeredLogoController.resizedFinished) {
            clearTimeout(this.centeredLogoController.resizedFinished);
        }

        // Remove added DOM elements and classes
        const overlay = document.querySelector('.dwc-nest-menu-overlay');
        if (overlay) overlay.remove();
        document.body.classList.remove('show-nav', 'adaptive-height-active', 'desktop-centered', 'dom-ready');
        this.tooltipManager.removeAllTooltips();
        const offcanvasStyles = document.querySelector('#dwc-offcanvas-styles');
        if (offcanvasStyles) offcanvasStyles.remove();

        // Reset mobile logo
        const mobileLogo = document.querySelector('.dwc-nest-menu__mobile-logo');
        if (mobileLogo) {
            const currentMobileLogo = mobileLogo.querySelector('img, svg');
            if (currentMobileLogo) currentMobileLogo.remove();
        }

        // Re-run setup
        updateMobileClass(this.config.minWidthThreshold);
        this.setupMenu();
        this.mobileScrollReset.reinitialize();
        console.log('Mega Menu Pro reinitialized...')
    }



    setupDesktopBehavior() {
        this.animationController.megaMenuLinks.forEach(link => {
            link.removeEventListener('mouseenter', this.handleMouseEnter);
            link.addEventListener('mouseenter', this.handleMouseEnter);
        });
    }

    handleMouseEnter = (event) => {
        this.animationController.updateChevronPosition(event.target);
        // Call updateDropdownPositions on mouseenter if not already called via interaction
        if (this.animationController.isAboveMinWidth() && !this.hasUpdatedDropdowns) {
            this.animationController.updateDropdownPositions();
            this.animationController.updateMenuVariables();
            this.hasUpdatedDropdowns = true;
        }
    };

    setupEventListeners() {
        let observer = new MutationObserver(mutations => {
            mutations.forEach(mutation => {
                if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
                    this.animationController.updateMenuVariables();
                }
            });
        });

        this.animationController.megaMenuLinks.forEach(link =>
            observer.observe(link, { attributes: true })
        );

        document.addEventListener('click', event => {
            let submenuToggle = event.target.closest('.brx-submenu-toggle, .dwc-tabbed-nav-list__li');
            if (submenuToggle) {
                setTimeout(() => {
                    let openButtons = document.querySelectorAll('.brxe-dropdown.open.active button, .dwc-tabbed-nav-list__li.active button');
                    let targetButton = Array.from(openButtons).find(button => {
                        let parentDropdown = button.closest('.brxe-dropdown.open.active, .dwc-tabbed-nav-list__li.active');
                        return parentDropdown &&
                            parentDropdown.tagName.toLowerCase() === 'li' &&
                            !parentDropdown.querySelector('.brxe-dropdown.open.active:not(:scope), .dwc-tabbed-nav-list__li.active:not(:scope)');
                    });

                    if (targetButton) {
                        this.swipeHandler.setTargetButton(targetButton);
                        if (this.config.toolTip) {
                            this.tooltipManager.removeAllTooltips();
                            this.tooltipManager.addTooltip(targetButton);
                            this.tooltipManager.updateTooltipDataText(targetButton);
                        }
                    }
                }, 50);
            }
        });

        window.addEventListener('resize', this.debounce(() => {
            updateMobileClass(this.config.minWidthThreshold);
            this.animationController.updateHeaderHeight();
            this.animationController.initializeMaxDimensions();
            this.animationController.setMobileMenuTopHeight();
            this.animationController.updateMobileLogo();
            this.animationController.closeNavOnClick();

            if (this.animationController.isAboveMinWidth()) {
                this.animationController.updateMenuVariables();
                this.animationController.initDesktopNav();
                this.setupDesktopBehavior();
                // Reset flag on resize to desktop and call updateDropdownPositions       
                this.hasUpdatedDropdowns = false;
                this.animationController.updateDropdownPositions();
            } else {
                this.animationController.resetForMobile();
                this.swipeHandler.initialize();
                // Reset flag on resize to mobile               
                this.hasUpdatedDropdowns = false;
            }
        }, 300));
    }

    debounce(func, delay) {
        let timeoutId;
        return function (...args) {
            clearTimeout(timeoutId);
            timeoutId = setTimeout(() => func.apply(this, args), delay);
        };
    }
}

const mainMenu = new MenuSystem().initialize();


// RECALCULATE DROPDOWN POSITION ON LAYOUT SHIFTS

const debouncedUpdate = mainMenu.debounce(() => {
    //console.log('updated')
    mainMenu.animationController.updateDropdownPositions();
    mainMenu.animationController.updateMenuVariables();

    if (!mainMenu.animationController.menuOpened) {
        mainMenu.animationController.header.style.setProperty('--dropdown-menu-width', '100px');
        // console.log('less')
    }

}, 300);



if (window.visualViewport) {
    window.visualViewport.addEventListener('resize', debouncedUpdate);
}




//==== HEADER INSTANCE EXPERIMENTAL ====
/*
const secondaryMenu = new MenuSystem({   
headerSelector: '.second.dwc-nest-header',
adaptiveHeight: 1,
stripeStyle: 0,
shiftFactor: 1.5,  // Example override
minOverflow: 300   // Example override
}).initialize();
*/


/* BREAKOUT LINK & BREAKIN FUNCTIONALITY */

// WeakMaps for breakinto feature state management
const breakintoOriginalParents = new WeakMap(); // Track original parents for breakinto items
const breakintoOriginalIndexes = new WeakMap(); // Track original child indexes for breakinto items  
const breakintoItemStates = new WeakMap(); // Track individual breakinto item states

// Use WeakMap for better garbage collection
const originalParents = new WeakMap();
const itemStates = new WeakMap(); // Track individual item states
const breakinOriginalParents = new WeakMap(); // Track original parents for breakin items
const breakinOriginalIndexes = new WeakMap(); // Track original child indexes for breakin items
const breakinItemStates = new WeakMap(); // Track individual breakin item states
let isMobileView = null;
let resizeTimer;
let breakinContainer = null;

function ensureBreakInContainer() {
    // Check if any breakin elements exist in the header first
    const hasBreakInElements = document.querySelector('#brx-header [data-breakin]');
    if (!hasBreakInElements) return null;

    // Select nav wrapper based on config
    const navWrapperSelector = MegaMenuCONFIG.breakinToNavList
        ? '.dwc-nest-menu .brx-nav-nested-items'
        : '.dwc-nav-wrapper';

    const navWrapper = document.querySelector(navWrapperSelector);
    if (!navWrapper) return null;

    if (!breakinContainer) {
        breakinContainer = navWrapper.querySelector('.breakin-container');
        if (!breakinContainer) {
            // Create element based on config
            breakinContainer = MegaMenuCONFIG.breakinToNavList
                ? document.createElement('li')
                : document.createElement('div');

            breakinContainer.className = 'breakin-container';
            navWrapper.appendChild(breakinContainer);
        }
    }

    return breakinContainer;
}

function handleBreakInItems() {
    const currentWidth = window.innerWidth;
    const container = ensureBreakInContainer();
    if (!container) return;

    // Get all breakin items from both original locations and breakin container
    const breakinItemsInOriginal = document.querySelectorAll('#brx-header [data-breakin]:not(.breakin-container [data-breakin])');
    const breakinItemsInContainer = container.querySelectorAll('[data-breakin]');

    // Combine both nodelets into a single array
    const breakinItems = [...breakinItemsInOriginal, ...breakinItemsInContainer];

    breakinItems.forEach(item => {
        const breakpointAttr = item.getAttribute('data-breakin');

        // Set default breakpoint if not defined or invalid
        let breakpoint;
        if (!breakpointAttr || breakpointAttr.trim() === '') {
            breakpoint = MegaMenuCONFIG.minWidth - 1;
        } else {
            breakpoint = parseInt(breakpointAttr, 10);
            if (isNaN(breakpoint)) {
                breakpoint = MegaMenuCONFIG.minWidth - 1;
            }
        }

        // Continue with your logic using the breakpoint value...

        // Determine if item should be in mobile state (moved into container)
        const shouldBeInContainer = currentWidth <= breakpoint;

        // Get current state of this breakin item
        const currentItemState = breakinItemStates.get(item);

        // Only process if this item's state changed
        if (currentItemState !== shouldBeInContainer) {
            breakinItemStates.set(item, shouldBeInContainer);

            if (shouldBeInContainer) {
                // Move to breakin container

                // Store original parent and index if not already stored
                if (!breakinOriginalParents.has(item)) {
                    const originalParent = item.parentElement;
                    const originalIndex = Array.from(originalParent.children).indexOf(item);
                    breakinOriginalParents.set(item, originalParent);
                    breakinOriginalIndexes.set(item, originalIndex);
                }

                // Move item to breakin container
                container.appendChild(item);

            } else {
                // Move back to original parent at original position
                const originalParent = breakinOriginalParents.get(item);
                const originalIndex = breakinOriginalIndexes.get(item);

                if (originalParent && originalIndex !== undefined) {
                    const children = originalParent.children;

                    if (originalIndex >= children.length) {
                        // Insert at the end if original index is beyond current children
                        originalParent.appendChild(item);
                    } else {
                        // Insert at the original position
                        originalParent.insertBefore(item, children[originalIndex]);
                    }
                }
            }
        }
    });
}

function handleBreakIntoItems() {
    const currentWidth = window.innerWidth;

    // Get all breakinto items from both original locations and target containers
    const breakintoItemsInOriginal = document.querySelectorAll('[data-breakinto]:not([data-breakinto=""])');
    const breakintoItemsInContainers = document.querySelectorAll('[data-breakinto-moved="true"]');

    // Combine both nodelets into a single array
    const breakintoItems = [...breakintoItemsInOriginal, ...breakintoItemsInContainers];

    breakintoItems.forEach(item => {
        const breakintoAttr = item.getAttribute('data-breakinto');

        // Skip if no breakinto attribute or empty value
        if (!breakintoAttr || breakintoAttr.trim() === '') {
            return;
        }

        // Parse the attribute value for container selector and optional breakpoint
        let containerSelector, customBreakpoint;

        if (breakintoAttr.includes('|')) {
            // Format: '.class | 767' or '#id | 1024'
            const parts = breakintoAttr.split('|').map(part => part.trim());
            containerSelector = parts[0];
            customBreakpoint = parseInt(parts[1], 10);

            // Validate custom breakpoint
            if (isNaN(customBreakpoint)) {
                console.warn(`Invalid breakpoint in data-breakinto="${breakintoAttr}". Using global breakpoint.`);
                customBreakpoint = null;
            }
        } else {
            // Format: '.class' or '#id'
            containerSelector = breakintoAttr.trim();
            customBreakpoint = null;
        }

        // Find the target container
        let targetContainer;
        try {
            targetContainer = document.querySelector(containerSelector);
        } catch (error) {
            console.error(`Invalid selector in data-breakinto="${breakintoAttr}":`, error);
            return;
        }

        if (!targetContainer) {
            console.warn(`Target container "${containerSelector}" not found for data-breakinto element.`);
            return;
        }

        // Determine breakpoint to use (custom or global)
        const breakpoint = customBreakpoint !== null ? customBreakpoint : MegaMenuCONFIG.minWidth;

        // Determine if item should be in target container (moved state)
        const shouldBeInContainer = currentWidth <= breakpoint;

        // Get current state of this breakinto item
        const currentItemState = breakintoItemStates.get(item);

        // Only process if this item's state changed
        if (currentItemState !== shouldBeInContainer) {
            breakintoItemStates.set(item, shouldBeInContainer);

            if (shouldBeInContainer) {
                // Move to target container

                // Store original parent and index if not already stored
                if (!breakintoOriginalParents.has(item)) {
                    const originalParent = item.parentElement;
                    const originalIndex = Array.from(originalParent.children).indexOf(item);
                    breakintoOriginalParents.set(item, originalParent);
                    breakintoOriginalIndexes.set(item, originalIndex);
                }

                // Mark item as moved and move to target container
                item.setAttribute('data-breakinto-moved', 'true');
                targetContainer.appendChild(item);

            } else {
                // Move back to original parent at original position
                const originalParent = breakintoOriginalParents.get(item);
                const originalIndex = breakintoOriginalIndexes.get(item);

                if (originalParent && originalIndex !== undefined) {
                    const children = originalParent.children;

                    // Remove the moved marker
                    item.removeAttribute('data-breakinto-moved');

                    if (originalIndex >= children.length) {
                        // Insert at the end if original index is beyond current children
                        originalParent.appendChild(item);
                    } else {
                        // Insert at the original position
                        originalParent.insertBefore(item, children[originalIndex]);
                    }
                }
            }
        }
    });
}

function handleResponsiveMenu() {
    const currentIsMobile = window.innerWidth < MegaMenuCONFIG.minWidth;
    const currentWidth = window.innerWidth;

    const nestMenu = document.querySelector('.dwc-nest-menu');
    if (!nestMenu) return;

    // Get all target items from both original locations and nest menu
    const targetItemsInOriginal = document.querySelectorAll('.brx-nav-nested-items > .menu-item > [data-breakout-link]');
    const targetItemsInNest = nestMenu.querySelectorAll('[data-breakout-link]');

    // Combine both nodelets into a single array
    const targetItems = [...targetItemsInOriginal, ...targetItemsInNest];
    let hasStateChange = false;

    targetItems.forEach(item => {

        if (item.closest('.dwc-header-logo-item')) return; // don't interfere with centerd logo item

        const parent = item.parentElement;
        const breakpointAttr = item.getAttribute('data-breakout-link');

        // Determine if item should be in mobile state
        let shouldBeMobile;

        if (!breakpointAttr || breakpointAttr.trim() === '') {
            // No custom breakpoint - use global mobile view logic
            shouldBeMobile = currentIsMobile;
        } else {
            // Custom breakpoint - check if within range
            const customBreakpoint = parseInt(breakpointAttr, 10);
            if (isNaN(customBreakpoint)) {
                // Invalid breakpoint value - fallback to global logic
                shouldBeMobile = currentIsMobile;
            } else {
                // Within custom range: between customBreakpoint and MegaMenuCONFIG.minWidth (exclusive)
                shouldBeMobile = currentWidth >= customBreakpoint && currentWidth < MegaMenuCONFIG.minWidth;
            }
        }

        // Get current state of this item
        const currentItemState = itemStates.get(item);

        // Only process if this item's state changed
        if (currentItemState !== shouldBeMobile) {
            hasStateChange = true;
            itemStates.set(item, shouldBeMobile);

            if (shouldBeMobile) {
                // Move to mobile state
                parent.classList.add('has-breakout-link');

                // Store original parent if not already stored
                if (!originalParents.has(item)) {
                    originalParents.set(item, parent);
                }

                // Move item to nest menu
                nestMenu.insertBefore(item, nestMenu.firstChild);

                // Hide the original parent
                parent.style.display = 'none';
            } else {
                // Move to desktop state - restore to original parent
                const originalParent = originalParents.get(item);
                if (originalParent) {
                    originalParent.appendChild(item);
                    originalParent.style.display = '';
                    originalParent.classList.remove('has-breakout-link');
                }
            }
        }
    });

    // Update global mobile view state only if there was a global state change
    if (isMobileView !== currentIsMobile) {
        isMobileView = currentIsMobile;
    }

    // Optional: You can add logic here if you need to do something when any state changes
    if (hasStateChange) {
        // Any additional logic when items change state
    }
}

function handleAllResponsiveElements() {
    handleResponsiveMenu(); // Handle breakout functionality
    handleBreakInItems();   // Handle breakin functionality
    handleBreakIntoItems(); // Handle breakinto functionality ← ADD THIS LINE
}

// Run on page load
handleAllResponsiveElements();

// Debounce resize events
window.addEventListener('resize', () => {
    clearTimeout(resizeTimer);
    resizeTimer = setTimeout(handleAllResponsiveElements, 150);
});

// Optional: Add for better initial load behavior
document.addEventListener('DOMContentLoaded', handleAllResponsiveElements);




// REINITIALIZE ON URL CHANGE
if (MegaMenuCONFIG.reinitializeOnURLchange) {
    console.log('on URL change active')
    function onUrlChange() {
        setTimeout(function () {
            mainMenu.reinitialize();
        }, 1500); // Delay execution by 1.5 seconds
    }

    // Listen for popstate event (history navigation)
    window.addEventListener('popstate', onUrlChange);

    // Listen for hashchange event (URL hash change)
    window.addEventListener('hashchange', onUrlChange);

    // Handle pushState and replaceState
    (function (history) {
        const pushState = history.pushState;
        const replaceState = history.replaceState;

        history.pushState = function (state) {
            const result = pushState.apply(history, arguments);
            onUrlChange(); // Call the function when pushState is used
            return result;
        };

        history.replaceState = function (state) {
            const result = replaceState.apply(history, arguments);
            onUrlChange(); // Call the function when replaceState is used
            return result;
        };
    })(window.history);
}

console.log('%c<Mega Menu Pro v1.4.2>', 'color: #b388eb');
/*prevent FOUC on mobile when using sidebar */
.dwc-mobile :is(.bricks-is-frontend.brx-header-left, .bricks-is-frontend.brx-header-right) #brx-header {
  position: relative;
  inline-size: 100%;
  flex-direction: column;
}

.dwc-mobile .bricks-is-frontend:is(.brx-header-left, .brx-header-right) :is(#brx-content, #brx-footer) {
  margin-inline-start: 0;
}

/*prevent FOUC on desktop when using sidebar */
.bricks-is-frontend:is(.brx-header-left, .brx-header-right):not(.show-nav) .dwc-nav-wrapper {
  display: none;
}

/*=== sidebar css ===*/
html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header {
  flex-direction: column;
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.7);  
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]).no-scroll {
  overflow: visible;
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nest-menu.brxe-nav-nested .brx-nav-nested-items {
  max-block-size: 100dvb;
  padding-block-end: 12rem;
  overscroll-behavior: contain;
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nav-wrapper {
  position: relative;
  overflow: hidden;
  block-size: 100%;
  transform: translateX(0%);
  visibility: visible;
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) .dwc-nest-menu .brxe-toggle {
  display: none !important;
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nest-menu {
  display: flex;
  flex-direction: column;
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nest-header > div {
  display: flex;
  grid-template-columns: 1fr;
  block-size: 100%;
  flex-direction: column;
  justify-content: flex-start;
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-menu-wrap {
  inline-size: 100%;
  display: grid;
  grid-template-columns: 1fr;
  block-size: 100%;
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header :is(.brxe-code, .dwc-nest-menu-overlay) {
  display: none;
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nest-header {
  inline-size: 100%;
  padding-inline: 0;
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nest-menu-top {
  min-block-size: var(--top-offset);
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nest-menu:not( [data-hide-close-bar = 'true']) .brx-dropdown-content {
  inset-block-start: calc(var(--top-offset) + 1px) !important;

}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nest-menu:not( [data-submenu-reveal = 'slide']) .brx-dropdown-content:not([data-submenu-reveal = 'slide'] *) {  
  inset-inline-start: 0;
  inset-block-start: unset !important;
  overflow: hidden;
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nest-menu:not([data-submenu-reveal = 'slide']) .brxe-dropdown:not(.open.active) > .brx-dropdown-content > .brxe-dropdown:not([data-submenu-reveal = 'slide'] *){
  visibility: hidden;  
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nest-menu.brxe-nav-nested.brx-open .brxe-dropdown > .brx-dropdown-content {
  overscroll-behavior: contain;
  min-inline-size: var(--mobile-menu-width);

}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nest-menu .brxe-dropdown.open > .brx-submenu-toggle button:not([data-submenu-reveal = 'expand'] button)  {
  min-block-size: calc(var(--top-offset) - 1px);
  inset-block-start: 0;
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nest-menu .brxe-dropdown.open[data-submenu-reveal = 'slide'] > .brx-submenu-toggle button  {
  min-block-size: calc(var(--top-offset) - 1px);
  inset-block-start: 0;
}

html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nest-menu .brxe-dropdown .brx-submenu-toggle button {
  min-block-size: 0;    
}

/* sidebar css ends*/



/*sidebar in builder*/
/*=== sidebar css ===*/
:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header {
  flex-direction: column;
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.7);
  --top-offset: 40px;
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nest-menu.brxe-nav-nested .brx-nav-nested-items {
  max-block-size: 100dvb;
  padding-block-end: 12rem;
  overscroll-behavior: contain;
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nav-wrapper {
  position: relative;
  overflow: hidden;
  block-size: 100%;
  transform: translateX(0%);
  visibility: visible;
}

body:is(.brx-header-left, .brx-header-right)[data-builder-window] .dwc-nest-menu .brxe-toggle {
  display: none !important;
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nest-menu {
  display: flex;
  flex-direction: column;
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nest-header > div {
  display: flex;
  grid-template-columns: 1fr;
  block-size: 100%;
  flex-direction: column;
  justify-content: flex-start;
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-menu-wrap {
  inline-size: 100%;
  display: grid;
  grid-template-columns: 1fr;
  block-size: 100%;
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nest-header {
  inline-size: 100%;
  padding-inline: 0;
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nest-menu-top {
  min-block-size: var(--top-offset);
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nest-menu .brx-dropdown-content {
  inset-block-start: calc(var(--top-offset) - 1px) !important;
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nest-menu.brxe-nav-nested.brx-open .brxe-dropdown > .brx-dropdown-content {
  overscroll-behavior: contain;  
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nest-menu .brxe-dropdown.open > .brx-submenu-toggle button {
  min-block-size: calc(var(--top-offset) - 1px);
  inset-block-start: 0;
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nest-menu .brxe-dropdown .brx-submenu-toggle button {
  min-block-size: 0;    
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] .dwc-nest-menu {
  margin: 0 !important;
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] .brx-nav-nested-items {  
  flex-direction: column !important;  
}
   
:is(.brx-header-left, .brx-header-right)[data-builder-window] .dwc-nest-toggle--open.brxe-toggle {
  display: flex !important;
}
 
:is(.brx-header-left, .brx-header-right)[data-builder-window] .dwc-nest-menu .brx-nav-nested-items {
  position: relative !Important;
  background: var(--mobile-menu-bg) !important;
  align-items: stretch;
  flex: 1;
}

:where(.brx-header-left, .brx-header-right)[data-builder-mode]:not(:has(.dwc-sidebar)) .dwc-nest-menu-top::before {
    content: 'this space is the back text bar';
    padding: 1rem;
    background-color: gray;
    color: white;
    width: 100%;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 1px;
}
 
/* MENU CTA (LAST BUTTON) */
:is(.brx-header-left, .brx-header-right)[data-builder-window] [data-last-item-is-button="true"].dwc-nest-menu .brx-nav-nested-items > .menu-item:last-of-type {
  padding-inline: var(--menu-item-inline-padding) !important;
  padding-block: var(--menu-item-block-padding) !important;
}
 
:is(.brx-header-left, .brx-header-right)[data-builder-window] .dwc-nest-menu-top {
  min-block-size: 80px !important;
}
 
:is(.brx-header-left, .brx-header-right)[data-builder-window] .dwc-nest-nav-items {
  overflow-y: scroll;
}

:is(.brx-header-left, .brx-header-right)[data-builder-mode] .brx-dropdown-content {
  min-inline-size: var(--mobile-menu-width);
  position: static;
}

:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nest-menu.brxe-nav-nested .brx-nav-nested-items {
  flex-wrap: nowrap;
}
:is(.brx-header-left, .brx-header-right)[data-builder-window] #brx-header .dwc-nest-menu .brx-dropdown-content {   
  visibility: visible !important;
  opacity: 1;
}

/*OVERLAY SIDEBAR*/


html:not(.dwc-mobile):has([data-overlay-sidebar=true])  {
 --mobile-menu-bg: rgb(255 255 255 / 0%);
  --menu-item-border: solid 1px rgb(255 255 255 / 50%);
 
}

html:not(.dwc-mobile):has([data-overlay-sidebar=true]) :is(.brx-header-left, .brx-header-right):not([data-builder-modee]) :is(main, footer){
  margin: 0 !important
}

html:not(.dwc-mobile):has([data-overlay-sidebar=true]) :is(.brx-header-left, .brx-header-right):not([data-builder-modee]) :is(main, footer) :where(section):not(section>section) {
  padding-inline-start: calc(var(--mobile-menu-width) + clamp(1.5rem, calc(0.625vw + 1.375rem), 1.875rem));
  max-inline-size: 100%
}

html:not(.dwc-mobile):has([data-overlay-sidebar=true]) :is(.brx-header-left, .brx-header-right):not([data-builder-modee]) #brx-header {
  border-radius: var(--overlay-sidebar-radius);
  overflow: hidden;
  background: var(--overlay-sidebar-bg);
  box-shadow: var(--overlay-sidebar-shadow) !important;
  inset: var(--overlay-sidebar-inset);
}

html:not(.dwc-mobile):has([data-overlay-sidebar=true]) :is(.brx-header-left, .brx-header-right):not([data-builder-modee]) .dwc-nest-header{
  backdrop-filter: blur(13px);
  background: transparent !important;
}

html:not(.dwc-mobile):has([data-overlay-sidebar=true]):not([data-builder-modee])  .brx-dropdown-content {
   background-color: rgb(255 255 255 / 100%);
}

/*NO BRX-OPEN STYLES*/
html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) #brx-header .dwc-nest-menu.brxe-nav-nested .brx-nav-nested-items {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: column !important;
}


  html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) .dwc-nest-menu.brxe-nav-nested .brxe-dropdown .brx-dropdown-content {
      visibility: visible;
      min-inline-size: var(--mobile-menu-width) !important;
  }


  html:not(.dwc-mobile) :is(.brx-header-left, .brx-header-right):not([data-builder-window]) .dwc-nest-menu[data-submenu-reveal="expand"] .brxe-dropdown.open>.brx-dropdown-content {
   position: static;
}


class SidebarNavigation {
  constructor(options = {}) {
    // Basic configuration properties
    this.config = {
      minWidth: options.minWidth || MegaMenuCONFIG.minWidth, // Using external minWidth variable
      menuSelector: options.menuSelector || '.dwc-nest-menu',
      openClass: options.openClass || 'brx-open',
      activeClasses: options.activeClasses || ['open', 'active'],
      leftHeaderClass: options.leftHeaderClass || 'brx-header-left',
      rightHeaderClass: options.rightHeaderClass || 'brx-header-right',
      debounceDelay: options.debounceDelay || 100,
      menuItemClickDelay: options.menuItemClickDelay || 300
    };
    
    // Set dependent selectors
    const menuSelector = this.config.menuSelector;
    this.config.submenuToggleSelector = options.submenuToggleSelector || `${menuSelector} .brx-submenu-toggle`;
    this.config.dropdownSelector = options.dropdownSelector || `${menuSelector} .brxe-dropdown`;
    this.config.dropdownContentSelector = options.dropdownContentSelector || `${menuSelector} .brx-dropdown-content`;
    
    // State
    this.previousHeaderClass = null;
    this.dropdownClickHandlers = new Map();
    this.menuHoverHandlers = null;
    this.menuItemClickTimeout = null;
    this.keyboardNavHandler = null;
    this.cachedFocusableElements = null;
    this.cachedElements = {
      menuElement: null,
      navElement: null,
      dropdowns: null,
      dropdownToggles: null,
      menuItems: null
    };
    
    // Bind methods to this instance
    this.handleResize = this.debounce(this.handleMenu.bind(this), this.config.debounceDelay);
    this.handleOutsideClick = this.handleOutsideClick.bind(this);
  }
  
  // Initialize everything - called once
  init() {
    // Wait for DOM to be fully loaded before attaching events
    if (document.readyState === 'loading') {
      document.addEventListener('DOMContentLoaded', () => {
        this.initAfterDOMLoaded();
      }, { once: true });
    } else {
      this.initAfterDOMLoaded();
    }
    
    return this;
  }
  
  // Separate initialization method to run after DOM is loaded
  initAfterDOMLoaded() {
    // Cache DOM elements once
    this.cacheElements();
    
    // Setup resize event with passive flag
    window.addEventListener('resize', this.handleResize, { passive: true });
    
    // Setup mutation observer for critical class changes only
    this.setupMutationObserver();
    
    // Initial setup based on current screen size
    this.handleMenu();
    
    // Cache focusable elements once if header class is present
    if (this.hasHeaderClass()) {
      this.cacheFocusableElements();
      this.setupMenuFocusNavigation();
    }
  }
  
  // Cache all required DOM elements upfront
  cacheElements() {
    this.cachedElements.menuElement = document.querySelector(this.config.menuSelector);
    
    if (this.cachedElements.menuElement) {
      this.cachedElements.navElement = this.cachedElements.menuElement.querySelector('.dwc-nest-nav-items');
      this.cachedElements.dropdowns = Array.from(document.querySelectorAll(this.config.dropdownSelector));
      this.cachedElements.dropdownToggles = Array.from(document.querySelectorAll(this.config.submenuToggleSelector));
      this.cachedElements.menuItems = Array.from(document.querySelectorAll(`${this.config.menuSelector} .menu-item`));
    }
  }
  
  // Set up a focused mutation observer only for dropdown state changes
  setupMutationObserver() {
    if (!this.cachedElements.dropdowns || this.cachedElements.dropdowns.length === 0) return;
    
    const callback = (mutations) => {
      for (let mutation of mutations) {
        if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
          const target = mutation.target;
          const prevClassList = mutation.oldValue ? mutation.oldValue.split(' ') : [];
          const hadBothBefore = prevClassList.includes('open') && prevClassList.includes('active');
          const hasBothNow = target.classList.contains('open') && target.classList.contains('active');
    
          if (hadBothBefore !== hasBothNow) {
            this.updateDropdownAccessibility();
            break; // Only need to update once per batch
          }
        }
      }
    };
    
    // Create observer with optimized options
    this.classObserver = new MutationObserver(callback);
    
    // Observe only the dropdown elements
    this.cachedElements.dropdowns.forEach(dropdown => {
      this.classObserver.observe(dropdown, { 
        attributes: true, 
        attributeFilter: ['class'], 
        attributeOldValue: true 
      });
    });
  }
  
  // Cache focusable elements for keyboard navigation
  cacheFocusableElements() {
    if (!this.cachedElements.navElement) return;
    
    // Get direct children of nav
    const directChildren = Array.from(this.cachedElements.navElement.children);
    
    // Find the first focusable element within each direct child
    this.cachedFocusableElements = directChildren.map(child => {
      // Check if the child itself is focusable
      if (child.matches('a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])')) {
        return child;
      }
      // Otherwise, find the first focusable element within this child
      return child.querySelector('a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])');
    }).filter(Boolean); // Remove null/undefined values
  }
  
  // Clean up all event listeners and observers
  destroy() {
    // Clean up the mutation observer
    if (this.classObserver) {
      this.classObserver.disconnect();
      this.classObserver = null;
    }
    
    // Clean up resize listener
    window.removeEventListener('resize', this.handleResize);
    
    // Clean up click handlers
    if (this.dropdownClickHandlers.size > 0) {
      this.dropdownClickHandlers.forEach((handler, toggle) => {
        toggle.removeEventListener('click', handler);
      });
      this.dropdownClickHandlers.clear();
    }
    
    // Clean up hover handlers
    this.cleanupMenuHover();
    
    // Clean up menu item click handlers
    this.cleanupMenuItemClicks();
    
    // Clean up outside click handler
    document.removeEventListener('click', this.handleOutsideClick);
    
    // Clean up keyboard navigation
    if (this.keyboardNavHandler) {
      document.removeEventListener('keydown', this.keyboardNavHandler);
      this.keyboardNavHandler = null;
    }
    
    // Clear any pending timeouts
    if (this.menuItemClickTimeout) {
      clearTimeout(this.menuItemClickTimeout);
      this.menuItemClickTimeout = null;
    }
  }
  
  // Utility methods
  hasHeaderClass() {
    return document.body.classList.contains(this.config.leftHeaderClass) || 
           document.body.classList.contains(this.config.rightHeaderClass);
  }
  
  debounce(func, delay) {
    let timer;
    return (...args) => {
      clearTimeout(timer);
      timer = setTimeout(() => func(...args), delay);
    };
  }

  // Check if an element has all the required active classes
  hasAllActiveClasses(element) {
    return this.config.activeClasses.every(className => element.classList.contains(className));
  }
  
  // Toggle all active classes on an element
  toggleActiveClasses(element) {
    this.config.activeClasses.forEach(className => {
      element.classList.toggle(className);
    });
  }
  
  // Core functionality methods
  handleMenu() {
    if (!this.cachedElements.menuElement) return;
    if (!this.hasHeaderClass() && !this.previousHeaderClass) return;

    const screenWidth = window.innerWidth;
    const isLargeScreen = screenWidth >= this.config.minWidth;
    const menuElement = this.cachedElements.menuElement;

    if (!isLargeScreen) {
      // Save which class was present before removal
      if (this.hasHeaderClass()) {
        this.previousHeaderClass = document.body.classList.contains(this.config.leftHeaderClass) 
          ? this.config.leftHeaderClass 
          : this.config.rightHeaderClass;
        
        // Remove header classes
        document.body.classList.remove(this.config.leftHeaderClass, this.config.rightHeaderClass);
        menuElement.classList.remove(this.config.openClass);
        
        // Reset accessibility attributes
        this.resetAccessibilityAttributes();
      }
      
      // Clean up event handlers for mobile view
      this.cleanupMenuHover();
      this.cleanupMenuItemClicks();
      this.cleanupDropdownHandlers();
      document.removeEventListener('click', this.handleOutsideClick);
      
      return;
    }

    // Large screen behavior
    if (!this.hasHeaderClass() && this.previousHeaderClass) {
      document.body.classList.add(this.previousHeaderClass);
    }

    if (this.hasHeaderClass()) {
      if (!menuElement.classList.contains(this.config.openClass)) {
        menuElement.classList.add(this.config.openClass);
      }
      
      // Setup elements for large screen view
      this.setupMenuHover();
      this.setupMenuItemClicks();
      this.setupDropdownHandlers();
      this.setupMenuFocusNavigation();
      this.updateDropdownAccessibility();
      
      // Ensure outside click handler is set up
      document.removeEventListener('click', this.handleOutsideClick);
      document.addEventListener('click', this.handleOutsideClick, { passive: false });
    }
  }
  
  // Reset accessibility attributes when switching to mobile
  resetAccessibilityAttributes() {
    if (!this.cachedElements.dropdowns) return;
    
    // Remove all inert attributes from dropdown contents
    this.cachedElements.dropdowns.forEach(dropdown => {
      const content = dropdown.querySelector(this.config.dropdownContentSelector);
      if (content) {
        content.removeAttribute('inert');
      }
      
      const button = dropdown.querySelector('button');
      if (button) {
        button.setAttribute('aria-expanded', 'false');
      }
    });
  }
  
  setupMenuFocusNavigation() {
    // Only run if hasHeaderClass() is true and we have focusable elements
    if (!this.hasHeaderClass() || !this.cachedFocusableElements || this.cachedFocusableElements.length === 0) {
      return;
    }
    
    // Clean up previous handler if it exists
    if (this.keyboardNavHandler) {
      document.removeEventListener('keydown', this.keyboardNavHandler, true);
      this.keyboardNavHandler = null;
    }
    
    const navMenu = this.cachedElements.menuElement;
    const focusableElements = this.cachedFocusableElements;
    const firstFocusableElement = focusableElements[0];
    const lastFocusableElement = focusableElements[focusableElements.length - 1];
    
    // Find adjacent focusable elements outside the menu (only once during setup)
    const headerElement = navMenu.closest('header') || document.querySelector('header');
    
    // Prepare variables to hold adjacent elements
    let prevFocusableElement = null;
    let nextFocusableElement = null;
    let firstElementAfterHeader = null;
    
    if (headerElement) {
      // Get all focusable elements within the header - do this once and cache the result
      const headerFocusables = Array.from(
        headerElement.querySelectorAll('a:not([tabindex="-1"]), button:not([tabindex="-1"]), input:not([tabindex="-1"]), select:not([tabindex="-1"]), textarea:not([tabindex="-1"]), [tabindex]:not([tabindex="-1"])')
      ).filter(el => window.getComputedStyle(el).display !== 'none');
      
      // Find the index of our first and last menu elements in one pass
      const menuStartIndex = headerFocusables.indexOf(firstFocusableElement);
      const menuEndIndex = headerFocusables.indexOf(lastFocusableElement);
      
      // Cache the adjacent elements
      if (menuStartIndex > 0) {
        prevFocusableElement = headerFocusables[menuStartIndex - 1];
      }
      
      if (menuEndIndex !== -1 && menuEndIndex < headerFocusables.length - 1) {
        nextFocusableElement = headerFocusables[menuEndIndex + 1];
      }
      
      // Pre-calculate the first element after header - but only if needed
      if (!nextFocusableElement) {
        // Use a more efficient selector that targets immediate children of body that aren't the header
        const selector = 'body > *:not(header)';
        const nonHeaderElements = document.querySelectorAll(selector);
        
        // Only process if we have elements
        if (nonHeaderElements.length > 0) {
          // Create a function to find the first focusable element (used later if needed)
          this.findFirstFocusableAfterHeader = () => {
            for (const element of nonHeaderElements) {
              const focusable = element.querySelector('a:not([tabindex="-1"]), button:not([tabindex="-1"]), input:not([tabindex="-1"]), select:not([tabindex="-1"]), textarea:not([tabindex="-1"]), [tabindex]:not([tabindex="-1"])');
              if (focusable && window.getComputedStyle(focusable).display !== 'none') {
                return focusable;
              }
            }
            return null;
          };
        }
      }
    }
    
    // Create keyboard navigation handler with closure over the cached elements
    this.keyboardNavHandler = (e) => {
      // Quick check for Tab key first
      if (e.key !== 'Tab') return;
      
      // Then check if focus is inside the menu
      if (!navMenu.contains(document.activeElement)) return;
      
      let targetElement = null;
      
      // Handle tab navigation at boundaries only
      if (!e.shiftKey && document.activeElement === lastFocusableElement) {
        // Forward tab from last element
        e.preventDefault();
        e.stopPropagation();
        
        if (nextFocusableElement) {
          targetElement = nextFocusableElement;
        } else if (this.findFirstFocusableAfterHeader) {
          // Only search for elements after header if needed and not already found
          firstElementAfterHeader = this.findFirstFocusableAfterHeader();
          targetElement = firstElementAfterHeader;
        }
        
        // Focus on the target or body as fallback
        setTimeout(() => {
          if (targetElement) {
            targetElement.focus();
          } else {
            document.body.setAttribute('tabindex', '-1');
            document.body.focus();
            document.body.removeAttribute('tabindex');
          }
        }, 10);
      } 
      else if (e.shiftKey && document.activeElement === firstFocusableElement) {
        // Backward tab from first element
        e.preventDefault();
        e.stopPropagation();
        
        setTimeout(() => {
          if (prevFocusableElement) {
            prevFocusableElement.focus();
          } else {
            document.body.setAttribute('tabindex', '-1');
            document.body.focus();
            document.body.removeAttribute('tabindex');
          }
        }, 10);
      }
    };
    
    // Use capture phase for the event
    document.addEventListener('keydown', this.keyboardNavHandler, true);
  }
  
  setupMenuHover() {
    const menuElement = this.cachedElements.menuElement;
    if (!menuElement) return;
    
    // Clean up existing hover handlers first
    this.cleanupMenuHover();
    
    // Create event handlers
    const mouseenterHandler = () => {
      menuElement.classList.add(this.config.openClass);
    };
    
    const mouseleaveHandler = () => {
      menuElement.classList.remove(this.config.openClass);
    };
    
    // Add event listeners with passive flag for better performance
    menuElement.addEventListener('mouseenter', mouseenterHandler, { passive: true });
    menuElement.addEventListener('mouseleave', mouseleaveHandler, { passive: true });
    
    // Store the handlers for cleanup
    this.menuHoverHandlers = {
      element: menuElement,
      mouseenter: mouseenterHandler,
      mouseleave: mouseleaveHandler
    };
  }
  
  cleanupMenuHover() {
    if (this.menuHoverHandlers) {
      const { element, mouseenter, mouseleave } = this.menuHoverHandlers;
      element.removeEventListener('mouseenter', mouseenter);
      element.removeEventListener('mouseleave', mouseleave);
      this.menuHoverHandlers = null;
    }
  }
  
  setupMenuItemClicks() {
    if (!this.cachedElements.menuItems || this.cachedElements.menuItems.length === 0) return;
    
    // Clean up existing handlers first
    this.cleanupMenuItemClicks();
    
    const menuElement = this.cachedElements.menuElement;
    const menuItemHandlers = new Map();
    
    this.cachedElements.menuItems.forEach(item => {
      const clickHandler = () => {
        if (this.hasHeaderClass()) {
          // Clear any existing timeout
          if (this.menuItemClickTimeout) {
            clearTimeout(this.menuItemClickTimeout);
          }
          
          // Set timeout before adding the class
          this.menuItemClickTimeout = setTimeout(() => {
            if (!menuElement.classList.contains(this.config.openClass)) {
              menuElement.classList.add(this.config.openClass);
            }
          }, this.config.menuItemClickDelay);
        }
      };
      
      menuItemHandlers.set(item, clickHandler);
      item.addEventListener('click', clickHandler);
    });
    
    this.menuItemClickHandlers = menuItemHandlers;
  }
  
  cleanupMenuItemClicks() {
    if (this.menuItemClickHandlers && this.menuItemClickHandlers instanceof Map) {
      this.menuItemClickHandlers.forEach((handler, item) => {
        item.removeEventListener('click', handler);
      });
      this.menuItemClickHandlers.clear();
    }
    
    if (this.menuItemClickTimeout) {
      clearTimeout(this.menuItemClickTimeout);
      this.menuItemClickTimeout = null;
    }
  }
  
  setupDropdownHandlers() {
    if (!this.hasHeaderClass() || !this.cachedElements.dropdownToggles) return;
    
    // Clean up existing handlers first
    this.cleanupDropdownHandlers();
    
    this.cachedElements.dropdownToggles.forEach(toggle => {
      const clickHandler = (event) => {
        event.stopPropagation();
        event.preventDefault();
        
        const dropdown = toggle.closest(this.config.dropdownSelector);
        if (dropdown) {
          this.toggleActiveClasses(dropdown);
          this.updateDropdownAccessibility();
        }
      };
      
      this.dropdownClickHandlers.set(toggle, clickHandler);
      toggle.addEventListener('click', clickHandler);
    });
  }
  
  cleanupDropdownHandlers() {
    if (this.dropdownClickHandlers.size > 0) {
      this.dropdownClickHandlers.forEach((handler, toggle) => {
        toggle.removeEventListener('click', handler);
      });
      this.dropdownClickHandlers.clear();
    }
  }
  
  handleOutsideClick(event) {
    if (event.target.tagName === 'A') return;
    if (!event.target.closest(this.config.dropdownSelector)) return;
    if (!event.target.closest(this.config.submenuToggleSelector)) {
      event.preventDefault();
      event.stopPropagation();
    }
  }
  
  updateDropdownAccessibility() {
    // Only run if hasHeaderClass() is true
    if (!this.hasHeaderClass() || !this.cachedElements.dropdowns) return;
    
    this.cachedElements.dropdowns.forEach(dropdown => {
      const content = dropdown.querySelector(this.config.dropdownContentSelector);
      const button = dropdown.querySelector('button');
      
      // Check if dropdown has all active classes
      const isOpen = this.hasAllActiveClasses(dropdown);
      
      if (content) {
        if (isOpen) {
          content.removeAttribute('inert');
        } else {
          content.setAttribute('inert', '');
        }
      }
      
      if (button) {
        button.setAttribute('aria-expanded', isOpen ? 'true' : 'false');
      }
    });
  }
}


const sidebarNav = new SidebarNavigation().init();

Blog

Trainingen

Een persoon leest een document met de titel "NEN 7510" op een computerscherm, gericht op informatiebeveiliging, in een kantooromgeving met vage figuren zichtbaar op de achtergrond.

Kamerbrief VWS bevestigt: de zorg is doelwit

Op 4 december 2025 stuurde de minister van Volksgezondheid, Welzijn en Sport een uitgebreide beleidsbrief aan de Tweede Kamer over informatieveiligheid in de zorg.

Die brief kwam niet zomaar. Aanleiding was een stapeling van zorgwekkende signalen: het toenemend aantal digitale aanvallen op zorgorganisaties, ernstige datalekken zoals bij Clinical Diagnostics, en de vaststelling dat veel zorgaanbieders de wettelijke normen voor informatiebeveiliging nog altijd onvoldoende naleven.

De zorgsector blijkt structureel kwetsbaar, juist omdat ze zo sterk digitaliseert én intensief samenwerkt in complexe ketens.

De boodschap van de minister is helder: zonder goede beveiliging is er geen vertrouwen, en zonder vertrouwen geen databeschikbaarheid – wat betekent dat passende, digitale zorg onhaalbaar wordt. De brief zet niet alleen de risico’s op een rij, maar wijst ook op de verantwoordelijkheden die rusten op zorgorganisaties en hun bestuurders.

Met de komst van de Cyberbeveiligingswet (NIS2), zwaarder toezicht door de Inspectie Gezondheidszorg en Jeugd en formele taken voor Z-CERT, is een nieuwe fase aangebroken.

De overheid biedt ondersteuning, maar de regie ligt bij de sector zelf.

Een ziekenhuisreceptie met een witte balie, blauwe muuraccenten, een lift en een richtingaanwijzer naar medische zorgfaciliteiten op de eerste verdieping - die zowel zorg als cyberweerbaarheid in een moderne omgeving benadrukt.

1. Dreiging in de zorg groeit snel

Cyberdreiging zorg is geen technisch thema meer dat kan worden gedelegeerd aan een IT‑afdeling.

Cyberdreiging in de zorg raakt direct de bestuurlijke verantwoordelijkheid van zorgorganisaties. Bestuurders, managers en ceo’s krijgen ermee te maken omdat continuïteit van zorg, privacyverplichtingen en toezicht steeds sterker met elkaar zijn verbonden.

Deze dreiging speelt zich af op organisatieniveau en vraagt om sturing, keuzes en prioriteiten. Dat geldt ongeacht omvang, type zorg of digitaliseringsgraad.

In de zorg is informatiebeveiliging onlosmakelijk verbonden met primaire processen. Digitale systemen ondersteunen diagnostiek, planning, communicatie en verantwoording. Zodra deze systemen onder druk komen te staan, ontstaan directe gevolgen voor bedrijfsvoering en bestuurlijke verantwoording.

De dreiging ontwikkelt zich sneller dan veel organisaties bestuurlijk kunnen bijbenen. Niet door gebrek aan intentie, maar door onderschatting van de aard en omvang van het risico.

Cyberaanvallen als bedrijfsrisico

Cyberaanvallen in de zorg moeten worden gezien als een volwaardig bedrijfsrisico, vergelijkbaar met financiële risico’s, personeelskrapte of vastgoedvraagstukken. Het onderscheid tussen “ICT-probleem” en “bestuurlijk probleem” bestaat in de praktijk niet meer.

Bestuurders worden geconfronteerd met risico’s die zich op meerdere niveaus tegelijk manifesteren:

  • Onderbreking van zorgprocessen en planning
  • Reputatieschade richting patiënten, cliënten en ketenpartners
  • Aansprakelijkheid bij onvoldoende beheersing
  • Verscherpt toezicht door toezichthouders
  • Bestuurlijke druk door meldplichten en verantwoording

Deze combinatie maakt dat cyberdreiging structureel thuishoort in risicomanagement en governance. Organisaties die dit niet expliciet zo positioneren, lopen achter de feiten aan.

Van incidentdenken naar structurele druk

Veel zorgorganisaties benaderen digitale incidenten nog als uitzonderingen. Dat perspectief past niet meer bij de huidige realiteit. De dreiging is structureel aanwezig en vormt een constante druk op de organisatie. Dit vraagt om een andere manier van kijken.

Niet het individuele incident is leidend, maar de vraag:

  • In hoeverre is de organisatie ingericht om verstoringen op te vangen
  • Welke afhankelijkheden zijn ontstaan door digitalisering
  • Hoe zichtbaar is digitale weerbaarheid op bestuursniveau

Cyberdreiging zorg dwingt tot structurele keuzes over investeringen, prioriteiten en acceptabele risico’s. Dat gesprek hoort niet incidenteel, maar periodiek plaats te vinden in de bestuurskamer.

Bestuurlijke verantwoordelijkheid verschuift

De positie van bestuurders verandert zichtbaar. Waar informatiebeveiliging eerder vooral werd gezien als ondersteunend, wordt het nu gezien als onderdeel van goed bestuur. Wet- en regelgeving versterken deze verschuiving, maar ook maatschappelijke verwachtingen spelen een rol.

Toezichthouders en partners verwachten dat bestuurders:

  • Weten welke digitale risico’s spelen
  • Aantoonbaar sturen op beheersing
  • Kunnen uitleggen waarom keuzes zijn gemaakt
  • Niet uitsluitend vertrouwen op externe leveranciers

Deze ontwikkeling maakt dat onwetendheid geen verdedigbaar standpunt meer is. Bestuurders hoeven geen technische specialisten te zijn, maar wel risicobewust en besluitvaardig.

Vertrouwen als kwetsbaar kapitaal

Zorgorganisaties opereren op basis van vertrouwen. Vertrouwen van patiënten, cliënten, medewerkers, samenwerkingspartners en financiers. Digitale incidenten tasten dit vertrouwen direct aan, ook wanneer de zorginhoud niet zichtbaar wordt geraakt.

Vertrouwen verdwijnt sneller dan het wordt opgebouwd. Dat heeft gevolgen voor:

  • Bereidheid om gegevens te delen
  • Samenwerking in regionale netwerken
  • Imago van de organisatie
  • Relatie met toezichthouders

Cyberdreiging zorg is daarmee niet alleen een technisch of juridisch risico, maar ook een strategisch reputatierisico. Dit vraagt om een bredere blik dan alleen naleving van regels.

Complexiteit door ketens en afhankelijkheden

Zorg wordt steeds vaker geleverd in netwerken. Gegevensstromen lopen over meerdere organisaties, systemen en leveranciers heen. Die verwevenheid vergroot de kwetsbaarheid.

Bestuurders krijgen te maken met:

  • Afhankelijkheid van externe partijen
  • Beperkte invloed op ketenbeveiliging
  • Onduidelijkheid over verantwoordelijkheden
  • Risico’s die buiten de eigen organisatie ontstaan

Deze context maakt cyberdreiging zorg lastig te beheersen met klassieke interne maatregelen. Het vraagt om bestuurlijke aandacht voor afspraken, samenwerking en ketenrisico’s, ook wanneer die buiten de directe hiërarchie liggen.

Toezicht en handhaving worden zichtbaarder

Toezicht op digitale weerbaarheid in de zorg wordt concreter en actiever.

De IGJ (Inspectie Gezondheidszorg en Jeugd) kijkt nadrukkelijker naar hoe bestuurders omgaan met risico’s rond informatiebeveiliging en privacy. De AP (Autoriteit Persoonsgegevens) toetst strenger op naleving en opvolging.

Voor bestuurders betekent dit:

  • Minder ruimte voor vrijblijvende plannen
  • Meer nadruk op aantoonbaarheid
  • Verantwoordingsvragen op bestuursniveau
  • Toenemende samenhang tussen toezicht en beleid

Cyberdreiging zorg wordt daarmee ook een toezichtsdossier. Niet alleen wat er gebeurt telt, maar ook wat vooraf is geregeld.

Digitale dreiging vraagt bestuurlijke taal

Een belangrijk knelpunt is taal. Digitale risico’s worden vaak technisch geformuleerd, terwijl bestuurlijke besluitvorming vraagt om helderheid over impact, prioriteit en consequenties.

Effectieve sturing ontstaat wanneer:

  • Risico’s worden vertaald naar bedrijfsimpact
  • Scenario’s begrijpelijk zijn voor bestuur en toezicht
  • Keuzes expliciet worden vastgelegd
  • Verantwoordelijkheden duidelijk zijn belegd

Zonder deze vertaalslag blijft cyberdreiging zorg abstract en moeilijk bestuurbaar. Dat vergroot de kans op ad‑hocbeslissingen onder druk.

Informatiebeveiliging als onderdeel van continuïteit

Informatiebeveiliging staat niet los van continuïteit van zorg. Digitale verstoringen hebben direct effect op beschikbaarheid, betrouwbaarheid en planning. Bestuurders die continuïteit serieus nemen, moeten digitale weerbaarheid daarin meenemen.

Dit raakt onder meer:

  • Crisisstructuren en besluitvorming
  • Oefenen van verstoringsscenario’s
  • Afstemming met externe partijen
  • Communicatie richting stakeholders

Cyberdreiging zorg laat zien dat continuïteit niet alleen fysiek of organisatorisch is, maar ook digitaal.

Bestuurlijke keuzes worden zichtbaar

De manier waarop een zorgorganisatie omgaat met cyberdreiging laat zien hoe bestuur en management omgaan met risico’s in brede zin. Niet alles is te voorkomen, maar keuzes worden zichtbaar in voorbereiding, prioritering en transparantie.

Organisaties die wachten tot iets misgaat, worden ingehaald door realiteit en toezicht. Organisaties die cyberdreiging structureel agenderen, bouwen aan bestuurlijke wendbaarheid en geloofwaardigheid.

De dreiging gaat niet meer weg.

De vraag verschuift naar hoe organisaties ermee omgaan, welke keuzes zij maken en hoe zij daar verantwoording over afleggen.

Een man en een vrouw zitten tegenover elkaar aan een tafel in een modern kantoor; de man gebruikt een laptop terwijl de vrouw glimlacht, en bespreekt de continuïteit van zorg en de naleving van NEN 7510 normen.

2. Naleving van normen blijft achter

NEN 7510 zorg is voor veel bestuurders een bekende naam, maar zelden een actief stuurinstrument. NEN 7510 zorg verschijnt vaak pas op de agenda wanneer toezicht zich aandient of wanneer een incident vragen oproept.

Toch vormt NEN 7510 zorg het formele fundament onder informatiebeveiliging in de zorg en daarmee onder bestuurlijke verantwoordelijkheid. De achterblijvende naleving is geen randverschijnsel, maar een structureel patroon dat zichtbaar is in vrijwel alle zorgsegmenten.

De kern van het probleem zit niet in onwil, maar in positionering.

Normen worden nog te vaak gezien als technische checklists of certificeringstrajecten, terwijl ze bedoeld zijn als bestuurlijk raamwerk voor risicobeheersing. Daardoor ontstaat een kloof tussen formele verplichtingen en dagelijkse praktijk.

Normenkaders als bestuurlijk vraagstuk

Informatiebeveiligingsnormen in de zorg zijn geen vrijblijvende richtlijnen. Ze leggen vast hoe organisaties moeten omgaan met risico’s rond gegevensverwerking, continuïteit en betrouwbaarheid. Wanneer naleving tekortschiet, raakt dat direct aan governance.

Bestuurders krijgen hiermee te maken op meerdere niveaus:

  • Aanspreekbaarheid door toezichthouders
  • Verwachtingen van samenwerkingspartners
  • Verantwoordingsdruk richting cliënten en financiers
  • Interne sturing en prioritering

Het normenkader fungeert daarmee als meetlat voor professioneel bestuur. Onvoldoende naleving wordt steeds vaker gezien als tekortschietende beheersing.

Waarom naleving structureel achterblijft

De oorzaken van achterblijvende naleving zijn divers en vaak organisatiebreed. Het gaat zelden om één ontbrekende maatregel, maar om samenhang.

Veelvoorkomende bestuurlijke oorzaken:

  • Onvoldoende eigenaarschap op directieniveau
  • Versnipperde verantwoordelijkheden
  • Afhankelijkheid van externe partijen
  • Onderschatting van inspanning en doorlooptijd

Daarbij speelt mee dat normen abstract kunnen overkomen. Zonder vertaling naar concrete keuzes blijven ze op papier bestaan, terwijl de praktijk zich anders ontwikkelt.

Toezicht maakt verschillen zichtbaar

Toezicht op informatiebeveiliging in de zorg is niet uniform, maar wel consistent in boodschap. De IGJ (Inspectie Gezondheidszorg en Jeugd) kijkt nadrukkelijk naar de mate waarin normen zijn ingebed in beleid, sturing en verantwoording.

Het gaat niet alleen om documenten, maar om aantoonbare werking.

Voor bestuurders betekent dit dat:

  • Beleidsstukken alleen niet voldoende zijn
  • Besluitvorming herleidbaar moet zijn
  • Verbeteracties worden opgevolgd
  • Verantwoordelijkheden duidelijk zijn vastgelegd

Toezicht legt daarmee bloot of normen daadwerkelijk worden gebruikt als stuurmiddel.

Certificering is geen eindpunt

Een hardnekkig misverstand is dat certificering gelijkstaat aan naleving. Certificering kan ondersteunen, maar vervangt geen actieve sturing. Normen vragen om continu onderhoud, evaluatie en bijstelling.

Organisaties die uitsluitend sturen op audits lopen het risico dat:

  • Verbeteringen tijdelijk zijn
  • Afwijkingen blijven bestaan
  • Bestuur geen actueel beeld heeft
  • Schijnzekerheid ontstaat

Naleving vraagt om cyclisch werken, niet om een eenmalig traject.

Kleine en middelgrote organisaties onder druk

Voor kleinere zorgorganisaties is naleving vaak extra complex. Beperkte capaciteit, meerdere rollen per medewerker en afhankelijkheid van leveranciers maken structurele borging lastig. Dat neemt de verplichting niet weg, maar vraagt wel om realistische keuzes.

Bestuurlijk gezien betekent dit:

  • Bewuste prioritering van risico’s
  • Heldere afspraken met leveranciers
  • Gebruikmaken van beschikbare hulpmiddelen
  • Acceptatie dat niet alles tegelijk kan

Het normenkader biedt ruimte voor proportionaliteit, maar die ruimte moet wel expliciet worden benut en onderbouwd.

Leveranciers bepalen mede de naleving

Een groot deel van informatieverwerking in de zorg vindt plaats buiten de directe invloedssfeer van de organisatie. Applicaties, hosting en beheer zijn vaak uitbesteed. Toch blijft de zorgorganisatie verantwoordelijk voor naleving van normen.

Dit vraagt om bestuurlijke aandacht voor:

  • Contractuele afspraken
  • Verdeling van verantwoordelijkheden
  • Inzicht in afhankelijkheden
  • Escalatie bij tekortkomingen

Zonder deze aandacht ontstaat een papieren naleving die in de praktijk niet standhoudt.

Normen als hulpmiddel voor besluitvorming

Wanneer normen goed worden gebruikt, ondersteunen ze bestuurders bij lastige keuzes. Ze bieden een gemeenschappelijke taal om risico’s te bespreken en afwegingen vast te leggen.

Voorbeelden van vragen die normen helpen structureren:

  • Welke risico’s worden geaccepteerd en waarom
  • Waar zijn aanvullende maatregelen nodig
  • Welke investeringen zijn verdedigbaar
  • Hoe wordt voortgang gevolgd

Op die manier verschuift de norm van verplicht nummer naar bestuurlijk hulpmiddel.

Aantoonbaarheid wordt steeds belangrijker

In de zorg telt niet alleen wat is geregeld, maar ook wat aantoonbaar is. Bestuurders moeten kunnen laten zien dat keuzes bewust zijn gemaakt en opgevolgd. Dat geldt richting toezicht, maar ook intern.

Aantoonbaarheid vraagt om:

  • Vastgelegde besluiten
  • Duidelijke eigenaarschap
  • Periodieke evaluatie
  • Transparante rapportage

Zonder deze elementen blijft naleving kwetsbaar.

Privacy en informatiebeveiliging zijn verweven

Normen voor informatiebeveiliging staan niet los van privacyverplichtingen. In de praktijk lopen deze verantwoordelijkheden door elkaar. Bestuurlijke keuzes op het ene vlak hebben direct effect op het andere.

Dat betekent dat:

  • Privacy geen los dossier is
  • Beveiligingskeuzes impact hebben op gegevensbescherming
  • Verantwoordelijkheden samenkomen op bestuursniveau

Deze verwevenheid maakt integrale sturing noodzakelijk.

Van compliance naar volwassenheid

De grootste uitdaging is de stap van minimale compliance naar volwassen risicobeheersing. Zolang normen worden gezien als externe druk, blijft naleving achter. Pas wanneer ze worden ingezet als intern kompas, ontstaat beweging.

Organisaties die hierin investeren:

  • Hebben beter zicht op risico’s
  • Kunnen sneller bijsturen
  • Zijn beter voorbereid op toezicht
  • Bouwen vertrouwen op bij partners

De druk groeit, vanuit toezicht en ketens.

Naleving van normen blijft daarmee geen administratieve verplichting, maar een zichtbaar onderdeel van professioneel bestuur.

Een hardcover boek getiteld "Cybersecurity" met een schildlogo ligt op een tafel; twee mensen zijn vaag op de achtergrond en lijken te discussiëren over informatiebeveiliging of naleving van ISO 27001.

3. Nieuwe wetgeving verandert alles

Cyberbeveiligingswet zorg betekent dat digitale risico’s in de zorgsector voortaan wettelijk zijn verankerd. Daarmee verschuift informatiebeveiliging van een interne verantwoordelijkheid naar een formele verplichting onder publiek toezicht.

Zorgorganisaties vallen niet meer alleen onder sectorale normen, maar krijgen te maken met brede wetgeving die toezicht, aansprakelijkheid en ondersteuning structureel anders regelt.

Deze ontwikkeling komt voort uit de Europese NIS2-richtlijn en wordt in Nederland vastgelegd in de Cyberbeveiligingswet (Cbw). De wet geldt voor een groot deel van de zorgsector en stelt eisen aan hoe organisaties omgaan met digitale weerbaarheid, meldingsplichtige incidenten en verantwoord bestuur.

Juridische verantwoordelijkheid wordt explicieter

Bestuurders in de zorg zijn vanaf de inwerkingtreding van de Cbw niet alleen bestuurlijk verantwoordelijk, maar ook juridisch aanspreekbaar. De wet introduceert expliciete verplichtingen voor bestuur en toezicht.

Onderdeel van deze verantwoordelijkheid:

  • Bestuurders moeten voldoende kennis hebben van cyberbeveiliging
  • Opleiding en training worden verplicht
  • Aansprakelijkheid bij nalatigheid is wettelijk vastgelegd
  • Besluitvorming over risico’s moet aantoonbaar zijn

Dat vraagt om meer dan alleen reactief gedrag. Organisaties die onvoldoende voorbereid zijn, lopen het risico op boetes, ingrepen of juridische claims.

Meldplicht incidenten wordt een toetsmoment

De meldplicht voor significante incidenten wordt onder de Cbw wettelijk verankerd. Daarmee verandert het karakter van incidentmanagement. Het wordt niet langer alleen een interne zorgplicht, maar ook een toetsmoment richting toezichthouders.

De meldplicht betekent concreet:

  • Significante verstoringen moeten worden gemeld bij het sectorale CSIRT
  • Niet melden of te laat melden kan leiden tot sancties
  • De kwaliteit van de melding wordt meegewogen
  • Structurele opvolging wordt verwacht

Organisaties moeten dus beschikken over een meldstructuur die past binnen hun governance en crisisstructuur. Incidenten worden daarmee ook bestuurlijk relevant.

Toezicht krijgt een andere lading

Waar toezicht op informatiebeveiliging in de zorg eerder indirect verliep via normen zoals NEN 7510, introduceert de Cbw een duidelijk en wettelijk kader. De IGJ (Inspectie Gezondheidszorg en Jeugd) wordt aangewezen als toezichthouder binnen de zorgsector.

De gevolgen van dit formele toezicht:

  • Toetsing vindt plaats op basis van wet, niet alleen op norm
  • Toezichthouders kunnen sancties opleggen
  • Structurele audits en controles zijn mogelijk
  • Herstelmaatregelen kunnen worden afgedwongen

De verhouding tussen zorgorganisatie en toezichthouder verandert hierdoor fundamenteel. Niet alleen intentie telt, maar vooral aantoonbaar handelen.

Ketenverantwoordelijkheid wordt juridisch afdwingbaar

Digitale risico’s beperken zich niet tot de eigen organisatie. De Cbw benoemt expliciet dat ook toeleveranciers, ICT-partijen en andere ketenpartners binnen het risicobeeld moeten worden meegenomen.

Bestuurders moeten zorgen dat:

  • Leveranciers voldoen aan normen en verplichtingen
  • Ketenafspraken schriftelijk zijn vastgelegd
  • Inkoopprocedures rekening houden met informatiebeveiliging
  • Verantwoordelijkheden bij uitbesteding helder zijn geregeld

Afhankelijkheden zijn geen verzachtende omstandigheden meer. Het ontbreken van grip op leveranciers kan worden aangemerkt als nalatig bestuur.

Ondersteuning via het sectorale CSIRT

Naast verplichtingen brengt de wet ook rechten met zich mee. Organisaties in de zorg die onder de Cbw vallen, krijgen recht op ondersteuning via het sectorale Computer Security Incident Response Team.

In de zorg is deze rol belegd bij Z-CERT. Z-CERT staat voor Zorg Computer Emergency Response Team. Het is het sectorale expertisecentrum voor cybersecurity in de zorg in Nederland. De taken van Z-CERT omvatten:

  • Dreigingsinformatie en waarschuwingen verspreiden
  • Ondersteuning bij incidentanalyse en herstel
  • Onderhoud van kennisbanken en richtlijnen
  • Advies over implementatie van maatregelen

Deze ondersteuning is beschikbaar, maar vraagt actieve participatie. Organisaties die zich niet aansluiten of niet reageren op waarschuwingen lopen risico’s die voorkomen hadden kunnen worden.

Aansluiting op bestaande normen is vereist

De Cbw werkt aanvullend op bestaande normen zoals NEN 7510 en ISO 27001. Wie nu al werkt volgens deze normen, heeft een voorsprong. Maar dat betekent niet dat deze normen automatisch voldoen aan de eisen uit de wet.

Verschillen zitten onder meer in:

  • De juridische status van verplichtingen
  • De specifieke meldplicht en rapportage-eisen
  • De expliciete betrokkenheid van bestuurders
  • De reikwijdte richting keten en leveranciers

Naleving van normen wordt dus geen alternatief voor wettelijke naleving, maar een onderdeel van de totale vereisten.

Inwerkingtreding dwingt tot voorbereiding

De verwachte inwerkingtreding van de Cbw ligt in het tweede kwartaal van 2026. Dat lijkt ver weg, maar de voorbereiding vraagt tijd, capaciteit en aandacht op strategisch niveau.

Voorbereiding vereist:

  • Herijking van risicobeoordelingen
  • Aanpassing van governance en besluitvorming
  • Inrichting van meldprocessen en escalatie
  • Interne training en bewustwording op directieniveau

Organisaties die wachten tot de wet van kracht is, zullen moeite hebben om op tijd te voldoen aan alle eisen. Tijdige voorbereiding is daarom noodzakelijk.

Bestuurders worden meetbaar geacht

De wet maakt het gedrag en de keuzes van bestuurders expliciet toetsbaar. Er wordt niet alleen gekeken of iets is geregeld, maar ook of het bestuur daar actief op heeft gestuurd.

Dit betekent dat:

  • Onwetendheid of passiviteit geen verdedigbare positie meer is
  • Bestuurlijke besluiten moeten worden vastgelegd en gemotiveerd
  • Externe toetsing zal plaatsvinden op bestuursniveau
  • Training en bewustzijn niet optioneel zijn

Bestuurders worden geacht digitaal volwassen te zijn in hun sturing. De lat ligt hoger dan ooit.

Vooruitkijken is geen luxe meer

Wetgeving zoals de Cbw legt de nadruk op proactief handelen. Besturen op basis van incidenten of externe druk is niet meer houdbaar. Digitale weerbaarheid moet worden geïntegreerd in beleid, strategie en risicomanagement.

Nadenken over de impact van toekomstige wetgeving:

  • Maakt organisaties wendbaarder
  • Versterkt de interne besluitvorming
  • Vergroot vertrouwen bij ketenpartners
  • Vermindert risico op incidenten en sancties

Zorgorganisaties die wetgeving alleen formeel volgen, lopen achter. Organisaties die wetgeving gebruiken als sturingsinstrument, bouwen aan duurzame digitale weerbaarheid.

Een persoon leest een document met de titel "NEN 7510" op een computerscherm, gericht op informatiebeveiliging, in een kantooromgeving met vage figuren zichtbaar op de achtergrond.

4. Gedrag maakt het verschil

Bewustwording informatiebeveiliging zorg is geen bijzaak. De mate waarin medewerkers risico’s herkennen, opvolging geven aan beleid en veilig omgaan met systemen bepaalt in grote mate hoe effectief technische en organisatorische maatregelen zijn.

Organisaties investeren in systemen, normen en processen, maar gedrag bepaalt of het allemaal functioneert zoals bedoeld.

Gedrag in de zorgorganisatie is de verbindende laag tussen beleid en praktijk. Bestuurders kunnen beleidsdocumenten goedkeuren, en systemen kunnen conform norm worden ingericht, maar als medewerkers klikken op schadelijke links, wachtwoorden delen of systemen open laten staan, valt alle techniek weg.

Informatiebeveiliging is dus niet alleen een ICT-aangelegenheid of een complianceverplichting, maar een structureel gedragsvraagstuk dat bestuurlijk moet worden aangestuurd.

Onveilig gedrag is nog steeds de grootste oorzaak

De meeste datalekken in de zorg ontstaan niet door hackers, maar door menselijk handelen. Dit varieert van verkeerd geadresseerde e-mails tot onzorgvuldige omgang met patiëntgegevens. Zelfs in organisaties waar technisch alles op orde is, blijven menselijke fouten de zwakke schakel.

De belangrijkste gedragsrisico’s binnen zorginstellingen zijn:

  • Gebrek aan alertheid bij phishing of frauduleuze communicatie
  • Onvoldoende naleving van basisafspraken (zoals schermvergrendeling)
  • Onbedoeld delen van patiëntinformatie via onveilige kanalen
  • Gebrek aan kennis over beveiligingsinstellingen bij het gebruik van nieuwe software

Bestuurlijke aandacht is nodig omdat deze risico’s niet vanzelf verdwijnen. Gedrag verandert niet door beleid alleen, maar door gerichte sturing, herhaling en voorbeeldgedrag.

Traditionele trainingen zijn onvoldoende

Eenmalige e-learningmodules of standaard awarenesssessies leveren zelden blijvende gedragsverandering op. Ze zijn vaak te algemeen, te vrijblijvend en sluiten niet aan bij de werkpraktijk van zorgmedewerkers.

Effectieve bewustwording vraagt om:

  • Continue en praktijkgerichte interventies
  • Verschillende formats zoals simulaties, microlearning en coaching
  • Inbedding in dagelijkse werkprocessen
  • Aansluiting bij rollen en verantwoordelijkheden

Het doel is niet kennisoverdracht, maar gedragsverandering. Dat vereist dat organisaties investeren in programmatische, cyclische benaderingen – niet in losse acties.

Voorbeeldgedrag begint bij de top

Bestuurders, managers en teamleiders geven het signaal af hoe serieus informatiebeveiliging genomen wordt. Als veiligheidsregels consequent worden toegepast en overtredingen besproken, ontstaat normbesef. Als leidinggevenden zelf slordig omgaan met wachtwoorden of beleid omzeilen, is elke boodschap daarover ongeloofwaardig.

Voorbeeldgedrag op bestuurlijk niveau laat zich vertalen in:

  • Actieve deelname aan trainingen of simulaties
  • Duidelijke communicatie over prioriteiten
  • Zichtbare betrokkenheid bij incidentafhandeling
  • Integratie van informatiebeveiliging in overleggen en jaarplannen

De mate waarin dit gebeurt, bepaalt in belangrijke mate de cultuur rond veilig gedrag.

Praktische hulpmiddelen beschikbaar voor ondersteuning

Organisaties hoeven niet zelf het wiel uit te vinden. Er bestaan diverse initiatieven en tools die gericht zijn op gedragsverandering specifiek voor de zorg.

Voorbeelden hiervan:

Toegang tot deze middelen is vaak gratis. Wat ontbreekt is niet het aanbod, maar de integratie in het werkproces. Organisaties die dat wel doen, versterken hun weerbaarheid op structurele basis.

Risicobewustzijn verschilt per functiegroep

Niet alle medewerkers hebben dezelfde toegang tot systemen of werken met dezelfde gegevens. Dat betekent ook dat risicobewustzijn niet uniform is. Een algemeen bewustwordingsprogramma doet daardoor zelden recht aan de praktijk.

Effectieve programma’s differentiëren tussen:

  • Zorgprofessionals aan het bed of in de wijk
  • Administratief personeel met toegang tot dossiers
  • Technische dienst of facilitair personeel
  • Management en staf

Elke groep heeft andere risico’s, andere leerbehoeften en andere triggers voor gedrag. Zonder deze differentiatie blijven programma’s vaag en ineffectief.

Gebrek aan feedback ondermijnt gedragsverandering

In veel organisaties ontbreekt structurele terugkoppeling op veilig of onveilig gedrag. Incidenten worden wel geregistreerd, maar niet besproken. Positief gedrag wordt niet herkend of beloond. Dat maakt het lastig om cultuur te veranderen.

Gedrag wordt pas structureel beïnvloed als:

  • Incidenten worden besproken met de betrokken teams
  • Successen zichtbaar worden gemaakt
  • Teams inzicht krijgen in hun eigen prestaties
  • Informatiebeveiliging onderdeel is van het functioneringsgesprek

Zonder feedback blijft informatiebeveiliging abstract en afstandelijk.

Informele cultuur heeft invloed

In zorgorganisaties is sprake van een sterke informele werkcultuur. Collega’s helpen elkaar, regels worden soms pragmatisch toegepast. Hoewel deze flexibiliteit essentieel is voor goede zorg, kan het ook leiden tot het negeren van veiligheidsregels als die ‘onhandig’ zijn.

Voorbeelden:

  • Inloggen op elkaars account om ‘even snel’ iets te regelen
  • Dossiers open laten staan voor de nachtdienst
  • Patiëntgegevens mondeling bespreken in openbare ruimtes

Dit soort situaties vraagt niet om strengere regels, maar om bespreekbaarheid. Organisaties die dit gedrag herkennen én bespreekbaar maken, zetten echte stappen in bewustwording.

Meten van gedrag maakt verschil zichtbaar

Gedrag is lastig te sturen zonder inzicht. Veel zorginstellingen meten wel incidenten, maar niet structureel het gedrag van medewerkers. Daardoor blijft onduidelijk of interventies effect hebben.

Mogelijkheden om gedrag zichtbaar te maken:

  • Periodieke gedragsmetingen via enquêtes of interviews
  • Analyse van herhaalde fouten of terugkerende incidenten
  • Rapportages van phishing-simulaties of awarenessmodules
  • Observaties in de praktijk

Meten is niet bedoeld om te controleren, maar om te verbeteren. Bestuurders die zicht hebben op gedrag, kunnen beter sturen op cultuur.

Gedrag bepaalt de werkelijke weerbaarheid

Informatiebeveiliging in zorginstellingen bestaat uit techniek, beleid en mensen. De mens is daarin de enige variabele die niet programmeerbaar is. Organisaties met technisch sterke oplossingen zijn niet automatisch veilig.

Gedrag maakt het verschil tussen een plan en een praktijk die werkt.

In een sector waar vertrouwen, zorgvuldigheid en continuïteit centraal staan, is het ondenkbaar dat veilig gedrag niet structureel wordt gestuurd. Gedragsbeïnvloeding is daarom niet optioneel, maar essentieel voor organisaties die informatiebeveiliging daadwerkelijk willen borgen.

Een persoon kijkt naar een computerscherm met code en de gemarkeerde tekst "information security officer" tussen de syntaxis van programmeertaal, wat de focus op informatiebeveiliging en naleving van ISO 27001 weerspiegelt.

5. Leveranciers en technologie vormen risico

Cloudgebruik zorgsector levert voordelen op, maar introduceert ook nieuwe kwetsbaarheden. Zorgorganisaties zijn in toenemende mate afhankelijk van externe partijen voor hun informatiesystemen, digitale communicatie en gegevensopslag.

Daarmee komt een deel van de informatiebeveiliging buiten de directe invloedssfeer van de organisatie te liggen, terwijl de verantwoordelijkheid wettelijk blijft rusten op de zorgaanbieder zelf.

Technologische ontwikkelingen zoals kunstmatige intelligentie, externe dataopslag, nieuwe encryptiemethoden en keteninfrastructuren veranderen het risicolandschap snel.

Bestuurders moeten keuzes maken over inrichting, samenwerking en continuïteit. Deze keuzes kunnen niet langer alleen op basis van gemak of kostenefficiëntie worden genomen.

Externe leveranciers zijn onderdeel van de eigen verantwoordelijkheid

Leveranciers van EPD-systemen, portalen, communicatieoplossingen of ICT-beheer hebben directe toegang tot kritieke gegevens of systemen. De wetgeving verplicht zorgaanbieders om in te staan voor de beveiliging van deze keten.

Dat betekent:

  • Verantwoordelijkheid blijft bij de zorgaanbieder, ook bij uitbesteding
  • Leverancierskeuze moet gebaseerd zijn op toetsbare beveiligingscriteria
  • Eisen uit wetgeving en normen moeten contractueel worden vastgelegd
  • Periodieke toetsing en audits zijn nodig om naleving te controleren

Zonder contractuele borging ontstaat een risico dat pas zichtbaar wordt bij incidenten. Dan blijkt vaak dat toezicht, logging of herstelcapaciteit ontbreken.

Clouddiensten verhogen afhankelijkheid

Cloudtoepassingen bieden schaalvoordelen, maar maken organisaties ook afhankelijk van de beschikbaarheid, compliance en support van de dienstverlener. Voor zorgorganisaties betekent dit dat zij minder controle hebben over fysieke locaties, infrastructuur en back-ups.

Belangrijke aandachtspunten:

  • Waar worden gegevens opgeslagen (jurisdictie en data-eigendom)
  • Hoe wordt versleuteling toegepast en beheerd
  • Wat zijn de voorwaarden bij storingen, updates of migratie
  • Welke exit-strategie is beschikbaar bij beëindiging van de samenwerking

Zonder duidelijke afspraken over deze aspecten ontstaat een vorm van ‘vendor lock-in’ waarbij overstappen technisch, juridisch en operationeel vrijwel onmogelijk wordt.

AI en automatisering versterken onbekende risico’s

Kunstmatige intelligentie wordt steeds vaker toegepast voor triage, planning, dossiervorming en communicatie. Tegelijkertijd is de controle op dataverzameling, bias en beveiliging van AI-modellen nog beperkt.

Mogelijke risico’s bij gebruik van AI in de zorg:

  • Onbedoelde blootstelling van gevoelige gegevens via publieke modellen
  • Slecht beveiligde of ongetrainde algoritmen in commerciële software
  • Gebrek aan transparantie over gegevensverwerking en beslislogica
  • Misbruik van AI door derden voor phishing of gegevensmanipulatie

Organisaties moeten duidelijke kaders stellen voor de inzet van AI, ook als de technologie via leveranciers wordt aangeboden. Zonder dit toezicht kunnen AI-toepassingen een nieuwe bron van kwetsbaarheid vormen.

Nieuwe encryptiestandaarden zijn nodig

Postquantum cryptografie is in opkomst vanwege de verwachte kracht van toekomstige quantumcomputers. Hoewel dit nu nog theoretisch lijkt, is het risico van ‘nu stelen, straks ontsleutelen’ al actueel. Gegevens die nu worden onderschept kunnen in de toekomst alsnog leesbaar worden.

Bestuurlijke aandacht is vereist voor:

  • Inventarisatie van informatie die lang vertrouwelijk moet blijven
  • Toepassing van versleuteling die aanpasbaar is in de tijd
  • Eisen aan apparatuur of leveranciers die afhankelijk zijn van langdurige encryptiestandaarden

Dit vraagt niet direct om ingrijpende technische vernieuwing, maar wel om visie en beleid op de langere termijn. Het ontbreken van dit perspectief vergroot de toekomstige kwetsbaarheid.

End-to-end encryptie wordt nieuwe norm

Bij digitale communicatie binnen de zorg wordt steeds vaker geëist dat alleen de verzender en ontvanger toegang hebben tot de inhoud. Dit zogeheten end-to-end encryptie sluit derden, zoals e-mailproviders of softwareleveranciers, uit.

Invoering hiervan vereist:

  • Afspraken over welke systemen hieraan moeten voldoen
  • Technische aanpassing van mail-, chat- en overdrachtsdiensten
  • Certificering van afzender en ontvanger via betrouwbare kanalen
  • Eisen aan leveranciers en IT-partners om dit te ondersteunen

Zorgaanbieders moeten bij nieuwe IT-inkopen standaard deze eisen stellen. Anders wordt er gekozen voor oplossingen die binnen korte tijd verouderd of onacceptabel zijn.

Ketenrisico’s moeten actief beheerd worden

De zorgsector is sterk verweven: gegevens worden gedeeld met andere zorgaanbieders, laboratoria, verzekeraars, softwareleveranciers en onderzoeksinstellingen. Elke partij kan een toegangspunt worden voor aanvallers.

Ketenbeheer betekent:

  • Inventarisatie van alle externe verbindingen en systemen
  • Vastlegging van wie waarvoor verantwoordelijk is
  • Periodieke evaluatie van beveiligingsniveaus in de keten
  • Standaardisering van eisen op sectorniveau

Zonder dit overzicht ontstaan blinde vlekken. In complexe ketens worden incidenten vaak pas opgemerkt nadat schade is ontstaan, of zijn ze moeilijk te herleiden naar de oorzaak.

Digitale autonomie wordt strategisch thema

De keuze voor technologie en leveranciers raakt ook de strategische zelfstandigheid van een zorgorganisatie. Wie volledig afhankelijk is van niet-Nederlandse of gesloten systemen, kan bij geopolitieke spanningen, marktverstoringen of productstop zonder opties komen te zitten.

Digitale autonomie vereist:

  • Inzicht in wie de technologie beheert en bezit
  • Keuze voor open standaarden waar mogelijk
  • Vermogen om tijdig over te stappen van leverancier
  • Beoordeling van risico’s bij contractverlenging of investeringen

Strategische risico’s zijn minder zichtbaar dan technische gebreken, maar hebben vaak grotere gevolgen op lange termijn. Ze moeten onderdeel zijn van bestuursbesluiten over ICT.

Aansprakelijkheid verschuift ook juridisch

De wet stelt dat bestuurders verantwoordelijkheid dragen voor risico’s in de keten. Dat betekent dat onvoldoende sturing op leveranciers, ontbrekende eisen of gebrekkige contracten niet alleen risico’s zijn, maar ook juridische gevolgen kunnen hebben bij incidenten.

Bestuurlijke gevolgen:

  • Persoonlijke aansprakelijkheid bij nalatigheid
  • Toegenomen bewijslast richting toezichthouders
  • Juridische claims vanuit cliënten of ketenpartners
  • Verlies van vertrouwen van financiers of overheid

Beheersing van technologie en leveranciers is daarmee niet alleen een operationeel aandachtspunt, maar een vast onderdeel van risicomanagement en compliance.

Technologie mag niet sneller bewegen dan beleid

Nieuwe oplossingen worden vaak geïntroduceerd omdat ze operationeel gemak bieden. Maar zonder duidelijke beleidskaders kunnen deze oplossingen onbedoeld risico’s introduceren die niet passen bij de context van zorginstellingen.

Daarom is nodig:

  • Voorafgaande risicoanalyse bij nieuwe tools of leveranciers
  • Betrokkenheid van informatiebeveiliging bij inkoop en innovatie
  • Toetsing aan bestaande normen en wetgeving
  • Bewustzijn van de wisselwerking tussen gemak en veiligheid

Zorgorganisaties die beleid achteraf proberen aan te passen op bestaande technologie lopen structureel achter de feiten aan.

Een persoon met een gele pen vult een zorgformulier in op papier, terwijl een andere persoon in de buurt zit.

Samengevat

Informatiebeveiliging in de zorg wordt niet langer alleen bepaald door interne keuzes, maar steeds meer door externe druk: wetgeving, toezicht, ketenverantwoordelijkheid en toenemende dreigingen.

De Kamerbrief van de minister van VWS laat zien dat de digitale weerbaarheid van de zorgsector achterloopt, terwijl de dreigingen zich versnellen en verdiepen. Tegelijkertijd wordt duidelijk dat de overheid stevig inzet op ondersteuning, maar dat de zorgsector zélf aan zet is om maatregelen structureel te borgen.

1. Bestuurlijke verantwoordelijkheid wordt wettelijk én zichtbaar afgedwongen
De Cyberbeveiligingswet (implementatie van NIS2) brengt concrete verplichtingen, toezicht en bestuurlijke aansprakelijkheid. Bestuurders worden geacht te sturen op digitale veiligheid als integraal onderdeel van zorgcontinuïteit.

2. De zorg is structureel kwetsbaar in een steeds agressiever dreigingslandschap
De zorgsector is aantoonbaar één van de meest aangevallen sectoren in Europa. Dreigingen worden complexer, ketens worden doelwit, en de impact op dienstverlening en privacy is direct en ernstig.

3. Naleving van normen zoals NEN 7510 blijft structureel achter
Ondanks wettelijke verplichtingen blijft de implementatie van basale beveiligingsnormen bij veel zorgaanbieders onder de maat. De IGJ intensiveert toezicht en zal naleving de komende jaren expliciet toetsen.

4. Gedrag van medewerkers bepaalt de effectiviteit van elke maatregel
Programma’s zoals Informatieveilig gedrag in de zorg en Kickstart IB&P onderstrepen dat bewustwording en gedragsverandering randvoorwaarden zijn voor succesvolle informatiebeveiliging. Een plan op papier zonder gedragssturing is een gemiste investering.

5. Leveranciers en technologie vereisen actieve regie vanuit de zorgorganisatie
Cloudoplossingen, AI en gegevensuitwisseling over netwerken als het LDN maken organisaties afhankelijk van externe partijen. Toch blijft de juridische en praktische verantwoordelijkheid volledig bij de zorgaanbieder liggen.

6. Ondersteuning is beschikbaar, maar geen vervanging voor eigen regie
VWS stelt middelen en programma’s beschikbaar, van quickscans tot trainingen en handreikingen. Toch zal het effect pas zichtbaar worden als organisaties dit integreren in hun eigen risicosturing en strategisch beleid.

7. Digitale weerbaarheid is van groot belang
Zonder veilige toegang tot betrouwbare gegevens is passende zorg onmogelijk. Informatiebeveiliging is daarom onlosmakelijk verbonden met de kwaliteit en beschikbaarheid van zorg.

Meer weten
0

Subtotal