.Chip {
  border-radius: 4px;
  width: fit-content;

  &--type-default {
    background-color: $color-gray-140;
    color: $color-gray-10;
    padding: 5px 8px;
  }

  &--type-warning {
    -webkit-box-shadow: inset 0px 0px 0px 1px $color-orange-light;
    -moz-box-shadow: inset 0px 0px 0px 1px $color-orange-light;
    box-shadow: inset 0px 0px 0px 1px $color-orange-light;
    background-color: $color-white;
    color: $color-orange-dark;
    padding: 5px 8px;
  }

  &--type-sim {
    background-color: $color-violet;
    color: $color-white;
    width: 190px;
    height: 30px;
    padding: 5px 0px 5px 8px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;

    &__button {
      width: 28px;
      height: 28px;
      border-color: $color-white;
      box-sizing: border-box;
      margin-right: 1px;
      &:active,
      &:focus {
        background-color: $color-violet-darker;
      }
      div.Button__icon--right {
        padding: 0px !important;
        margin: auto;
      }
      &:hover:not(:focus):not(:active) {
        background-color: $color-violet-dark;
      }
    }
  }

  &__text {
    @extend .Font__body;
    @extend .Font__body--10;
  }
}