.avatar {
  background-color: returnColorCSSVar('brand-tertiary');
  color: returnColorCSSVar('brand-secondary-tint-80');

  .bg-brand--off-white &,
  .bg-brand-tertiary & {
    background: returnColorCSSVar('white');
    color: returnColorCSSVar('brand-secondary-tint-60');
  }
}

.avatar--XS.avatar__initials,
.avatar--XXS.avatar__initials {
  .bg-brand--six &,
  .bg-brand-senary & {
    background: transparent;
    border: 2px solid returnColorCSSVar('brand-secondary');
    color: returnColorCSSVar('brand-secondary');
  }
}

.avatar--XS.avatar__initials {
  .bg-brand--two &,
  .bg-brand-secondary & {
    background: transparent;
    border: 2px solid returnColorCSSVar('brand-secondary-tint-60');
    color: returnColorCSSVar('white');
  }
}

.avatar--XXS.avatar__initials {
  .bg-brand--two &,
  .bg-brand-secondary & {
    background: transparent;
    border: 2px solid returnColorCSSVar('white');
    color: returnColorCSSVar('white');
  }
}

