{{-- resources/views/purchases/payments/index.blade.php --}}
@extends('layouts.app')
@section('title', 'Supplier Payments')
@section('page_title', 'Supplier Payments')
@section('page_subtitle', 'Payments made to suppliers')

@section('content')

<div class="card mb-3">
    <div class="card-body" style="padding:12px 16px;">
        <form method="GET" class="d-flex align-items-center gap-2 flex-wrap">
            <select name="supplier"
                    class="form-select form-select-sm"
                    style="width:auto;">
                <option value="">All Suppliers</option>
                @foreach($suppliers as $s)
                    <option value="{{ $s->id }}"
                            {{ request('supplier') == $s->id ? 'selected' : '' }}>
                        {{ $s->name }}
                    </option>
                @endforeach
            </select>
            <input type="date" name="date_from"
                   class="form-control form-control-sm"
                   style="width:auto;"
                   value="{{ request('date_from') }}">
            <input type="date" name="date_to"
                   class="form-control form-control-sm"
                   style="width:auto;"
                   value="{{ request('date_to') }}">
            <button type="submit"
                    class="btn btn-sm btn-outline-secondary">
                Filter
            </button>

            <div class="ms-auto d-flex align-items-center gap-3">
                <div style="font-size:.78rem;color:var(--muted);">
                    This month:
                    <strong style="color:var(--success);">
                        ${{ number_format($totalPaidThisMonth, 2) }}
                    </strong>
                </div>
                <a href="{{ tenant_route('purchases.index') }}"
                   class="btn btn-sm btn-outline-secondary">
                    <i class="bi bi-box-seam me-1"></i>Orders
                </a>
            </div>
        </form>
    </div>
</div>

<div class="card">
    <div class="card-header">
        <span class="card-title">
            Supplier Payments
            <span style="font-size:.75rem;font-weight:400;
                         color:var(--muted);margin-left:6px;">
                {{ $payments->total() }} total
            </span>
        </span>
    </div>

    @if($payments->isEmpty())
        <div class="card-body text-center py-5">
            <i class="bi bi-cash-stack"
               style="font-size:2.5rem;color:var(--muted)"></i>
            <p class="fw-semibold mt-3 mb-1">No supplier payments yet</p>
        </div>
    @else
        <div class="table-responsive">
            <table class="table">
                <thead>
                    <tr>
                        <th>Reference</th>
                        <th>Supplier</th>
                        <th>PO</th>
                        <th>Method</th>
                        <th>Amount</th>
                        <th>Date</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($payments as $payment)
                        <tr>
                            <td style="font-size:.8rem;font-weight:600;
                                       color:var(--clay);">
                                {{ $payment->reference }}
                            </td>
                            <td style="font-size:.82rem;">
                                {{ $payment->supplier?->name }}
                            </td>
                            <td style="font-size:.78rem;color:var(--muted);">
                                @if($payment->purchaseOrder)
                                    <a href="{{ tenant_route('purchases.show', ['po' => $payment->purchase_order_id]) }}"
                                       style="color:var(--clay);">
                                        {{ $payment->purchaseOrder->po_number }}
                                    </a>
                                @else
                                    —
                                @endif
                            </td>
                            <td style="font-size:.78rem;color:var(--muted);">
                                {{ ucfirst(str_replace('_', ' ', $payment->payment_method)) }}
                            </td>
                            <td style="font-size:.84rem;font-weight:700;
                                       color:var(--success);">
                                {{ $payment->currency }}
                                {{ number_format($payment->amount, 2) }}
                            </td>
                            <td style="font-size:.78rem;color:var(--muted);
                                       white-space:nowrap;">
                                {{ $payment->paid_at->format('d M Y') }}
                            </td>
                            <td>
                                <a href="{{ tenant_route('purchases.supplier-payments.show', ['payment' => $payment->id]) }}"
                                   class="btn btn-xs btn-outline-secondary">
                                    View →
                                </a>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>

        @if($payments->hasPages())
            <div class="card-body"
                 style="border-top:1px solid var(--border);padding:12px 16px;">
                {{ $payments->links() }}
            </div>
        @endif
    @endif
</div>

@endsection