.flag {
   display: inline-block;

   @if mixin-exists(flag-base) {
      @include flag-base;
   } @else {
      font-size: $font-size-smaller;
      font-weight: $font-weight-bold;
      letter-spacing: $letter-spacing-lg;
      padding: 6px 10px;
      text-transform: uppercase;
   }
}

@each $name, $props in $flags {
   .flag-#{$name} {
      @each $prop, $val in $props {
         #{$prop}: $val;
      }
   }
}

.flag-discount {
   @if mixin-exists(flag-discount) {
      @include flag-discount;
   } @else {
      border-radius: 50%;
      font-size: 18px;
      font-weight: 400;
      letter-spacing: normal;
      line-height: 58px;
      padding: 0;
      text-align: center;
      width: 58px;
      height: 58px;
   }
}
