Kendo Grid validation message position issue

The Kendo grid I developed has a validation message, but the arrow points to the column to the right. I cannot change anything in /kendo.default.min.css as this is located in a shared folder which should not be changed. Any help on this?

dataSource: {
  data: data.ReportData,
  schema: {
    model: {
      fields: {
        ProposedDiscount: {
          validation: { 
            required: true,
            proposeddiscountcvalidation: function (input) {
              if (input.val() != "" && input.is("\[name='ProposedDiscount'\]")) {
                  input.attr("data-proposeddiscountcvalidation-msg", "Should be whole number between 0 & 100");
                  // $('.k-widget k-tooltip k-tooltip-validation k-invalid-msg  .k-icon k-warning .k-tooltip-validation .k-callout-n').removeClass('.k-callout-n');
                  return input.val() >= 0 && input.val() < 101 && input.val() % 1 == 0;
              } else {
                  return true;
              }
            }
          }
        }