@use '~@moda/om';

.Badge {
  @include om.text(eyebrow);
  display: inline-block;
  color: om.color(ink);
  border: 1px solid;
  padding: om.space(1);
  user-select: none;

  &,
  &--default {
    background-color: transparent;
    border-color: om.color(fog);
    color: om.color(cement);
  }

  &--forest-green {
    background-color: om.color(forest-green);
    border-color: transparent;
    color: om.color('snow');
  }

  &--klein-blue {
    background-color: om.color(klein-blue);
    border-color: transparent;
    color: om.color('snow');
  }

  &--brick {
    background-color: om.color(brick);
    border-color: transparent;
    color: om.color('snow');
  }

  &--dark-fuchsia {
    border-color: om.color(dark-fuchsia);
    color: om.color(dark-fuchsia);
    font-weight: 700;
    text-transform: none;
  }

  &--noise {
    @include om.text(body1);

    background-color: om.color(noise);
    border-color: transparent;
    color: om.color(ink);
    text-transform: none;
    line-height: 1.4;
  }
}