{{--
    Subscription accordion shared by the full-page history and the AJAX
    report fragment.

    $packageHistory - PackageProfile collection with packageHistory eager loaded
    $packages, $packages_price - lookups keyed by package id
--}}
@if ($packageHistory->isEmpty())
    <x-empty icon="fa-clock-rotate-left" title="No subscriptions recorded" />
@else
    <div class="accordion">
        @foreach ($packageHistory as $subscription)
            @php
                $panelId = 'subscription-'.$subscription->id;
                $paidSoFar = $subscription->packageHistory->sum('paid');
            @endphp

            <div class="accordion__item">
                <button
                    type="button"
                    class="accordion__trigger"
                    data-accordion-trigger
                    aria-controls="{{ $panelId }}"
                    aria-expanded="{{ $loop->first ? 'true' : 'false' }}"
                >
                    <span class="u-flex u-items-center u-gap-3 u-flex-wrap">
                        <span class="u-capitalize">{{ $packages[$subscription->package_id] ?? 'Package #'.$subscription->package_id }}</span>
                        <span class="u-text-muted" style="font-weight:var(--weight-normal); font-size:var(--text-xs);">
                            {{ date('d M Y', strtotime($subscription->starting_date)) }}
                            &ndash;
                            {{ date('d M Y', strtotime($subscription->ending_date)) }}
                        </span>
                        <x-badge :tone="$subscription->status == 1 ? 'success' : 'neutral'">
                            {{ $subscription->status == 1 ? 'Running' : 'Ended' }}
                        </x-badge>
                        @if ((float) $subscription->total_due > 0)
                            <x-badge tone="warning">Due {{ number_format($subscription->total_due, 2) }}</x-badge>
                        @endif
                    </span>
                    <i class="fa-solid fa-chevron-down" aria-hidden="true"></i>
                </button>

                <div class="accordion__panel" id="{{ $panelId }}" @if (! $loop->first) hidden @endif>
                    <div class="grid grid--4 u-mb-4">
                        <div>
                            <div class="stat__label">Package price</div>
                            <div style="font-weight:var(--weight-medium);">{{ number_format($packages_price[$subscription->package_id] ?? 0, 2) }}</div>
                        </div>
                        <div>
                            <div class="stat__label">Amount</div>
                            <div style="font-weight:var(--weight-medium);">{{ number_format($subscription->amount, 2) }}</div>
                        </div>
                        <div>
                            <div class="stat__label">Discount</div>
                            <div style="font-weight:var(--weight-medium);">{{ number_format($subscription->discount, 2) }}</div>
                        </div>
                        <div>
                            <div class="stat__label">Paid / Due</div>
                            <div style="font-weight:var(--weight-medium);">
                                {{ number_format($subscription->total_paid, 2) }} / {{ number_format($subscription->total_due, 2) }}
                            </div>
                        </div>
                    </div>

                    @if ($subscription->packageHistory->isEmpty())
                        <p class="u-text-muted">No payments recorded against this subscription.</p>
                    @else
                        <div class="table-wrap">
                            <table class="table table--compact">
                                <thead>
                                    <tr>
                                        <th scope="col">Payment date</th>
                                        <th scope="col" class="u-text-right">Paid</th>
                                        <th scope="col" class="u-text-right">Due</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($subscription->packageHistory as $payment)
                                        <tr>
                                            <td class="u-nowrap">{{ date('d M Y', strtotime($payment->payment_date)) }}</td>
                                            <td class="u-numeric">{{ number_format($payment->paid, 2) }}</td>
                                            <td class="u-numeric">{{ number_format($payment->due, 2) }}</td>
                                        </tr>
                                    @endforeach
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <th scope="row">Total paid</th>
                                        <td class="u-numeric">{{ number_format($paidSoFar, 2) }}</td>
                                        <td></td>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    @endif
                </div>
            </div>
        @endforeach
    </div>
@endif