/** Scroll Navigation layout. */
.polymer-classic-layout--scroll-navigation {
	--polymer-scroll-navigation-background: var(--polymer-layout-background, var(--polymer-classic-background, #fff));
	--polymer-scroll-navigation-border: color-mix(in srgb, currentColor 18%, transparent);
	--polymer-scroll-navigation-offset: 0px;
	background: var(--polymer-scroll-navigation-background);
	color: var(--polymer-layout-text, inherit);
	isolation: isolate;
	z-index: 1020;
}

.polymer-classic-layout--scroll-navigation.polymer-scroll-navigation--sticky {
	position: sticky;
	top: var(--polymer-scroll-navigation-offset);
}

.polymer-scroll-navigation {
	border-bottom: 1px solid var(--polymer-scroll-navigation-border);
	border-top: 1px solid var(--polymer-scroll-navigation-border);
}

.polymer-scroll-navigation__list {
	display: flex;
	gap: clamp(1rem, 3vw, 2.5rem);
	list-style: none;
	margin: 0;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	padding: 0;
	scrollbar-width: thin;
	white-space: nowrap;
}

.polymer-scroll-navigation__item {
	flex: 0 0 auto;
	margin: 0;
}

.polymer-scroll-navigation__link {
	color: inherit !important;
	display: block;
	font-weight: 600;
	padding: 1rem 0 .85rem;
	position: relative;
	text-decoration: none;
}

.polymer-scroll-navigation__link::after {
	background: currentColor;
	bottom: 0;
	content: "";
	height: 2px;
	left: 0;
	position: absolute;
	transform: scaleX(0);
	transform-origin: right center;
	transition: transform 180ms ease;
	width: 100%;
}

.polymer-scroll-navigation__link:hover::after,
.polymer-scroll-navigation__link:focus-visible::after,
.polymer-scroll-navigation__link.is-active::after {
	transform: scaleX(1);
	transform-origin: left center;
}

.polymer-scroll-navigation__link.is-active {
	color: var(--polymer-layout-link, inherit) !important;
}

.polymer-scroll-target {
	scroll-margin-top: calc(var(--polymer-scroll-navigation-total-offset, 0px) + 1rem);
}

@media (min-width: 768px) {
	.polymer-scroll-navigation--center .polymer-scroll-navigation__list { justify-content: center; }
	.polymer-scroll-navigation--right .polymer-scroll-navigation__list { justify-content: flex-end; }
}

@media (prefers-reduced-motion: reduce) {
	.polymer-scroll-navigation__link::after { transition: none; }
}