/**index.wxss**/
@import "/style/theme.less";
@import "/style/form.less";

page {
  height: 100vh;
  display: flex;
  flex-direction: column;
  .t-steps-item__line--horizontal {
    top: 33%;
  }
  .t-cell--middle {
    align-items: flex-start;
  }
}

.page {
  padding: 0 30rpx;
  .step-icon {
    width: 96rpx;
    height: 96rpx;
    padding: 26rpx 0;
    text-align: center;
    border-radius: 50%;
    background-color: white;
    border: 2px solid @mainColor;

    &.active {
      background-color: @mainColor;
      border: 2px solid @mainColor;
    }

    &-img {
      width: 40rpx;
      height: 40rpx;
      display: inline-block;
      vertical-align: middle;
    }
  }
}

.container {
  margin: 48rpx auto;
  border-radius: 24rpx;
  background-color: white;

  &.pad {
    padding: 30rpx;
  }

  .img-require {
    width: 10rpx;
    height: 11rpx;
  }

  .input-label {
    white-space: nowrap;
  }

  .radio {
    .pick {
      width: 100%;
      text-align: right;
      background-color: red;
      min-height: 48rpx;
      color: var(--td-input-default-text-color, var(--td-text-color-primary, var(--td-font-gray-1, rgba(0, 0, 0, 0.9))));
    }

    .radio-check {
      width: 36rpx;
      height: 36rpx;
      display: inline-block;
      margin-right: 8rpx;

      &:not(:first-child) {
        margin-left: 16rpx;
      }
    }
  }

  .seperator {
    height: 1rpx;
    width: 95%;
    background-color: #EDEEF2;
    margin-left: auto;
  }
}

.btn-contaier {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 30rpx;
  padding-bottom: env(safe-area-inset-bottom, 28rpx);
  background-color: rgba(255, 255, 255, 0.94);
  box-shadow: 0rpx -0.5rpx 0rpx 0rpx rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(40rpx);

  .extra {
    .checkbox {
      flex: 0 0 40rpx;
      width: 40rpx;
      height: 40rpx;
    }
  }

  .btn {
    height: 88rpx;
    border-radius: 8rpx;

    &.ghost {
      border: 2px solid @mainColor;
    }

    &.gradient {
      background: linear-gradient(145.75deg, rgba(62, 214, 227, 1) 0%, rgba(39, 169, 189, 1) 100%);
    }
  }
}

.popup {
  padding: 48rpx;
  max-width: 70vw;

  &-img {
    width: 312rpx;
    height: 196rpx;
  }
}