/**
 * Montagemarkt productzoek — shortcode [montagemarkt_search]
 */


/* Forceer parent menu-<li> om mee te groeien — de zoekbalk wordt door
   walker_nav_menu_start_el in een nav <li> geïnjecteerd, en de meeste
   thema's geven die <li> een vaste/krappe breedte. */
li:has(> form.lts-search),
li:has(> .lts-search),
.menu-item:has(.lts-search),
.nav-item:has(.lts-search) {
	flex: 1 1 auto !important;
	width: auto !important;
	max-width: none !important;
	min-width: 320px !important;
}
@media (min-width: 1024px) {
	li:has(> form.lts-search),
	li:has(> .lts-search),
	.menu-item:has(.lts-search),
	.nav-item:has(.lts-search) {
		min-width: 520px !important;
	}
}

.lts-search {
	position: relative;
	display: block;
	width: 100% !important;
	max-width: none !important;
	min-width: 320px !important;
	font-family: inherit;
	direction: ltr !important;
	flex: 1 1 auto !important;
	box-sizing: border-box !important;
}
@media (min-width: 1024px) {
	.lts-search { min-width: 520px !important; }
}
@media (max-width: 720px) {
	.lts-search {
		max-width: 100% !important;
		min-width: 0 !important;
	}
	/* Mobiel menu: zoekbalk volle breedte, scherp (geen afgeronde hoeken),
	   en boven het assortiment-kopje (order: -1 als parent een flex/grid is). */
	li:has(> form.lts-search),
	li:has(> .lts-search),
	.menu-item:has(.lts-search),
	.nav-item:has(.lts-search) {
		min-width: 0 !important;
		width: 100% !important;
		order: -1 !important;
		padding: 12px 16px !important;
		margin: 0 0 8px 0 !important;
		box-sizing: border-box !important;
	}
	.lts-search .lts-search__inner,
	.lts-search__inner {
		border-radius: 0 !important;
		height: 44px !important;
	}
	.lts-search .lts-search__input,
	.lts-search__input {
		height: 42px !important;
		min-height: 42px !important;
		max-height: 42px !important;
		line-height: 42px !important;
	}
}

.lts-search .lts-search__inner,
.lts-search__inner {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	background: #fff !important;
	border: 1px solid #d0d5dd !important;
	border-radius: 999px !important;
	overflow: hidden !important;
	height: 38px !important;
	padding: 0 !important;
	direction: ltr !important;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.lts-search__inner:focus-within {
	border-color: #1a73e8;
	box-shadow: 0 0 0 3px rgba(26,115,232,.15);
}

.lts-search .lts-search__input,
.lts-search__input {
	order: 1 !important;
	flex: 1 1 auto !important;
	border: 0 !important;
	outline: none !important;
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 8px 0 18px !important;
	margin: 0 !important;
	font-size: 14px !important;
	color: #222 !important;
	min-width: 0 !important;
	width: auto !important;
	height: 36px !important;
	min-height: 36px !important;
	max-height: 36px !important;
	line-height: 36px !important;
	box-sizing: border-box !important;
}

.lts-search .lts-search__submit,
.lts-search__submit {
	order: 99 !important;
	flex: 0 0 auto !important;
	flex-shrink: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 36px !important;
	height: 36px !important;
	background: transparent !important;
	border: 0 !important;
	color: #5f6368 !important;
	cursor: pointer !important;
	padding: 0 !important;
	margin: 0 6px 0 auto !important;
}
.lts-search__submit:hover { color: #1a73e8; }
.lts-search__submit svg { width: 18px; height: 18px; }

/* Dropdown — breder dan input zodat alle info goed past. */
.lts-search__results {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	width: 560px;
	max-width: 92vw;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 14px;
	box-shadow: 0 12px 32px rgba(0,0,0,.12);
	max-height: 480px;
	overflow-y: auto;
	z-index: 10000;
	padding: 8px;
}

.lts-search__results[hidden] { display: none; }

.lts-search .lts-search__item,
.lts-search__item {
	display: flex !important;
	align-items: center !important;
	gap: 16px !important;
	padding: 12px 16px !important;
	border-radius: 10px !important;
	text-decoration: none !important;
	color: inherit !important;
	cursor: pointer !important;
	text-align: left !important;
}
.lts-search__item:hover,
.lts-search__item--active {
	background: #f5f7fb;
}

.lts-search__thumb {
	width: 56px;
	height: 56px;
	flex-shrink: 0;
	background: #f5f5f5;
	border-radius: 6px;
	object-fit: contain;
	display: inline-block;
}

.lts-search .lts-search__meta,
.lts-search__meta {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 4px !important;
	text-align: left !important;
	align-items: flex-start !important;
	padding: 0 !important;
	margin: 0 !important;
}
.lts-search .lts-search__title,
.lts-search__title {
	display: -webkit-box !important;
	-webkit-line-clamp: 2 !important;
	-webkit-box-orient: vertical !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	color: #1f2937 !important;
	line-height: 1.3 !important;
	overflow: hidden !important;
	word-break: break-word !important;
	text-align: left !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}
.lts-search .lts-search__sub,
.lts-search__sub {
	display: block !important;
	width: 100% !important;
	font-family: inherit !important;
	font-size: 12px !important;
	font-weight: 400 !important;
	color: #8e9398 !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	text-align: left !important;
	align-self: flex-start !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Prijs in zoekresultaten — exact dezelfde styling als compact-card prijs.
   Vaste min-width + margin-left: auto zodat alle prijs-blokken op identieke
   X-positie beginnen, ongeacht prijslengte of titel-lengte.
   align-self: flex-start zorgt dat de prijs op dezelfde hoogte begint als de titel. */
.lts-search__price {
	flex: 0 0 130px !important;
	width: 130px !important;
	min-width: 130px !important;
	margin-left: auto !important;
	padding-left: 0 !important;
	align-self: flex-start !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
}
/* Prijs-stijling: zie assets/lts-price.css (single source of truth). */

/* Titels mogen 2 regels wrappen — geen nowrap erfen. */
.lts-search .lts-search__title,
.lts-search__title {
	white-space: normal !important;
}

.lts-search__empty,
.lts-search__loading {
	padding: 14px;
	font-size: 13px;
	color: #6b7280;
	text-align: center;
}

.lts-search__footer {
	border-top: 1px solid #eef0f3;
	padding: 10px 12px;
	font-size: 12px;
	color: #1a73e8;
	cursor: pointer;
	text-align: center;
	border-radius: 0 0 10px 10px;
	margin-top: 4px;
}
.lts-search__footer:hover { background: #f1f5fb; }

/* Mobile: dropdown gaat over de volle viewport-breedte minus marge en
   wordt fixed gepositioneerd zodat hij niet uit de header valt. */
@media (max-width: 720px) {
	.lts-search__results {
		position: fixed;
		top: auto;
		left: 12px;
		right: 12px;
		width: auto;
		max-width: none;
		max-height: 70vh;
	}
	.lts-search__thumb { width: 48px; height: 48px; }
	.lts-search__title { font-size: 14px; }
	.lts-search__price { font-size: 14px; min-width: 70px; padding-left: 10px; }
	.lts-search__item { padding: 10px 12px; gap: 12px; }
}