// ----
// Sass (v3.3.7)
// Compass (v)
// ----

@import 'compass';

$btn-colors: (

  default: (
    default: (
      top: #226bfb,
      bottom: #0f53e2,
      border: #014de6,
    ),
    hover: (
      top: #1552cc,
      bottom: #003db8,
      border: #013eb8
    ),
    active: (
      top: #103d99,
      bottom: #002e8a,
      border: #012e8a
    )
  ),

  action: (
    default: (
      top: #34ae23,
      bottom: #1a9509,
      border: #1b9509,
    ),
    hover: (
      top: #2a8b1c,
      bottom: #157708,
      border: #167707
    ),
    active: (
      top: #1f6915,
      bottom: #105906,
      border: #105905
    )
  ),

  warn: (
    default: (
      top: #888888,
      bottom: #6f6f6f,
      border: #6f6f6f
    ),
    hover: (
      top: #6d6d6d,
      bottom: #595959,
      border: #595959
    ),
    active: (
      top: #525252,
      bottom: #434343,
      border: #434343
    )
  ),

  alert: (
    default: (
      top: #f13030,
      bottom: #d71616,
      border: #d71616,
    ),
    hover: (
      top: #c12626,
      bottom: #ac1212,
      border: #ac1212
    ),
    active: (
      top: #901d1d,
      bottom: #810d0d,
      border: #810d0d
    )
  ),

  dim: (
    default: (
      top: #fff,
      bottom: #f7f7f7,
      border: #dddddd,
    ),
    hover: (
      top: #f2f2f2,
      bottom: #ebebeb,
      border: #d2d2d2
    ),
    active: (
      top: #d9d9d9,
      bottom: #d2d2d2,
      border: #bdbdbd
    )
  )

);

$btn-types: map-keys($btn-colors);

@function map-me($map, $keys) {
  
  @return map-me-r($map, $keys); 
  
  @each $key in $keys {
    
    @if map-has-key($map, $key) {
      $map: map-get($map, $key);
    }
    
  } // each key
  
  @return $map;
  
} // @function map-me

@function map-me-r($map, $keys) {

  @if length($keys) == 0 or length($map) == 0 {
    @warn 'Check your arguments, dawg!';
    @return null;
  }

  // get first key from list
  $key: nth($keys, 1);

  // get the value of $key from $map
  @if map-has-key($map, $key) {
    $map: map-get($map, $key);
  }

  // if this is the last $key in the list of $keys, return out $map value - there are no further keys to check
  @if length($keys) == 1 {
    @return $map;
  }

  // otherwise, continue drilling down into our map
  // remove the first key from $keys to pass onto the next iteration of this function
  $tmp-keys: $keys;
  $keys: ();
  @for $i from 2 through length($tmp-keys) {
    $keys: append($keys, nth($tmp-keys, $i));
  }

  @return map-me-r($map, $keys);

} // @function map-me-r

@mixin button($type) {

  @include background(
    linear-gradient(
      map-me($btn-colors, $type default top),
      map-me($btn-colors, $type default bottom)
    )
  );
  border-color: map-me($btn-colors, $type default border);

  &:hover,
  &:focus {
    @include background(
      linear-gradient(
        map-me($btn-colors, $type hover top),
        map-me($btn-colors, $type hover bottom)
      )
    );
    border-color: map-me($btn-colors, $type hover border);
  }

  &:active {
    @include background(
      linear-gradient(
        map-me($btn-colors, $type active top),
        map-me($btn-colors, $type active bottom)
      )
    );
    border-color: map-me($btn-colors, $type active border);
  }

  &[disabled] {

    &,
    &:hover,
    &:active,
    &:focus {
      @include background(
        linear-gradient(
          map-me($btn-colors, $type default top),
          map-me($btn-colors, $type default bottom)
        )
      );
      border-color: map-me($btn-colors, $type default border);
    }

  } // &[disabled]

} // @mixin button

// Iterate over all types of buttons to generate their styles.
@each $type in $btn-types {

  .btn-#{$type} {
    @include button($type);
  }

} // each type