//move to helpers
@function set-text-color($color) {
  @if (lightness($color) > 60%) {
    @return rgba($black, $transparent-weak); // Lighter backgorund, return dark color
  } @else {
    @return rgba($white, $transparent-strong); // Darker background, return light color
  }
}
//BUTTON GENERATOR FOR EACH COLOR
@each $class in $button-classes {
	$i: index($button-classes, $class);
	$primary-color: nth($button-define, $i);
	.button.#{$class}{
		background-color: $primary-color;
		color: set-text-color($primary-color);//&*default
	}
	.button.#{$class}:hover{
		background-color: lighten($primary-color, $transition-brighten);//&*hover
	}//&*append
}