.@{css-prefix}form {
  position: relative;

  &-vertical {
    .bui-form-item-label {
      display: block;
      margin-bottom: 8px;
      line-height: @line-height-md;
      color: @text-color-1;
      word-break: break-all;
    }

    .@{css-prefix}form-item {
      margin-bottom: @padding-xl;
      position: relative;
      &-tooltip {
        .bui-form-item-label {
          &-tooltip-icon {
            fill: @text-color-5;
            vertical-align: -2px;
          }
        }
      }

      &-required {
        & > .bui-form-item-label {
          display: flex;
          align-items: center;
          &::after {
            content: '';
            display: block;
            width: 4px;
            height: 4px;
            background-color: @danger-color;
            border-radius: 50%;
            margin-left: 8px;
            flex-shrink: 0;
          }
        }
      }
      &-error-msg {
        margin-bottom: @form-item-error-msg-margin-bottom;
      }
    }
  }

  &-horizontal {
    .@{css-prefix}form-item {
      .make-row(0);
      margin-bottom: @padding-xl;
      position: relative;
      .bui-form-item-label {
        float: left;
        position: relative;
        padding: @padding-xs - 2px 8px @padding-xs - 2px 0;
        font-size: @font-size-md;
        line-height: @line-height-md;
        color: @text-color-1;
        word-break: break-all;
        &-text {
          display: inline-block;
        }
        &-right {
          text-align: right;
        }
        &-left {
          text-align: left;
        }

      }


      &-required {
        & > .bui-form-item-label {
          padding-right: 20px;
          &::after {
            content: '';
            display: block;
            width: 4px;
            height: 4px;
            background-color: @danger-color;
            border-radius: 50%;
            position: absolute;
            top: 15px;
            right: 8px;
          }
        }
      }
      &-tooltip {
        .bui-form-item-label {
          &-tooltip-icon {
            fill: @text-color-5;
            vertical-align: -2px;
          }
        }
      }
      &-error-msg {
        margin-bottom: @form-item-error-msg-margin-bottom;
      }
    }
    &.@{css-prefix}form-has-required {
      .@{css-prefix}form-item {
        .bui-form-item-label {
          padding: @padding-xs - 2px 20px @padding-xs - 2px 0;
        }
      }
    }
  }
  .bui-form-item-msg-container {
    margin-top: 4px;
    display: flex;
    flex-direction: column;
    .bui-form-item-help {
      font-size: @font-size-sm;
      line-height: @line-height-sm;
      color: @danger-color;
    }
    .bui-form-item-tip {
      font-size: @form-item-tip-font-size;
      line-height: @form-item-tip-line-height;
      color: @form-item-tip-color;
      font-style: normal;
    }
    .bui-form-item-help + .bui-form-item-tip {
      margin-bottom: 4px;
    }
  }

}
.help-block {
  float: left;
  margin-top: 7px;
  margin-bottom: 0;
  font-size: @font-size-sm;
  color: @danger-color;
}

.@{css-prefix}form-rtl {
  direction: rtl;
  &.@{css-prefix}form-horizontal {
    .bui-form-item-label {
      float: right;
      padding-left: 20px;
      padding-right: 0;
      &::after {
        left: 8px;
        right: auto;
      }
    }
  }
  &.@{css-prefix}form-vertical {

  }
}
.@{css-prefix}form-item-rtl {
  direction: rtl;
}