/* Town picker (assets/js/town-picker.js): type-to-filter list, about five towns visible, then scroll. */
.sl-picker { position: relative; display: block; flex: 1 1 auto; min-width: 0; width: 100%; }
.sl-picker-input { cursor: text; text-overflow: ellipsis; }
.sl-picker-list {
	position: absolute; z-index: 60; left: 0; right: 0; top: calc(100% + 8px);
	min-width: 230px; max-height: calc(5 * 42px + 8px); overflow-y: auto; overscroll-behavior: contain;
	margin: 0; padding: 4px; list-style: none;
	background: #fff; border: 1px solid #d5ded5; border-radius: 8px;
	box-shadow: 0 14px 30px rgba(23, 52, 78, .18);
}
.sl-picker-list[hidden] { display: none; }
.sl-picker-list li {
	padding: 10px 12px; border-radius: 6px; cursor: pointer;
	color: var(--ink, #17344e); font: 400 14px/22px -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sl-picker-list li:hover, .sl-picker-list li.is-active { background: #eef4ea; }
.sl-picker-list li[aria-selected="true"] { font-weight: 700; color: var(--green, #315d2b); }
.sl-picker-list li.sl-picker-none { cursor: default; color: #7c877d; background: none; }
/* Homepage hero bar: the list lines up under the town field and is never narrower than it. */
.search-town .sl-picker-list { left: -38px; right: -16px; }
@media (max-width: 760px) { .search-town .sl-picker-list { left: -30px; right: 0; } }