.igloo-freeform-element-preview {
  margin: 0 !important;

  .ant-form-item-control-input {
    min-height: unset;
  }

  &:last-child > div {
    padding-bottom: 0;
  }

  .igloo-freeform-element-preview-item {
    .igloo-freeform-element-preview-label {
      color:  @icon-color;
      line-height: 24px;
    }

    .igloo-freeform-element-preview-value {
      color:  @text-color;
      white-space: pre-wrap;
      word-break: break-word;
      line-height: 24px;

      .igloo-freeform-element-preview-value-icon {
        color: @error-color;
        margin-right: 8px;
      }

      .igloo-freeform-element-preview-value-errors {
        color: @error-color;
      }
    }
  }

  .ant-form-item-explain-error {
    margin-top: 0;
    margin-left: calc(~'50%' + 16px);
  }

  .ant-form-item-extra,
  .ant-form-item-explain {
    display: none;
  }

  .ant-form-item-explain-error,
  .ant-form-item-explain-connected {
    display: block;
  }
}

.igloo-freeform-element-preview + .igloo-freeform-element-preview > div {
  border-top: 1px solid #eeeeee;
  padding-top: 16px;
}

.igloo-freeform-element-preview-hide + .igloo-freeform-element-preview > div {
  border-top: 1px solid #eeeeee;
  padding-top: 16px;
}

.igloo-freeform-element-preview-hide:first-child
  + .igloo-freeform-element-preview
  > div {
  border-top: none;
  padding-top: 0;
}

.igloo-freeform-element-preview-hide {
  border-bottom: none !important;
  display: none;
}

.igloo-freeform-element-preview-hide-divider {
  & > div {
    border-bottom: none !important;
    padding-bottom: 8px;
  }

  &:last-child {
    padding-bottom: 0;
  }
}

.igloo-freeform-element-edit {
  flex-direction: column;
}

.ant-form-item-control-input {
  min-height: unset;
}

.igloo-freeform-label {
  display: flex;
  justify-content: space-between;
  width: 100%;

  .igloo-freeform-label-text {
    color:  @icon-color;
    font-size: 16px;
    line-height: 24px;

    .igloo-freeform-label-required {
      margin-left: 8px;
    }
    .igloo-freeform-label-optional {
      margin-left: 5px;
      font-size: 16px;
      font-style: italic;
      color: @hint-color;
    }
  }
}

@media screen and (max-width: 768px) {
  .igloo-freeform-element-preview {
    .igloo-freeform-element-preview-value {
      margin-top: 8px;

      .igloo-freeform-element-preview-value-icon {
        color: @error-color;
        margin-right: 8px;
      }

      .igloo-freeform-element-preview-value-errors {
        color: @error-color;
      }
    }

    .ant-form-item-explain-error {
      margin-left: 0 !important;
    }
  }
}

.ant-form-item-label > label {
  height: auto;
}

.igloo-freeform-item,
.igloo-freeform-element-preview {
  .ant-form-item {
    margin-bottom: 0;
  }
}
