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

@include themes-mixin {
  @include b(back-top) {
    @include fade-in-transition(back-top);
    @include once {
      position: fixed;
      right: 40px;
      bottom: 40px;
      min-width: 40px;
      height: 40px;
      cursor: pointer;
    }
    @include e(default-button) {
      @include once {
        transition: box-shadow .3s $default-cubic-bezier, fill .3s $default-cubic-bezier;;
        border-radius: 20px;
        height: 40px;
        width: 40px;
        svg {
          pointer-events: none;
        }
      }
      fill: $--back-top-button-fill;
      box-shadow: map-get($--back-top-box-shadow, 'default');
      &:hover {
        box-shadow: map-get($--back-top-box-shadow, 'hover');
        fill: $--back-top-button-fill-hover;
      }
      &:active {
        box-shadow: map-get($--back-top-box-shadow, 'active');
        fill: $--back-top-button-fill-active;
      }
    }
  }
}