/**
 * Live AJAX dropdown: “Inhalte” rows (Woodmart + WK Search Typesense).
 * Keeps Woodmart layout but adds card-like affordance, excerpt, placeholder icon.
 */

.wd-search-suggestions .wd-suggestion.wk-search-content-hit {
	align-items: flex-start;
	gap: 12px;
	padding: 10px 12px;
	margin: 4px 0;
	border-radius: calc(var(--wd-brd-radius, 8px) * 0.75);
	border: 1px solid color-mix(in srgb, var(--wd-form-brd-color, rgba(0, 0, 0, 0.12)) 85%, transparent);
	background: color-mix(in srgb, var(--color-gray-100, rgba(0, 0, 0, 0.03)) 70%, transparent);
	transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

/* When Woodmart hides thumbnails, still give content rows a clear visual anchor */
.wd-search-suggestions .wd-suggestion.wk-search-content-hit:not(:has(.wd-suggestion-thumb)) {
	border-inline-start: 3px solid color-mix(in srgb, var(--wd-primary-color, #83b735) 42%, transparent);
	padding-inline-start: 13px;
}

.wd-search-suggestions .wd-suggestion.wk-search-content-hit:hover,
.wd-search-suggestions .wd-suggestion.wk-search-content-hit.wd-active {
	border-color: color-mix(in srgb, var(--wd-primary-color, #83b735) 35%, var(--wd-form-brd-color, rgba(0, 0, 0, 0.12)));
	background: color-mix(in srgb, var(--wd-primary-color, #83b735) 7%, #fff);
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
}

.wd-search-suggestions .wd-suggestion.wk-search-content-hit .wd-suggestion-thumb {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-inline-end: 0;
	border-radius: 8px;
	background: color-mix(in srgb, var(--wd-form-brd-color, rgba(0, 0, 0, 0.08)) 55%, transparent);
	color: color-mix(in srgb, var(--wd-form-color, #767676) 90%, #000);
}

.wd-search-suggestions .wd-suggestion.wk-search-content-hit .wd-suggestion-thumb img {
	max-width: 38px;
	max-height: 38px;
	width: 38px;
	height: 38px;
	object-fit: cover;
	border-radius: 6px;
}

.wd-search-suggestions .wk-search-content-thumb-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.wd-search-suggestions .wd-suggestion.wk-search-content-hit .wd-suggestion-content {
	flex: 1;
	min-width: 0;
	--wd-mb: 4px;
}

.wd-search-suggestions .wd-suggestion.wk-search-content-hit .wd-entities-title {
	font-size: 0.95em;
	font-weight: 600;
	line-height: 1.25;
}

.wd-search-suggestions .wd-suggestion.wk-search-content-hit .wk-search-suggestion-excerpt {
	margin: 6px 0 0 !important;
	padding: 0 !important;
	font-size: 0.82em;
	line-height: 1.35;
	color: color-mix(in srgb, var(--wd-form-color, #767676) 92%, #000);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Product AJAX row: variant / needle subtitle (injected next to title; Woodmart puts price after) */
.wd-search-suggestions .wk-search-suggestion-variant {
	display: block;
	margin-top: 4px;
	font-size: 0.84em;
	line-height: 1.3;
	font-weight: 500;
	color: color-mix(in srgb, var(--wd-form-color, #767676) 88%, #000);
}

/* Section title: slightly clearer hierarchy */
.wd-search-suggestions .suggestion-divider-title.title,
.wd-search-suggestions .wd-search-title.title {
	letter-spacing: 0.04em;
	font-weight: 600;
	opacity: 0.88;
	padding-top: 10px;
	padding-bottom: 6px;
}

/* Fullscreen / larger panels: allow a slightly looser grid for content groups */
[class*='wd-search-full-screen'] .wd-suggestions-group[class*='wd-type-']:not(.wd-type-product):not(.wd-type-categories) {
	gap: 6px 10px;
}