/**
 * Nia mobile mega-menu drill-down styles.
 * Pairs with assets/js/nia-mobile-menu.js. Scoped to the Elementor mobile
 * dropdown so desktop menus are untouched.
 */

/* The caret toggle button next to parent category items. */
.elementor-nav-menu--dropdown .nia-cat-toggle {
	display: inline-block;
	position: absolute;
	right: 0;
	top: 0;
	width: 54px;
	height: 100%;
	min-height: 44px;
	cursor: pointer;
	z-index: 2;
}

.elementor-nav-menu--dropdown .nia-cat-toggle::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 9px;
	height: 9px;
	margin: -6px 0 0 -5px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.2s ease;
	opacity: 0.75;
}

.elementor-nav-menu--dropdown li.menu-item-has-children.nia-open > .nia-cat-toggle::before {
	transform: rotate(-135deg);
}

/* Parent items need room for the caret and relative positioning. */
.elementor-nav-menu--dropdown li.menu-item-has-children {
	position: relative;
}

.elementor-nav-menu--dropdown li.menu-item-has-children > a {
	padding-right: 54px !important;
}

/* Hide nested (2nd level and deeper) submenus until their branch is opened.
   The first submenu (Collections -> Her/Him) stays managed by Elementor. */
.elementor-nav-menu--dropdown .sub-menu .sub-menu {
	display: none;
}

.elementor-nav-menu--dropdown li.menu-item-has-children.nia-open > .sub-menu {
	display: block !important;
}

/* Slight indent so each level reads as a hierarchy. */
.elementor-nav-menu--dropdown .sub-menu .sub-menu .elementor-sub-item {
	padding-left: 30px;
}

.elementor-nav-menu--dropdown .sub-menu .sub-menu .sub-menu .elementor-sub-item {
	padding-left: 45px;
}
