/*
* Raised Button Colors
*
* Create colors for raised buttons
*/
#{$ubtn-namespace}-raised {
  @each $ubtn-color in $ubtn-colors {
    $ubtn-name: nth($ubtn-color, 1);
    $ubtn-background: nth($ubtn-color, 2);
    $ubtn-color: nth($ubtn-color, 3);
    $ubtn-color-namespace: #{$ubtn-namespace} + '-' + $ubtn-name;

    &#{$ubtn-color-namespace} {
      border-color: darken($ubtn-background, 5%);
      background: linear-gradient(lighten($ubtn-background, 5%), darken($ubtn-background, 5%));
      &:hover,
      &:focus {
        background: linear-gradient(lighten($ubtn-background, 8%), darken($ubtn-background, 7%));
      }
      &:active,
      &.active,
      &.is-active  {
        border-color: darken($ubtn-background, 10%);
        background: desaturate($ubtn-background, 10%);
      }
    }
  }
}
