I need to remove a q-table__separator component that is taking up unnecessary space in my table footer! It is a component inherited from Quasar, it was not added with code, it is part of the Quasar table! I know I could create a footer with CSS by hand, but before trying this approach I would like to maintain the standard of the system being developed, as there are many other similar tables in it! P.s: I know that the 'botom' slot might be a more suitable option, but 'pagination' offers some items that are used in other system tables, so before making any radical changes to the default I would like to try modifying just the q-table__separator if possible!

Here is the table:

<q-table dense ref="colunaRecebimentoTitulo" :key="keyTabelaRecebimentos" :columns="colunasRecebimentosTitulos" :row-key="(row) => recebimentos.indexOf(row)" style="background-color: #fafafa; overflow: auto" class="fixar-scroll-header scroll altura-tabela" :class="[
                    atribuiSombra ? 'atribui-sombra-th-left' : '',
                    atribuiSombraFuncoes ? 'atribui-sombra-td-right atribui-sombra-th-right' : ''
                ]" :data="recebimentos" :pagination.sync="pagination" selection="multiple" :selected.sync="recebimentosSelecionados" :visible-columns="visibleColumns">
  <template v-slot:pagination="scope">
    <!-- CONTAINER -->
    <div class="container">
      <!-- PAGINAÇÃO -->
      <div class="paginacao">
        <span> Pag: {{ scope.pagination.page }}</span>
      </div>
      <!-- BADGES -->
      <div class="badges">
        <q-badge />
        <span style="font-weight: 500">A Vencer</span>
      </div>
    </div>
  </template>
</q-table>

and here is what I tried to do from the style scope

<style scoped>
  .fixar-scroll-header ::v-deep .q-table__bottom {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row-reverse;
    padding: 0px !important;
  }

  .q-table__separator {
    display: none !important;
    /* Esconde completamente */
    width: 0 !important;
    /* Remove espaço ocupado */
  }

  .container {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    align-items: center;
  }

  .badges {
    display: flex;
    flex-wrap: nowrap;
  }

  .paginacao {
    display: flex;
    justify-content: right;
    align-items: center;
    flex-wrap: nowrap;
  }
</style>

Here is the browser inspect: enter image description here