/* In-page anchor navigation (.hw-subnav): sticky bar + scroll-spy highlight + smooth scrolling. */

:root {
	--hw-subnav-h: 64px;
	--hw-header-h: 0px; /* set by subnav.js when the site header is sticky */
}

.hw-subnav-page {
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	.hw-subnav-page {
		scroll-behavior: auto;
	}
}

.hw-subnav {
	position: sticky;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--hw-header-h));
	z-index: 90; /* below the theme's sticky .primary-menu (10000) */
	transition: box-shadow 0.2s ease, background-color 0.2s ease;
}

.hw-subnav.is-stuck {
	box-shadow: 0 6px 18px rgba(20, 36, 86, 0.12);
}

.hw-subnav .wp-block-buttons {
	flex-wrap: nowrap;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding: 2px 0;
}

.hw-subnav .wp-block-buttons::-webkit-scrollbar {
	display: none;
}

/* Centered when there is room, left-aligned (no clipped pills) when the row overflows. */
.hw-subnav .wp-block-buttons.is-layout-flex {
	justify-content: flex-start;
}

.hw-subnav .wp-block-button {
	flex: 0 0 auto;
}

.hw-subnav .wp-block-button:first-child {
	margin-left: auto;
}

.hw-subnav .wp-block-button:last-child {
	margin-right: auto;
}

.hw-subnav .wp-block-button__link {
	white-space: nowrap;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.hw-subnav .wp-block-button:not(.is-active) .wp-block-button__link:hover {
	background-color: rgba(255, 255, 255, 0.55) !important;
}

.hw-subnav .wp-block-button.is-active .wp-block-button__link {
	background-color: #ffffff !important;
	font-weight: 600 !important;
	box-shadow: 0 2px 6px rgba(20, 36, 86, 0.1);
}

/* Anchor targets land just below the sticky bar. */
.hw-subnav-target {
	scroll-margin-top: calc(var(--hw-subnav-h) + var(--hw-header-h) + var(--wp-admin--admin-bar--height, 0px) + 24px);
}

/* Side variant (.hw-subnav--side): vertical index in a column, e.g. Condizioni di acquisto. */
.hw-subnav--side {
	--hw-subnav-gap: 24px;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--hw-header-h) + var(--hw-subnav-gap));
	max-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px) - var(--hw-header-h) - var(--hw-subnav-gap));
	overflow-y: auto;
	scrollbar-width: thin;
}

.hw-subnav--side.is-stuck {
	box-shadow: none;
}

.hw-subnav--side a {
	display: inline-block;
	padding: 2px 0;
	text-decoration: none;
	transition: color 0.2s ease, padding-left 0.2s ease;
}

.hw-subnav--side a:hover {
	text-decoration: underline;
}

.hw-subnav--side a.is-active {
	font-weight: 600;
	color: var(--wp--preset--color--custom-blue, inherit);
}

.hw-subnav--side li:has(> a.is-active)::marker {
	color: var(--wp--preset--color--custom-blue, currentColor);
}

/* Side index: anchor targets only need to clear the header (the index is beside, not above). */
.hw-subnav-page--side .hw-subnav-target {
	scroll-margin-top: calc(var(--hw-header-h) + var(--wp-admin--admin-bar--height, 0px) + 24px);
}
