/* EM Live Search — matches the EM Audio theme tokens (navy header, red accent) */
.emls-panel {
	position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 1000;
	background: #fff; color: var(--ink, #14171c); text-align: left;
	border-radius: var(--radius, 10px); box-shadow: 0 14px 40px rgba(10, 23, 45, .28), 0 0 0 1px rgba(10, 49, 97, .08);
	max-height: min(70vh, 640px); overflow-y: auto; overscroll-behavior: contain;
	font-family: var(--font, -apple-system, "Segoe UI", Roboto, Arial, sans-serif); font-size: .95rem; line-height: 1.3;
}
.emls-panel[hidden] { display: none; }
.emls-panel::before { content: ""; position: absolute; left: 36px; top: -7px; width: 14px; height: 14px; background: #fff; transform: rotate(45deg); box-shadow: -2px -2px 4px rgba(10,23,45,.06); }
.emls-panel.is-loading { opacity: .7; }
.emls-sec { padding: 6px 0; border-bottom: 1px solid var(--line, #e3e6ea); }
.emls-sec:last-child { border-bottom: 0; }
.emls-head { padding: 6px 16px 4px; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted, #646b76); }
.emls-item { display: flex; align-items: center; gap: 12px; padding: 8px 16px; color: inherit; text-decoration: none; cursor: pointer; }
.emls-item:hover, .emls-item.is-active { background: #eef3fa; color: inherit; text-decoration: none; }
.emls-item.is-active { box-shadow: inset 3px 0 0 var(--red, #8c0808); }
.emls-thumb { flex: 0 0 48px; width: 48px; height: 48px; object-fit: cover; border-radius: 6px; background: #f4f5f7; }
.emls-ico { flex: 0 0 28px; width: 28px; text-align: center; color: var(--muted, #646b76); font-size: 1rem; }
.emls-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.emls-title { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.emls-title b { color: var(--navy, #0a3161); font-weight: 800; }
.emls-sub { font-size: .8rem; color: var(--muted, #646b76); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.emls-right { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: 3px; }
.emls-price { font-weight: 800; color: var(--navy, #0a3161); white-space: nowrap; }
.emls-count { font-size: .8rem; color: var(--muted, #646b76); white-space: nowrap; }
.emls-tag { font-size: .68rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; padding: 2px 6px; border-radius: 4px; }
.emls-pre  { background: var(--red, #8c0808); color: #fff; }
.emls-out  { background: #e9ebee; color: #646b76; }
.emls-back { background: #fff3e0; color: #8a4b00; }
.emls-foot .emls-item { font-weight: 700; color: var(--navy, #0a3161); }
.emls-empty { padding: 10px 16px 6px; color: var(--muted, #646b76); font-size: .88rem; }
/* keep long prices from squeezing the product name out of the row */
.emls-right { max-width: 42%; }
.emls-price { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 600px) {
  /* phones: let a price range break at the dash and long names use two lines instead of cutting off */
  .emls-right { max-width: 32%; }
  .emls-price { white-space: normal; text-align: right; overflow: visible; }
  .emls-title { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
}
@media (max-width: 980px) {
	.emls-panel { max-height: 60vh; font-size: .92rem; }
	.emls-panel::before { display: none; }
	.emls-item { padding: 10px 14px; }
	.emls-sub { display: none; }
}