Table in Emails showing raw HTML after upgrading Laravel

[Ifriqiya]

I recently upgraded a project to php 8 and laravel 8.37 and noticed raw html in emails when they contain a table. The table becomes malformed. I tried the pointers about removing indents, upgrading to L9, but still no difference. Below are screenshots of the table.

This is my layout.blade code:
`

<style> @media only screen and (max-width: 600px) { .inner-body { width: 100% !important; }

        .footer {
            width: 100% !important;
        }
    }

    @media only screen and (max-width: 500px) {
        .button {
            width: 100% !important;
        }
    }
</style>

<table class="wrapper" width="100%" cellpadding="0" cellspacing="0">
    <tr>
        <td align="center">
            <table class="content" width="100%" cellpadding="0" cellspacing="0">
                {{ $header ?? '' }}

                <!-- Email Body -->
                <tr>
                    <td class="body" width="100%" cellpadding="0" cellspacing="0">
                        <table class="inner-body" align="center" width="570" cellpadding="0" cellspacing="0">
                            <!-- Body content -->
                            <tr>
                                <td class="content-cell">
                                    {{ Illuminate\Mail\Markdown::parse($slot) }}

                                    {{ $subcopy ?? '' }}
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>

                {{ $footer ?? '' }}
            </table>
        </td>
    </tr>
</table>

`

This is the broken email blade code:

`@component('mail::message')

Hello {{ $user->name }},

Please find below, a summary of the portfolio performance of {{ $plan->name }} plan for the month of {{ \Carbon\Carbon::now()->format('M, Y') }}

Want more information? Chat with us in-app or send an email to ....

<style> table { font-family: arial, sans-serif; font-size:11px; border-collapse: collapse; width: 100%; margin: 20px auto; table-layout: auto; } td, th { border: 1px solid #dddddd; text-align: left; padding: 8px; } tr:nth-child(even) { background-color: #dddddd; } </style>

@if($stocks->isNotEmpty())

Stocks

@foreach($stocks as $stock)

                                @endforeach

                                <tr>
                                    <td colspan="3">
                                     Sub Total
                                    </td>
                                    <td>
                                      {{ $stock->stock_total_cost }}
                                    </td>
                                    <td>
                                      
                                    </td>
                                     <td>
                                      {{ $stock->stock_total_currentmarkval }}
                                    </td>
                                     <td>
                                      {{ $stock->stock_total_absolutegain }}
                                    </td>
                                    <td>
                                      {{ $stock->stock_total_percentgain }}
                                    </td>
                                <tr>
                            </tbody>
                        </table>
                       @endif
                        <br>
                       @if($bonds->isNotEmpty())
                        <h3>Bonds</h3>
                        <table >
                            <thead>
                            <tr>
                                <th>Name</th>
                                <th>Quantity</th>
                                <th>Pur Date</th>
                                <th>Pur Val(₦)</th>
                                <th>Int Rate(%)</th>
                                <th>Prin+Accr Int(₦)</th>
                                <th>Accr Int Till Date(₦)</th>
                                <th>Per Gain(%)</th>
                                <th>Tenor(Yrs)</th>
                                <th>Mat Date</th>
                            </tr>
                            </thead>
                            <tbody>
                          
                                
                                @foreach($bonds as $bond)
                                    <tr>
                                        <td>
                                        {{ $bond->name }}
                                        </td>
                                        <td>
                                        {{ $bond->quantity }}
                                        </td>
                                        <td>
                                        {{ $bond->purchase_date }}
                                        </td>
                                        <td>
                                        {{ $bond->purchase_value }}
                                        </td>
                                        <td>
                                        {{ $bond->interest_rate }}
                                        </td>
                                        <td>
                                        {{ $bond->principal_accruedinterest }}
                                        </td>
                                        <td>
                                        {{ $bond->accruedinterest_tilldate }}
                                        </td>
                                        <td>
                                        {{ $bond->percent_gain }}
                                        </td>
                                         <td>
                                        {{ $bond->tenor }}
                                        </td>
                                        <td>
                                        {{ $bond->  maturity_date }}
                                        </td>
                                    </tr>
                                   
                                @endforeach

                                <tr>
                                    <td colspan="3">
                                     Sub Total
                                    </td>
                                    <td>
                                      {{ $bond->bondtotal_purchasevalue }}
                                    </td>
                                    <td>
                                      
                                    </td>
                                     <td>
                                      {{ $bond->bondtotal_principalaccruedinterest }}
                                    </td>
                                     <td>
                                      {{ $bond->bondtotal_accruedint_tilldate }}
                                    </td>
                                    <td>
                                      {{ $bond->bondtotal_percentgain }}
                                    </td>
                                    <td>
                                      
                                    </td>
                                    <td>
                                     
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="10">
                                     
                                    </td>
                                </tr>
                                 <tr>
                                    <td colspan="3">
                                     Grand Total
                                    </td>
                                    <td>
                                      {{ $bond->purchase_portfolio_value }}
                                    </td>
                                    <td>
                                      
                                    </td>
                                    <td>
                                      {{ $bond->current_portfolio_value }}
                                    </td>
                                     <td>
                                      {{ $bond->grand_gain }}
                                    </td>
                                     <td>
                                      {{ $bond->grand_percentgain }}
                                    </td>
        
                                    <td>
                                      
                                    </td>
                                    <td>
                                     
                                    </td>
                                </tr>
                           
                            </tbody>
                        </table>
                     @endif
                    </div>

The SmartWealth Team
@endcomponent`

What can I do to resolve this?

Name	Quantity	Unit Pur Cost(₦)	Total Cost(₦)	Curr Mkt Price(₦)	Curr Mkt Val(₦)	Abs Gain(₦)	Per Gain(%)
{{ $stock->name }}	{{ $stock->quantity }}	{{ $stock->unit_cost }}	{{ $stock->total_cost }}	{{ $stock->current_market_price }}	{{ $stock->current_market_value }}	{{ $stock->absolute_gain }}	{{ $stock->percent_gain }}

[Ifriqiya]

De-indenting every line of code in the email blade resolved this.