select {
  outline: none;
  height: var(--form-component-height);
  min-width: 100px;
  max-width: 200px;
  padding: 4px 35px 4px 12px;
  font-size: var(--font-size-sm);
  font-weight: var(--weight-light);
  font-family: 'Inter', sans-serif;
  border: solid 1px var(--color-border-primary);
  color: var(--color-text-secondary);
  border-radius: var(--border-radius-md);
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: var(--color-bg-primary) var(--select-chevron) no-repeat;
  background-position-x: calc(100% - 8px);
  background-position-y: 12px;

  /* Kinds */

  &.borderless {
    border: 0;
    border-radius: 0;
  }

  /* Kinds */

  /* Sizes */

  &.expand {
    width: 100%;
    max-width: 100%;
  }

  /* Sizes */
}

@media(min-width: 1240px) {
  select {
    max-width: 275px;
  }
}