/*
 * Elkan 5e styling for the SearchWP Live Ajax Search dropdown.
 *
 * Matches the site's card look (familiar panel): white card, thin warm
 * border, brand-red accent, 10px radius, soft shadow. Raleway titles,
 * Jost labels. No separate dark styles are needed: the DarkLooks switch
 * inverts the whole page, so this light card flips with everything else.
 */

.searchwp-live-search-results {
	--elkan-ls-red: #8b1a1a;
	--elkan-ls-border: #e3d0c9;
	--elkan-ls-hover: #f8ece8;
	--elkan-ls-muted: #6b5a55;

	background: #fff !important;
	border: 1px solid var(--elkan-ls-border) !important;
	border-top: 3px solid var(--elkan-ls-red) !important;
	border-radius: 0 0 10px 10px !important;
	box-shadow: 0 10px 28px rgba(60, 20, 15, 0.16), 0 2px 6px rgba(60, 20, 15, 0.08) !important;
	max-height: min(70vh, 460px) !important;
	overflow-y: auto !important;
	overscroll-behavior: contain;
	padding: 4px 0 !important;
	font-family: Jost, -apple-system, BlinkMacSystemFont, sans-serif;
	box-sizing: border-box;
}

/* A bit wider than the narrow header box on screens that have the room. */
@media (min-width: 600px) {
	.searchwp-live-search-results {
		min-width: 340px;
	}
}

.searchwp-live-search-results .searchwp-live-search-results-container {
	padding: 0 !important;
	margin: 0 !important;
}

/* One row per result. */
.searchwp-live-search-results .searchwp-live-search-result {
	display: block !important;
	position: relative;
	padding: 8px 14px 9px !important;
	margin: 0 !important;
	border: 0 !important;
	border-bottom: 1px solid #f1e6e2 !important;
	background: transparent !important;
	cursor: pointer;
	transition: background-color 0.12s ease;
}

.searchwp-live-search-results .searchwp-live-search-result:last-child {
	border-bottom: 0 !important;
}

.searchwp-live-search-results .searchwp-live-search-result:hover,
.searchwp-live-search-results .searchwp-live-search-result[aria-selected="true"] {
	background: var(--elkan-ls-hover) !important;
}

/* Keyboard-selected row gets the red accent bar too. */
.searchwp-live-search-results .searchwp-live-search-result[aria-selected="true"]::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 3px;
	background: var(--elkan-ls-red);
}

/* The grey placeholder picture adds nothing here - none of the content has thumbnails. */
.searchwp-live-search-results .searchwp-live-search-result--img {
	display: none !important;
}

.searchwp-live-search-results .searchwp-live-search-result--info {
	display: block !important;
	padding: 0 !important;
	margin: 0 !important;
	width: auto !important;
}

/* Content-type label (added by live-search.js), e.g. "SPELL", "RANGER SUBCLASS". */
.searchwp-live-search-results .elkan-ls-type {
	display: block;
	font-family: Jost, -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--elkan-ls-red);
	line-height: 1.3;
	margin: 0 0 1px;
}

.searchwp-live-search-results .searchwp-live-search-result--title {
	margin: 0 !important;
	padding: 0 !important;
	font-family: Raleway, Jost, sans-serif !important;
	font-size: 1rem !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

.searchwp-live-search-results .searchwp-live-search-result--title a {
	color: #1a1a1a !important;
	text-decoration: none !important;
	display: block;
}

/* Make the whole row the click target. */
.searchwp-live-search-results .searchwp-live-search-result--title a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.searchwp-live-search-results .searchwp-live-search-result:hover .searchwp-live-search-result--title a,
.searchwp-live-search-results .searchwp-live-search-result[aria-selected="true"] .searchwp-live-search-result--title a {
	color: var(--elkan-ls-red) !important;
}

/* Matched text, highlighted by live-search.js. */
.searchwp-live-search-results mark.elkan-ls-hit {
	background: transparent;
	color: inherit;
	font-weight: 800;
	text-decoration: underline;
	text-decoration-color: rgba(139, 26, 26, 0.45);
	text-decoration-thickness: 2px;
	text-underline-offset: 2px;
}

/* Footer link to the full results page (added by live-search.js). */
.searchwp-live-search-results .elkan-ls-all {
	display: block;
	padding: 9px 14px 8px;
	border-top: 1px solid var(--elkan-ls-border);
	font-size: 0.85rem;
	font-weight: 500;
	color: var(--elkan-ls-red) !important;
	text-decoration: none !important;
	background: #fcf7f5;
}

.searchwp-live-search-results .elkan-ls-all:hover,
.searchwp-live-search-results .elkan-ls-all:focus {
	background: var(--elkan-ls-hover);
	text-decoration: underline !important;
}

/* No results. */
.searchwp-live-search-results .searchwp-live-search-no-results {
	margin: 0 !important;
	padding: 12px 14px !important;
	font-family: Jost, -apple-system, BlinkMacSystemFont, sans-serif;
	font-size: 0.92rem;
	font-style: normal;
	color: var(--elkan-ls-muted);
}

.searchwp-live-search-results .searchwp-live-search-no-results .searchwp-live-search-no-results {
	padding: 0 !important;
}

.searchwp-live-search-results .searchwp-live-search-no-results em {
	font-style: normal;
}

/* Loading spinner in brand red. */
.searchwp-live-search-results .searchwp-live-search-results-spinner,
.searchwp-live-search-results .spinner {
	color: var(--elkan-ls-red) !important;
}

/* Thin scrollbar that matches the card. */
.searchwp-live-search-results::-webkit-scrollbar {
	width: 8px;
}
.searchwp-live-search-results::-webkit-scrollbar-thumb {
	background: #dcc6bf;
	border-radius: 8px;
}
.searchwp-live-search-results {
	scrollbar-width: thin;
	scrollbar-color: #dcc6bf transparent;
}