/* Classic WordPress submenu dropdowns for the Grecta header */
.grecta-nav-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.grecta-nav-list .grecta-nav-item,
.grecta-nav-list .grecta-sub-menu {
	list-style: none;
	margin: 0;
}

.grecta-nav-toggle {
	appearance: none;
	-webkit-appearance: none;
	background: transparent;
	border: 0;
	padding: 0;
	margin: 0;
	cursor: pointer;
	color: inherit;
	font: inherit;
}

.grecta-nav-toggle:focus-visible,
.grecta-nav-list .grecta-nav-link:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px hsl(var(--accent, 160 25% 40%) / 0.5);
	border-radius: var(--radius, 0.375rem);
}

.grecta-header .grecta-nav-list .grecta-nav-link,
.grecta-header .grecta-nav-list .grecta-nav-link:visited,
.grecta-header .grecta-nav-list .grecta-nav-link span {
	font-family: var(--font-sans, Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	font-size: 0.9375rem;
	font-weight: 400;
	line-height: 1.5;
	color: #000;
	text-decoration: none;
	background: transparent;
	transition: color 0.2s ease;
}

.grecta-header .grecta-nav-list .grecta-nav-link:hover,
.grecta-header .grecta-nav-list .grecta-nav-link:hover span,
.grecta-header .grecta-nav-list > .grecta-nav-item:hover > .grecta-nav-link,
.grecta-header .grecta-nav-list > .grecta-nav-item:hover > .grecta-nav-link span,
.grecta-header .grecta-nav-list > .grecta-nav-item:focus-within > .grecta-nav-link,
.grecta-header .grecta-nav-list > .grecta-nav-item:focus-within > .grecta-nav-link span,
.grecta-header .grecta-nav-list .grecta-nav-item--open > .grecta-nav-link,
.grecta-header .grecta-nav-list .grecta-nav-item--open > .grecta-nav-link span,
.grecta-header .grecta-nav-list .grecta-nav-link.grecta-nav-link--current,
.grecta-header .grecta-nav-list .grecta-nav-link.grecta-nav-link--current span {
	color: hsl(var(--accent, 160 25% 40%));
	background: transparent;
	text-decoration: none;
}

@media (min-width: 1024px) {
	.grecta-header,
	.grecta-header-inner,
	.grecta-nav-wrap,
	.grecta-nav {
		overflow: visible;
	}

	.grecta-header .grecta-nav-wrap,
	.grecta-header .grecta-nav,
	.grecta-header .grecta-nav-list {
		display: flex;
		align-items: stretch;
		height: 100%;
	}

	.grecta-nav-list {
		gap: 1.5rem;
	}

	.grecta-nav-list > .grecta-nav-item {
		position: relative;
		display: flex;
		align-items: center;
		margin-top: -1rem;
		margin-bottom: -1rem;
		padding-top: 1rem;
		padding-bottom: 1rem;
	}

	.grecta-nav-list > .grecta-nav-item > .grecta-nav-link {
		display: inline-flex;
		align-items: center;
		gap: 0.4rem;
		margin: 0;
		padding: 0;
		height: 100%;
	}

	.grecta-nav-item--has-children > .grecta-nav-link::after {
		content: "";
		display: block;
		flex-shrink: 0;
		width: 0.4rem;
		height: 0.4rem;
		border-right: 1.5px solid currentColor;
		border-bottom: 1.5px solid currentColor;
		transform: rotate(45deg) translateY(-1px);
		transform-origin: 50% 50%;
		transition: transform 0.25s ease;
	}

	.grecta-nav-item--has-children:hover > .grecta-nav-link::after,
	.grecta-nav-item--has-children:focus-within > .grecta-nav-link::after,
	.grecta-nav-item--open > .grecta-nav-link::after {
		transform: rotate(225deg) translateY(-1px);
	}

	.grecta-nav-toggle {
		display: none;
	}

	.grecta-nav-list > .grecta-nav-item > .grecta-sub-menu {
		position: absolute;
		top: 100%;
		left: 0;
		z-index: 140;
		min-width: 13.75rem;
		width: max-content;
		max-width: 22rem;
		margin: 0.5rem 0 0;
		padding: 0.5rem 0;
		background: #fff;
		border: 1px solid hsl(var(--border, 210 20% 88%));
		border-radius: 0.5rem;
		box-shadow: 0 12px 28px hsl(var(--foreground, 215 25% 15%) / 0.1);
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: none;
		transition: opacity 0.18s ease, visibility 0s linear 0.18s;
	}

	.grecta-nav-list > .grecta-nav-item > .grecta-sub-menu::before {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: 100%;
		height: 0.5rem;
	}

	.grecta-nav-item--has-children:hover > .grecta-sub-menu,
	.grecta-nav-item--has-children:focus-within > .grecta-sub-menu,
	.grecta-nav-item--open > .grecta-sub-menu {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transition-delay: 0s;
	}

	.grecta-sub-menu .grecta-nav-item {
		position: relative;
		width: 100%;
	}

	.grecta-header .grecta-sub-menu .grecta-nav-link,
	.grecta-header .grecta-sub-menu .grecta-nav-link:visited,
	.grecta-header .grecta-sub-menu .grecta-nav-link span {
		display: block;
		width: 100%;
		box-sizing: border-box;
		padding: 0.55rem 1rem;
		white-space: nowrap;
		color: #000;
	}

	.grecta-header .grecta-sub-menu .grecta-nav-link:hover,
	.grecta-header .grecta-sub-menu .grecta-nav-link:hover span,
	.grecta-header .grecta-sub-menu .grecta-nav-link.grecta-nav-link--current,
	.grecta-header .grecta-sub-menu .grecta-nav-link.grecta-nav-link--current span {
		color: hsl(var(--accent, 160 25% 40%));
		background: transparent;
	}

	.grecta-sub-menu .grecta-nav-item--has-children > .grecta-nav-link::after {
		transform: rotate(-45deg) translateY(-1px);
	}

	.grecta-sub-menu .grecta-sub-menu {
		top: 0;
		left: calc(100% + 0.25rem);
		margin-top: 0;
	}

	.grecta-nav-list > .grecta-nav-item:nth-last-child(-n + 2) > .grecta-sub-menu {
		left: auto;
		right: 0;
	}

	.grecta-sub-menu .grecta-nav-item:nth-last-child(-n + 2) > .grecta-sub-menu {
		left: auto;
		right: calc(100% + 0.25rem);
	}
}

@media (max-width: 1023px) {
	.grecta-nav-list {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		width: 100%;
		gap: 0;
	}

	.grecta-nav-item {
		width: 100%;
	}

	.grecta-nav-item--has-children {
		display: grid;
		grid-template-columns: 1fr auto;
		align-items: center;
	}

	.grecta-nav-list > .grecta-nav-item > .grecta-nav-link {
		display: block;
		width: 100%;
		box-sizing: border-box;
		padding: 0.75rem 0;
		margin: 0;
		text-align: left;
	}

	.grecta-nav-toggle {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 2.5rem;
		height: 2.5rem;
		color: #000;
	}

	.grecta-nav-toggle span {
		display: block;
		width: 0.45rem;
		height: 0.45rem;
		border-right: 1.5px solid currentColor;
		border-bottom: 1.5px solid currentColor;
		transform: rotate(45deg);
		transition: transform 0.22s ease, color 0.2s ease;
	}

	.grecta-nav-item--open > .grecta-nav-toggle,
	.grecta-nav-item--open > .grecta-nav-toggle span {
		color: hsl(var(--accent, 160 25% 40%));
	}

	.grecta-nav-item--open > .grecta-nav-toggle span {
		transform: rotate(225deg);
	}

	.grecta-sub-menu {
		display: none;
		grid-column: 1 / -1;
		position: static;
		width: 100%;
		margin: 0;
		padding: 0.15rem 0 0.55rem;
		border: 0;
		background: transparent;
		box-shadow: none;
		transform: none;
		opacity: 1;
		visibility: visible;
	}

	.grecta-nav-item--open > .grecta-sub-menu {
		display: block;
		border-left: 0;
	}

	.grecta-header .grecta-sub-menu .grecta-nav-link,
	.grecta-header .grecta-sub-menu .grecta-nav-link span {
		display: block;
		width: 100%;
		box-sizing: border-box;
		padding: 0.5rem 0 0.5rem 0.85rem;
	}

	.grecta-sub-menu .grecta-nav-item--has-children {
		display: grid;
		grid-template-columns: 1fr auto;
	}

	.grecta-sub-menu .grecta-sub-menu {
		margin-left: 0.15rem;
	}
}
