/*
 * TASK-183: Listeo's own sidebar search widget ("Filter services", the
 * `[listeo_search_form]` sidebar variant rendered on every listing
 * archive/taxonomy page) puts its category drilldown (`.drilldown-menu`)
 * inside a narrow ~108-140px column. Listeo's own CSS sizes the opened
 * `.menu-panel` to `width: 100%` of that same narrow trigger, with
 * `overflow: hidden` — so multi-word category names ("Transportation",
 * "Other services") get clipped mid-word, and the floating panel
 * (`z-index: 1000`) visually overlapped the "Search" button sitting right
 * below it. Never touches listeo-core; this only widens the panel Listeo's
 * own JS already opens/positions, and anchors it to the trigger's right
 * edge instead of the left — safer against viewport overflow on every
 * width, since this widget is consistently the right-most field in its row.
 */
.drilldown-menu .menu-panel {
	min-width: 220px;
	width: max-content;
	max-width: 280px;
	left: auto;
	right: 0;
}

/*
 * On narrow (mobile) widths the whole search bar stacks to near
 * full-width — cap the panel to the viewport so it can never spill past
 * the screen edge on a small phone.
 */
@media (max-width: 480px) {
	.drilldown-menu .menu-panel {
		max-width: calc(100vw - 32px);
	}
}
