// Border Color
.border {
  &--primary {
    border-color: $color-primary;
  }

  &--secondary {
    border-color: $color-secondary;
  }

  &--success {
    border-color: $color-success;
  }

  &--warning {
    border-color: $color-warning;
  }

  &--danger {
    border-color: $color-danger;
  }

  &--info {
    border-color: $color-info;
  }

  &--default {
    border-color: $color-default;
  }

  &--white {
    border-color: $color-white;
  }

  &--black {
    border-color: $color-black;
  }

  &--light {
    border-color: $color-light-gray-1;
  }

  &--dark {
    border-color: $color-dark-gray-2;
  }

  &--transparent {
    border-color: transparent;
  }
}

// Text Color
.text {
  &--primary {
    §color: $color-primary;
  }

  &--secondary {
    color: $color-secondary;
  }

  &--success {
    color: $color-success;
  }

  &--warning {
    color: $color-warning;
  }

  &--danger {
    color: $color-danger;
  }

  &--info {
    color: $color-info;
  }

  &--default {
    color: $color-default;
  }

  &--white {
    color: $color-white;
  }

  &--black {
    color: $color-black;
  }

  &--light {
    color: $color-light-gray-1;
  }

  &--dark {
    color: $color-dark-gray-2;
  }

  &--transparent {
    color: transparent;
  }
}

// Background Color
.bg {
  &--primary {
    background-color: $color-primary;
  }

  &--secondary {
    background-color: $color-secondary;
  }

  &--success {
    background-color: $color-success;
  }

  &--warning {
    background-color: $color-warning;
  }

  &--danger {
    background-color: $color-danger;
  }

  &--info {
    background-color: $color-info;
  }

  &--default {
    background-color: $color-default;
  }

  &--white {
    background-color: $color-white;
  }

  &--black {
    background-color: $color-black;
  }

  &--light {
    background-color: $color-light-gray-1;
  }

  &--dark {
    background-color: $color-dark-gray-2;
  }

  &--transparent {
    background-color: transparent;
  }
}