/* Supplied by the owner on 2026-08-26 and used as given. Nothing in this
 * file is site specific: the cricket wiring is in finder.js and the
 * palette is in finder.css, both of which override rather than edit.
 * Keep it that way, so a newer copy of the component can be dropped in.
 */
/*!
 * Predictive Search — base styles.
 *
 * Every color, radius, and shadow reads from a --ps-* custom property
 * with a neutral fallback, so this file has no opinion about your
 * brand. Override the variables (globally, or scoped to wherever you
 * mount the search box) instead of editing the rules below.
 *
 * The element wrapping your <input> needs `position: relative` so the
 * dropdown positions against it instead of the page. That's the one
 * layout requirement this file doesn't set for you, since it doesn't
 * know your markup.
 */

.ps-suggestions {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  background: var(--ps-bg, #ffffff);
  border: 1px solid var(--ps-border, rgba(0, 0, 0, 0.14));
  border-radius: var(--ps-radius, 10px);
  box-shadow: var(--ps-shadow, 0 14px 28px rgba(0, 0, 0, 0.16));
  list-style: none;
  margin: 0;
  padding: 6px;
  z-index: var(--ps-z, 20);
  max-height: var(--ps-max-height, 320px);
  overflow-y: auto;
  font-family: var(--ps-font, inherit);
}

.ps-suggestions[hidden] {
  display: none;
}

.ps-suggestion {
  display: block;
  padding: 9px 12px;
  border-radius: max(var(--ps-radius, 10px) - 3px, 4px);
  color: var(--ps-text, #17181a);
  font-size: var(--ps-font-size, 0.9rem);
  line-height: 1.4;
  cursor: pointer;
}

.ps-suggestion.active,
.ps-suggestion:hover {
  background: var(--ps-active-bg, rgba(0, 0, 0, 0.06));
  color: var(--ps-active-text, var(--ps-text, #17181a));
}

.ps-suggestion mark {
  background: var(--ps-mark-bg, rgba(255, 196, 0, 0.45));
  color: inherit;
  border-radius: 2px;
  padding: 0 1px;
}

.ps-suggestion-empty {
  color: var(--ps-muted, rgba(0, 0, 0, 0.5));
  cursor: default;
}
.ps-suggestion-empty:hover {
  background: none;
}