.Pill {
  @extend .Font__caption;
  @extend .Font__caption--10;

  display: flex;
  justify-content: center;
  align-items: center;
  background: #353e5c;
  border-radius: 15px;
  color: $color-white;
  width: fit-content;
  height: 20px;
  padding: 0 8px;

  &--hasTooltip {
    cursor: pointer;
  }

  &__content {
    padding-top: 2px;
  }

  &__changeAmount {
    margin: 2px 4px 0 0;
  }

  &__period {
    margin: 2px 0 0 4px;
  }

  &__separator--string {
    padding-top: 2px;
  }

  &__wrapper {
    width: -moz-fit-content;
    width: fit-content;
  }
}