@import './mixins/mixins.scss';

@include themes-mixin {
  @include b(icon) {
    @include once {
      height: 1em;
      width: 1em;
      line-height: 1em;
      text-align: center;
      display: inline-block;
      position: relative;
      transition: $--n-icon-transition;
      svg {
        height: 1em;
        width: 1em;
      }
    }
    fill: $--n-base-text-color;
    stroke:  $--n-base-text-color;
    @include m(primary-depth) {
      svg {
        opacity: $--n-primary-opacity;
      }
    }
    @include m(secondary-depth) {
      svg {
        opacity: $--n-secondary-opacity;
      }
    }
    @include m(tertiary-depth) {
      svg {
        opacity: $--n-tertiary-opacity;
      }
    }
  }
}