/* The results under a product search box (assets/js/live-search.js).
   Colours come from the theme where it has them (a designed theme's palette),
   and fall back to plain ones where it does not. */
.td-ls-open { overflow: visible !important; }
.td-ls {
  position: absolute; z-index: 60; left: -1px; right: auto; top: calc(100% + 6px);
  width: max(100%, 22rem); max-width: calc(100vw - 2rem); box-sizing: border-box;
  background: var(--wp--preset--color--base, #fff);
  color: var(--wp--preset--color--contrast, #111);
  border: 1px solid var(--wp--preset--color--border, #e5e7eb);
  border-radius: var(--wp--custom--radius--large, 10px);
  box-shadow: 0 16px 40px -16px rgb(0 0 0 / .35);
  padding: .375rem; text-align: left;
  max-height: min(70vh, 30rem); overflow-y: auto; overflow-x: hidden;
}
/* A box in the right half of the page opens to the left, so it stays on the page. */
.td-ls.td-ls-right { left: auto; right: -1px; }
.td-ls[hidden] { display: none; }
.td-ls-item {
  display: flex; align-items: center; gap: .75rem;
  padding: .5rem; min-height: 3.5rem;
  border-radius: var(--wp--custom--radius--medium, 8px);
  color: inherit; text-decoration: none; font-size: .9375rem; line-height: 1.3;
}
.td-ls-item:hover, .td-ls-item:focus { background: var(--wp--preset--color--surface, #f5f5f4); outline: 0; }
.td-ls-img { flex: none; width: 2.75rem; height: 2.75rem; object-fit: cover; border-radius: var(--wp--custom--radius--small, 4px); background: var(--wp--preset--color--surface, #f5f5f4); }
.td-ls-text { flex: 1 1 auto; min-width: 0; display: grid; gap: .125rem; }
.td-ls-title { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.td-ls-cat { font-size: .8125rem; color: var(--wp--preset--color--muted, #6b7280); }
.td-ls-price { flex: none; font-weight: 700; white-space: nowrap; }
.td-ls-none { padding: .875rem .5rem; font-size: .9375rem; color: var(--wp--preset--color--muted, #6b7280); }
.td-ls-all {
  display: block; width: 100%; margin-top: .25rem; padding: .625rem .5rem; min-height: 2.75rem;
  border: 0; border-top: 1px solid var(--wp--preset--color--border, #e5e7eb); border-radius: 0;
  background: none; color: var(--wp--preset--color--primary-text, var(--wp--preset--color--primary, #2563eb));
  font: inherit; font-size: .875rem; font-weight: 600; text-align: left; cursor: pointer;
}
.td-ls-all:hover, .td-ls-all:focus { text-decoration: underline; outline: 0; }