.filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
}

.filter-search {
  position: relative;
  flex: 1 1 220px;
  min-width: 180px;
}

.filter-search-icon {
  position: absolute;
  left: 0.65rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--gray-400);
  font-size: 0.85rem;
  pointer-events: none;
}

.filter-search-input {
  width: 100%;
  padding: 0.42rem 0.75rem 0.42rem 2rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-control);
  background: var(--color-surface);
  font-size: var(--font-size-sm);
  color: var(--color-text);
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}

.filter-search-input::placeholder { color: var(--gray-400); }

.filter-search-input:focus {
  border-color: var(--brand-blue-light);
  box-shadow: var(--focus-ring);
}

.filter-select {
  flex: 0 1 160px;
  min-width: 130px;
  border-radius: var(--radius-control) !important;
  border-color: var(--color-border) !important;
  background: var(--color-surface);
  font-size: var(--font-size-sm);
}

.form-control, .form-select {
  border-radius: var(--radius-control);
  border-color: var(--color-border-strong);
}

.form-label {
  font-weight: 500;
  color: var(--color-text);
}