// flat-default
// -----------------------------------------------------------
@mixin flat-default ($color: $button-color, $text-shadow: $button-text-shadow, $box-shadow: $button-box-shadow){
  $base-color: $color;
  $grad-1: darken($base-color, 8%);
  $dark-color: darken($base-color, 20%);
  $highlight-color: lighten($base-color, 50%);

  background-color: $base-color;
  @include filter-gradient($grad-1, $base-color, vertical); // IE6-9
  @include background-image(linear-gradient(top, $grad-1 0%,$base-color 75%));

  border: 1px solid $dark-color;

  @include button-default;

  @if $text-shadow == true {
    text-shadow: 0px 1px 3px transparentize($dark-color, 0.5);
  }
  @if $box-shadow == true {
    box-shadow: 0 em(2) em(6) em(0) $shadow-color, $highlight-color 0 1px 0 inset;
  }

  &:hover {
    $base-color: darken($base-color, 10%);
    $grad-1: darken($grad-1, 10%);
    background-color: $base-color;
    @include filter-gradient($grad-1, $base-color, vertical); // IE6-9
    @include background-image(linear-gradient(top, $grad-1 0%,$base-color 75%));
  }

  @media #{$mobile} {
    width: 100%;
  }
}