Conditional format in liquid template adds empty html element rather removing from the template

Working on an email template using Liquid to conditionalize some html, however the elements which are conditionally hidden, they are adding the empty row in the template for it like this:

<tr><td><p></p></td></tr>

and there is nothing like this in our template i have attached below:

<table style="border-collapse:collapse" width="100%" cellpadding="4">
  <tbody>
    <tr>
      <th style="text-align:left">Customer:</th>
      <td align="right">{{customer.organization}}</td>
    </tr>
    {% if payment.card_number? %}
    <tr>
      <th style="text-align:left">Card:</th>
      <td align="right">{{payment.card_number}}</td>
    </tr>
    {% endif %}
    <tr>
      <th style="text-align:left">Amount paid:</th>
      <td align="right">{{payment.amount}}</td>
    </tr>
    {% if balance_in_cents > 0 %}
    <tr>
      <th style="text-align:left">Balance owed:</th>
      <td align="right">{{balance}}</td>
    </tr>
    {% endif %}
  </tbody>
</table>

and this is the html i copied from gmail which is generated from the above email template:

<table style="border-collapse:collapse;" width="100%" cellpadding="4">
  <tbody>
    <tr>
      <th align="left">Customer:</th>
      <td align="right">STG SG V32</td>
    </tr>

    <tr>
      <td>
        <p></p>
      </td>
    </tr>
    <tr>
      <th align="left">Amount paid:</th>
      <td align="right">$2,097.00 SGD</td>
    </tr>

    <tr>
      <td>
        <p></p>
      </td>
    </tr>
  </tbody>
</table>

Can anyone help on why its happening or is there something i am missing, as i can't see anything wrong from the things which are in our control.

### Tasks

Compare the Liquid template source with the rendered HTML copied from Gmail, focusing on the false conditional blocks. First establish whether the empty

...

exists before Gmail processing; done means identifying where it is introduced and confirming conditional sections do not leave an empty row.