// sass-lint:disable force-element-nesting, force-pseudo-nesting, no-empty-rulesets, no-mergeable-selectors, one-declaration-per-line

/* -----------------------------------------
	Main Navigation
----------------------------------------- */
.nav {
	display: block;
}

.navigation-main {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: normal;

	// Apply top margin to the fullwidth menu to keep
	// it more distanced from the logo
	@at-root {
		.head-mast {
			[class^="col-lg-12"]  {
				.navigation-main {
					margin-top: 10px;
				}
			}
		}
	}

	// Functional Styles
	// ===================================
	li { position: relative; }
	> li { display: inline-block; }
	a { display: block; white-space: nowrap; }

	ul {
		text-align: left;
		position: absolute;
		z-index: 10;
		visibility: hidden;
		opacity: 0;
		transition: transform .25s ease .2s, opacity .25s ease .2s, visibility 0s ease .35s;
		transform: translate(0, 10px);
		margin-left: 12px;
	}

	ul ul {
		top: -12px;
		left: 100%;
		margin: 0;
		transform: translate(-10px, 0);
	}

	> li:first-child {
		ul {
			margin-left: 0;
		}
	}

	li:hover {
		> ul {
			transition-delay: 0s, 0s, 0s;
			visibility: visible;
			opacity: 1;
		}

		ul {
			z-index: 15;
		}
	}

	> li:hover > ul {
		transform: translate(0, 0);
	}

	li li:hover > ul {
		transform: translate(0, 0);
	}

	> .nav-open-left {
		ul {
			right: 0;
		}

		ul ul {
			right: 100%;
			left: auto;
		}
	}

	li {
		.nav-open-left {
			ul {
				right: 100%;
				left: auto;
			}

			&.menu-item-has-children > a {
				&::after {
					content: "\f0d9";
					font-size: 12px;
				}
			}
		}

		&.nav-open-left {
			.menu-item-has-children > a {
				&::after {
					content: "\f0d9";
					font-size: 12px;
				}
			}
		}
	}

	// Development only
	//> li:nth-child(3),
	//> li:first-child {
	//	ul { transform: translate(0, 0); visibility: visible !important; opacity: 1 !important; }
	//	ul ul { transform: translate(0, 0); opacity: 1 !important; }
	// }

	// Visual Styles
	// ===================================

	// Sub-menu containers
	ul {
		padding: 15px 0;
		list-style: none;
		background-color: $white;
		min-width: 220px;
		box-shadow: 0 0 24px rgba($black, .08);
	}

	// Global Menu Link Styles
	a {
		position: relative;
		color: $accent-color;
		font-size: 14px;
		font-weight: 700;
		letter-spacing: $letter-spacing-default;
	}

	// First Level Menu Links
	// -----------------------------------

	// Default Styles
	> li > a {
		padding: 10px 0;
		margin: 0 12px;
	}

	> li:first-child {
		> a {
			margin-left: 0;
		}
	}

	// Active & Hover
	> li:hover > a,
	> li > a:focus,
	> .current-menu-item > a,
	> .current-menu-parent > a,
	> .current-menu-ancestor > a,
	> .current_page_item > a,
	> .current_page_ancestor > a {
		color: $accent-color-alt;
	}

	// Sub-Menu Links
	// -----------------------------------

	// Default Styles
	li li a {
		padding: 10px 15px;
		font-size: 13px;
		color: $text-color;
		font-weight: 400;
	}

	// Active & Hover
	li li:hover > a,
	li li > a:focus,
	li .current-menu-item > a,
	li .current-menu-parent > a,
	li .current-menu-ancestor > a,
	li .current_page_item > a,
	li .current_page_ancestor > a {
		background: $accent-color-alt;
		color: $white;
	}

	// Arrows
	// -----------------------------------

	// First Level (Facing Down)
	.menu-item-has-children > a::after,
	.page_item_has_children > a::after {
		@include font-awesome(\f107);
		font-size: 10px;
		position: relative;
		top: -3px;
		right: -3px;
		line-height: normal;
	}

	// Sub-Menus (Facing Right)
	li .menu-item-has-children > a,
	li .page_item_has_children > a {
		padding-right: 25px;

		&::after {
			@include font-awesome(\f105);
			position: absolute;
			font-size: 12px;
			right: 15px;
			top: 50%;
			transform: translateY(-50%);
		}
	}

	// Nav Buttons
	// -----------------------------------
	.nav-button {
		> a {
			border: 2px solid currentColor;
			padding: 7px 28px;
			margin-left: 10px;

			&::before {
				display: none;
			}
		}

		&:last-child {
			> a {
				margin-right: 0;
			}
		}
	}

	// Mega Menus
	// -----------------------------------
	.mega-menu {
		> ul {
			display: flex;

			> li {
				> a {
					font-weight: 700;
					font-size: 1.05em;
				}

				> a,
				& > a:focus,
				&.current-menu-item > a,
				&.current-menu-parent > a,
				&.current-menu-ancestor > a {
					background-color: transparent;
					color: initial;
				}
			}

			ul {
				display: block;
				opacity: 1;
				box-shadow: none;
				padding: 0;
				margin: 0;
				position: static;
				background: none;
				min-width: 180px;
				transform: translate(0, 10px);
			}

			a {
				&::after {
					display: none;
				}
			}
		}

		&:hover {
			ul {
				ul {
					opacity: 1;
					visibility: visible;
					transform: none;
					transition-delay: 0s;
				}
			}
		}
	}
}

// Open the last submenu of the menu always on the left
.navigation-main-right {
	text-align: right;

	> li:last-child {
		ul {
			right: 0;
		}

		ul ul {
			left: auto;
			right: 100%;
		}

		.menu-item-has-children > a {
			&::after {
				content: "\f0d9";
				font-size: 12px;
			}
		}
	}
}