/** START: Legacy (Divi) Menu **/
/** CAN BE REMOVED ONCE the Max MegaMenus are live **/
body header #top-nav .et_pb_menu__logo a { color: var(--page-logo-color) }
body.has-hero header #top-nav .et_pb_menu__logo a { color: #fff; }
/** END: Legacy (Divi) Menu **/

/** START: (NEW) Variable based Menus **/
/** Baseline Noom Logo **/
:root {
    --noom-icon-svg-download: url('data:image/svg+xml,<svg width="13" height="14" viewBox="0 0 13 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.01831 9.13626L1.01831 11.595C1.01831 11.9676 1.15879 12.325 1.40883 12.5885C1.65888 12.852 1.99802 13 2.35164 13H10.3516C10.7053 13 11.0444 12.852 11.2945 12.5885C11.5445 12.325 11.685 11.9676 11.685 11.595V9.13626M6.35239 1V8.96164M6.35239 8.96164L9.40001 5.91953M6.35239 8.96164L3.30477 5.91953" stroke="black" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    --noom-icon-svg-arrow: url('data:image/svg+xml,<svg width="12" height="11" viewBox="0 0 12 11" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.66667 10.8333C6.66667 7.16658 10.3333 5.49992 12 5.49992C10.3333 5.49992 6.66667 3.83325 6.66667 0.166584" stroke="black" stroke-width="1.5"/><path d="M9.66699 5.5L0.000326097 5.5" stroke="black" stroke-width="1.5"/></svg>');
}

body header .noom-logo {
    height: 75px;
}
body:not(.has-hero):not(.home) header {
    background-color: var(--noom-desktop-nav-background);
}

body header .noom-logo .noom-logo-span {
    background-color: var(--page-logo-color);
    -webkit-mask-image: var(--page-primary-logo);
    mask-image: var(--page-primary-logo);
    width: var(--page-primary-logo-width);
    height: 100%;
    display: inline-block;
    content: "";
    mask-repeat: no-repeat; 
    mask-size: contain; 
    mask-position: center; 
}
body.has-hero header .noom-logo .noom-logo-span {
    background-color: #fff;
}

/** B2B: Noom Health **/
body.page-health header .et_pb_section--with-menu, 
body.primary-parent-health header .et_pb_section--with-menu,
body.single-b2b_resource header .et_pb_section--with-menu { border: none !important; }

body.primary-parent-health {
    background-color: var(--noom-off-white) !important;
}
body.parent-noom-health header .noom-logo .noom-logo-span,
body.primary-parent-health header .noom-logo .noom-logo-span,
body.single-b2b_resource header .noom-logo .noom-logo-span {
    -webkit-mask-image: var(--noom-logo-health);
    mask-image: var(--noom-logo-health);
    width: var(--noom-logo-health-width);
}
/** END: (NEW) Variable based Menus **/


/** START: Header Nav links & icons **/
header a.noom-btn-link {
    color: var(--noom-black);
    border-bottom: 2px solid var(--noom-black);
    padding-bottom: 5px;
    font-weight: bold;
}

.noom-icon-download:after {
    content: '';
    display: inline-block;
    width: 16px;
    height: 18px;
    margin-left: 10px;
    margin-top: -5px;
    vertical-align: middle;
    background-color: currentColor;
    -webkit-mask-image: var(--noom-icon-svg-download);
    mask-image: var(--noom-icon-svg-download);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    color: inherit;
}

header ul#mega-menu-primary-menu ul.mega-sub-menu li.mega-disable-link ul.mega-sub-menu li {
    margin-bottom: 10px !important; 
}

header ul#mega-menu-primary-menu ul.mega-sub-menu li:not(.mega-disable-link) > a.mega-menu-link {
    display: inline !important;
    line-height: 1.2 !important;
}


header ul#mega-menu-primary-menu li.mega-menu-megamenu.mega-menu-grid ul.mega-sub-menu li:not(.mega-disable-link) > a.mega-menu-link:hover:after,
.noom-icon-arrow-right:after {
    content: '';
    display: inline-block;
    width: 12px;
    height: 11px;
    margin-left: 10px;
    vertical-align: middle;
    background-color: currentColor;
    -webkit-mask-image: var(--noom-icon-svg-arrow);
    mask-image: var(--noom-icon-svg-arrow);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    color: inherit;
}

header ul#mega-menu-primary-menu li.mega-menu-flyout ul.mega-sub-menu li:not(.mega-disable-link) > a.mega-menu-link {
    border-bottom: 2px solid transparent !important;
}

header ul#mega-menu-primary-menu li.mega-menu-flyout ul.mega-sub-menu li:not(.mega-disable-link) > a.mega-menu-link:hover {
    border-bottom-color: #000 !important;
}

/** Links with the class "noom-btn-link"  and "noom-icon-arrow-right" will now inherit the color of the parent element when the parent element has the class "et_pb_bg_layout_dark" -- A Divi page builder feature that allows for the color of the links to be changed based on the background color of the parent element.**/
header .et_pb_bg_layout_dark a.noom-btn-link {
    color: #fff !important;
    border-bottom: 2px solid #fff !important;
}
header .et_pb_bg_layout_dark a.noom-icon-arrow-right {
    color: #fff !important;
}

/** END: Header Nav links & icons **/
