/**
 * 公共滑动条样式
 */
@import '~amos-framework/lib/styles/mixins/scrollbar.scss';

$scrollOutColor: rgba(#dedede, 0.3);
$scrollInnerColor: rgba(rgb(20, 20, 20), 0.1);

@mixin default-scroll {
  overflow: auto;

  &:hover {
    &::-webkit-scrollbar {
      width: 8px;
      height: 8px;
      background-color: whitesmoke;
    }

    &::-webkit-scrollbar-track {
      // padding: 1px;
      background-color: whitesmoke;
      box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
      // border: 1px solid #e4e4e4;
      // border-top: 0;
      // border-right: 0;
      // // border-left: 0;
      // border-radius: 0;
    }

    &::-webkit-scrollbar-thumb {
      background-color: #eaeaea;
      border: 1px solid #cecece;
      // border: 1px solid #e4e4e4;
      // border-top: 0;
      // border-right: 0;
      // border-bottom: 0;
      // border-radius: 0;
      // background-clip: padding-box;
    }
  }

  &::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    background-color: transparent;
  }

  &::-webkit-scrollbar-track {
    background: transparent;
    border: 0;
  }

  &::-webkit-scrollbar-thumb {
    background: transparent;
    border: 0;
  }
}

.mod-com-scrollbar {
  @include pretty-scrollbar(5px, 8px, $scrollOutColor, $scrollInnerColor);
  // @include default-scroll;
}


%gm-scrollbar {
  @include pretty-scrollbar(
    var(--gm-scrollbar-width),
    var(--gm-scrollbar-width),
    var(--gm-scrollbar-bg),
    var(--gm-scrollbar-bar),
    calc(var(--gm-scrollbar-width) / 2)
  );
}

.gm-scrollbar {
  @extend %gm-scrollbar;

  overflow: auto;
}

.gm-blue-scrollbar {
  @include pretty-scrollbar(
    5px,
    5px,
    rgba(44, 21, 21, 0.3),
    #0a4c7b,
    calc(5px / 2)
  );

  overflow: auto;
}
