/*
 * Header site search: Ajax Search Pro instance 1 in compact mode, placed by a Brizy Shortcode
 * element in the header global block, to the left of Member Login.
 * Closed: a white magnifier. Open: a dark pill outlined in white (matching the Member Login
 * button) that slides out to the left on desktop and spans the row on phones.
 * The plugin prints its own instance CSS with ID selectors, hence the !important rules.
 */

/* Put the icon and Member Login on one line. */
.brz .brz-column__items:has(.asp_w_container_1) {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	justify-content: flex-end !important;
	gap: 12px;
	position: relative;
}
.brz .brz-column__items:has(.asp_w_container_1) > .brz-wrapper,
.brz .brz-column__items:has(.asp_w_container_1) > .brz-wrapper-clone {
	width: auto;
	margin: 0 !important;
	flex-shrink: 0 !important;
}

/* The icon keeps a fixed 44px slot; the open field floats out of it without moving the button. */
.brz .brz-wrapper:has(> .brz-wp-shortcode .asp_w_container_1) {
	flex: 0 0 44px !important;
	width: 44px !important;
	min-width: 44px;
	height: 44px;
	position: relative;
	z-index: 30;
}
/* While open, the field sits above Member Login. */
.brz .brz-column__items:has(div.asp_m.asp_m_1[data-asp-compact="open"]) > .brz-wrapper:has(.asp_w_container_1) {
	z-index: 40 !important;
}
.brz .brz-column__items:has(div.asp_m.asp_m_1[data-asp-compact="open"]) .asp_w_container_1 {
	z-index: 40 !important;
}
.brz-wrapper:has(> .brz-wp-shortcode .asp_w_container_1) .brz-wp-shortcode {
	width: 44px;
	height: 44px;
}
.brz .brz-wrapper .asp_w_container_1 {
	position: absolute !important;
	top: 50% !important;
	right: 0 !important;
	transform: translateY(-50%);
}

/* The box */
.asp_w_container_1 div.asp_m.asp_m_1 {
	background: transparent !important;
	border: 2px solid transparent !important;
	border-radius: 999px !important;
	transition: background-color .25s ease, border-color .25s ease;
}
.asp_w_container_1 div.asp_m.asp_m_1[data-asp-compact="open"] {
	background: rgb(35, 35, 35) !important;
	box-shadow: 0 6px 20px rgba(0, 0, 0, .25) !important;
	border-color: #fff !important;
}
.asp_w_container_1 div.asp_m.asp_m_1 .probox {
	margin: 6px 6px 6px 16px !important;
	height: 28px !important;
}
.asp_w_container_1 div.asp_m.asp_m_1[data-asp-compact="closed"] .probox {
	margin: 6px !important;
}
.asp_w_container_1 div.asp_m.asp_m_1 .probox .proinput input.orig {
	font-family: "Poppins", sans-serif !important;
	font-size: 14px !important;
	color: #fff !important;
}
/* Placeholder: one rule per pseudo-element, since a browser drops a whole rule it can't parse. */
.asp_w_container_1 div.asp_m.asp_m_1 .probox .proinput input.orig::placeholder {
	font-family: "Poppins", sans-serif !important;
	font-size: 14px !important;
	color: rgba(255, 255, 255, .75) !important;
	opacity: 1;
}
.asp_w_container_1 div.asp_m.asp_m_1 .probox .proinput input.orig::-webkit-input-placeholder {
	font-family: "Poppins", sans-serif !important;
	font-size: 14px !important;
	color: rgba(255, 255, 255, .75) !important;
	opacity: 1;
}
.asp_w_container_1 div.asp_m.asp_m_1 .probox .proinput input.orig::-moz-placeholder {
	font-family: "Poppins", sans-serif !important;
	font-size: 14px !important;
	color: rgba(255, 255, 255, .75) !important;
	opacity: 1;
}
.asp_w_container_1 div.asp_m.asp_m_1 .probox .proinput input.autocomplete {
	display: none !important;
}
.asp_w_container_1 div.asp_m.asp_m_1 .probox .promagnifier .innericon svg,
.asp_w_container_1 div.asp_m.asp_m_1 .probox .proclose svg {
	fill: #fff !important;
}
.asp_w_container_1 div.asp_m.asp_m_1 .probox .promagnifier .innericon {
	width: 22px !important;
	height: 22px !important;
}

/* Results */
div.asp_r.asp_r_1.vertical {
	background: #fff !important;
	border: 0 !important;
	border-radius: 14px !important;
	padding: 6px !important;
	box-shadow: 0 14px 36px rgba(0, 0, 0, .22) !important;
	font-family: "Poppins", sans-serif !important;
}
div.asp_r.asp_r_1 .asp_group_header {
	background: transparent !important;
	border: 0 !important;
	margin: 0 !important;
	padding: 10px 10px 4px !important;
	font-family: "Poppins", sans-serif !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: rgb(196, 0, 28) !important;
}
div.asp_r.asp_r_1 .results .item {
	border-radius: 10px;
	padding: 8px 10px !important;
}
div.asp_r.asp_r_1.vertical .results .item::after {
	display: none !important;
}
div.asp_r.asp_r_1 .results .item.hovered {
	background: rgb(245, 245, 245) !important;
}
div.asp_r.asp_r_1.vertical .results .item .asp_image {
	width: 56px !important;
	height: 56px !important;
	border-radius: 8px;
	overflow: hidden;
}
div.asp_r.asp_r_1 .results .item .asp_content h3 a,
div.asp_r.asp_r_1 .results .item .asp_content h3 a:hover {
	font-family: "Poppins", sans-serif !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	color: rgb(35, 35, 35) !important;
}
div.asp_r.asp_r_1 .results .item div.asp_content,
div.asp_r.asp_r_1 .asp_nores {
	font-family: "Poppins", sans-serif !important;
	font-size: 13px !important;
	line-height: 1.45 !important;
	color: rgb(100, 100, 100) !important;
}
div.asp_r.asp_r_1 span.highlighted {
	background: transparent !important;
	color: rgb(196, 0, 28) !important;
	font-weight: 600 !important;
}

/* Phones: the open field spans the Member Login row. */
@media (max-width: 767px) {
	.brz .brz-column__items:has(.asp_w_container_1) {
		justify-content: center !important;
	}
	.brz .brz-column__items:has(.asp_w_container_1 div.asp_m.asp_m_1[data-asp-compact="open"]) .brz-wrapper:has(> .brz-wp-shortcode .asp_w_container_1) {
		position: static !important;
	}
	.brz .brz-column__items:has(.asp_w_container_1 div.asp_m.asp_m_1[data-asp-compact="open"]) .asp_w_container_1 {
		left: 0 !important;
		right: 0 !important;
		width: auto !important;
		max-width: none !important;
	}
}
