/* Sticky site header. The WordPress admin bar scrolls away on narrow screens, so no offset there. */
@media screen {
	.wp-site-blocks > header.wp-block-template-part {
		inset-block-start: var(--wp-admin--admin-bar--height, 0px);
		position: sticky;
		z-index: 60;
	}

	/*
	 * Anchor jumps land below the compact bar instead of underneath it. This is set on the
	 * targets, not as page scroll padding, so focusing a control inside the sticky header never
	 * scrolls the page.
	 */
	main :where([id]) {
		scroll-margin-block-start: calc(var(--wp-admin--admin-bar--height, 0px) + 5.5rem);
	}
}

@media screen and (max-width: 600px) {
	.wp-site-blocks > header.wp-block-template-part {
		inset-block-start: 0;
	}

	main :where([id]) {
		scroll-margin-block-start: 5rem;
	}
}

.llt-site-header__marker {
	block-size: 1px;
	inline-size: 1px;
	inset-inline-start: 0;
	pointer-events: none;
	position: absolute;
	visibility: hidden;
}

.llt-site-header > .wp-block-group {
	transition: background-color 180ms ease, box-shadow 180ms ease, padding 180ms ease;
}

/* The labeled select is the expanded control; the icon buttons belong to the compact bar. */
.llt-appearance-toggle,
.llt-appearance-toggle[hidden] {
	display: none;
}

/*
 * Compact state. The header keeps its expanded height in the page flow (set by site-header.js)
 * and lets clicks pass through the empty space below the shortened bar.
 */
html.llt-header-compact .llt-site-header {
	min-block-size: var(--llt-header-block-size, auto);
	pointer-events: none;
}

html.llt-header-compact .wp-site-blocks > header.llt-site-header > .wp-block-group {
	background: var(--llt-color-main);
	border-block-end-color: transparent;
	box-shadow: inset 0 -0.2rem 0 var(--llt-color-accent), 0 0.5rem 1.4rem rgba(0, 17, 38, 0.22);
	color: var(--llt-color-white);
	padding-block: var(--wp--preset--spacing--20) !important;
	pointer-events: auto;
}

html.llt-header-compact .llt-site-header > .wp-block-group > .wp-block-group {
	align-items: center;
	flex-wrap: nowrap;
}

html.llt-header-compact .llt-site-header :where(.wp-block-site-title, .wp-block-site-title a) {
	color: var(--llt-color-white) !important;
}

html.llt-header-compact .llt-site-header .wp-block-site-title {
	font-size: clamp(1.05rem, 0.95rem + 0.5vw, 1.3rem);
}

html.llt-header-compact .llt-site-header .llt-brand-mark {
	width: 2rem;
}

html.llt-header-compact .llt-site-header .llt-brand-mark .llt-mark--color {
	display: none;
}

html.llt-header-compact .llt-site-header .llt-brand-mark .llt-mark--reversed {
	display: block;
}

html.llt-header-compact .llt-site-header .llt-appearance {
	display: none;
}

html.llt-header-compact .llt-site-header .llt-appearance-toggle:not([hidden]) {
	border: 1px solid rgba(252, 252, 252, 0.34);
	border-radius: var(--llt-radius-line);
	display: inline-flex;
	gap: 0.15rem;
	margin-inline-start: auto;
	padding: 0.15rem;
}

/* Menu links fold into the menu button on every screen size while compact. */
html.llt-header-compact .llt-site-header .wp-block-navigation__responsive-container-open {
	color: var(--llt-color-white);
	display: flex;
}

html.llt-header-compact .llt-site-header .wp-block-navigation__responsive-container:not(.is-menu-open) {
	display: none;
}

.llt-appearance-toggle__button {
	align-items: center;
	background: transparent;
	block-size: var(--llt-control-min-size);
	border: 0;
	border-radius: var(--llt-radius-line);
	color: var(--llt-color-white);
	cursor: pointer;
	display: inline-flex;
	font-size: 1.05rem;
	inline-size: var(--llt-control-min-size);
	justify-content: center;
	padding: 0;
}

.llt-appearance-toggle__button:hover {
	background: rgba(252, 252, 252, 0.12);
}

/* Theme 0.23.0: on the navy compact bar the selected choice is the light secondary style, not gold. */
.llt-appearance-toggle__button[aria-pressed="true"] {
	background: var(--wp--preset--color--white, #fcfcfc);
	color: var(--wp--preset--color--main, #002147);
}

.llt-appearance-toggle__button:focus-visible {
	outline: 2px solid var(--llt-color-accent);
	outline-offset: 2px;
}

.llt-appearance-toggle__icon {
	align-items: center;
	display: inline-flex;
}

.llt-appearance-toggle__icon :where(.svg-inline--fa, .llt-appearance-toggle__fallback) {
	block-size: 1.1em;
	inline-size: 1.1em;
}

.llt-appearance-toggle__icon .svg-inline--fa + .llt-appearance-toggle__fallback {
	display: none;
}

/* Phone icon on small screens, monitor icon on larger ones. */
.llt-appearance-toggle__icon--desktop {
	display: none;
}

@media (min-width: 782px) {
	.llt-appearance-toggle__icon--mobile {
		display: none;
	}

	.llt-appearance-toggle__icon--desktop {
		display: inline-flex;
	}
}

/*
 * Phones: one header row in the expanded state too. The labeled Appearance select gives way to
 * the same phone/sun/moon buttons the compact bar uses, styled for the light header.
 */
@media screen and (max-width: 600px) {
	.llt-site-header > .wp-block-group > .wp-block-group {
		align-items: center;
		flex-wrap: nowrap;
		gap: 0.5rem;
	}

	.llt-site-header .wp-block-site-title {
		align-items: center;
		display: flex;
		flex: 1 1 auto;
		gap: 0.5rem;
		min-inline-size: 0;
	}

	.llt-site-header .llt-appearance {
		display: none;
	}

	.llt-site-header .llt-appearance-toggle:not([hidden]) {
		border: 1px solid var(--llt-color-line);
		border-radius: var(--llt-radius-line);
		display: inline-flex;
		gap: 0.15rem;
		margin-inline-start: auto;
		padding: 0.15rem;
	}

	html:not(.llt-header-compact) .llt-site-header .llt-appearance-toggle__button {
		color: var(--llt-color-ink);
	}

	html:not(.llt-header-compact) .llt-site-header .llt-appearance-toggle__button:hover {
		background: color-mix(in srgb, var(--llt-color-main) 8%, transparent);
	}

	html:not(.llt-header-compact) .llt-site-header .llt-appearance-toggle__button[aria-pressed="true"] {
		background: var(--llt-color-main);
		color: var(--llt-color-white);
	}

	html:not(.llt-header-compact) .llt-site-header .llt-appearance-toggle__button:focus-visible {
		outline-color: var(--llt-color-main);
	}

	/* Theme 0.23.0: the selected choice uses the primary navy (with a light-blue ring in dark mode), not gold. */
	html[data-llt-scheme="dark"]:not(.llt-header-compact) .llt-site-header .llt-appearance-toggle__button[aria-pressed="true"] {
		background: var(--llt-color-main);
		box-shadow: inset 0 0 0 1px var(--llt-color-link);
		color: var(--llt-color-white);
	}
}

/* On phones the compact bar shows the mark only; the site name stays the link's accessible text. */
@media (max-width: 600px) {
	html.llt-header-compact .llt-site-header .wp-block-site-title {
		position: relative;
	}

	html.llt-header-compact .llt-site-header .wp-block-site-title a {
		color: transparent !important;
		inset: 0;
		overflow: hidden;
		position: absolute;
		white-space: nowrap;
	}

	html.llt-header-compact .llt-site-header .wp-block-site-title a:focus-visible {
		outline: 2px solid var(--llt-color-accent);
		outline-offset: 2px;
	}
}

/* Theme 0.24.0: the short site name (LLTBX) on phones; the full name everywhere else. */
.llt-site-title__short {
	display: none;
}

@media (max-width: 600px) {
	.llt-site-title__short {
		display: inline;
		white-space: nowrap;
	}

	.llt-site-title__full {
		block-size: 1px;
		clip-path: inset(50%);
		inline-size: 1px;
		overflow: hidden;
		position: absolute;
		white-space: nowrap;
	}
}

/* Breadcrumbs */
.llt-breadcrumbs {
	font-family: var(--llt-font-body);
	font-size: 0.875rem;
	line-height: 1.4;
	margin-block-end: var(--wp--preset--spacing--30);
}

.llt-breadcrumbs__list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 0.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.llt-breadcrumbs__item {
	align-items: baseline;
	display: inline-flex;
	gap: 0.5rem;
}

.llt-breadcrumbs__item[hidden] {
	display: none;
}

.llt-breadcrumbs__item + .llt-breadcrumbs__item::before {
	content: "›" / "";
	opacity: 0.7;
}

.llt-breadcrumbs a {
	color: inherit;
	text-underline-offset: 0.2em;
}

.llt-breadcrumbs [aria-current="page"] {
	font-weight: 650;
}

.llt-breadcrumbs--band {
	color: var(--llt-color-white);
}

.llt-breadcrumbs--band a,
html[data-llt-scheme="dark"] .llt-breadcrumbs--band a:not(.wp-element-button) {
	color: var(--llt-color-white);
}

.llt-breadcrumbs--title {
	color: var(--llt-color-muted);
}

.llt-breadcrumbs--plain {
	color: var(--llt-color-muted);
	margin-block-start: var(--wp--preset--spacing--40);
}

@media print {
	.wp-site-blocks > header.wp-block-template-part {
		position: static;
	}

	.llt-appearance-toggle,
	.llt-site-header__marker {
		display: none !important;
	}
}

@media (forced-colors: active) {
	html.llt-header-compact .llt-site-header > .wp-block-group {
		border-block-end: 2px solid CanvasText;
	}

	.llt-appearance-toggle__button[aria-pressed="true"] {
		outline: 2px solid Highlight;
	}
}

/* Header search: the site menu and the search icon sit together at the end of the bar. */
.llt-header-tools {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	gap: 0.5rem;
	margin-inline-start: auto;
}

.llt-header-search {
	margin: 0;
}

.llt-header-search .wp-block-search__inside-wrapper {
	align-items: center;
	border: 0;
	gap: 0.35rem;
	padding: 0;
}

.llt-header-search .wp-block-search__button {
	align-items: center;
	background: transparent;
	block-size: var(--llt-control-min-size, 2.75rem);
	border: 1px solid color-mix(in srgb, currentColor 34%, transparent);
	border-radius: var(--llt-radius-line, 0.375rem);
	box-shadow: none;
	color: inherit;
	display: inline-flex;
	inline-size: var(--llt-control-min-size, 2.75rem);
	justify-content: center;
	margin: 0;
	padding: 0;
}

.llt-header-search .wp-block-search__button svg {
	block-size: 1.35rem;
	fill: currentColor;
	inline-size: 1.35rem;
	min-block-size: 0;
	min-inline-size: 0;
}

.llt-header-search .wp-block-search__button:hover {
	background: color-mix(in srgb, currentColor 12%, transparent);
}

.llt-header-search .wp-block-search__button:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.llt-header-search:not(.wp-block-search__searchfield-hidden) .wp-block-search__input {
	background: var(--llt-color-surface, #fff);
	border: 1px solid var(--llt-color-line, #767676);
	border-radius: var(--llt-radius-line, 0.375rem);
	color: var(--llt-color-ink, #1a1a1a);
	min-block-size: var(--llt-control-min-size, 2.75rem);
	inline-size: min(16rem, 40vw);
	padding-inline: 0.75rem;
}

html.llt-header-compact .llt-site-header .llt-header-search .wp-block-search__button {
	color: var(--llt-color-white);
}

/* On phones the opened field drops below the bar at full width instead of crowding it. */
@media screen and (max-width: 600px) {
	.llt-site-header > .wp-block-group {
		position: relative;
	}

	.llt-header-search:not(.wp-block-search__searchfield-hidden) .wp-block-search__input {
		box-shadow: 0 0.5rem 1.4rem rgba(0, 17, 38, 0.22);
		inline-size: auto;
		inset-block-start: calc(100% + 0.25rem);
		inset-inline: var(--wp--style--root--padding-left, 1rem) var(--wp--style--root--padding-right, 1rem);
		position: absolute;
		z-index: 2;
	}
}

/* The narrowest phones: a tighter bar so the site name stays on one line. */
@media screen and (max-width: 359px) {
	.llt-header-tools {
		gap: 0.15rem;
	}

	.llt-header-search .wp-block-search__button {
		border-color: transparent;
		inline-size: 2.25rem;
	}

	.llt-site-header > .wp-block-group > .wp-block-group {
		gap: 0.35rem;
	}

	.llt-site-header .llt-appearance-toggle__button {
		block-size: 2.25rem;
		inline-size: 2.25rem;
	}
}

@media print {
	.llt-header-search {
		display: none !important;
	}
}