/* The sticky positioning and frosted-glass background of the header live in
 * the theme stylesheet (header.wp-block-template-part). This file only
 * collapses the utility bar (account, search, language) once the page is
 * scrolled, so the sticky header shrinks to the logo + navigation row. */
html.hb-header-scrolled header.wp-block-template-part {
	box-shadow: 0 1px 8px rgba(6, 26, 63, 0.12);
}

/* No overflow clipping at rest: the language-switcher dropdown is an
 * absolutely positioned list that must be able to escape the bar. Clipping
 * only applies while the bar is collapsed. */
.header-utility-bar {
	max-height: 6rem;
	transition:
		max-height 0.25s ease,
		padding-top 0.25s ease,
		opacity 0.2s ease,
		visibility 0s linear 0s;
}

html.hb-header-scrolled .header-utility-bar {
	max-height: 0;
	overflow: hidden;
	padding-top: 0 !important;
	opacity: 0;
	/* Also removes the bar's links from the tab order while hidden. */
	visibility: hidden;
	transition:
		max-height 0.25s ease,
		padding-top 0.25s ease,
		opacity 0.2s ease,
		visibility 0s linear 0.25s;
}

@media (prefers-reduced-motion: reduce) {
	.header-utility-bar,
	html.hb-header-scrolled .header-utility-bar {
		transition: none;
	}
}
