/* ===== Native SearchWP Live Search results panel: pin the CoA CTA to the
   bottom, keep the result list scrollable above it. The panel's own
   show/hide (opacity/height transition, driven by the
   .searchwp-live-search-results-showing class) is handled by the plugin
   itself in wp_footer, so no extra animation work is needed here — just
   override its layout to a flex column while showing. That footer style
   block is printed after this stylesheet, so !important is required to
   win the cascade for equal-specificity rules (overflow, display). */
.searchwp-live-search-results.searchwp-live-search-results-showing {
	display: flex !important;
	flex-direction: column;
	max-height: calc(100vh - 160px);
	overflow: hidden !important;
	box-sizing: border-box;
	overscroll-behavior: contain; /* DLS-189: a scroll that reaches the end of the panel never passes on to the page behind it */
}

/* Anchor the results panel to the search input's container.
   SearchWP appends the panel to <body> and writes inline left/top/width from a
   one-off measurement that is only redone on window.resize, so a sticky header,
   the mobile search reveal or a late-loading banner leaves it mispositioned.
   ssc-coa-search-cta.js re-parents the panel into the container; these rules
   override the stale inline geometry so the panel always tracks the input. */
.searchwp-form-input-container {
	position: relative;
}

/* Monthly maintenance: 2026-10 */

.searchwp-form-input-container > .searchwp-live-search-results {
	position: absolute !important;
	top: 100% !important;
	left: 0 !important;
	right: auto !important;
	width: 100% !important;
	min-width: 0 !important;
	max-width: 100% !important;
	/* As a <body> child the panel painted above the page by document order.
	   Nested in the header it shares that stacking context, and the header is
	   a plain .elementor-section (z-index only while sticky-active), so later
	   positioned sections would paint over it. */
	z-index: 9999;
}

/* The plugin's own stylesheet floors the panel at min-height: 175px, which pads
   a one- or two-result dropdown out to a full-height box. Drop the floor so the
   panel sizes to its content. !important because this ties on specificity with
   the plugin's own .searchwp-live-search-results rule, and the winner would
   otherwise depend on plugin load order. */
.searchwp-live-search-results {
	min-height: 0 !important;
}

.searchwp-live-search-results-showing > div:not(.coa-search-cta),
.searchwp-live-search-results-showing > .searchwp-live-search-no-results {
	flex: 1 1 auto;
	overflow-y: auto;
	overscroll-behavior: contain; /* DLS-189: same as the panel, so the end of the list does not scroll the page (iPad touch/momentum) */
	-webkit-overflow-scrolling: touch;
	min-height: 0;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding: 0;
}

.searchwp-live-search-results-showing > div:not(.coa-search-cta)::-webkit-scrollbar,
.searchwp-live-search-results-showing > .searchwp-live-search-no-results::-webkit-scrollbar {
	width: 0;
	height: 0;
	display: none;
}

/* Loading state. .spinner exists only while a request is in flight and the
   plugin adds no class for it. The :not() guard keeps the plugin's own
   "Continue typing" ::after intact, which shares this element. */
.searchwp-live-search-results-showing:not(.searchwp-live-search-no-min-chars):has(> .spinner)::after {
	content: "Searching…";
	display: block;
	text-align: center;
	padding: 10px;
	font-size: 16px;
	line-height: 24px;
}

/* Align the plugin's own "Continue typing" message with the panel's padding
   and type scale. */
.searchwp-live-search-no-min-chars:after {
	padding: 10px !important;
	font-size: 16px;
	line-height: 24px;
}

.searchwp-live-search-results .searchwp-live-search-result {
	padding: 12px 15px;
	transition: background-color 0.20s ease;
}

.searchwp-live-search-results .searchwp-live-search-result:hover {
	background-color: #f5f5f5;
}

.searchwp-live-search-results .searchwp-live-search-result--title {
	margin: 0;
}

.searchwp-live-search-result .searchwp-live-search-result--title a {
	font-size: 14px;
	line-height: 21px;
	font-weight: 500;
	border-color: transparent;
}

.searchwp-live-search-result .searchwp-live-search-result--title a mark.searchwp-highlight {
	font-weight: 600;
	color: #0073aa;
	background-color: transparent;
}

.searchwp-live-search-results > .coa-search-cta {
	flex: 0 0 auto;
	display: block;
	position: relative;
	z-index: 2;
	background-color: #3D264F;
	color: #FFFFFF;
	font-family: "Lato", Sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0.3px;
	padding: 12px 15px;
	text-align: center;
	text-decoration: none;
	transition: background-color 0.15s ease;
}

.searchwp-live-search-results > .coa-search-cta:hover,
.searchwp-live-search-results > .coa-search-cta:focus {
	color: #FFFFFF;
	text-decoration: underline;
}

.searchwp-live-search-results > .coa-search-cta:focus-visible {
	outline: 2px solid #3D264F;
	outline-offset: -4px;
}

.searchwp-live-search-results .coa-search-cta-link {
	text-decoration: underline;
	font-weight: 600;
}

/* ===== "Focus before typing" fallback bar =====
   A small standalone panel showing just the CTA, for the moment an input
   is focused but the native results panel doesn't exist yet (it only
   appears once the visitor starts typing). Reuses the native panel's
   look (background/shadow/radius/position from the plugin's own CSS)
   via the shared .searchwp-live-search-results class, positioned
   relative to the input's own parent instead of the plugin's
   document-relative absolute positioning. */
.searchwp-live-search-results.coa-search-cta-fallback {
	position: absolute;
	top: 100%;
	left: 0 !important;
	width: 100% !important;
	min-width: 0 !important;
	min-height: 0;
}

.coa-search-cta-fallback.coa-search-cta-fallback-showing {
	display: block !important;
	opacity: 1 !important;
	height: auto !important;
	overflow: visible !important;
}

.coa-search-cta-fallback .coa-search-cta {
	display: block;
	position: static;
	background-color: #3D264F;
	color: #FFFFFF;
	font-family: "Lato", Sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0.3px;
	padding: 12px 15px;
	text-align: center;
	text-decoration: none;
	border-radius: 3px;
	transition: background-color 0.15s ease;
}

.coa-search-cta-fallback .coa-search-cta:hover,
.coa-search-cta-fallback .coa-search-cta:focus {
	background-color: #FD7521;
	color: #FFFFFF;
	text-decoration: none;
}

.coa-search-cta-fallback .coa-search-cta:focus-visible {
	outline: 2px solid #3D264F;
	outline-offset: -4px;
}

.coa-search-cta-fallback .coa-search-cta-link {
	text-decoration: underline;
	font-weight: 600;
}

.header-search-col .elementor-widget-wrap.elementor-element-populated {
    padding: 0 !important; /* DLS-142: the header height now comes from the section padding, not from this */
}
.header-search-col .elementor-element.elementor-element-56d4a40e > .elementor-widget-container {
    padding: 0 !important; /* DLS-142: the header height now comes from the section padding, not from this */
}