/* SSPC Collapsible Mobile Menu: rules apply only inside the open phone menu. */

.wp-block-navigation__responsive-container.is-menu-open .sspc-mm:not(.sspc-mm-open) > .wp-block-navigation__submenu-container {
	display: none !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.sspc-mm {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	justify-content: var(--navigation-layout-justification-setting, flex-start);
	column-gap: 0.25em;
}
.wp-block-navigation__responsive-container.is-menu-open .sspc-mm > .wp-block-navigation__submenu-container {
	flex-basis: 100%;
	align-items: var(--navigation-layout-justification-setting, flex-start);
}

/* The arrow button: hidden on the desktop menu, shown in the phone menu. */
.sspc-mm-toggle {
	display: none;
}
.wp-block-navigation__responsive-container.is-menu-open .sspc-mm-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	cursor: pointer;
	transition: transform 0.2s ease;
}
.wp-block-navigation__responsive-container.is-menu-open .sspc-mm-open > .sspc-mm-toggle {
	transform: rotate(180deg);
}
.wp-block-navigation__responsive-container.is-menu-open .sspc-mm-toggle:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: -4px;
	border-radius: 4px;
}
.wp-block-navigation__responsive-container.is-menu-open .sspc-mm-label-toggles > .wp-block-navigation-item__content {
	cursor: pointer;
}

/* WordPress's own small arrow is not used in the phone menu. */
.wp-block-navigation__responsive-container.is-menu-open .sspc-mm > .wp-block-navigation__submenu-icon {
	display: none !important;
}

@media (prefers-reduced-motion: reduce) {
	.sspc-mm-toggle { transition: none !important; }
}
