<!DOCTYPE html>
<html lang="ur" dir="ltr">
<head>
    <meta charset="UTF-8" />
    <title>Trial Balance - Print</title>
    <style>
        * { box-sizing: border-box; margin: 0; padding: 0; }

        body {
            font-family: Arial, 'Segoe UI', sans-serif;
            font-size: 12px;
            background: #fff;
            color: #000;
        }

        .container { width: 97%; margin: 10px auto; }

        /* Company Header */
        .co-header { text-align: center; margin-bottom: 6px; }
        .co-header .co-name { font-size: 22px; font-weight: 700; letter-spacing: 3px; }
        .co-header .co-sub  { font-size: 14px; font-weight: normal; margin-top: 2px; }

        /* Info row */
        .info-row {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            border-bottom: 1px solid #aaa;
            padding-bottom: 5px;
            margin-bottom: 5px;
            font-size: 12px;
        }
        .info-row .urdu-title { font-size: 17px; font-weight: 700; direction: rtl; }

        .range-line { font-size: 11px; color: #444; margin-bottom: 6px; }

        /* Main table */
        table { width: 100%; border-collapse: collapse; font-size: 11.5px; }
        table, th, td { border: 1px solid #999; }

        thead tr.th-group th {
            background: #fff; font-weight: 700; text-align: center;
            padding: 6px 8px; white-space: nowrap; font-size: 12px;
        }
        thead tr.th-sub th {
            background: #fff; font-weight: 700; text-align: center;
            padding: 4px 8px; font-size: 11px;
        }

        tbody td { padding: 5px 8px; vertical-align: middle; }

        td.col-ac    { width: 100px; white-space: nowrap; font-size: 11px; }
        td.col-title { text-align: right; direction: rtl; font-size: 12.5px; }
        td.col-amt   { text-align: right; white-space: nowrap; width: 95px; padding-right: 10px; }

        /* ── Category heading (Suppliers / Customers) ── */
        tr.row-category td {
            font-weight: 800;
            font-size: 13px;
            color: #1565C0;
            direction: rtl;
            text-align: right;
            background: #eef2ff;
            border-top: 2px solid #1565C0 !important;
            border-bottom: 1px solid #aac;
            padding: 8px 10px 5px;
        }
        tr.row-category td.col-ac {
            text-align: left;
            direction: ltr;
            color: #1565C0;
        }

        /* Sub-category */
        tr.row-subcategory td {
            font-weight: 700; font-size: 12.5px; color: #2E7D32;
            direction: rtl; text-align: right;
            background: #fff; border-top: none; border-bottom: none;
            padding: 6px 8px 2px;
        }
        tr.row-subcategory td.col-ac { color: #1565C0; text-align: left; direction: ltr; }

        /* Sub-total */
        tr.row-total td {
            font-weight: 700; background: #f5f5f5;
            border-top: 2px solid #666 !important;
            text-align: right; padding-right: 10px;
        }
        tr.row-total td.col-ac,
        tr.row-total td.col-title { text-align: right; direction: rtl; font-size: 11.5px; }

        /* Grand total */
        tr.row-grand-total td {
            font-weight: 700; font-size: 12px; background: #e8e8e8;
            border-top: 2px solid #333 !important;
            border-bottom: 2px solid #333 !important;
            text-align: right; padding: 6px 10px;
        }
        tr.row-grand-total td.col-ac-label { text-align: left; direction: ltr; }

        /* Print button */
        .no-print {
            margin-top: 18px; padding: 9px 22px;
            background: #007bff; color: #fff;
            border: none; cursor: pointer; font-size: 14px; border-radius: 4px;
        }

        @media print {
            .no-print { display: none; }
            tr         { page-break-inside: avoid; }
            thead      { display: table-header-group; }
            tfoot      { display: table-footer-group; }

            /* keep category heading with following rows */
            tr.row-category { page-break-after: avoid; }
        }
    </style>
</head>
<body>
<div class="container">

    {{-- Company Header --}}
    <div class="co-header">
        <div class="co-name">M.D.S</div>
        <div class="co-sub">Trial Balance</div>
    </div>

    {{-- Date & Urdu title --}}
    <div class="info-row">
        <div>
            As From &nbsp;
            <strong>{{ $fromDate ? \Carbon\Carbon::parse($fromDate)->format('d/m/Y') : '/ /' }}</strong>
            &nbsp;&nbsp; To &nbsp;
            <strong>{{ $toDate   ? \Carbon\Carbon::parse($toDate)->format('d/m/Y')   : '/ /' }}</strong>
        </div>
        <div class="urdu-title">کُل کھاتہ میزان</div>
    </div>

    {{-- Account range --}}
    <div class="range-line">
        Account Nos.: &nbsp;
        <strong>{{ $fromCustomer ?? '—' }}</strong>
        &nbsp; Till &nbsp;
        <strong>{{ $toCustomer ?? '—' }}</strong>
    </div>

    @if(empty($trialData))
        <p style="text-align:center;padding:30px;color:#888;">کوئی اندراج نہیں ملا۔</p>
    @else

        <table>
            <thead>
                <tr class="th-group">
                    <th class="col-ac" rowspan="2">A/C #</th>
                    <th rowspan="2" style="text-align:right;direction:rtl;">Title</th>
                    <th colspan="2">Opening</th>
                    <th colspan="2">Current</th>
                    <th colspan="2">Balance</th>
                </tr>
                <tr class="th-sub">
                    <th>Debit</th><th>Credit</th>
                    <th>Debit</th><th>Credit</th>
                    <th>Debit</th><th>Credit</th>
                </tr>
            </thead>
            <tbody>

                @foreach($trialData as $row)

                    @if($row['type'] === 'category')
                        <tr class="row-category">
                            <td class="col-ac"></td>
                            <td colspan="7" style="font-size:14px;font-weight:800;color:#1565C0;text-align:right;direction:rtl;">
                                {{ $row['title'] }}
                            </td>
                        </tr>

                    @elseif($row['type'] === 'subcategory')
                        <tr class="row-subcategory">
                            <td class="col-ac">{{ $row['ac'] }}</td>
                            <td colspan="7" style="font-size:13px;color:#2E7D32;">{{ $row['title'] }}</td>
                        </tr>

                    @elseif($row['type'] === 'account')
                        <tr>
                            <td class="col-ac">{{ $row['ac'] }}</td>
                            <td class="col-title">{{ $row['title'] }}</td>
                            <td class="col-amt">{{ $row['opening_debit']  ? number_format($row['opening_debit'],  0) : '' }}</td>
                            <td class="col-amt">{{ $row['opening_credit'] ? number_format($row['opening_credit'], 0) : '' }}</td>
                            <td class="col-amt">{{ $row['current_debit']  ? number_format($row['current_debit'],  0) : '' }}</td>
                            <td class="col-amt">{{ $row['current_credit'] ? number_format($row['current_credit'], 0) : '' }}</td>
                            <td class="col-amt">{{ $row['balance_debit']  ? number_format($row['balance_debit'],  0) : '' }}</td>
                            <td class="col-amt">{{ $row['balance_credit'] ? number_format($row['balance_credit'], 0) : '' }}</td>
                        </tr>

                    @elseif($row['type'] === 'subtotal')
                        <tr class="row-total">
                            <td class="col-ac"></td>
                            <td class="col-title" style="direction:rtl;text-align:right;font-size:11.5px;">
                                {{ $row['title'] }} — کُل
                            </td>
                            <td class="col-amt">{{ $row['opening_debit']  ? number_format($row['opening_debit'],  0) : '' }}</td>
                            <td class="col-amt">{{ $row['opening_credit'] ? number_format($row['opening_credit'], 0) : '' }}</td>
                            <td class="col-amt">{{ $row['current_debit']  ? number_format($row['current_debit'],  0) : '' }}</td>
                            <td class="col-amt">{{ $row['current_credit'] ? number_format($row['current_credit'], 0) : '' }}</td>
                            <td class="col-amt">{{ $row['balance_debit']  ? number_format($row['balance_debit'],  0) : '' }}</td>
                            <td class="col-amt">{{ $row['balance_credit'] ? number_format($row['balance_credit'], 0) : '' }}</td>
                        </tr>

                    @endif

                @endforeach

                {{-- Grand Total --}}
                <tr class="row-grand-total">
                    <td colspan="2" class="col-ac-label">Grand Total &nbsp;&nbsp; کُل مجموعہ</td>
                    <td class="col-amt">{{ $grandOpeningDebit  ? number_format($grandOpeningDebit,  0) : '' }}</td>
                    <td class="col-amt">{{ $grandOpeningCredit ? number_format($grandOpeningCredit, 0) : '' }}</td>
                    <td class="col-amt">{{ number_format($grandTotalDebit,  0) }}</td>
                    <td class="col-amt">{{ number_format($grandTotalCredit, 0) }}</td>
                    <td class="col-amt">{{ $grandBalanceDebit  ? number_format($grandBalanceDebit,  0) : '' }}</td>
                    <td class="col-amt">{{ $grandBalanceCredit ? number_format($grandBalanceCredit, 0) : '' }}</td>
                </tr>

            </tbody>
        </table>

    @endif

    <button class="no-print" onclick="window.print()">Print Report</button>

</div>
</body>
</html>