/* DigiMark Block Styles — Navigation */

/*
 * Works in both the front end and the block editor. In the editor, the
 * DigiMark class is placed on the block wrapper; on the front end it is
 * placed on the rendered <nav> element.
 */
.digimark-navigation-styles .wp-block-navigation-item__content {
	border-radius: var(--digimark-nav-radius, inherit);
	transition:
		color var(--digimark-nav-transition, 0.2s) ease,
		background-color var(--digimark-nav-transition, 0.2s) ease;
}

/* Space between top-level parent items. */
.digimark-navigation-styles .wp-block-navigation__container {
	column-gap: var(--digimark-nav-item-gap, var(--wp--style--block-gap, 0));
}

/*
 * Treat each top-level item as one hover target. WordPress renders a submenu
 * label and its arrow as sibling elements, so the hover background belongs on
 * the parent menu item rather than on the link alone. Horizontal padding also
 * belongs on the parent so it naturally includes the submenu arrow.
 */
.digimark-navigation-styles .wp-block-navigation__container > .wp-block-navigation-item {
	min-height: var(--digimark-nav-item-height, auto);
	box-sizing: border-box;
	padding-left: var(--digimark-nav-item-padding-x, 0);
	padding-right: var(--digimark-nav-item-padding-x, 0);
	border-radius: var(--digimark-nav-radius, inherit);
	transition:
		color var(--digimark-nav-transition, 0.2s) ease,
		background-color var(--digimark-nav-transition, 0.2s) ease;
}

.digimark-navigation-styles .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	min-height: var(--digimark-nav-item-height, auto);
	box-sizing: border-box;
	display: flex;
	align-items: center;
}

/*
 * Leave WordPress's submenu toggle geometry intact. Overriding its display or
 * stretch behavior can make the SVG chevron disappear in the Site Editor.
 */
.digimark-navigation-styles .wp-block-navigation__container > .wp-block-navigation-submenu > .wp-block-navigation__submenu-icon {
	color: inherit;
	background: transparent !important;
}

/* Exact current menu item. */
.digimark-navigation-styles .current-menu-item > .wp-block-navigation-item__content,
.digimark-navigation-styles .current_page_item > .wp-block-navigation-item__content {
	color: var(--digimark-nav-current-text, inherit) !important;
	background-color: var(--digimark-nav-current-bg, transparent) !important;
}

/*
 * Desktop current items use the same padded parent surface as hover/focus.
 * Keep overlay and submenu current backgrounds on their individual links.
 * Zero-specificity state filters let the hover/focus rules below take priority.
 */
.digimark-navigation-styles .wp-block-navigation__container > .wp-block-navigation-item:where(.current-menu-item, .current_page_item):not(:where(.is-menu-open *)) {
	color: var(--digimark-nav-current-text, inherit) !important;
	background-color: var(--digimark-nav-current-bg, transparent) !important;
}

.digimark-navigation-styles .wp-block-navigation__container > .wp-block-navigation-item:where(.current-menu-item, .current_page_item):not(:where(.is-menu-open *)) > .wp-block-navigation-item__content {
	color: var(--digimark-nav-current-text, inherit) !important;
	background-color: transparent !important;
}

/* Top-level hover/focus state, including the submenu arrow. */
.digimark-navigation-styles .wp-block-navigation__container > .wp-block-navigation-item:hover,
.digimark-navigation-styles .wp-block-navigation__container > .wp-block-navigation-item:focus-within {
	color: var(--digimark-nav-hover-text, inherit) !important;
	background-color: var(--digimark-nav-hover-bg, transparent) !important;
}

.digimark-navigation-styles .wp-block-navigation__container > .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.digimark-navigation-styles .wp-block-navigation__container > .wp-block-navigation-item:focus-within > .wp-block-navigation-item__content,
.digimark-navigation-styles .wp-block-navigation__container > .wp-block-navigation-item:hover > .wp-block-navigation__submenu-icon,
.digimark-navigation-styles .wp-block-navigation__container > .wp-block-navigation-item:focus-within > .wp-block-navigation__submenu-icon {
	color: var(--digimark-nav-hover-text, inherit) !important;
	background-color: transparent !important;
	text-decoration: var(--digimark-nav-hover-decoration, none) !important;
}

/* Submenu links retain their own normal hover/focus treatment. */
.digimark-navigation-styles .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.digimark-navigation-styles .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
	color: var(--digimark-nav-hover-text, inherit) !important;
	background-color: var(--digimark-nav-hover-bg, transparent) !important;
	text-decoration: var(--digimark-nav-hover-decoration, none) !important;
}

/*
 * Responsive/mobile overlay
 * -------------------------
 * DigiMark's desktop sizing controls are intentionally disabled while the
 * core Navigation responsive container is open. WordPress needs menu items
 * and expanded submenus to grow naturally in the overlay; carrying desktop
 * min-heights, horizontal padding, gaps, or flex alignment into this layout
 * can cause submenu links to overlap one another.
 */
.digimark-navigation-styles .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	column-gap: initial !important;
	row-gap: var(--wp--style--block-gap, 0.75rem);
}

.digimark-navigation-styles .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item {
	min-height: 0 !important;
	height: auto !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	align-items: stretch;
}

.digimark-navigation-styles .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	min-height: 0 !important;
	height: auto !important;
	display: block;
}

/* Let an opened mobile submenu participate in normal document flow. */
.digimark-navigation-styles .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	position: static !important;
	width: auto !important;
	height: auto !important;
	min-height: 0 !important;
	overflow: visible !important;
}

.digimark-navigation-styles .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
	height: auto !important;
	min-height: 0 !important;
}

.digimark-navigation-styles .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	height: auto !important;
	min-height: 0 !important;
	white-space: normal;
}
