@import '../../common/style/smoba/layout.scss';

.press-popup-cell {
  &__item {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    // padding: 0 0.64rem 0 0.32rem;
    padding: 0 .32rem 0 .32rem;
    height: 1.12rem;

    &--switch {
      height: 1.56rem;
    }

    &--checkbox {
      // height: 1.73rem;
      height: auto;

      .press-popup-cell__description-wrap {
        font-size: .24rem;
        margin-top: .08rem;
        line-height: .4rem;
        height: .4rem;
      }
    }

    &--button {
      justify-content: center;
      font-size: .32rem;
      font-weight: 400;
    }
  }

  &__label {
    font-size: $font-l;
    color: $color-black;
    display: flex;
    // align-items: center;
    align-items: flex-start;
    flex-direction: column;
    padding: .36rem 0;
  }

  &__title {
    line-height: .48rem;
    height: .48rem;
  }

  &__description-wrap {
    font-size: $font-xxs;
    color: $color-gray;
    line-height: .5rem;
  }

  &__description {
    &--light {
      color: #1181d7;
      margin: 0 .04rem;
    }
  }

  &__value {
    font-size: $font-s;
    color: $color-gray;
    display: flex;
    align-items: center;
  }

  &__checkbox {
    width: .4rem;
    height: .4rem;
    background: url(https://image-1251917893.file.myqcloud.com/Esports/new/user/select-new.png)
      no-repeat;
    background-size: 100%;

    &--checked {
      background-image: url(https://image-1251917893.file.myqcloud.com/Esports/new/user/selected-new.png);
    }
  }

  &__tip {
    padding: .32rem 0;
    color: #bfc3e1;
    font-size: .24rem;
    text-align: center;
    position: relative;
    margin: 0 .32rem;

    &::before {
      content: '';
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      height: 1px;
      background-color: #eef0f6;
      transform: scaleY(.5);
      transform-origin: 0 0;
    }
  }

  &__tabs {
    display: flex;
    width: 2.76rem;
    padding-bottom: 0 !important;
    padding-top: 0 !important;
    height: .52rem;
    background: #dfe2ea;
    border-radius: .08rem;
  }

  &__tab {
    width: 1.36rem;
    font-size: .2rem;
    font-weight: 400;
    color: #09134e;
    border-radius: .04rem;
    height: .44rem;
    margin: .04rem;

    display: flex;
    align-items: center;
    justify-content: center;

    &--active {
      background: #fff;
    }
  }

  &__bottom-button {
    height: .88rem;
    line-height: .88rem;
    background: #eef0f6;
    border-radius: .08rem;
    font-weight: 400;
    font-size: .32rem;
    text-align: center;
    margin: .32rem .4rem .4rem;
  }
}

.icon-back {
  transform: rotate(180deg);
}