.filters-toolbar .search-wrapper {
  flex-grow: 1;
  min-width: 200px;
  max-width: 100%;
}

.filters-toolbar .btn,
.commands-btn-group .btn {
  white-space: nowrap;
  border-radius: 12px;
  margin: 2.5px;
}

.filter-btn {
  border: 1px solid transparent;
  transition: all 0.35s ease-in-out;
  background-color: color-mix(in srgb, var(--btn-color) 20%, transparent) !important;
}

.filter-btn:hover,
.filter-btn.active {
  background-color: var(--btn-color) !important;
  outline: none;
}

.commands-btn-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

@media (max-width: 576px) {
  .filters-toolbar .d-flex {
    flex-direction: column;
    align-items: stretch;
  }

  .filters-toolbar .search-wrapper,
  .filters-toolbar button {
    width: 100%;
  }
}