<style>
    table {
        font-size: 10px;
        border-collapse: collapse;
        width: 100%;
        table-layout: fixed;
        word-wrap: break-word;
    }

    th,
    td {
        border: 1px solid black;
    }

    th,
    td {
        padding: 4px;
        text-align: left;
        /* border: 1px solid #ddd; */
    }

    th {
        text-align: left;
    }

    .page-break {
        page-break-after: always;
    }

    .header {
        font-size: 22px;
        text-align: center;
        margin-bottom: 20px;
    }

    .logo {
        width: 100px;
        height: 100px;
        margin: 0 auto;
    }
</style>

<div class="header">
    {{-- <img src="{{ asset('assets/images/logo.png') }}" alt="logo" class="logo"> --}}
    <h2>{{ $general->site_name }}</h2>
</div>

<h3>Transaction History</h3>

<table>
    <tr>
        <th>Date</th>
        <th>TRX</th>
        <th>Amount</th>
        <th>Charge</th>
        <th>Mode of Payment</th>
        <th>Detail</th>
    </tr>
    @foreach($transactions as $trx)
        <tr>
            <td>{{ showDateTime($trx->created_at) }}</td>
            <td>{{ $trx->trx }}</td>
            <td>{{ getAmount($trx->amount) }} {{ $general->cur_text }}</td>
            <td>{{ getAmount($trx->charge) }} {{ $general->cur_text }}</td>
            <td>{{ $trx->payment_mode }}</td>
            <td>{{ $trx->details }}</td>
        </tr>
    @endforeach
</table>

<div class="page-break"></div>

<h3>User Information</h3>

<table>
    <tr>
        <th>Name</th>
        <td>{{ $user->fullname }}</td>
    </tr>
    <tr>
        <th>Email</th>
        <td>{{ $user->email }}</td>
    </tr>
    <tr>
        <th>Username</th>
        <td>{{ $user->username }}</td>
    </tr>
    <tr>
        <th>Mobile</th>
        <td>{{ $user->mobile }}</td>
    </tr>
</table>
