//------------------------------------\
//  COLOR UTILITIES
//------------------------------------/

.a-bgWhite {
  // Default background on body
  background-color: $white;
}

.a-bgGreyLight {
  // Background on body if logged in as private person
  background-color: $grey-light;
}

.a-bgBlue {
  background-color: $blue;
}

.a-bgBlueLight {
  // Background on body if logged in as business
  background-color: $blue-light;
}

.a-bgBlueLighter {
  background-color: $blue-lighter;
}

.a-bgBlueDark {
  background-color: $blue-dark;
}

.a-bgBlueDarker {
  background-color: $blue-darker;
}

.a-bgPurple {
  background-color: $purple;
}

.a-bgPurpleLight {
  background-color: $purple-light;
}

.a-bgYellow {
  background-color: $yellow;
}

.a-bgYellowLight {
  background-color: $yellow-light;
}

.a-bgGreen {
  background-color: $green;
}

.a-bgGreenLight {
  background-color: $green-light;
}

.a-bgGreenLighter {
  background-color: $grey-lighter;
}

.a-bgRed {
  background-color: $red;
}

.a-bgRedLight {
  background-color: $red-light;
}

// Hover colors
.a-bg-blue-hover {
  &:hover {
    background-color: $blue-light;
  }
}

.a-bg-red-hover {
  &:hover {
    background-color: $red-light;
  }
}

// Dark background colors with white text
.a-bgPurple,
.a-bgBlueDark,
.a-bgBlueDarker,
.a-bgRed {
  color: $white;
}

// Text colors

.a-textGreen {
  color: $green;
}

.a-textWhite {
  color: $white !important;
}

.a-textBlue {
  color: $blue;

  &.a-textBlue-hover {
    color: $blue;
  }
}

.a-blueText {
  color: $blue;
}

.a-blueDarkText {
  color: $blue-dark;
}

.a-blueDarkerText {
  color: $blue-darker;
}