@include('accounting::admin.accounting._styles')
<style>
.ledger-running { font-weight:600; }
.ledger-running.dr { color:#1d4ed8; }
.ledger-running.cr { color:#059669; }
</style>

<div class="acc-wrap">
    <div class="acc-header">
        <div class="acc-header-left">
            <div class="acc-header-icon" style="background:linear-gradient(135deg,#0891b2,#0e7490)">
                <svg fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/></svg>
            </div>
            <div><h1>Ledger</h1><div class="acc-header-sub">Account-wise transaction history</div></div>
        </div>
    </div>

    {{-- Filter Form --}}
    <div class="acc-card" style="margin-bottom:20px;">
        <div class="acc-card-body">
            <form method="GET" id="ledger-form">
                <div class="acc-form-row col-4">
                    <div class="acc-form-group">
                        <label class="required">Account</label>
                        <select name="account_id" class="acc-form-control" required onchange="this.form.submit()">
                            <option value="">-- Select Account --</option>
                            @foreach($accounts as $a)
                            <option value="{{ $a->id }}" {{ request('account_id') == $a->id ? 'selected' : '' }}>
                                {{ $a->account_code }} — {{ $a->account_name }}
                            </option>
                            @endforeach
                        </select>
                    </div>
                    <div class="acc-form-group">
                        <label>From Date</label>
                        <input type="date" name="from" class="acc-form-control" value="{{ request('from') }}">
                    </div>
                    <div class="acc-form-group">
                        <label>To Date</label>
                        <input type="date" name="to" class="acc-form-control" value="{{ request('to', now()->format('Y-m-d')) }}">
                    </div>
                    <div class="acc-form-group" style="display:flex;align-items:flex-end;">
                        <button type="submit" class="btn-acc-primary" style="width:100%;">
                            <svg fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" width="16" height="16"><path stroke-linecap="round" stroke-linejoin="round" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"/></svg>
                            Show Ledger
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </div>

    @if($account)
    {{-- Account summary --}}
    <div style="display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px;">
        <div class="acc-stat" style="min-width:0;">
            <div class="acc-stat-icon blue"><svg fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg></div>
            <div><div class="acc-stat-value" style="font-size:14px;">₹{{ number_format($opening,2) }}</div><div class="acc-stat-label">Opening</div></div>
        </div>
        <div class="acc-stat" style="min-width:0;">
            <div class="acc-stat-icon blue"><svg fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M7 11l5-5m0 0l5 5m-5-5v12"/></svg></div>
            <div><div class="acc-stat-value" style="font-size:14px;">₹{{ number_format($entries->sum('debit'),2) }}</div><div class="acc-stat-label">Total Debit</div></div>
        </div>
        <div class="acc-stat" style="min-width:0;">
            <div class="acc-stat-icon green"><svg fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M17 13l-5 5m0 0l-5-5m5 5V6"/></svg></div>
            <div><div class="acc-stat-value" style="font-size:14px;">₹{{ number_format($entries->sum('credit'),2) }}</div><div class="acc-stat-label">Total Credit</div></div>
        </div>
        <div class="acc-stat" style="min-width:0;">
            <div class="acc-stat-icon {{ $account->current_balance >= 0 ? 'green' : 'red' }}">
                <svg fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"/></svg>
            </div>
            <div><div class="acc-stat-value" style="font-size:14px;">₹{{ number_format(abs($account->current_balance),2) }} {{ $account->current_balance >= 0 ? 'Dr' : 'Cr' }}</div><div class="acc-stat-label">Closing</div></div>
        </div>
    </div>

    {{-- Ledger table --}}
    <div class="acc-card">
        <div class="acc-card-header">
            <h3>{{ $account->account_code }} — {{ $account->account_name }}</h3>
            <span style="font-size:12px;color:var(--text-muted);">{{ $account->group?->name }}</span>
        </div>
        <div class="acc-card-body" style="padding:0;">
            <div style="overflow-x:auto;">
                <table style="width:100%;border-collapse:collapse;font-size:13px;min-width:700px;">
                    <thead>
                        <tr style="background:var(--body-bg);">
                            <th style="padding:10px 16px;text-align:left;">Date</th>
                            <th style="padding:10px 16px;text-align:left;">Voucher #</th>
                            <th style="padding:10px 16px;text-align:left;">Type</th>
                            <th style="padding:10px 16px;text-align:left;">Narration</th>
                            <th style="padding:10px 16px;text-align:right;">Debit (₹)</th>
                            <th style="padding:10px 16px;text-align:right;">Credit (₹)</th>
                            <th style="padding:10px 16px;text-align:right;">Balance</th>
                        </tr>
                    </thead>
                    <tbody>
                        {{-- Opening balance row --}}
                        <tr style="background:rgba(59,130,246,.05);">
                            <td style="padding:10px 16px;color:var(--text-muted);"></td>
                            <td colspan="3" style="padding:10px 16px;font-weight:600;">Opening Balance</td>
                            <td style="padding:10px 16px;text-align:right;"></td>
                            <td style="padding:10px 16px;text-align:right;"></td>
                            <td style="padding:10px 16px;text-align:right;font-weight:700;">₹ {{ number_format(abs($opening),2) }} {{ $opening >= 0 ? 'Dr' : 'Cr' }}</td>
                        </tr>
                        @php $runBal = $opening; $nature = $account->group?->nature ?? 'debit'; @endphp
                        @forelse($entries as $entry)
                        @php
                            $d = (float)$entry->debit; $c = (float)$entry->credit;
                            $runBal += $nature === 'debit' ? ($d - $c) : ($c - $d);
                        @endphp
                        <tr style="border-top:1px solid var(--card-border);">
                            <td style="padding:10px 16px;white-space:nowrap;">{{ $entry->voucher->voucher_date->format('d M Y') }}</td>
                            <td style="padding:10px 16px;">
                                <a href="{{ route('admin.accounting.vouchers.show', $entry->voucher->id) }}" style="color:var(--primary);font-weight:600;text-decoration:none;">{{ $entry->voucher->voucher_number }}</a>
                            </td>
                            <td style="padding:10px 16px;font-size:11px;color:var(--text-muted);">{{ $entry->voucher->type_label }}</td>
                            <td style="padding:10px 16px;color:var(--text-muted);">{{ $entry->narration ?: $entry->voucher->narration ?: '—' }}</td>
                            <td style="padding:10px 16px;text-align:right;font-weight:600;color:#1d4ed8;">{{ $d > 0 ? '₹ '.number_format($d,2) : '' }}</td>
                            <td style="padding:10px 16px;text-align:right;font-weight:600;color:#059669;">{{ $c > 0 ? '₹ '.number_format($c,2) : '' }}</td>
                            <td style="padding:10px 16px;text-align:right;" class="ledger-running {{ $runBal >= 0 ? 'dr' : 'cr' }}">
                                ₹ {{ number_format(abs($runBal),2) }} {{ $runBal >= 0 ? 'Dr' : 'Cr' }}
                            </td>
                        </tr>
                        @empty
                        <tr><td colspan="7" style="padding:24px;text-align:center;color:var(--text-muted);">No transactions found for this account in the selected period.</td></tr>
                        @endforelse
                    </tbody>
                    @if($entries->isNotEmpty())
                    <tfoot>
                        <tr style="background:var(--body-bg);border-top:2px solid var(--card-border);">
                            <td colspan="4" style="padding:12px 16px;text-align:right;font-weight:700;">Closing Balance</td>
                            <td style="padding:12px 16px;text-align:right;font-weight:700;color:#1d4ed8;">₹ {{ number_format($entries->sum('debit'),2) }}</td>
                            <td style="padding:12px 16px;text-align:right;font-weight:700;color:#059669;">₹ {{ number_format($entries->sum('credit'),2) }}</td>
                            <td style="padding:12px 16px;text-align:right;font-weight:700;font-size:14px;">₹ {{ number_format(abs($runBal ?? $opening),2) }} {{ ($runBal ?? $opening) >= 0 ? 'Dr' : 'Cr' }}</td>
                        </tr>
                    </tfoot>
                    @endif
                </table>
            </div>
        </div>
    </div>
    @else
    <div style="text-align:center;padding:48px;color:var(--text-muted);">
        <svg fill="none" stroke="currentColor" stroke-width="1" viewBox="0 0 24 24" width="48" height="48" style="margin:0 auto 12px;display:block;opacity:.4;"><path stroke-linecap="round" stroke-linejoin="round" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/></svg>
        <p>Select an account above to view its ledger.</p>
    </div>
    @endif
</div>