.searchbar {
  display: flex;
  gap: 10px;
  padding: 12px 16px;
  background: transparent;
  backdrop-filter: blur(14px);
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  margin: 12px 0 20px;
}

.searchbar input[type="text"] {
  flex: 2;
  border: none;
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.04);
  padding: 10px 14px;
  color: var(--ink);
  font-size: 14px;
  transition: all 0.2s ease;
}

.searchbar input[type="text"]:focus {
  outline: none;
  background: rgba(255, 255, 255, 0.12);
  Border: 1px solid var(--brand1);
}

.searchbar select,
.searchbar input[type="date"] {
  border-radius: 12px;
  border: none;
  background: rgba(0, 0, 0, 0.04);
  color: var(--ink);
  padding: 8px 12px;
}

.searchbar button {
  border-radius: 999px;
  padding: 8px 14px;
}

.searchbar button:hover {
  filter: brightness(1.06)
}

/* Shared: visually dim + deactivate search bar when not usable */
.searchbar--disabled {
  opacity: .5;              /* feel free to tweak to .40 */
  pointer-events: none;      /* no clicks / focus */
Filter: blur(1px);
}

/* keep placeholder readable */
.searchbar--disabled input::placeholder,
.searchbar--disabled textarea::placeholder,
.searchbar select, .searchbar input[type="date"],
.searchbar button {
  opacity: .4;
}