.btn {

  small {
    display: block;
    margin-bottom: 2px;
    text-transform: none;
  }

}

// OPTYMALIZACJA
@each $color, $value in $theme-colors {
  .btn.#{$color} {
    @include button-outline-variant($value);
  }
}

@each $color, $value in $theme-colors {
  .btn.#{$color}.inverse {
    @include button-variant($value, $value);
    color: $white;
  }
}

.btn__txt {
  font: {
    weight: bold;
  };

  @include icon(chevron-double-right, after);
  &::after {
    margin-left: .2em;
    color: inherit;
  }
}

.btn__text.download{
  @include icon(arrow-alt-circle-right, after);

  &::after {
    transform: rotate(90deg);
    display: inline-block;
    vertical-align: middle;
  }
}

.btn__text.play {
  @include icon(play, after);
}


.btn.download,
.btn.btn-download,
.btn-download,
.button-download {
  @extend %btn;
  @extend %btn-download;
  @include button-variant(map-get($colors, 'red'), map-get($colors, 'red'));
}

.btn.play,
.btn.btn-play,
.btn-play,
.button-online {
  @extend %btn;
  @extend %btn-play;
  @include button-variant(map-get($colors, 'red'), map-get($colors, 'red'));
}

.link-download {
  @extend .btn__txt;
  @extend .primary;
  @extend .download;
}

.link-online {
  @extend .btn__txt;
  @extend .primary;
  @include icon(play, after);
}

.btn.fill {
  @extend .btn-fill;
}


.td__more__link {
  @extend %btn-more;
  @include button-outline-variant($btn-more-color);
}

@each $color, $value in $theme-colors {
  .btn.#{$color}.more {
    @include button-outline-variant($value);
  }
}


.btn.more.white:not(:hover) {
  color: white !important;
  border-color: white !important;
}


//.btn.more {
//  @extend %btn;
//  @extend %btn-more;
//}
//
//.td__more__link {
//  @extend %btn-more;
//  //@extend .btn;
//  //@extend .btn--more;
//}

// OPTYMALIZACJA END







.btn-fill {
  @each $color, $value in $theme-colors {
    &:not(.download).#{$color}:not(.play).#{$color} {
      @include button-variant($value, $value);
    }
  }
}




.btn--more {
  @extend %btn-more;

  &:hover {
    color: white !important;
  }
}

@each $color, $value in $theme-colors {
  .#{$color} .btn--more,
  .#{$color}.btn--more {
    @include button-outline-variant($value, $value);
  }

  .btn--#{$color} {
    @include button-outline-variant($value);
  }
}