=standard-button-color($color, $root-color: true)
  @if luma($color) > 90
    $color: shade($color, .5%)
  background-color: $color
  background-image: linear-gradient(to bottom, tint($color, 14%) 0%, shade($color, 14%) 100%)
  border-style: solid
  border-color: shade($color, 14%) shade($color, 22%) shade($color, 30%)
  @if $root-color
    color: luma_contrast_color($color)
    &:hover,
    &.hover,
    &.is-hover,
    &:active,
    &.active,
    &.is-active
      color: luma_contrast_color($color)

=standard-button($color: blue)
  transition: .5s (background-image)
  +standard-button-color($color)
  &:hover,
  &.hover,
  &.is-hover
    +standard-button-color(darken($color, 10%), false)
  &:active,
  &.active,
  &.is-active
    $color: darken($color, 12%)
    box-shadow: darken($color, 16%) 0 1px 1px inset
    +standard-button-color($color, false)
    background-image: linear-gradient(to bottom, shade($color, 14%) 0%, tint($color, 14%) 100%)
    border-color: shade($color, 30%) shade($color, 22%) shade($color, 14%)

  // radio & checkbos
  &.is-radio,
  &.is-checkbox
    &:before
      box-shadow: rgba(black, 0.2) 0 1px 1px inset
      background-color: #{if(luma_bright($color), shade($color, 20%), tint($color, 20%))}

  // checked
  &.is-checked
    color: luma_contrast_color($button-checked-color)
    +standard-button-color($button-checked-color, true)
    border-color: shade($button-checked-color, 10%) shade($button-checked-color, 16%) shade($button-checked-color, 26%)
    box-shadow: darken($button-checked-color, 12%) 0 1px 0 inset, rgba(white, .3) 0 1px 1px
    &:before
      box-shadow: rgba(black, 0.2) 0 1px 1px inset
      background-color: #{if(luma_bright($button-checked-color), tint($button-checked-color, 20%), shade($button-checked-color, 20%))}

  // select
  &.is-select
    &:after
      color: rgba(luma_contrast_color($color), .7)
      border-left: 1px solid
      border-left-color: #{if(luma_bright($color), shade($color, 20%), tint($color, 20%))}

  // disabled
  &.is-disabled,
  &:disabled
    $color: if(luma_bright($color), shade($color, 20%), tint($color, 20%))
    background-color: rgba($color, 7)
    background-image: none
    color: rgba(luma_contrast_color($color), .7)
    border-color: shade($color, 10%) shade($color, 16%) shade($color, 26%)
    text-shadow: none
    box-shadow: none