@use "../../libs/css/mixin" as *;
@use "../../libs/css/theme" as *;

@include b(checkbox) {
  /* #ifndef APP-NVUE */
  @include flex(row);
  /* #endif */
  overflow: hidden;
  flex-direction: row;
  align-items: center;
  margin-bottom: 5px;
  margin-top: 5px;

  @include m(group) {
    @include m(row) {
      /* #ifndef APP-NVUE */
      display: flex;
      /* #endif */
      flex-flow: row wrap;
    }

    @include m(column) {
      @include flex(column);
    }
  }

  @include m(label) {
    @include e(left) {
      flex-direction: row;
    }
    @include e(right) {
      flex-direction: row-reverse;
      justify-content: space-between;
    }

    @include e(wrap){
      /* #ifndef APP-NVUE */
      word-wrap: break-word;
      /* #endif */
      font-size: $hy-font-size-base;
      margin-right: $hy-border-margin-padding-sm;

      @include m(disabled) {
        color: $hy-text-color--disabled;
      }
    }
  }

  @include m(icon-wrap) {
    /* #ifndef APP-NVUE */
    box-sizing: border-box;
    // nvue下，border-color过渡有问题
    transition-property: border-color, background-color, color;
    transition-duration: 0.2s;
    /* #endif */
    @include flex;
    align-items: center;
    justify-content: center;
    color: transparent;
    text-align: center;
    margin-right: $hy-border-margin-padding-sm;
    border: $hy-border-line;

    /* #ifdef MP-TOUTIAO */
    // 头条小程序兼容性问题，需要设置行高为0，否则图标偏下
    @include e(icon) {
      line-height: 0;
    }

    /* #endif */

    @include m(circle) {
      border-radius: 50%;
    }

    @include m(square) {
      border-radius: 3px;
    }

    @include m(checked) {
      color: #FFFFFF;
      background-color: $hy-primary;
      border-color: $hy-primary;
    }

    @include m(disabled) {
      background-color: $hy-background--disabled;
      :deep(.hy-icon) {
        display: none;
      }
    }

    @include m(disabled--checked){
      background-color: $hy-primary;
      border-color: $hy-primary;
      opacity: 0.5;
      :deep(.hy-icon) {
        display: block;
      }
    }
  }
}