@import "../settings/variables";

.pill {
  border: 1px solid;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  padding: 1px spacing(sm);
  display: inline-block;

  &--yellow {
    background-color: $core-yellow-94;
    border-color: $core-yellow-90;
    color: $core-orange-30;
  }

  &--green {
    background-color: $core-green-94;
    border-color: $core-green-90;
    color: $core-green-30;
  }

  &--gray {
    background-color: $core-gray-94;
    border-color: $core-gray-90;
    color: $core-gray-30;
  }

  &--blue {
    background-color: $core-blue-94;
    border-color: $core-blue-90;
    color: $core-blue-50;
  }

  &--red {
    background-color: $core-red-94;
    border-color: $core-red-90;
    color: $core-red-50;
  }
}