.videoWrap {
  position: relative;
  width: 100%;
  height: 100%;

  .videoSection {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 8;
  }

  img {
    -moz-user-select: none;
    /* 火狐浏览器 */
    -webkit-user-drag: none;
    /* 谷歌、Safari和Opera浏览器 */
    -webkit-user-select: none;
    /* 谷歌、Safari和Opera浏览器 */
    -ms-user-select: none;
    /* IE10+浏览器 */
    user-select: none;
    /* 通用 */
    -webkit-touch-callout: none;
    /* iOS Safari */
  }
}

.content {
  position: relative;
  height: 100%;
}

.contentWrap {
  height: 100%;

  video {
    width: 100%;
    height: 100%;
  }
}

.controls {
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.5), transparent);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: all 0.5s;
  width: 100%;
  z-index: 9;
  padding-top: 10px;

  &.hide {
    transform: translateY(100%);
  }

  .time {
    display: flex;
    flex-shrink: 0;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    padding: 4px 0 4px 0;
    width: 96px;
  }

  .slider {
    display: flex;
    align-items: center;
    justify-content: space-between;
    // width: 100%;
    padding: 0 40px 0;
    --van-slider-button-width: 13px !important;
    --van-slider-button-height: 13px !important;
    --van-slider-active-background-color: #FF7390 !important;
    --van-slider-bar-height: 2px !important;

    :global {
      .n-slider {
        --n-handle-size: 13px !important;
        --n-fill-color: var(--van-primary-color) !important;
        --n-fill-color-hover: var(--van-primary-color) !important;
      }

      .van-loading {
        width: 100%;
        height: 100%;
      }
      .van-slider__button {
        box-shadow: none;
      }
    }
  }

  .actionSection {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 40px 12px 36px;

    .name {
      font-size: 14px;
      font-weight: 500;
      color: #ffffff;
    }
  }

  .actions {
    display: flex;
    // width: 100%;
    color: #fff;
    font-size: 12px;

    align-items: center;

    .actionWrap {
      display: flex;
    }

    .actionBtn {
      display: flex;
      width: 28px;
      height: 28px;
      margin-right: 16px;
      background: transparent;
      box-sizing: content-box;

      &.btnLoop {
        width: 33px;
        height: 28px;
      }

      >img {
        width: 100%;
        height: 100%;
      }
    }
    :global {
      .van-loading__circular {
        width: 100%;
        height: 100%;
      }
    }

    .playIcon {
      display: none;
    }

    .btnPlay img:nth-child(2) {
      display: block;
    }

    .btnPause img:nth-child(3) {
      display: block;
    }

    .btnPlay,
    .btnPause {
      :global {
        .van-loading {
          display: none;
        }
      }
    }

    .loopBtn {
      :global {
        .loop {
          display: block;
        }

        .loopActive {
          display: none;
        }
      }
    }

    .loopBtn.active {
      :global {
        .loop {
          display: none;
        }

        .loopActive {
          display: block;
        }
      }
    }
  }
}


.sliderPopup {
  position: absolute;
  z-index: 9999;
  left: 120px;
  bottom: 46px;
  display: flex;
  align-items: center;
  flex-direction: column;
  height: 197px;
  width: 46px;
  padding: 10px 0 15px;
  background: url('data:image/png;base64,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') no-repeat top center;
  background-size: contain;
  box-sizing: border-box;

  .iconAdd,
  .iconCut {
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url('data:image/png;base64,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') no-repeat center;
    background-size: contain;
    flex-shrink: 0;

    &.disabled {
      opacity: 0.7;
    }
  }

  .iconCut {
    background: url('data:image/png;base64,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') no-repeat center;
    background-size: contain;
  }

  .sliderPoint {
    background: #FFFFFF;
    // box-shadow: 0px 2px 4px 0px rgba(102, 102, 102, 0.77);
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;
    // line-height: 20px;
    padding: 2px 0 1px;
    color: #FE2451;
    min-width: 35px;
    text-align: center;
    vertical-align: text-bottom;
    span {
      font-size: 10px;
    }
  }

  :global {
    .van-slider {
      margin: 13px 0;
    }
    .van-slider__bar {
      background-color: #FF7C97 !important;
    }
  }
}

.goPractice {
  position: absolute;
  right: 39px;
  bottom: 12px;
  width: 86px;
  height: 30px;
  background: url('./../image/btn_go_practice.png') no-repeat center;
  background-size: contain;
  // position: absolute;
  // right: 16px;
  // bottom: 60px;
  z-index: 11;
  transition: all .5s ease;


  &.hide {
    transform: translateY(55px);
  }
}
