.fw-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--chip-gap);
  padding: var(--chip-padding-vertical) var(--chip-padding-horizontal);
  font-size: var(--chip-font-size);
  border-radius: var(--chip-border-radius);
  border: var(--chip-border-thickness) solid var(--chip-border-color);
  background-color: var(--chip-background-color);
  color: var(--chip-text-color);
  cursor: pointer;
  transition: background-color var(--transition-timing-fast) var(--transition-ease-1), color var(--transition-timing-fast) var(--transition-ease-1);
  -webkit-tap-highlight-color: transparent;
}
.fw-chip[aria-pressed=true] {
  background-color: var(--chip-background-color-selected);
  color: var(--chip-text-color-selected);
}

.fw-chip-set {
  display: flex;
  flex-wrap: wrap;
  gap: var(--chip-gap);
}

.chip-remove {
  display: inline-flex;
  background: transparent;
  border: none;
  padding: 0;
}

@media (prefers-reduced-motion: reduce) {
  .fw-chip {
    transition: none;
  }
}
.fw-chip-select {
  display: none;
  appearance: none;
  -webkit-appearance: none;
  max-width: 100%;
  min-height: 0;
  padding: var(--chip-padding-vertical) calc(var(--chip-padding-horizontal) + 20px) var(--chip-padding-vertical) var(--chip-padding-horizontal);
  font-family: var(--button-font-family);
  font-size: var(--chip-font-size);
  font-weight: var(--font-weight-bold);
  line-height: 1.4;
  color: var(--chip-text-color);
  background-color: var(--chip-background-color);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='currentColor' stroke-width='1.5'/></svg>");
  background-repeat: no-repeat;
  background-position: right var(--chip-padding-horizontal) center;
  border: var(--chip-border-thickness) solid var(--chip-border-color);
  border-radius: var(--chip-border-radius);
  cursor: pointer;
}
.fw-chip-select option {
  background-color: var(--color-white);
  color: var(--color-type-body);
}

@media screen and (max-width: 767px) {
  .fw-chip-set[data-fw-chip-filter] {
    display: none;
  }
  .fw-chip-select {
    display: inline-block;
  }
}
