From d78e10c0c64ebd3da276282ac59e3f1c0c11f94c Mon Sep 17 00:00:00 2001
From: Farah Nahle <farah.nahle@foo.mobi>
Date: Wed, 5 Aug 2026 10:57:30 +0300
Subject: [PATCH] WEB-1107: Fix Charges table alignment in Loan Account Preview
 step

The Charges table header had a stray flex-fill class applied to the
<table> element, forcing display:flex on it. This broke the shared
table layout algorithm, causing each row to compute its own column
widths independently so header and data cells no longer lined up.
---
 .../loans-account-preview-step.component.html                   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/loans/loans-account-stepper/loans-account-preview-step/loans-account-preview-step.component.html b/src/app/loans/loans-account-stepper/loans-account-preview-step/loans-account-preview-step.component.html
index bfc9ec9b5a..9b45f4dc1e 100644
--- a/src/app/loans/loans-account-stepper/loans-account-preview-step/loans-account-preview-step.component.html
+++ b/src/app/loans/loans-account-stepper/loans-account-preview-step/loans-account-preview-step.component.html
@@ -405,7 +405,7 @@ <h3 class="mat-h3 margin-t flex-fill">{{ 'labels.heading.Moratorium' | translate
       <div class="layout-row-wrap responsive-column flex-fill margin-t">
         <h3 class="mat-h3 flex-fill">{{ 'labels.heading.Charges' | translate }}</h3>
         <mat-divider class="flex-fill"></mat-divider>
-        <table class="flex-fill mat-elevation-z1" mat-table [dataSource]="loansAccount.charges">
+        <table class="mat-elevation-z1" mat-table [dataSource]="loansAccount.charges">
           <ng-container matColumnDef="name">
             <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.name' | translate }}</th>
             <td mat-cell *matCellDef="let charge">