/// Change button size.
///
/// This mixin will change size button in terms of media queries.
///
/// @group buttons
///
/// @example scss - Usage
///
///   $buttonBigOptions: (
///     typography-step: -2,
///     line-height: 50px,
///     radius: 0px,
///     width: 200px,
///     icon-size: 50px,
///     icon-width: 12px,
///     icon-height: 14px,
///   );
///
///   .k-Button--big {
///     @include k-buttonBig($buttonBigOptions);
///   }
///
/// @example css - CSS output
///   .k-Button--big {
///     @include k-typographyFontSize(-2, 50px);
///
///     padding: 0 25px;
///     border-radius: 0px;
///     min-width: 200px;
///   }
///
///   .k-Button--big.k-Button--icon {
///     .k-Button__icon {
///       @include k-buttonRounded(50px, 12px, 14px);
///     }
///   }

@mixin k-buttonBig($options) {
  $button-step: map-get($options, 'typography-step');
  $button-size-big: map-get($options,'icon-size');
  $button-big-min-width: map-get($options, 'width');
  $button-big-line-height: map-get($options, 'icon-size');
  $button-big-height: map-get($options, 'height');
  $button-big-radius: map-get($options, 'radius');
  $icon-width: map-get($options, 'icon-width');
  $icon-height: map-get($options, 'icon-height');

  @include k-typographyFontSize(
    $button-step,
    $button-big-line-height
  );

  padding: 0 $button-big-height;
  border-radius: $button-big-radius;
  min-width: $button-big-min-width;

  &.k-Button--icon {
    .k-Button__icon {
      @include k-buttonRounded($button-big-radius);
      @include k-buttonPadding(
        $button-size-big,
        $icon-width,
        $icon-height
      );
    }
  }
}