/* wpagent/nav-menu — structural CSS (P03). Non-default prop values arrive as
 * custom properties (--wpab-nm-*) from the style engine (style-rules.php);
 * the fallbacks below are the registry defaults. */
.wpab-nav-menu {
	font-family: var(--wpab-nm-font, var(--wp--custom--font--body, inherit));
	font-size: var(--wpab-nm-size, 15px);
	font-weight: var(--wpab-nm-weight, 500);
	letter-spacing: var(--wpab-nm-spacing, 0px);
}
.wpab-nav-menu--italic {
	font-style: italic;
}
.wpab-nav-menu--uppercase {
	text-transform: uppercase;
}
.wpab-nav-menu__list,
.wpab-nav-menu__sub {
	margin: 0;
	padding: 0;
	list-style: none;
}
.wpab-nav-menu__link {
	/* Solid, zero-width border: the item/sub part borders (borderWidth,
	 * borderColor) show without also setting a style. */
	border: 0 solid currentColor;
	color: var(--wpab-nm-link, inherit);
	text-decoration: none;
	transition: color 0.18s ease, background-color 0.18s ease;
}
a.wpab-nav-menu__link:hover,
a.wpab-nav-menu__link:focus-visible {
	color: var(--wpab-nm-hover, var(--wpab-nm-link, inherit));
}
.wpab-nav-menu--active-color .is-current > .wpab-nav-menu__link,
.wpab-nav-menu--active-color .is-current-ancestor > .wpab-nav-menu__link,
.wpab-nav-menu--active-underline .is-current > .wpab-nav-menu__link,
.wpab-nav-menu--active-underline .is-current-ancestor > .wpab-nav-menu__link {
	color: var(--wpab-nm-active, var(--wp--preset--color--accent, inherit));
}
.wpab-nav-menu--active-underline .is-current > .wpab-nav-menu__link,
.wpab-nav-menu--active-underline .is-current-ancestor > .wpab-nav-menu__link {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 6px;
}
.wpab-nav-menu__placeholder {
	margin: 0;
	padding: 8px 12px;
	border: 1px dashed currentColor;
	font-size: 13px;
	opacity: 0.7;
}

/* Horizontal bar ------------------------------------------------------- */
.wpab-nav-menu--horizontal > .wpab-nav-menu__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 var(--wpab-nm-gap, 28px);
}
.wpab-nav-menu--horizontal .wpab-nav-menu__item {
	position: relative;
	display: flex;
	align-items: center;
}
.wpab-nav-menu--horizontal > .wpab-nav-menu__list > .wpab-nav-menu__item > .wpab-nav-menu__link {
	display: inline-flex;
	align-items: center;
	padding-block: 8px;
}
.wpab-nav-menu--horizontal .wpab-nav-menu__item.has-mega {
	position: static;
}
/* Directly in a header bar the menu fills the bar height, so panels open at
 * the bar's bottom edge with no gap to cross. */
.wpab-header__inner > .wpab-nav-menu--horizontal {
	align-self: stretch;
}
.wpab-header__inner > .wpab-nav-menu--horizontal > .wpab-nav-menu__list {
	height: 100%;
	align-items: stretch;
}
.wpab-nav-menu__toggle {
	display: inline-flex;
	align-items: center;
	margin: 0 0 0 2px;
	padding: 2px;
	border: 0;
	border-radius: 4px;
	background: none;
	color: inherit;
	font: inherit;
	cursor: pointer;
}
.wpab-nav-menu__toggle .wpab-icon {
	width: var(--wpab-nm-chev, 16px);
	height: var(--wpab-nm-chev, 16px);
	transition: transform 0.18s ease;
}
.wpab-nav-menu__item.is-open > .wpab-nav-menu__toggle .wpab-icon,
.wpab-nav-menu__item.is-open > .wpab-nav-menu__link > .wpab-nav-menu__chevron {
	transform: rotate(180deg);
}
/* chevronPlacement in-link: the chevron sits in the link box after the label. */
.wpab-nav-menu__chevron {
	flex: none;
	width: var(--wpab-nm-chev, 16px);
	height: var(--wpab-nm-chev, 16px);
	margin-inline-start: 4px;
	cursor: pointer;
	transition: transform 0.18s ease;
}
/* No chevron: the button stays for keyboard users, visible on focus only. */
.wpab-nav-menu__toggle.is-iconless:not(:focus-visible) {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
}
.wpab-nav-menu__toggle.is-iconless:focus-visible::after {
	content: "▾";
}

/* Dropdown panels. */
.wpab-nav-menu--horizontal .wpab-nav-menu__sub {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 30;
	min-width: var(--wpab-nm-dd-w, 220px);
	padding: 8px;
	/* Zero solid border: a dropdown part border needs only a width. */
	border: 0 solid var(--wp--preset--color--line, #1118271f);
	border-top: var(--wpab-nm-dd-rule-w, 0) solid var(--wpab-nm-dd-rule, var(--wp--preset--color--line, #1118271f));
	background: var(--wpab-nm-dd-bg, var(--wp--preset--color--surface, #fff));
	color: var(--wpab-nm-dd-text, var(--wp--preset--color--ink, inherit));
	text-align: start;
	visibility: hidden;
	opacity: 0;
}
.wpab-nav-menu--horizontal .wpab-nav-menu__sub .wpab-nav-menu__sub {
	top: -8px;
	left: 100%;
}
.wpab-nav-menu--horizontal .wpab-nav-menu__sub .wpab-nav-menu__link {
	display: block;
	flex: 1 1 auto;
	padding: 9px 12px;
	border-radius: 6px;
	color: var(--wpab-nm-dd-text, var(--wp--preset--color--ink, inherit));
	white-space: nowrap;
}
.wpab-nav-menu--horizontal .wpab-nav-menu__sub a.wpab-nav-menu__link:hover,
.wpab-nav-menu--horizontal .wpab-nav-menu__sub a.wpab-nav-menu__link:focus-visible {
	color: var(--wpab-nm-hover, var(--wpab-nm-dd-text, var(--wp--preset--color--ink, inherit)));
}
.wpab-nav-menu--dropdown-card .wpab-nav-menu__sub {
	border-radius: var(--wp--preset--border-radius--md, 10px);
	box-shadow: var(--wp--preset--shadow--soft, 0 12px 32px rgba(16, 24, 40, 0.14));
}
.wpab-nav-menu--dropdown-panel .wpab-nav-menu__sub {
	border: 1px solid var(--wp--preset--color--line, #1118271f);
	border-top: var(--wpab-nm-dd-rule-w, 1px) solid var(--wpab-nm-dd-rule, var(--wp--preset--color--line, #1118271f));
}
.wpab-nav-menu--dropdown-panel .wpab-nav-menu__sub .wpab-nav-menu__link {
	border-radius: 0;
}
.wpab-nav-menu--horizontal .wpab-nav-menu__mega {
	right: 0;
	min-width: 0;
	padding: 0;
	border-radius: 0;
}
/* Closing waits a moment (visibility delay) so the pointer can cross a gap
 * between the item and its panel. */
.wpab-nav-menu--horizontal .wpab-nav-menu__sub {
	transition: visibility 0s linear 0.15s;
}
.wpab-nav-menu--animate .wpab-nav-menu__sub {
	transform: translateY(6px);
	transition: opacity 0.18s ease, transform 0.18s ease, visibility 0s linear 0.18s;
}
/* Open: the toggle (all devices), hover (pointer devices), focus inside (no JS). */
.wpab-nav-menu--horizontal .wpab-nav-menu__item.is-open > .wpab-nav-menu__sub,
.wpab-nav-menu--horizontal:not(.is-js) .wpab-nav-menu__item:focus-within > .wpab-nav-menu__sub {
	visibility: visible;
	opacity: 1;
	transform: none;
	transition-delay: 0s;
}
@media (hover: hover) {
	.wpab-nav-menu--horizontal .wpab-nav-menu__item:hover > .wpab-nav-menu__sub {
		visibility: visible;
		opacity: 1;
		transform: none;
		transition-delay: 0s;
	}
}

/* dropdownOffset (per breakpoint): the item keeps the link's height and the
 * panel opens offset below it; an invisible bridge spans the gap so hover
 * does not drop while the pointer crosses it. Mega panels are unaffected. */
@media (max-width: 767px) {
	.wpab-nav-menu--dd-offset-base > .wpab-nav-menu__list > .wpab-nav-menu__item.has-sub {
		align-self: center;
	}
	.wpab-nav-menu--dd-offset-base > .wpab-nav-menu__list > .wpab-nav-menu__item.has-sub > .wpab-nav-menu__sub {
		top: calc(100% + var(--wpab-nm-dd-offset, 0px));
	}
	.wpab-nav-menu--dd-offset-base > .wpab-nav-menu__list > .wpab-nav-menu__item.has-sub > .wpab-nav-menu__sub::before {
		content: "";
		position: absolute;
		inset-inline: 0;
		bottom: 100%;
		height: var(--wpab-nm-dd-offset, 0px);
	}
}
@media (min-width: 768px) and (max-width: 1024px) {
	.wpab-nav-menu--dd-offset-md > .wpab-nav-menu__list > .wpab-nav-menu__item.has-sub {
		align-self: center;
	}
	.wpab-nav-menu--dd-offset-md > .wpab-nav-menu__list > .wpab-nav-menu__item.has-sub > .wpab-nav-menu__sub {
		top: calc(100% + var(--wpab-nm-dd-offset, 0px));
	}
	.wpab-nav-menu--dd-offset-md > .wpab-nav-menu__list > .wpab-nav-menu__item.has-sub > .wpab-nav-menu__sub::before {
		content: "";
		position: absolute;
		inset-inline: 0;
		bottom: 100%;
		height: var(--wpab-nm-dd-offset, 0px);
	}
}
@media (min-width: 1025px) {
	.wpab-nav-menu--dd-offset-lg > .wpab-nav-menu__list > .wpab-nav-menu__item.has-sub {
		align-self: center;
	}
	.wpab-nav-menu--dd-offset-lg > .wpab-nav-menu__list > .wpab-nav-menu__item.has-sub > .wpab-nav-menu__sub {
		top: calc(100% + var(--wpab-nm-dd-offset, 0px));
	}
	.wpab-nav-menu--dd-offset-lg > .wpab-nav-menu__list > .wpab-nav-menu__item.has-sub > .wpab-nav-menu__sub::before {
		content: "";
		position: absolute;
		inset-inline: 0;
		bottom: 100%;
		height: var(--wpab-nm-dd-offset, 0px);
	}
}

/* Hidden below the drawer breakpoint (an off-canvas block takes over). */
@media (max-width: 767px) {
	.wpab-nav-menu--hide-below-md {
		display: none;
	}
}
@media (max-width: 1024px) {
	.wpab-nav-menu--hide-below-lg {
		display: none;
	}
}

/* Vertical list (drawer, footer) ------------------------------------------ */
.wpab-nav-menu--vertical .wpab-nav-menu__list {
	display: flex;
	flex-direction: column;
	gap: var(--wpab-nm-gap, 28px);
}
.wpab-nav-menu--vertical .wpab-nav-menu__sub {
	display: flex;
	flex-direction: column;
	gap: calc(var(--wpab-nm-gap, 28px) / 2);
	margin-top: calc(var(--wpab-nm-gap, 28px) / 2);
	padding-inline-start: var(--wpab-nm-indent, 16px);
	font-size: 0.85em;
}
/* Vertical links are full-width rows, so row dividers (itemBorderWidth,
 * subBorderWidth) and minimum heights apply across the panel. */
.wpab-nav-menu--vertical .wpab-nav-menu__link {
	display: flex;
	align-items: center;
	gap: 12px;
}
/* An italic menu keeps its sub-links upright (subItalic turns them italic). */
.wpab-nav-menu--vertical.wpab-nav-menu--italic .wpab-nav-menu__sub {
	font-style: normal;
}
/* Trailing icon (itemIcon) at the end of each top-level row. */
.wpab-nav-menu--item-icon > .wpab-nav-menu__list > .wpab-nav-menu__item > .wpab-nav-menu__link {
	justify-content: space-between;
}
.wpab-nav-menu__item-icon {
	flex: none;
	width: var(--wpab-nm-icon-size, 18px);
	height: var(--wpab-nm-icon-size, 18px);
	color: var(--wpab-nm-icon-color, currentColor);
}

@media (prefers-reduced-motion: reduce) {
	.wpab-nav-menu__link,
	.wpab-nav-menu__sub,
	.wpab-nav-menu__toggle .wpab-icon {
		transition: none;
	}
}
