/**
 * Charta 2.3.5 — global header search and member actions.
 *
 * These controls are rendered on every public template, so their layout must
 * not depend on the enterprise homepage stylesheet being present.
 */

.site-header .charta-header-actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 1rem;
	min-width: 0;
	margin-left: auto;
}

.site-header .charta-header-tools,
.site-header .wp-block-shortcode .charta-header-tools,
.site-header .wp-block-shortcode:has(.charta-header-tools) {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end;
	gap: .65rem !important;
	width: auto;
	min-width: max-content;
	margin: 0 !important;
	padding: 0 !important;
}

.site-header .wp-block-shortcode:has(.charta-header-tools),
.site-header .wp-block-shortcode .charta-header-tools {
	line-height: 1;
}

.site-header .charta-header-tools > * {
	box-sizing: border-box;
	margin: 0 !important;
}

.site-header .charta-header-search {
	position: relative;
	display: block;
	margin: 0;
}

.site-header .charta-header-search summary {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	width: auto !important;
	min-width: 76px;
	min-height: 42px;
	margin: 0 !important;
	padding: 0 .85rem !important;
	border: 1px solid rgba(255, 255, 255, .14) !important;
	border-radius: 6px !important;
	background: transparent !important;
	box-shadow: none !important;
	color: rgba(255, 255, 255, .86) !important;
	font-size: .9rem !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	text-decoration: none !important;
	cursor: pointer;
	list-style: none;
	white-space: nowrap;
	transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}

.site-header .charta-header-search summary::-webkit-details-marker,
.site-header .charta-header-search summary::marker {
	display: none;
	content: "";
}

.site-header .charta-header-search summary:hover,
.site-header .charta-header-search summary:focus-visible,
.site-header .charta-header-search[open] summary {
	border-color: rgba(255, 255, 255, .32) !important;
	background: rgba(255, 255, 255, .07) !important;
	color: #ffffff !important;
}

.site-header .charta-header-search summary svg,
.site-header .charta-header-member-button svg {
	display: block !important;
	flex: 0 0 17px !important;
	width: 17px !important;
	min-width: 17px !important;
	max-width: 17px !important;
	height: 17px !important;
	min-height: 17px !important;
	max-height: 17px !important;
	margin: 0 !important;
	padding: 0 !important;
	fill: currentColor !important;
	stroke: none !important;
}

.site-header .charta-header-search summary span,
.site-header .charta-header-member-button span {
	display: inline !important;
	margin: 0 !important;
	font: inherit !important;
	line-height: 1 !important;
	white-space: nowrap;
}

.site-header .charta-header-search form {
	position: absolute !important;
	top: calc(100% + 14px) !important;
	right: 0 !important;
	left: auto !important;
	z-index: 1000 !important;
	display: flex !important;
	align-items: stretch;
	width: min(440px, 88vw) !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 12px !important;
	border: 1px solid #d7e1ec !important;
	border-radius: 8px !important;
	background: #ffffff !important;
	box-shadow: 0 20px 55px rgba(3, 20, 38, .24) !important;
}

.site-header .charta-header-search form::before {
	position: absolute;
	top: -7px;
	right: 34px;
	width: 12px;
	height: 12px;
	border-top: 1px solid #d7e1ec;
	border-left: 1px solid #d7e1ec;
	background: #ffffff;
	content: "";
	transform: rotate(45deg);
}

.site-header .charta-header-search form label {
	display: block;
	flex: 1 1 auto;
	min-width: 0;
	margin: 0 !important;
}

.site-header .charta-header-search form input[type="search"] {
	display: block;
	width: 100% !important;
	height: 44px !important;
	min-height: 44px !important;
	margin: 0 !important;
	padding: 0 14px !important;
	border: 1px solid #d8e2ed !important;
	border-radius: 5px 0 0 5px !important;
	background: #ffffff !important;
	box-shadow: none !important;
	color: #17263a !important;
	font-size: .94rem !important;
	line-height: 44px !important;
	outline: 0;
}

.site-header .charta-header-search form input[type="search"]:focus {
	position: relative;
	z-index: 1;
	border-color: #2463eb !important;
	box-shadow: 0 0 0 3px rgba(36, 99, 235, .12) !important;
}

.site-header .charta-header-search form button {
	flex: 0 0 auto;
	min-width: 74px;
	height: 44px !important;
	min-height: 44px !important;
	margin: 0 !important;
	padding: 0 16px !important;
	border: 0 !important;
	border-radius: 0 5px 5px 0 !important;
	background: #2463eb !important;
	box-shadow: none !important;
	color: #ffffff !important;
	font-size: .9rem !important;
	font-weight: 700 !important;
	line-height: 44px !important;
	cursor: pointer;
}

.site-header .charta-header-search form button:hover,
.site-header .charta-header-search form button:focus-visible {
	background: #174ec7 !important;
}

.site-header .charta-header-member-button {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: .48rem;
	width: auto !important;
	min-width: 104px;
	min-height: 42px;
	margin: 0 !important;
	padding: 0 1rem !important;
	border: 1px solid rgba(201, 168, 95, .62) !important;
	border-radius: 6px !important;
	background: rgba(201, 168, 95, .08) !important;
	box-shadow: none !important;
	color: #f0d99f !important;
	font-size: .9rem !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	text-decoration: none !important;
	white-space: nowrap;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.site-header .charta-header-member-button:hover,
.site-header .charta-header-member-button:focus-visible {
	border-color: #d8bb77 !important;
	background: #c9a85f !important;
	color: #071a2e !important;
	text-decoration: none !important;
}

@media (max-width: 1180px) {
	.site-header .charta-header-tools {
		margin-left: auto !important;
	}
}

@media (max-width: 900px) {
	.site-header .charta-header-actions {
		flex-wrap: wrap !important;
	}

	.site-header .charta-header-tools,
	.site-header .wp-block-shortcode:has(.charta-header-tools) {
		width: 100%;
		min-width: 0;
	}

	.site-header .charta-header-tools {
		justify-content: flex-end;
		padding: .65rem 0 .25rem !important;
		border-top: 1px solid rgba(255, 255, 255, .08);
	}
}

@media (max-width: 620px) {
	.site-header .charta-header-search summary span,
	.site-header .charta-header-member-button span {
		display: none !important;
	}

	.site-header .charta-header-search summary,
	.site-header .charta-header-member-button {
		width: 42px !important;
		min-width: 42px !important;
		max-width: 42px !important;
		padding: 0 !important;
	}

	.site-header .charta-header-search form {
		right: 0 !important;
		left: auto !important;
		width: min(360px, calc(100vw - 24px)) !important;
	}
}

@media (max-width: 420px) {
	.site-header .charta-header-search form {
		position: fixed !important;
		top: 78px !important;
		right: 12px !important;
		left: 12px !important;
		width: auto !important;
	}

	.site-header .charta-header-search form::before {
		display: none;
	}
}

/**
 * Charta 2.3.6 — keep the desktop header in one stable row.
 *
 * The header template nests navigation and tools inside .charta-header-actions.
 * display:contents lets the outer row become a true three-column layout:
 * brand | navigation | search/member tools.
 */
@media (min-width: 981px) {
	.site-header .charta-header-row {
		display: grid !important;
		grid-template-columns: max-content minmax(0, 1fr) max-content !important;
		align-items: center !important;
		column-gap: clamp(.8rem, 1.8vw, 1.75rem) !important;
		width: min(var(--charta-enterprise-width, 1360px), 100%) !important;
		min-height: 92px !important;
		padding: 0 !important;
		flex-wrap: nowrap !important;
	}

	.site-header .charta-header-brand {
		grid-column: 1 !important;
		min-width: 0 !important;
		max-width: 390px;
		margin: 0 !important;
	}

	.site-header .charta-header-actions {
		display: contents !important;
		width: auto !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
	}

	.site-header .wp-block-navigation {
		grid-column: 2 !important;
		justify-self: center !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: 100% !important;
		margin: 0 !important;
	}

	.site-header .wp-block-navigation .wp-block-navigation__responsive-container,
	.site-header .wp-block-navigation .wp-block-navigation__responsive-container-content {
		width: 100%;
		min-width: 0;
	}

	.site-header .wp-block-navigation .wp-block-navigation__container {
		display: flex !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		justify-content: center !important;
		width: 100% !important;
		min-width: 0 !important;
		gap: clamp(.05rem, .32vw, .3rem) !important;
	}

	.site-header .wp-block-navigation .wp-block-navigation-item {
		flex: 0 0 auto !important;
		white-space: nowrap !important;
	}

	.site-header .wp-block-shortcode:has(.charta-header-tools),
	.site-header .charta-header-tools {
		grid-column: 3 !important;
		justify-self: end !important;
		flex-wrap: nowrap !important;
		width: auto !important;
		min-width: max-content !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
	}
}

/* Compress only the medium desktop range instead of sending menu items to row two. */
@media (min-width: 981px) and (max-width: 1280px) {
	.site-header .charta-header-row {
		column-gap: .7rem !important;
	}

	.site-header .charta-header-brand {
		gap: .65rem !important;
	}

	.site-header .charta-header-brand:has(.wp-block-site-logo img) .charta-header-brand-text {
		display: none !important;
	}

	.site-header .wp-block-navigation {
		font-size: .84rem !important;
		letter-spacing: 0 !important;
	}

	.site-header .wp-block-navigation .wp-block-navigation__container {
		gap: 0 !important;
	}

	.site-header .wp-block-navigation .wp-block-navigation-item__content {
		padding-right: .5rem !important;
		padding-left: .5rem !important;
	}

	.site-header .charta-header-tools,
	.site-header .wp-block-shortcode:has(.charta-header-tools) {
		gap: .45rem !important;
	}

	.site-header .charta-header-search summary {
		min-width: 68px !important;
		padding-right: .65rem !important;
		padding-left: .65rem !important;
	}

	.site-header .charta-header-member-button {
		min-width: 96px !important;
		padding-right: .72rem !important;
		padding-left: .72rem !important;
	}
}

/* Below tablet/compact-desktop width, use the theme's deliberate responsive layout. */
@media (max-width: 980px) {
	.site-header .charta-header-row {
		display: flex !important;
	}
}

/*--------------------------------------------------------------
# Charta 2.4.1 Text Logo Fallback
--------------------------------------------------------------*/
/* When no image Logo is configured, the site name becomes the main Logo. */
.site-header .charta-header-brand--text-logo {
	gap: 0 !important;
	max-width: min(460px, 100%) !important;
}

.site-header .charta-header-brand--text-logo .wp-block-site-logo {
	display: none !important;
}

.site-header .charta-header-brand--text-logo .charta-header-brand-text {
	display: grid !important;
	padding-left: 0 !important;
	border-left: 0 !important;
	gap: .2rem !important;
}

.site-header .charta-header-brand--text-logo .wp-block-site-title,
.site-header .charta-header-brand--text-logo .charta-header-site-title {
	font-size: clamp(1.55rem, 2vw, 1.9rem) !important;
	font-weight: 800 !important;
	line-height: 1.12 !important;
	letter-spacing: .025em !important;
}

.site-header .charta-header-brand--text-logo .charta-header-tagline {
	font-size: .78rem !important;
	line-height: 1.35 !important;
}

@media (max-width: 620px) {
	.site-header .charta-header-brand--text-logo {
		width: calc(100% - 44px) !important;
		align-items: center !important;
		flex-wrap: nowrap !important;
	}

	.site-header .charta-header-brand--text-logo .charta-header-brand-text {
		display: grid !important;
		min-width: 0;
	}

	.site-header .charta-header-brand--text-logo .wp-block-site-title,
	.site-header .charta-header-brand--text-logo .charta-header-site-title {
		font-size: clamp(1.42rem, 6.5vw, 1.68rem) !important;
		line-height: 1.15 !important;
		white-space: normal;
	}
}

/* Charta 2.5.4 — move the text-only Logo slightly farther left. */
@media (min-width: 1281px) {
	.site-header .charta-header-brand--text-logo {
		transform: translateX(-30px);
	}
}

@media (min-width: 981px) and (max-width: 1280px) {
	.site-header .charta-header-brand--text-logo {
		transform: translateX(-18px);
	}
}



/*--------------------------------------------------------------
# Charta 2.4.3 Header Action Alignment
--------------------------------------------------------------*/
/* Move only the search/member action group closer to the right edge on
 * desktop. Navigation, Logo and the responsive mobile layout stay unchanged. */
@media (min-width: 1281px) {
	.site-header .charta-header-actions > .wp-block-shortcode,
	.site-header .charta-header-actions > .charta-header-tools {
		transform: translateX(30px);
	}
}

@media (min-width: 981px) and (max-width: 1280px) {
	.site-header .charta-header-actions > .wp-block-shortcode,
	.site-header .charta-header-actions > .charta-header-tools {
		transform: translateX(14px);
	}
}
