/* =========================================================
   AE SITE NAVBAR
   ========================================================= */

.ae-site-navbar {
	width: 100%;
	margin: 0;
	padding: 0;

	background: #ffffff;
}


/* =========================================================
   NAVBAR INNER
   25% LOGO | 55% MENU | 20% ACCOUNT
   ========================================================= */

.ae-site-navbar-inner {
	display: grid;
	grid-template-columns: 25% 55% 20%;
	align-items: center;

	width: 100%;
	min-height: 72px;

	margin: 0;
	padding: 0 32px;

	box-sizing: border-box;
}


/* =========================================================
   LOGO
   ========================================================= */

.ae-site-navbar-logo {
	display: flex;
	align-items: center;
	justify-content: flex-start;

	margin: 0;
	padding: 0;
}

.ae-site-navbar-logo .custom-logo-link {
	display: block;

	margin: 0;
	padding: 0;
}

.ae-site-navbar-logo img {
	display: block;

	width: auto;
	max-width: 180px;
	height: auto;

	margin: 0;
	padding: 0;
}


/* =========================================================
   NAVIGATION
   ========================================================= */

.ae-site-navbar-navigation {
	display: flex;
	align-items: center;
	justify-content: center;

	width: 100%;
	margin: 0;
	padding: 0;
}


/* =========================================================
   TOP LEVEL MENU
   ========================================================= */

.ae-site-navbar-navigation > ul {
	display: flex;
	align-items: center;
	justify-content: center;

	margin: 0;
	padding: 0;

	list-style: none;
}

.ae-site-navbar-navigation > ul > li {
	position: relative;

	display: block;

	margin: 0;
	padding: 0;

	list-style: none;
}


/* =========================================================
   TOP LEVEL LINKS
   ========================================================= */

.ae-site-navbar-navigation > ul > li > a {
	display: inline-flex;
	align-items: center;

	margin: 0;
	padding: 8px 15px;

	color: #222222;

	font-size: 14px;
	font-weight: 500;
	line-height: 1.4;

	text-decoration: none;
	white-space: nowrap;

	background: transparent;

	transition: opacity 0.2s ease;
}

.ae-site-navbar-navigation > ul > li > a:hover {
	opacity: 0.65;
}


/* =========================================================
   SUBMENU
   Hidden by default.
   Positioned relative to the parent <li>.
   ========================================================= */

.ae-site-navbar-navigation .sub-menu {
	position: absolute;

	top: 100%;
	left: 50%;

	display: block;

	min-width: 200px;
	width: max-content;

	margin: 0;
	padding: 8px 0;

	background: #ffffff;

	border: 1px solid #eaeaea;

	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);

	list-style: none;

	opacity: 0;
	visibility: hidden;

	transform: translate(-50%, 4px);

	transition:
		opacity 0.5s ease,
		visibility 0.5s ease,
		transform 0.5s ease;

	z-index: 1001;
}


/* =========================================================
   SHOW SUBMENU
   ========================================================= */

.ae-site-navbar-navigation li:hover > .sub-menu,
.ae-site-navbar-navigation li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;

	transform: translate(-50%, 0);
}


/* =========================================================
   SUBMENU ITEMS
   ========================================================= */

.ae-site-navbar-navigation .sub-menu li {
	display: block;

	width: 100%;

	margin: 0;
	padding: 0;

	list-style: none;
}


/* =========================================================
   SUBMENU LINKS
   ========================================================= */

.ae-site-navbar-navigation .sub-menu a {
	display: block;

	width: 100%;

	margin: 0;
	padding: 9px 18px;

	color: #222222;

	font-size: 13px;
	font-weight: 400;
	line-height: 1.4;

	text-decoration: none;

	white-space: nowrap;
}

.ae-site-navbar-navigation .sub-menu a:hover {
	background: #f7f7f7;
}

/* =========================================================
   ACCOUNT
   ========================================================= */

.ae-site-navbar-account {
	display: flex;
	align-items: center;
	justify-content: flex-end;

	width: 100%;

	margin: 0;
	padding: 0;
}

.ae-site-navbar-account a {
	margin: 0;
	padding: 0;

	color: #222222;

	font-size: 12px;
	font-weight: 500;
	line-height: 1.3;

	text-decoration: none;
}