/*
* Border Button Colors
*
* Create colors for buttons
* (.button-primary, .button-secondary, etc.)
*/

#{$ubtn-namespace}-border,
#{$ubtn-namespace}-border-thin,
#{$ubtn-namespace}-border-thick {

  @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} {
      color: $ubtn-background;

      &:hover,
      &:focus {
        background-color: $ubtn-background;
        color: $ubtn-color;
		opacity: .9;
      }

      &:active,
      &.active,
      &.is-active {
        background-color: $ubtn-background;
        color: $ubtn-color;
        opacity: .7;
      }
    }
  }
}
