/* :where(.wp-block-greyd-page-navigation) {
	--post-nav-justify: flex-start;
	--post-nav-color: currentColor;
	--post-nav-color-current: var(--wp--preset--color--primary, currentColor);
	--post-nav-font-size-child: inherit;
	--post-nav-indent: 1rem;
	--post-nav-gap: 1em;
	--post-nav-line-width: 1px;
	--post-nav-line-indent: 1em;
	--post-nav-line-color: currentColor;
	--post-nav-chevron-color: currentColor;
} */

/**
 * Layout
 */
.wp-block-greyd-page-navigation {
	color: var(--post-nav-color, currentColor);
}

.wp-block-greyd-page-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.wp-block-greyd-page-navigation li {
	margin: calc(var(--post-nav-gap, 1em) / 2) 0;
	position: relative;
}

.page-navigation-list {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}

.page-navigation-item {
	display: flex;
	align-items: center;
	gap: calc(var(--post-nav-gap, 1em) / 2);
	position: relative;
	justify-content: var(--post-nav-justify, flex-start);
	flex-direction: row;
}

/**
 * Link
 */
.page-navigation-item .page-navigation-link {
	color: var(--post-nav-color, currentColor);
}

.is-current > .page-navigation-item > .page-navigation-link {
	color: var(--post-nav-color-current, currentColor);
}

.wp-block-greyd-page-navigation[style*="text-decoration"] .page-navigation-link {
	text-decoration: inherit;
}

/**
 * Toggle & Icon
 */
.page-navigation-toggle {
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
	display: flex;
	align-items: center;
	position: relative;
}

.page-navigation-toggle::after {
	content: "";
	position: absolute;
	display: block;
	inset: -4px calc(var(--post-nav-gap, 1em) * -0.5);
}

.page-navigation-icon {
	color: var(--post-nav-chevron-color, currentColor);
	font-size: var(--post-nav-chevron-size, 1.5em);
}

.page-navigation-toggle[aria-expanded="true"] > .icon-closed {
	display: none;
}

.page-navigation-toggle[aria-expanded="false"] > .icon-expanded {
	display: none;
}

.page-navigation-toggle:hover,
.is-current > .page-navigation-item > .page-navigation-toggle .page-navigation-icon {
	color: var(--post-nav-chevron-color-current, currentColor);
}

/**
 * Indentation and vertical lines for hierarchy
 */
.page-navigation-list .page-navigation-list {
	margin-left: var(--post-nav-indent, 1em);
	border-left: var(--post-nav-line-width, 1px) solid var(--post-nav-line-color, currentColor);
	padding-left: var(--post-nav-line-indent, 1em);
	font-size: var(--post-nav-font-size-child, inherit);
}

.is-depth-2 > .page-navigation-item > .page-navigation-link {
	font-size: var(--post-nav-font-size-child, inherit);
}

.is-depth-3 > .page-navigation-item > .page-navigation-link {
	font-size: var(--post-nav-font-size-child, inherit);
}

.is-depth-4 > .page-navigation-item > .page-navigation-link {
	font-size: var(--post-nav-font-size-child, inherit);
}

.is-depth-5 > .page-navigation-item > .page-navigation-link {
	font-size: var(--post-nav-font-size-child, inherit);
}

/**
 * Remove default list item marker
 */
.page-navigation-list > li {
	list-style: none;
}

/**
 * Hide panels by default
 */
.page-navigation-panel {
	display: none;
}

/**
 * Show panels when expanded
 */
.page-navigation-panel[aria-hidden="false"] {
	display: block;
}