$button-background-color: dynamic(transparent);
$button-border-color: dynamic($button-background-color);
$button-border-width: dynamic(1px);
$button-border-radius: dynamic(.5em);
$button-border-style: dynamic(solid);
$button-color: dynamic($base-color);
$button-pressed-color: dynamic($base-light-color);
$button-disabled-color: dynamic($neutral-dark-color);

$button-font-weight: dynamic($font-weight-normal);

$button-line-height: dynamic(1.1429em);
$button-line-height-big: dynamic(1.25em);
$button-padding: dynamic(0.2143em 0);
$button-padding-big: dynamic(0.3125em 0);
$button-icon-color: dynamic($button-color);
$button-icon-size: dynamic(px-to-em(16px, 14px));
$button-icon-size-big: dynamic(px-to-em(24px, 16px));
$button-pressed-icon-color: dynamic($button-pressed-color);

@mixin button-confirm-ui {
    @include button-ui(
        $ui: 'confirm',
        $color: $ios-green,
        $pressed-color: mix(#fff, $ios-green, 70%)
    );
}

@mixin button-alt-ui {
    @include button-ui(
        $ui: 'alt',
        $color: #fff,
        $background-color: $ios-blue,
        $pressed-background-color: $button-pressed-color,
        $padding: 0.2143em 0.714em,
        $padding-big: 0.3125em .9375em
    );
}

@mixin button-decline-ui {
    @include button-ui(
        $ui: 'decline',
        $color: $ios-red,
        $pressed-color: mix(#fff, $ios-red, 70%)
    );
}

@mixin button-segmented-ui {
    @include button-ui(
        $ui: 'segmented',
        $color: $base-color,
        $border-color: $base-color,
        $background-color: $background-color,
        $pressed-background-color: $base-color,
        $pressed-color: #fff,
        $border-radius: 0.3rem,
        $padding: 0.2143em 0.714em,
        $padding-big: 0.3125em .9375em
    );
}

@mixin button-action-ui {
    @include button-ui(
        $ui: 'action',
        $font-weight: $font-weight-bold
    )
}