@import "../../../style/var.less";
@import "../../../style/mixins.less";

.container {
  overflow: hidden;
  background-color: @white;
  &::after {
    content: " ";
    display: block;
    height: 80px;
  }
  &.ios-bottom {
    &::after {
      height: 160px;
    }
  }
}
.policy {
  &-tip {
    background: rgba(255, 228, 162, 1);
    border-radius: @border-radius-sm;
    font-size: @font-size-14;
    color: @red;
    line-height: @line-height-sm;
    padding: @padding-xs + 1;
    text-align: center;
    &-wrap {
      padding: @padding-md + 3 @padding-md;
    }
  }
  &-form {
    padding: 0 @padding-md;
    .radio-btn {
      width: 100%;
      justify-content: start;
      flex-wrap: wrap;
      margin-bottom: -8px;
      @{deep} .cr-radio {
        box-shadow: none;
        border: 1px solid #ccc;
        height: 24px;
        line-height: 24px;
        flex: none;
        min-width: 40px;
        padding: 0 15px;
        margin-right: 6px;
        margin-bottom: 8px;
        &__label {
          color: #aaa;
        }
        &.checked {
          border-color: @orange-light;
          color: @black;
          .cr-radio__label {
            color: @black;
          }
        }
      }
    }
    @{deep} .cr-cell {
      color: @black;
      padding: @padding-sm 0;
      &-group {
        margin-bottom: 32px;
        &:last-child {
          margin-bottom: 0;
        }
        &__title {
          font-size: @font-size-18;
          font-weight: @font-weight-bold;
          color: @black;
          line-height: @line-height-lg;
          padding: @padding-xs + 1 0 @padding-lg;
        }
        &::after {
          border-top-width: 0;
        }
      }
      &__title {
        width: 100px !important;
      }
      &:not(:last-child)::after {
        border-color: #ECE9E9;
        left: 0;
      }
    }
  }
}
.form-unit {
  color: @black;
}

.pay-protocol {
  margin-bottom: 8px;
  &-tip {
    font-size: @font-size-12;
    color: @gray-4;
    line-height: @line-height-lg;
    margin: 15px 0 10px;
    display: flex;
    justify-content: space-between;
  }
  &-link {
    a {
      font-size: @font-size-12;
      vertical-align: middle;
    }
    i {
      display: inline-block;
      width: 0;
      height: 12px;
      border-right: 1px @blue solid;
      vertical-align: middle;
      margin: 0 2px;
    }
    &_wrap {
      a {
        display: block;
        margin-top: 8px;
      }
    }
  }
}
.relation-select {
  width: 13px;
  height: 22px;
  text-align: center;
  line-height: 22px;
}
.protocol-radio {
  background-color: @gray-1;
  padding-left: 15px !important;
  padding-right: 15px !important;
  margin-bottom: 50px;
  margin-top: 20px;
  @{deep} .cr-field--control {
    display: block;
  }
  &::after {
    display: none;
  }
}