@import '../../common/style/act/button/_button-game-life-vertical.scss';
@import './base.scss';

.press-act:not(.press-act--hidden-tip) {
  .press__dialog {
    width: 5.6rem;
    padding-bottom: .4rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99;
    background: #fff;
    border-radius: .12rem;
  }

  .press__close {
    display: none;
  }

  .press__title {
    padding: .36rem 0 .24rem;
    color: $color-gray-1;
    font-size: $font-xl;
    line-height: .44rem;
    text-align: center;
    font-weight: bold;
  }

  // 2填写手机号[

  .press__content {
    margin: auto;
    text-align: center;
  }

  .press__box input {
    display: block;
    // #ifdef H5
    width: 4.64rem;
    // #endif
    height: .72rem;
    padding: 0 .24rem;
    margin: .32rem auto .2rem;
    color: #303030;
    font-size: $font-m;
    text-align: left;
    line-height: .72rem;
    background: #f5f6f7;
    border-radius: .08rem;
  }

  .press__message {
    font-size: $font-s;
    line-height: .34rem;
    padding: 0 .48rem;
    color: $color-gray-3;
    text-align: justify;
  }

  .press__button-wrap {
    margin-top: .24rem;
    display: flex;
    justify-content: center;
  }

  .press__dialog-phone {
    .press__button-wrap {
      a {
        display: block;
      }

      .press__btn--cancel {
        width: .96rem;
        height: .96rem;
        display: block;
        position: absolute;
        bottom: -1.6rem;
        left: 50%;
        margin-left: -.48rem;
        background: url(https://image-1251917893.file.myqcloud.com/igame/common/image/close-dialog-icon.png) no-repeat;
        background-size: 100% 100%;
        font-size: 0;
        line-height: 0;
      }

      .press__btn--sure {
        width: 2.92rem;
        height: .68rem;
        line-height: .68rem;
        box-sizing: border-box;
        display: block;
        text-align: center;
        font-size: $font-l;
        color: #fff;
        border-radius: .08rem;
        background-image: linear-gradient(90deg, #50abff 0%, #6e61ff 50%, #925fff 100%);
      }
    }
  }

  // 2填写手机号]

  /* 验证码 */
  .press__box {
    .press__code-wrap {
      position: relative;

      input {
        padding-right: .24rem;
        box-sizing: border-box;
      }

      .press__code-btn {
        display: inline-block;
        position: absolute;
        top: 0;
        right: .54rem;
        width: 1.8rem;
        text-align: center;
        line-height: .72rem;
        font-size: $font-m;
        color: $color-blue-1;
        z-index: 3;
      }
    }
  }

  /* 协议 */
  .press__treaty-wrap {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    font-size: $font-s;
    line-height: .34rem;
    padding: 0 .48rem;
    color: $color-gray-2;
    margin-top: .4rem;
  }

  .press__act-checkbox {
    flex-shrink: 0;
    width: .24rem;
    height: .24rem;
    margin: .04rem .08rem 0 0;
    border: 1px solid rgba(86, 117, 236, .3);
    background: none;

    &.press__act-checkbox--checked {
      background: url(https://image-1251917893.file.myqcloud.com/igame/common/image/icon-checkbox--checked.png) no-repeat 50%;
      background-size: contain;
    }
  }

  .press__treaty-terms {
    color: $color-gray-2;
    font-size: $font-s;
    line-height: 1.4;
  }

  .press__treaty-desc {
    font-size: $font-s;
    color: $color-blue-1;
  }
}

//小程序手机号弹窗问题

// 手机号
.press__phone-number-mp {
  position: relative;
  width: 200%;
  transform: translateX(-50%);
  opacity: 0;
  z-index: 2;
}

.press-phone-input-text {
  position: absolute;
  top: 0;
  left: .1rem;
  width: 4.64rem;
  font-size: 14px;
  height: .72rem;
  line-height: .72rem;
  color: #09134e;
  margin-left: .38rem;
  padding: 0 .24rem;
  background: #f5f6f7;
  border-radius: .08rem;
  text-align: left;
  z-index: 1;
}

.press-phone-input-placeholder {
  position: absolute;
  top: 0;
  left: .32rem;
  font-size: .28rem;
  height: .72rem;
  line-height: .72rem;
  color: #9299c6;
  margin-left: .38rem;
  z-index: 1;
  pointer-events: none;
}

.press-act-input-wrap {
  position: relative;
  // 验证码
  .press__code-number-mp {
    position: relative;
    width: 200%;
    transform: translateX(-50%);
    opacity: 0;
    z-index: 2;
  }

  .press-code-input-text {
    position: absolute;
    top: 0;
    left: .1rem;
    width: 4.64rem;
    font-size: 14px;
    height: .72rem;
    line-height: .72rem;
    color: #09134e;
    margin-left: .38rem;
    padding: 0 .24rem;
    background: #f5f6f7;
    border-radius: .08rem;
    text-align: left;
    z-index: 1;
  }

  .press-act-input-placeholder {
    position: absolute;
    top: 0;
    left: .32rem;
    font-size: .28rem;
    height: .72rem;
    line-height: .72rem;
    color: #9299c6;
    margin-left: .38rem;
    z-index: 1;
    pointer-events: none;
  }
}