@php
    $company = $setting?->company_name ?: config('app.name');
    $primary = $setting?->primary_color ?: '#124a61';
    $symbol = $symbol ?? '';
    $code = $invoice->currency_code ?: '';

    $money = function ($value) use ($symbol, $code) {
        $formatted = number_format((float) $value, 2);
        return ($symbol !== '' ? $symbol . ' ' : ($code !== '' ? $code . ' ' : '')) . $formatted;
    };

    $hasBalance = (float) $invoice->balance_due > 0.01 && ! in_array($invoice->status, ['VOID', 'PAID'], true);
    $isPaid = ! $hasBalance && $invoice->status !== 'VOID';
    $items = $invoice->lineItems ?? collect();
@endphp

<x-mail-shell :message="$message ?? null" :setting="$setting" heading="Invoice {{ $invoice->invoice_number }}"
    preview="Invoice {{ $invoice->invoice_number }}, {{ $money($invoice->total) }}">

    <p style="margin:0 0 16px;">Dear {{ $invoice->payerName() ?: 'Customer' }},</p>

    <p style="margin:0 0 20px;">
        Please find invoice <strong>{{ $invoice->invoice_number }}</strong> from {{ $company }} below.
        A PDF copy is attached for your records.
    </p>

    <!-- Summary panel -->
    <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"
        style="background-color:#f8fafc; border:1px solid #e2e8f0; border-radius:12px; margin:0 0 24px;">
        <tr>
            <td style="padding:20px 24px;">
                <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="font-size:14px; color:#475569;">
                    <tr>
                        <td style="padding:4px 0;">Total</td>
                        <td align="right" style="padding:4px 0; font-weight:600; color:#0f172a;">{{ $money($invoice->total) }}</td>
                    </tr>
                    @if ((float) $invoice->amount_paid > 0)
                    <tr>
                        <td style="padding:4px 0;">Amount Paid</td>
                        <td align="right" style="padding:4px 0; color:#475569;">{{ $money($invoice->amount_paid) }}</td>
                    </tr>
                    @endif
                    <tr>
                        <td style="padding:10px 0 4px; border-top:1px solid #e2e8f0; font-weight:700; color:#0f172a;">
                            {{ $isPaid ? 'Balance' : 'Balance Due' }}
                        </td>
                        <td align="right" style="padding:10px 0 4px; border-top:1px solid #e2e8f0; font-weight:700; color:{{ $isPaid ? '#047857' : $primary }};">
                            {{ $money($invoice->balance_due) }}
                        </td>
                    </tr>
                    <tr>
                        <td style="padding:4px 0; color:#64748b;">Due Date</td>
                        <td align="right" style="padding:4px 0; color:#64748b;">{{ optional($invoice->due_date)->format('F j, Y') ?: '—' }}</td>
                    </tr>
                </table>

                @if ($isPaid)
                    <div style="margin-top:14px;">
                        <span style="display:inline-block; background-color:#d1fae5; color:#047857; font-size:12px; font-weight:700; letter-spacing:0.5px; text-transform:uppercase; padding:6px 12px; border-radius:9999px;">
                            &#10003; Paid in Full
                        </span>
                    </div>
                @endif
            </td>
        </tr>
    </table>

    <!-- Items being contracted -->
    @if ($items->isNotEmpty())
        <p style="margin:0 0 8px; font-size:12px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:#94a3b8;">Items</p>
        <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="margin:0 0 24px; font-size:14px;">
            @foreach ($items as $line)
                <tr>
                    <td style="padding:8px 0; border-bottom:1px solid #f1f5f9; color:#0f172a;">
                        <span style="color:{{ $primary }}; font-weight:700;">&bull;</span>&nbsp;
                        {{ $line->name }}
                        @if ((float) $line->qty > 0)
                            <span style="color:#94a3b8;">&times; {{ rtrim(rtrim(number_format((float) $line->qty, 2), '0'), '.') }}</span>
                        @endif
                    </td>
                    <td align="right" style="padding:8px 0; border-bottom:1px solid #f1f5f9; color:#475569; white-space:nowrap;">{{ $money($line->line_total) }}</td>
                </tr>
            @endforeach
        </table>
    @endif

    <!-- Call to action: an unpaid invoice always leaves with a payment button.
         Paynow takes the customer straight to checkout where it is live, and
         everywhere else the button lands on the invoice page, which carries the
         banking / mobile-money details. -->
    @if ($hasBalance)
        <table role="presentation" cellpadding="0" cellspacing="0" border="0" align="center" style="margin:8px auto 16px;">
            <tr>
                <td align="center" style="background-color:{{ $primary }}; background-image:linear-gradient(135deg,{{ $primary }},{{ $setting?->accent_color ?: '#2e86ab' }}); border-radius:10px;">
                    <a href="{{ $canPayOnline ? $payUrl : $portalUrl }}" target="_blank"
                        style="display:inline-block; padding:14px 32px; font-size:15px; font-weight:700; color:#ffffff; text-decoration:none;">
                        Pay {{ $money($invoice->balance_due) }}
                    </a>
                </td>
            </tr>
        </table>
        <p style="margin:0; text-align:center; font-size:13px; color:#64748b;">
            @if ($canPayOnline)
                Prefer to review first? <a href="{{ $portalUrl }}" target="_blank" style="color:{{ $primary }}; text-decoration:underline;">View the full invoice online</a>.
            @else
                <a href="{{ $portalUrl }}" target="_blank" style="color:{{ $primary }}; text-decoration:underline;">View the invoice and payment details online</a>.
            @endif
        </p>
    @else
        <p style="margin:0 0 4px; text-align:center; color:#047857; font-weight:600;">This invoice is fully paid, thank you!</p>
        <p style="margin:0; text-align:center; font-size:13px; color:#64748b;">
            <a href="{{ $portalUrl }}" target="_blank" style="color:{{ $primary }}; text-decoration:underline;">View invoice online</a>
        </p>
    @endif

</x-mail-shell>