/* ── Search page controls ──────────────────────────────────────────────── */

/* Price range wrap: grid layout so label never wraps */
#priceWrap {
  display: grid !important;
  grid-template-columns: max-content 1fr 120px;
  align-items: center;
  gap: 10px;
  width: 100%;
  flex-wrap: nowrap;
}

#priceWrap #maxPrice {
  width: 100%;
  min-width: 0;
}

#priceWrap #maxPriceLabel {
  justify-self: end;
  white-space: nowrap;
  width: 96px;
  min-width: 96px;
}

/* Sort + Availability + Type controls row */
.searchControls {
  display: flex;
  gap: 10px;
  align-items: center;
  width: 100%;
  flex-wrap: wrap;
  justify-content: space-between;
}

.searchControl {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 0;
  justify-content: flex-start;
}

/* Type filter drops to its own line on mobile */
.searchControlType {
  flex: 1 1 100%;
  justify-content: flex-start;
}

.searchControlLabel {
  opacity: 0.8;
  white-space: nowrap;
}

@media (min-width: 641px) {
  .searchControls {
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .searchControl {
    flex: 0 0 auto;
    justify-content: flex-start;
  }

  /* Type rejoins the row on desktop */
  .searchControlType {
    flex: 0 0 auto;
  }

  .searchControl .selectSmall:not(.spiritFilterTrigger) {
    width: auto;
    min-width: 0;
  }
}