@import '../../../brand-globals/src/less/backgrounds';

//
// Contextual backgrounds
// --------------------------------------------------

// Inverse background variant mixin
// Apply this to all background variants that require inverting
.bg-inverse() {
  .background-variant-inverse(@bg: @bg-inverse);
  // Automatically normalise any nested non-inverse backgrounds
  .bg-brand,
  .bg-default {
    .bg-normal;
  }
  .bg-muted {
    &,
    .bg-normal &,
    .bg-default & {
      background-color: @bg-muted-inverse;
    }
    &.bg-default,
    &.bg-normal {
      background-color: @bg-muted-inverse-normal;
    }
  }
  .bg-default.bg-muted,
  .bg-default .bg-muted {
    background-color: @bg-muted;
  }
}

// Inverse backgrounds
.bg-primary {
  .bg-inverse;
  background-color: @bg-primary;
}
.bg-secondary {
  background-color: @bg-secondary;
}
.bg-tertiary {
  .bg-inverse;
  background-color: @bg-tertiary;
}

// Normal backgrounds
.bg-normal {
  .background-variant(@bg: @bg-default);
}
.bg-default {
  background-color: @bg-default;
}
.bg-brand {
  background-color: @bg-brand;
  .text-muted {
    color: @gray-light;
  }
}
.bg-muted {
  &,
  &.bg-default,
  .bg-default &,
  .bg-normal & {
    background-color: @bg-muted;
  }
}