.mega-menu {
	position: static;
}

.mega-menu__content {
	background-color: #FFFFFF;
	border: 2px solid var(--Navy);
	overflow-y: auto;
	padding: 20px;
	position: absolute;
	left: 50%;
	top: 100%;
	max-width: 1200px;
	width: 100%;
	border-radius: 20px;
}

.shopify-section-header-sticky .mega-menu__content {
	max-height: calc(100vh - var(--header-bottom-position-desktop, 20rem) - 4rem);
}

.js .mega-menu__content {
	opacity: 0;
	transform: translateY(-1.5rem);
}

.mega-menu[open] .mega-menu__content {
	opacity: 1;
	transform: translate(-50%, 0);
}

.mega-menu__link {
	color: rgba(var(--color-foreground), 0.75);
	display: block;
	line-height: calc(1 + 0.3 / var(--font-body-scale));
	padding-bottom: 0.6rem;
	padding-top: 0.6rem;
	text-decoration: none;
	transition: text-decoration var(--duration-short) ease;
	word-wrap: break-word;
}

.mega-menu__link--level-2 {
	font-weight: bold;
}

.header--top-center .mega-menu__list {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	column-gap: 0;
}

.header--top-center .mega-menu__list > li {
	width: 16%;
	padding-right: 2.4rem;
}

.mega-menu__link:hover,
.mega-menu__link--active {
	color: rgb(var(--color-foreground));
	text-decoration: underline;
}

.mega-menu__link--active:hover {
	text-decoration-thickness: 0.2rem;
}

.mega-menu .mega-menu__list--condensed {
	display: block;
}

.mega-menu__list--condensed .mega-menu__link {
	font-weight: normal;
}

.mega-menu__grid {
	display: flex;
	gap: 20px;

	& .mega-menu__col {
		flex: 1;

		&:first-child {
			flex: 1.25;
		}
	}

	& .mega-menu__header {
		position: relative;
		display: flex;
		align-items: center;
		gap: 10px;
		font-size: 20px;
		font-weight: 700;
		letter-spacing: 0.5px;
		text-transform: uppercase;
		color: var(--Navy);
		padding-bottom: 20px;

		&:before {
			content: '';
			aspect-ratio: 48 / 18;
			width: 48px;
			height: 18px;
			background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='18' fill='none' viewBox='0 0 48 18'%3E%3Cpath fill='%2300b2ff' fill-opacity='.5' d='M27.509 13.412c.952.83 2.029 1.404 3.276 1.63 1.505.275 2.97.079 4.375-.466 3.836-1.478 6.953-3.88 9.17-7.384.407-.638.758-1.302 1.14-1.953.117-.2.232-.405.387-.576a1.23 1.23 0 0 1 1.48-.273c.511.264.78.845.614 1.423-.19.673-.56 1.273-.847 1.903-1.023 2.263-2.561 4.126-4.474 5.687-2.37 1.938-4.921 3.533-7.933 4.266-2.492.61-4.898.402-7.18-.827a9.9 9.9 0 0 1-2.674-2.1c-.189-.208-.353-.285-.645-.195a8.6 8.6 0 0 1-2.05.339c-1.98.108-3.834-.286-5.501-1.403a6.5 6.5 0 0 1-.734-.565c-.184-.165-.32-.146-.5-.007a8 8 0 0 1-.715.492c-2.076 1.276-4.3 1.67-6.66 1.019-2.798-.77-5.122-2.294-6.921-4.59C.775 9.392.435 8.94.18 8.44-.172 7.742.005 6.98.594 6.58c.61-.418 1.391-.286 1.909.338.159.192.292.405.433.614 1.315 1.945 3.12 3.244 5.317 4.003 1.835.632 3.567.398 5.185-.684.548-.369.545-.365.283-.994-.806-1.951-.96-3.928-.228-5.935.28-.769.696-1.467 1.318-2.017 1.366-1.209 3.14-.967 4.123.57.545.854.782 1.806.784 2.813.007 1.828-.649 3.432-1.667 4.916a6 6 0 0 1-.24.33c-.106.139-.073.247.059.342.126.088.245.19.374.272 1.174.787 2.49.992 3.867.9.867-.057.858-.068.582-.89-.958-2.865-.658-5.603.857-8.203.624-1.072 1.477-1.927 2.607-2.479 2.465-1.2 5.26-.057 6.2 2.52a5.7 5.7 0 0 1 .29 2.74c-.237 1.76-1.005 3.276-2.1 4.644-.892 1.11-1.97 2.01-3.214 2.812.088.107.13.17.177.215zm-2.026-2.802c.095.236.217.277.439.136 1.627-1.055 2.94-2.377 3.645-4.225.26-.68.37-1.374.254-2.105-.223-1.421-1.52-2.006-2.724-1.22-.477.312-.843.736-1.135 1.222-.786 1.3-1.092 2.708-.93 4.316.032.59.198 1.241.453 1.876zm-8.886-6.4c-.744.74-.998 2.61-.503 3.67.788-.996 1.037-2.795.503-3.67'/%3E%3C/svg%3E");
		}
	}

	& .mega-menu__list {
		padding: 20px 10px;

		& ul {
			list-style: none;
			display: flex;
			flex-flow: column;
			gap: 10px;
		}

		& a {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 12px 20px;
			border-radius: 20px;
			color: var(--Navy);
			transition: all 0.3s ease;

			&:hover {
				background-color: var(--Blue-3);
			}

			&:after {
				content: '';
				flex: 0;
				aspect-ratio: 6 / 10;
				width: 6px;
				height: 10px;
				background: center / cover no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='10' fill='none' viewBox='0 0 7 10'%3E%3Cpath fill='%2300b2ff' d='m6.062 5-5 5L0 8.938 3.938 5 0 1.062 1.062 0z'/%3E%3C/svg%3E");
			}
			&.mega-menu__link--active {
				background-color: var(--Blue-3);
			}
		}
	}

	& .mega-menu__promo {
		text-align: center;
		display: flex;
		flex-flow: column;
		justify-content: space-between;
		gap: 20px;
		padding: 20px 30px;
		border-radius: 20px;
		&.col_trade {
			justify-content: center;
			& img {
				width: auto;
				height: auto;
			}
			& .mega-menu__content-container {
				gap: 20px;
			}
		}
		&.bg_blue-2 {
			background-color: var(--Blue-2);
		}
		&.bg_blue-3 {
			background-color: var(--Blue-3);
		}
		&.bg_white {
			background-color: #FFFFFF;
		}
		&.bg_pink {
			background-color: var(--Pink);
		}
		&.bg_chartreuse {
			background-color: var(--Chartreuse);
		}
	}

	& .mega-menu__content-container {
		display: flex;
		flex-flow: column;
		gap: 15px;
		& .mega-menu__text {
			color: var(--Navy);
			& * {
				margin: 0;
			}
			& ul {
				background: var(--Blue-3);
				padding: 20px;
				border-radius: 10px;
				list-style: none;
				margin: 20px 20px 0;
				& li {
					display: flex;
					align-items: center;
					gap: 10px;
					font-size: 14px;
					font-weight: 700;
					&:before {
						content: '';
						aspect-ratio: 1/1;
						width: 10px;
						background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='9' fill='none' viewBox='0 0 10 9'%3E%3Cpath fill='%235ac230' fill-rule='evenodd' d='M8.518.308a.836.836 0 0 1 1.17-.125c.36.287.416.806.128 1.165L3.861 8.69a.834.834 0 0 1-1.236.066L.244 6.39a.83.83 0 0 1 0-1.175.84.84 0 0 1 1.18 0L3.15 6.934z' clip-rule='evenodd'/%3E%3C/svg%3E");
					}
				}
			}
		}
		& .mega-menu__buttons {
			display: flex;
			flex-flow: row wrap;
			gap: 10px;
			& .button {
				width: 100%;
				margin: 0;
			}
		}
	}
}

.js .menu-drawer__navigation:has(.submenu-open) ~ .menu-drawer__utility-links {
	display: none;
}
