@mixin avatar-background-mapping {
  .avatar {
    @include bg-variants(
      $supportedBackgrounds: (
        'brand-tertiary'
      )
    ) {
      background-color: variant-property('avatarBackground');
      color: variant-property('avatarText');
    }
  }

  .avatar__navigation.avatar__initials {
    @include bg-variants() {
      background: transparent;
      border: 2px solid currentColor;

      &.avatar--XS {
        border-color: variant-property('navigationLinkIdle');
        color: variant-property('navigationLinkIdle');

        &:hover {
          border-color: variant-property('navigationLinkHover');
          color: variant-property('navigationLinkHover');
        }
      }

      &.avatar--XXS {
        border: 2px solid variant-property('navigationLinkIdle');
        color: variant-property('navigationLinkIdle');

        &:hover {
          color: variant-property('navigationLinkHover');
        }
      }
    }
  }

  // todo delete when color map is final
  .avatar {
    background: returnColorCSSVar('brand-tertiary');
    color: returnColorCSSVar('brand-secondary-tint-60');

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

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

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

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