/**
 * MyLibrary navigation stability fixes.
 * Loaded after Veen's regular/optimized styles (v3.10.175).
 */

#header,
#header .menu-wrapper,
#header .menu-wrapper > .grid-container {
	overflow: visible;
}

#header.is-sticky .menu-wrapper {
	z-index: 10000;
}

.main-nav a:focus-visible,
.mlb-submenu-toggle:focus-visible {
	outline: 3px solid currentColor;
	outline-offset: 3px;
}

@media screen and (min-width: 1201px) {
	#header nav.main-nav ul.sub-menu {
		pointer-events: none;
		max-width: calc(100vw - 32px);
		transition: opacity 160ms ease, visibility 160ms ease, transform 160ms ease;
		will-change: opacity, transform;
	}

	#header nav.main-nav ul.menu li:hover > ul.sub-menu,
	#header nav.main-nav ul.menu li:focus-within > ul.sub-menu,
	#header nav.main-nav ul.menu li.mlb-menu-open > ul.sub-menu {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: translateY(0);
	}

	#header nav.main-nav ul.menu > li.mlb-align-right > ul.sub-menu {
		left: auto;
		right: 0;
	}

	#header nav.main-nav ul.sub-menu li.mlb-open-left > ul.sub-menu {
		left: auto;
		right: 100%;
		transform: translateX(10px);
	}

	#header nav.main-nav ul.sub-menu li.mlb-open-left:hover > ul.sub-menu,
	#header nav.main-nav ul.sub-menu li.mlb-open-left:focus-within > ul.sub-menu,
	#header nav.main-nav ul.sub-menu li.mlb-open-left.mlb-menu-open > ul.sub-menu {
		transform: translateX(0);
	}

	#header nav.main-nav ul.sub-menu.mlb-menu-columns-2,
	#header nav.main-nav ul.sub-menu.mlb-menu-columns-3 {
		display: grid;
		column-gap: 0;
		padding: 10px 0;
	}

	#header nav.main-nav ul.sub-menu.mlb-menu-columns-2 {
		grid-template-columns: repeat(2, minmax(250px, 1fr));
		width: min(560px, calc(100vw - 32px));
	}

	#header nav.main-nav ul.sub-menu.mlb-menu-columns-3 {
		grid-template-columns: repeat(3, minmax(230px, 1fr));
		width: min(780px, calc(100vw - 32px));
	}

	#header nav.main-nav ul.sub-menu.mlb-menu-scroll {
		max-height: var(--mlb-menu-max-height, calc(100vh - 32px));
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior: contain;
	}

	html.mlb-nav-scrolling #header nav.main-nav ul.sub-menu {
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}
}

@media screen and (max-width: 1200px) {
	body.menu-open {
		overflow: hidden;
	}

	nav.mobile.main-nav {
		z-index: 10020;
		max-width: calc(100vw - 36px);
		overflow-x: hidden !important;
		overflow-y: auto !important;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
	}

	div.menu-overlay {
		z-index: 10010;
	}

	nav.mobile.main-nav ul.menu li.menu-item-has-children {
		position: relative;
		padding-right: 15px;
	}

	nav.mobile.main-nav ul.menu li.menu-item-has-children::after {
		display: none !important;
	}

	nav.mobile.main-nav li.menu-item-has-children > a {
		display: block;
		padding-right: 48px;
	}

	nav.mobile.main-nav .mlb-submenu-toggle {
		position: absolute;
		top: 8px;
		right: 0;
		z-index: 8;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 42px;
		height: 42px;
		padding: 0;
		border: 0;
		border-radius: 8px;
		background: transparent;
		color: inherit;
		font: inherit;
		line-height: 1;
	}

	nav.mobile.main-nav ul.sub-menu .mlb-submenu-toggle {
		top: 1px;
	}

	nav.mobile.main-nav .mlb-submenu-toggle::before {
		content: '';
		width: 8px;
		height: 8px;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		transform: translateY(-2px) rotate(45deg);
		transition: transform 160ms ease;
	}

	nav.mobile.main-nav li.menu-open > .mlb-submenu-toggle::before {
		transform: translateY(2px) rotate(225deg);
	}

	nav.mobile.main-nav ul.menu li.menu-item-has-children:hover > ul.sub-menu {
		max-height: 0 !important;
		padding: 0 !important;
		overflow: hidden !important;
		opacity: 0 !important;
		visibility: hidden !important;
	}

	nav.mobile.main-nav ul.menu li.menu-item-has-children.menu-open > ul.sub-menu,
	nav.mobile.main-nav ul.menu li.menu-item-has-children.menu-open:hover > ul.sub-menu {
		position: relative !important;
		left: auto !important;
		top: auto !important;
		display: block;
		max-height: none !important;
		padding: 5px 0 0 !important;
		overflow: visible !important;
		opacity: 1 !important;
		visibility: visible !important;
		transform: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	#header nav.main-nav ul.sub-menu,
	nav.mobile.main-nav,
	nav.mobile.main-nav .mlb-submenu-toggle::before {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}
