// icons
.icon {
    @include avatar-base();
    @include flex-centered();
   // background: $primary-color;
    color:$light-color;
    border-radius: $border-radius;

    background-color: $bg-0-color;
  
    img {
      border-radius: 0;
    }
  
    &.icon-width-auto {
      width: auto;
      padding-left: $control-padding / 2;
      padding-right: $control-padding / 2;
    }
  
    &.icon-xs {
      @include avatar-base($unit-4);
    }
    &.icon-sm {
      @include avatar-base($unit-6, 2);
    }
    &.icon-lg {
      @include avatar-base($unit-12);
    }
    &.icon-xl {
      @include avatar-base($unit-16);
    }
  }