.container {
  width: 100%;
}

.tabs {
  display: flex;
  gap: var(--Spacing-x1);
  padding: var(--Spacing-x3) 0;
  flex-wrap: wrap;
}

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(251px, 1fr));
  gap: var(--Spacing-x2);
  height: 470px;
  overflow-y: auto;
  padding-right: var(--Spacing-x-one-and-half);
  margin-top: var(--Spacing-x2);
}

.chip {
  border-radius: var(--Corner-radius-rounded);
  padding: calc(var(--Space-x1) + var(--Space-x025)) var(--Space-x2);
  cursor: pointer;
  border: 1px solid var(--Border-Interactive-Default);
  color: var(--Text-Default);
  background-color: var(--Background-Secondary);
}

.chip.selected {
  background: var(--Surface-Brand-Primary-3-Default);
  color: var(--Text-Inverted);
}
