// @import '../_utils.scss';
@mixin inner() {
  background-color: $backtop-inner-background-color;
  border-radius: $backtop-inner-border-radius;
  box-shadow: $backtop-inner-box-shadow;
  transition: all $transition-time $ease-in-out;
  padding: $backtop-inner-padding;
  font-size: $backtop-inner-font-size;
  color: $backtop-inner-color;
  @include theme-background-color($__back-inner_background-color);
  @include theme-box-shadow($__back-inner_box-shadow);
  @include theme-font-color($__back-inner_font-color);
  @include theme-border($__back-inner_border);

  &:hover {
    background-color: $backtop-inner-hover-background-color;
    @include theme-background-color($__back-inner_hover_background-color);
  }
}

.#{$backtop-prefix-cls-top},
.#{$backtop-prefix-cls-bottom} {
  z-index: $zindex-back-top;
  position: fixed;
  cursor: pointer;
  display: none;
}

.#{$backtop-prefix-cls-top} {
  &.#{$backtop-prefix-cls-top}-show {
    display: block;
  }

  &-inner {
    @include inner();

    i {
      color: $backtop-top-inner-i-color;
      font-size: $backtop-top-inner-i-font-size;
      padding: $backtop-top-inner-i-padding;
      @include theme-font-color($__back-inner-i_font-color);
    }
  }
}
.#{$backtop-prefix-cls-bottom} {
  display: block;
  &.#{$backtop-prefix-cls-bottom}-hidden {
    display: none;
  }

  &-inner {
    @include inner();

    i {
      color: $backtop-bottom-inner-i-color;
      font-size: $backtop-bottom-inner-i-font-size;
      padding: $backtop-bottom-inner-i-padding;
      @include theme-font-color($__back-inner-i_font-color);
    }
  }
}