.wx--refresher--container--private {
  display: flex;

  .hidden {
    display: none;
  }

  .wx-refresher-default-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    margin-left: 5px;
    opacity: 0.3;
    background: #000;

    &:first-child {
      margin-left: 0;
    }
  }

  .wx-refresher-default-white {
    opacity: 0.5;
    background: #fff;
  }

  .wx-refresher-default-dot-1-blink-anim {
    animation: 1s wx-refresher-blink-anim 0.3s infinite;
  }

  .wx-refresher-default-dot-2-blink-anim {
    animation: 1s wx-refresher-blink-anim 0.6s infinite;
  }

  .wx-refresher-default-dot-3-blink-anim {
    animation: 1s wx-refresher-blink-anim 0.9s infinite;
  }

  .wx-refresher-default-dot-1-fold {
    animation: 0.1s wx-refresher-dot-1-fold-anim 0s;
  }

  .wx-refresher-default-dot-3-fold {
    animation: 0.1s wx-refresher-dot-3-fold-anim 0s;
  }

  @keyframes wx-refresher-blink-anim {
    25% { opacity: 0.7; }
    50% { opacity: 0.5; }
    75% { opacity: 0.3; }
  }

  @keyframes wx-refresher-dot-1-fold-anim {
    to { transform: translateX(13px); }
  }

  @keyframes wx-refresher-dot-3-fold-anim {
    to { transform: translateX(-13px); }
  }
}

.wx--refresher--content--private {
  will-change: transform;
}