Same table size in nested tables

I created nested tables (primeNg component) with unknown amout of elements and this is my code:

<p-table [value]="topicReports" dataKey="topicName">
    <ng-template pTemplate="header">
        <tr>
            <th class="is-header">Topic / Comment / Author </th>
            <th class="is-header">Points</th>
        </tr>
    </ng-template>
    <ng-template pTemplate="body" let-topic>
        <tr class="background-color">
            <td></td>
            <td class="is-number"></td>
        </tr>
        <td colspan="2">
            <p-table *ngIf="topic.commentReports" [value]="topic.commentReports" dataKey="commentName">
                <ng-template pTemplate="body" let-comment>
                    <tr clas="background-color">
                        <td class="pl-4"></td>
                        <td class="is-number"></td>
                    </tr>
                    <td colspan="2">
                        <p-table *ngIf="comment.authorReports" [value]="comment.authorReports" dataKey="authorName">
                            <ng-template pTemplate="body" let-author>
                                <tr *ngIf="author.point > 0" class="background-color">
                                    <td class="pl-5"></td>
                                    <td class="is-number"></td>
                                </tr>
                            </ng-template>
                        </p-table>
                    </td>
                </ng-template>
            </p-table>
        </td>
    </ng-template>
    <ng-template pTemplate="summary">
        <div style="text-align: right">
            Summary points: 
        </div>
    </ng-template>
</p-table>

And this how it looks like now:

Like in the picture, nested child table have smaller size than parent. What I try to do is create maybe some kind of CSS to make them same responsive size.

from Same table size in nested tables