@use "sass:map";
@use "sass:list";

.vxe-backtop {
  display: inline-flex;
  flex-direction: column;
  position: absolute;
  right: var(--vxe-ui-backtop-right);
  bottom: var(--vxe-ui-backtop-bottom);
  color: var(--vxe-ui-font-color);
  font-family: var(--vxe-ui-font-family);
  cursor: pointer;
  z-index: 9;
  &.is--visible {
    .vxe-backtop--content-wrapper {
      opacity: 1;
    }
  }
  &.is--fixed {
    position: fixed;
  }
  &.is--absolute {
    position: absolute;
  }
}

.vxe-backtop {
  .vxe-button {
    &.type--button {
      &:not(.is--circle) {
        min-width: 2.8em;
        min-height: 2.8em;
        padding: 0.6em;
        i {
          font-size: 1.3em;
        }
      }
      &.is--circle {
        min-width: 2.8em;
        min-height: 2.8em;
        i {
          font-size: 1.4em;
        }
      }
    }
  }
}

.vxe-backtop--top-wrapper {
  position: absolute;
  bottom: 100%;
  right: 0;
  margin-bottom: 0.8em;
}

.vxe-backtop--bottom-wrapper {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 0.8em;
}

.vxe-backtop--content-wrapper {
  opacity: 0;
  transition: all 0.3s;
}

.vxe-backtop--icon {
  font-size: 1.4em;
}

.vxe-backtop {
  font-size: var(--vxe-ui-font-size-default);
  &.size--medium {
    font-size: var(--vxe-ui-font-size-medium);
  }
  &.size--small {
    font-size: var(--vxe-ui-font-size-small);
  }
  &.size--mini {
    font-size: var(--vxe-ui-font-size-mini);
  }
}