/* Main navigation (replaces UberMenu; colors and spacing match its previous settings) */
#navigation { position:relative; z-index:100; }

#navigation .menu-toggle { display:none; }

.main-menu, .main-menu ul { list-style:none; margin:0; padding:0; }
.main-menu { display:flex; flex-wrap:wrap; }
.main-menu li { position:relative; }
.main-menu > li.mega-menu { position:static; }

.main-menu a, .main-menu .menu-label { display:block; line-height:1.3em; text-decoration:none; cursor:pointer; }
.main-menu .menu-label { cursor:default; }

/* Top level */
/* Positioned so the dropdown arrow stays on the item (mega menu items themselves are unpositioned so their submenu spans the bar) */
.main-menu > li > a, .main-menu > li > .menu-label { position:relative; color:#0e2d52; font-size:13px; padding:15px 20px; }
.main-menu > li.menu-item-has-children > a, .main-menu > li.menu-item-has-children > .menu-label { padding-right:35px; }
.main-menu > li.menu-item-has-children > a::after, .main-menu > li.menu-item-has-children > .menu-label::after { content:"\f107"; font-family:"Font Awesome 6 Pro"; font-weight:900; position:absolute; right:18px; top:50%; transform:translateY(-50%); }

.main-menu > li.whats-new > a { background:linear-gradient(#ffd900, #ffbd00); font-style:italic; font-weight:bold; }
.main-menu > li.profile > a { font-weight:bold; }
.main-menu > li.profile > a::before { content:"\f007"; font-family:"Font Awesome 6 Pro"; font-weight:900; margin-right:6px; }

.main-menu > li:hover > a, .main-menu > li:hover > .menu-label,
.main-menu > li:focus-within > a, .main-menu > li:focus-within > .menu-label,
.main-menu > li.is-open > a, .main-menu > li.is-open > .menu-label,
.main-menu > li.current-menu-item > a, .main-menu > li.current-menu-parent > a, .main-menu > li.current-menu-ancestor > a,
.main-menu > li.current-menu-ancestor > .menu-label { color:#ffd204; background:linear-gradient(#123b6c, #0e2d52); }

/* Submenus */
.main-menu .sub-menu { position:absolute; top:100%; left:0; z-index:500; background-color:#0e2d52; border:1px solid #0e2d52; box-shadow:0 0 20px rgba(0, 0, 0, 0.5); visibility:hidden; opacity:0; transform:translateY(10px); transition:opacity 0.3s ease-in, transform 0.3s ease-in, visibility 0.3s; }
.main-menu > li:hover > .sub-menu, .main-menu > li:focus-within > .sub-menu, .main-menu > li.is-open > .sub-menu { visibility:visible; opacity:1; transform:none; }

.main-menu .sub-menu a, .main-menu .sub-menu .menu-label { color:#ffffff; font-size:12px; padding:15px 20px; }
.main-menu .sub-menu a:hover, .main-menu .sub-menu a:focus, .main-menu .sub-menu .current-menu-item > a { color:#ffd204; }

.main-menu > li:not(.mega-menu) > .sub-menu { min-width:150px; }
.main-menu > li:not(.mega-menu) > .sub-menu a { white-space:nowrap; }

/* Mega menu: full width, one column per submenu item with a heading and its links below */
.main-menu > li.mega-menu > .sub-menu { left:-1px; right:-1px; display:flex; flex-wrap:wrap; max-height:600px; overflow-y:auto; }
.main-menu > li.mega-menu > .sub-menu > li { width:25%; }
.main-menu > li.mega-menu > .sub-menu > li > a, .main-menu > li.mega-menu > .sub-menu > li > .menu-label { color:#ffd204; font-size:13px; font-weight:bold; }
.main-menu > li.mega-menu > .sub-menu > li.menu-item-has-children > a, .main-menu > li.mega-menu > .sub-menu > li.menu-item-has-children > .menu-label { border-bottom:1px solid #10345f; }
.main-menu > li.mega-menu .sub-menu .sub-menu { position:static; visibility:inherit; opacity:1; transform:none; transition:none; box-shadow:none; border:0; background:none; padding:10px 0; }
.main-menu > li.mega-menu .sub-menu .sub-menu a { padding-top:5px; padding-bottom:5px; }

/* Small screens: "Menu" toggle, stacked items, tap a parent to open its submenu */
@media screen and (max-width:959px) {
	#navigation .menu-toggle { display:block; width:100%; background:#ffffff; color:#0e2d52; border:0; border-radius:5px; font-size:13px; font-weight:bold; padding:15px 20px; text-align:left; cursor:pointer; }
	#navigation .menu-toggle .fa-bars { margin-right:6px; }
	#navigation .main-menu { display:none; }
	#navigation.is-open .main-menu { display:block; }
	#navigation.is-open .menu-toggle { border-radius:5px 5px 0 0; }

	.main-menu > li.mega-menu { position:relative; }
	.main-menu .sub-menu, .main-menu > li.mega-menu > .sub-menu { position:static; display:none; visibility:visible; opacity:1; transform:none; transition:none; box-shadow:none; max-height:none; }
	.main-menu > li:hover > .sub-menu, .main-menu > li:focus-within > .sub-menu { display:none; }
	.main-menu > li.is-open > .sub-menu, .main-menu > li.mega-menu.is-open > .sub-menu { display:block; }
	.main-menu > li.mega-menu > .sub-menu > li { width:auto; }
	.main-menu > li.mega-menu .sub-menu .sub-menu { display:block; }
}
