/*
 * Vicando Future primary navigation
 * Keeps the administrator's light/dark glass choices authoritative and
 * prevents hover/current states from changing the button dimensions.
 */
body.vicando-color-light {
	--vc-menu-state-color: var(--vc-main-menu-light-glass, #ffffff);
	--vc-menu-state-surface: var(--vc-main-menu-light-glass-surface, rgba(255, 255, 255, .78));
	--vc-menu-state-text: var(--vc-main-menu-light-glass-text, #1d2430);
}

body.vicando-color-dark {
	--vc-menu-state-color: var(--vc-main-menu-dark-glass, #b81104);
	--vc-menu-state-surface: var(--vc-main-menu-dark-glass-surface, rgba(184, 17, 4, .76));
	--vc-menu-state-text: var(--vc-main-menu-dark-glass-text, #ffffff);
}

@media (min-width: 901px) {
	body .main-menu-bar .main-menu-bar-inner,
	body .main-menu-bar .main-menu-scroll-shell,
	body .main-menu-bar .main-menu-standard,
	body .main-menu-bar .main-menu-panel > .main-menu-list,
	body .main-menu-bar .main-menu-panel > .main-menu-list > li {
		height: 62px;
		min-height: 62px;
	}

	body .main-menu-bar .main-menu-panel > .main-menu-list > li {
		position: relative;
		display: flex;
		align-items: stretch;
		isolation: isolate;
		margin: 0;
		padding: 0;
	}

	body .main-menu-bar .main-menu-panel > .main-menu-list > li::before {
		content: "";
		position: absolute;
		z-index: 0;
		inset: 0 1px;
		box-sizing: border-box;
		border: 1px solid transparent;
		border-radius: 18px;
		background: transparent;
		box-shadow: none;
		opacity: 0;
		pointer-events: none;
		transition:
			opacity .24s ease,
			background-color .24s ease,
			border-color .24s ease,
			box-shadow .24s ease;
	}

	body .main-menu-bar .main-menu-panel > .main-menu-list > li:is(
		:hover,
		:focus-within,
		.current-menu-item,
		.current-menu-ancestor,
		.current-menu-parent,
		.current_page_item,
		.current_page_ancestor
	)::before {
		background:
			linear-gradient(145deg, rgba(255, 255, 255, .24), transparent 47%),
			var(--vc-menu-state-surface) !important;
		border-color: color-mix(in srgb, var(--vc-menu-state-color) 58%, rgba(255, 255, 255, .38));
		box-shadow:
			inset 0 1px 0 rgba(255, 255, 255, .5),
			inset 0 -1px 0 rgba(0, 0, 0, .1),
			0 14px 30px rgba(0, 0, 0, .2);
		opacity: 1;
		backdrop-filter: blur(18px) saturate(155%);
		-webkit-backdrop-filter: blur(18px) saturate(155%);
	}

	body .main-menu-bar .main-menu-panel > .main-menu-list > li > a,
	body .main-menu-bar.is-stuck .main-menu-panel > .main-menu-list > li > a {
		position: relative;
		z-index: 1;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		width: auto;
		height: 62px;
		min-height: 62px;
		margin: 0 1px;
		padding: 11px 18px;
		border: 1px solid transparent !important;
		border-radius: 18px !important;
		background: transparent !important;
		box-shadow: none !important;
		font-weight: 400;
		line-height: 1.35;
		letter-spacing: normal;
		transform: translateY(0) !important;
		transition:
			color .24s ease,
			text-shadow .24s ease,
			transform .28s cubic-bezier(.2, .78, .24, 1) !important;
	}

	body .main-menu-bar .main-menu-panel > .main-menu-list > li:is(
		:hover,
		:focus-within,
		.current-menu-item,
		.current-menu-ancestor,
		.current-menu-parent,
		.current_page_item,
		.current_page_ancestor
	) > a {
		color: var(--vc-menu-state-text) !important;
	}

	body .main-menu-bar .main-menu-panel > .main-menu-list > li > a:is(:hover, :focus-visible) {
		transform: translateY(-4px) !important;
		text-shadow: 0 5px 14px color-mix(in srgb, currentColor 34%, transparent);
	}
}

/* Every dropdown level uses the same selected glass, without changing size. */
body .main-menu-panel .main-menu-list .sub-menu {
	overflow: visible;
	background:
		linear-gradient(145deg, rgba(255, 255, 255, .12), transparent 44%),
		var(--vc-main-menu-dropdown-surface) !important;
}

body .main-menu-panel .main-menu-list .sub-menu > li > a {
	box-sizing: border-box;
	min-height: 44px;
	margin: 2px 0;
	padding-block: 10px;
	border: 1px solid transparent !important;
	border-radius: 13px !important;
	color: var(--vc-main-menu-dropdown-text) !important;
	background: transparent !important;
	box-shadow: none !important;
	transform: none !important;
}

body .main-menu-panel .main-menu-list .sub-menu > li:is(
	:hover,
	:focus-within,
	.current-menu-item,
	.current-menu-ancestor,
	.current-menu-parent,
	.current_page_item,
	.current_page_ancestor
) > a {
	color: var(--vc-menu-state-text) !important;
	background:
		linear-gradient(145deg, rgba(255, 255, 255, .22), transparent 47%),
		var(--vc-menu-state-surface) !important;
	border-color: color-mix(in srgb, var(--vc-menu-state-color) 58%, rgba(255, 255, 255, .35)) !important;
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, .4),
		0 8px 20px rgba(0, 0, 0, .17) !important;
}

@media (max-width: 900px) {
	body .main-menu-bar .main-menu-standard.is-open .main-menu-list > li > a {
		box-sizing: border-box;
		width: 100%;
		min-height: 48px;
		margin: 3px 0;
		padding: 11px 14px;
		border: 1px solid transparent !important;
		border-radius: 14px !important;
	}

	body .main-menu-bar .main-menu-standard.is-open .main-menu-list > li:is(
		:hover,
		:focus-within,
		.current-menu-item,
		.current-menu-ancestor,
		.current-menu-parent,
		.current_page_item,
		.current_page_ancestor
	) > a {
		color: var(--vc-menu-state-text) !important;
		background:
			linear-gradient(145deg, rgba(255, 255, 255, .22), transparent 47%),
			var(--vc-menu-state-surface) !important;
		border-color: color-mix(in srgb, var(--vc-menu-state-color) 58%, rgba(255, 255, 255, .35)) !important;
		box-shadow:
			inset 0 1px 0 rgba(255, 255, 255, .42),
			0 8px 20px rgba(0, 0, 0, .16) !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	body .main-menu-bar .main-menu-panel > .main-menu-list > li::before,
	body .main-menu-bar .main-menu-panel > .main-menu-list > li > a {
		transition: none !important;
	}

	body .main-menu-bar .main-menu-panel > .main-menu-list > li > a:is(:hover, :focus-visible) {
		transform: none !important;
	}
}