<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Expenses Report</title>
    <style>
        body {
            font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
            color: #1e293b;
            font-size: 11px;
            line-height: 1.4;
        }
        .header {
            margin-bottom: 20px;
            border-bottom: 2px solid #e2e8f0;
            padding-bottom: 12px;
        }
        .business-title {
            font-size: 18px;
            font-weight: bold;
            color: #ea580c;
            margin: 0;
        }
        .report-title {
            font-size: 13px;
            font-weight: bold;
            margin-top: 3px;
            color: #0f172a;
        }
        .table-data {
            width: 100%;
            border-collapse: collapse;
            margin-top: 10px;
        }
        .table-data th {
            background-color: #f1f5f9;
            font-weight: bold;
            text-align: left;
            padding: 6px 8px;
            border-bottom: 1px solid #cbd5e1;
            font-size: 9px;
            text-transform: uppercase;
            color: #475569;
        }
        .table-data td {
            padding: 6px 8px;
            border-bottom: 1px solid #e2e8f0;
        }
        .font-mono {
            font-family: Courier, monospace;
        }
        .text-right {
            text-align: right;
        }
        .total-row {
            background-color: #f8fafc;
            font-weight: bold;
            font-size: 12px;
        }
    </style>
</head>
<body>

    <div class="header">
        <table style="width: 100%;">
            <tr>
                <td>
                    <h1 class="business-title">{{ $businessName }}</h1>
                    <div class="report-title">Expenses Ledger Report</div>
                </td>
                <td style="text-align: right; vertical-align: top; font-size: 10px; color: #64748b;">
                    <div>Generated: {{ date('d-m-Y H:i') }}</div>
                    <div>Period: {{ date('d-m-Y', strtotime($dateFrom)) }} to {{ date('d-m-Y', strtotime($dateTo)) }}</div>
                </td>
            </tr>
        </table>
    </div>

    <table class="table-data">
        <thead>
            <tr>
                <th style="width: 10%;">Date</th>
                <th style="width: 15%;">Category</th>
                <th style="width: 15%;">Payee details</th>
                <th>Notes / Details</th>
                <th style="width: 15%;">Paid From</th>
                <th class="text-right" style="width: 10%;">Net</th>
                <th class="text-right" style="width: 8%;">VAT</th>
                <th class="text-right" style="width: 12%;">Total</th>
            </tr>
        </thead>
        <tbody>
            @forelse($expenses as $exp)
                <tr>
                    <td>{{ $exp->date->format('d-m-Y') }}</td>
                    <td>
                        @if($exp->category)
                            {{ $exp->category->parent ? $exp->category->parent->name . ' - ' : '' }}{{ $exp->category->name }}
                        @else
                            Uncategorized
                        @endif
                    </td>
                    <td>
                        {{ $exp->payee_bank_name ?: 'N/A' }}
                        @if($exp->payee_account_no)
                            <div style="font-size: 8px; color: #64748b; font-family: Courier, monospace;">A/C: {{ $exp->payee_account_no }}</div>
                        @endif
                    </td>
                    <td>{{ $exp->notes ?: 'N/A' }}</td>
                    <td>{{ $exp->bankAccount ? $exp->bankAccount->name : 'N/A' }}</td>
                    <td class="text-right font-mono">{{ $currencySymbol }}{{ number_format($exp->net_amount ?? $exp->amount, 2) }}</td>
                    <td class="text-right font-mono">{{ $currencySymbol }}{{ number_format($exp->vat_amount ?? 0.00, 2) }}</td>
                    <td class="text-right font-mono">{{ $currencySymbol }}{{ number_format($exp->amount, 2) }}</td>
                </tr>
            @empty
                <tr>
                    <td colspan="9" style="text-align: center; color: #94a3b8; padding: 15px;">No expenses recorded in this period.</td>
                </tr>
            @endforelse
            <tr class="total-row">
                <td colspan="5" class="text-right">Total Outgoings:</td>
                <td class="text-right font-mono">{{ $currencySymbol }}{{ number_format($totalExpensesNet, 2) }}</td>
                <td class="text-right font-mono">{{ $currencySymbol }}{{ number_format($totalExpensesVat, 2) }}</td>
                <td class="text-right font-mono">{{ $currencySymbol }}{{ number_format($totalExpenses, 2) }}</td>
            </tr>
        </tbody>
    </table>

</body>
</html>
