@import '../../common/style/press/mixins/flex.scss';

$press-main-color: #151719;
$press-primary: #3c9cff;
$press-warning: #f9ae3d;
$press-success: #5ac725;
$press-error: #f56c6c;
$press-info: #909399;
$press-content-color: #606266;
$press-tips-color: #909193;
$press-light-color: #c0c4cc;


.press-form-item {
  @include flex(column);
  font-size: 14px;
  color: $press-main-color;

  &__body {
    @include flex;
    padding: 10px 0;

    &__left {
      @include flex;
      align-items: center;

      &__content {
        position: relative;
        @include flex;
        align-items: center;
        padding-right: 5px;
        flex: 1;

        &__icon {
          margin-right: 4px;
        }

        &__required {
          position: absolute;
          left: -9px;
          color: $press-error;
          line-height: 20px;
          font-size: 20px;
          top: 3px;
        }

        &__label {
          @include flex;
          align-items: center;
          flex: 1;
          color: $press-main-color;
          font-size: 15px;
          white-space: nowrap;
        }
      }
    }

    &__right {
      flex: 1;

      &__content {
        @include flex;
        align-items: center;
        flex: 1;

        &__slot {
          flex: 1;

          /* #ifndef MP */
          @include flex;
          align-items: center;

          /* #endif */
        }

        &__icon {
          margin-left: 5px;
          color: $press-light-color;
          font-size: 15px;
        }
      }

      &__message {
        font-size: 12px;
        line-height: 12px;
        color: $press-error;
      }
    }
  }

  &__line {
    margin: 0px;
    border-bottom: 1px solid rgb(214, 215, 217);
    width: 100%;
    transform: scaleY(.5);
    border-top-color: rgb(214, 215, 217);
    border-right-color: rgb(214, 215, 217);
    border-left-color: rgb(214, 215, 217);
    vertical-align: middle;
  }
}