.site-header__search {
  position: relative;
  flex: 1 1 30rem;
  max-inline-size: 42rem;
}

.product-search {
  display: grid;
  min-block-size: 2.85rem;
  align-items: center;
  grid-template-columns: auto minmax(0, 1fr) auto;
  border: 1px solid var(--store-border);
  border-radius: 999px;
  background: var(--store-surface);
  box-shadow: none;
  transition: border-color .18s;
}

.product-search:focus-within {
  border-color: var(--store-focus-color);
}

.product-search svg {
  inline-size: 1.1rem;
  block-size: 1.1rem;
  margin-inline-start: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  color: var(--store-muted);
}

.product-search input {
  min-inline-size: 0;
  block-size: 2.75rem;
  border: 0;
  outline: 0;
  padding-inline: .75rem;
  color: var(--store-text);
  background: transparent;
  font: inherit;
}

.product-search button {
  align-self: stretch;
  border: 0;
  border-radius: 999px;
  border-start-start-radius: 0;
  border-end-start-radius: 0;
  padding-inline: 1.15rem;
  color: #fff;
  background: var(--store-accent);
  font: inherit;
  font-weight: 750;
  cursor: pointer;
  transition: background-color .18s;
}

.product-search button:hover { background: var(--store-accent-hover); }
.product-search button:active { background: var(--store-accent-active); }

.product-search-suggestions {
  position: absolute;
  z-index: 50;
  inset-block-start: calc(100% + .6rem);
  inset-inline: 0;
  overflow: hidden;
  border: 1px solid var(--store-border);
  border-radius: 1rem;
  background: var(--store-surface);
  box-shadow: 0 1.2rem 2.5rem rgba(23, 34, 28, .16);
}

.product-search-suggestions__group { padding: .65rem; }
.product-search-suggestions__group + .product-search-suggestions__group { border-block-start: 1px solid var(--store-border); }
.product-search-suggestions__group > strong {
  display: block;
  padding: .4rem .55rem;
  color: var(--store-muted);
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.product-search-suggestions__item {
  display: grid;
  align-items: center;
  grid-template-columns: 2.6rem minmax(0, 1fr) auto;
  gap: .75rem;
  border-radius: .7rem;
  padding: .5rem .55rem;
  color: var(--store-text);
  text-decoration: none;
}

.product-search-suggestions__item:focus,
.product-search-suggestions__item:hover,
.product-search-suggestions__item.is-active {
  outline: 0;
  background: color-mix(in srgb, var(--store-accent) 9%, var(--store-surface));
}

.product-search-suggestions__media {
  display: grid;
  inline-size: 2.6rem;
  block-size: 2.6rem;
  place-items: center;
  overflow: hidden;
  border-radius: .55rem;
  background: var(--store-background);
  font-weight: 800;
}

.product-search-suggestions__media img { inline-size: 100%; block-size: 100%; object-fit: cover; }
.product-search-suggestions__copy { display: grid; min-inline-size: 0; }
.product-search-suggestions__copy strong,
.product-search-suggestions__copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-search-suggestions__copy small { color: var(--store-muted); }
.product-search-suggestions__price { font-weight: 800; white-space: nowrap; }
.product-search-suggestions__all {
  display: block;
  border-block-start: 1px solid var(--store-border);
  padding: .85rem 1rem;
  color: var(--store-accent);
  font-weight: 750;
  text-align: center;
  text-decoration: none;
}
.product-search-suggestions__empty { margin: 0; padding: 1.2rem; color: var(--store-muted); text-align: center; }

@media (max-width: 48rem) {
  .product-search button { padding-inline: .9rem; }
  .product-search-suggestions { position: fixed; inset-block-start: auto; inset-inline: 1rem; }
}