{{-- resources/views/invoicing/credit-notes/index.blade.php --}}
@extends('layouts.app')
@section('title', 'Credit Notes')
@section('page_title', 'Credit Notes')
@section('page_subtitle', 'Manage credit notes')

@section('content')

<div class="d-flex justify-content-between align-items-center mb-3">
    <span style="font-size:.8rem;color:var(--muted);">
        {{ $creditNotes->total() }} credit notes
    </span>
    <div class="d-flex gap-2">
        <a href="{{ tenant_route('invoicing.invoices.index') }}"
           class="btn btn-sm btn-outline-secondary">
            ← Invoices
        </a>
    </div>
</div>

<div class="card">
    <div class="card-header">
        <span class="card-title">Credit Notes</span>
    </div>

    @if($creditNotes->isEmpty())
        <div class="card-body text-center py-5">
            <i class="bi bi-file-earmark-minus"
               style="font-size:2.5rem;color:var(--muted)"></i>
            <p class="fw-semibold mt-3 mb-1">No credit notes</p>
        </div>
    @else
        <div class="table-responsive">
            <table class="table">
                <thead>
                    <tr>
                        <th>Reference</th>
                        <th>Guest</th>
                        <th>Invoice</th>
                        <th>Amount</th>
                        <th>Remaining</th>
                        <th>Status</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($creditNotes as $cn)
                        <tr>
                            <td style="font-size:.8rem;font-weight:600;
                                       color:var(--clay);">
                                {{ $cn->reference }}
                            </td>
                            <td style="font-size:.8rem;">
                                @if($cn->guest)
                                    {{ $cn->guest->first_name }}
                                    {{ $cn->guest->last_name }}
                                @else
                                    —
                                @endif
                            </td>
                            <td style="font-size:.78rem;color:var(--muted);">
                                {{ $cn->invoice?->invoice_number ?? '—' }}
                            </td>
                            <td style="font-size:.82rem;font-weight:600;">
                                {{ $cn->currency }}
                                {{ number_format($cn->amount, 2) }}
                            </td>
                            <td style="font-size:.8rem;color:var(--success);">
                                {{ $cn->currency }}
                                {{ number_format($cn->amount_remaining, 2) }}
                            </td>
                            <td>
                                <span style="font-size:.7rem;font-weight:600;
                                             padding:2px 8px;border-radius:20px;
                                             background:{{ $cn->status === 'active' ? '#d1fae5' : '#fee2e2' }};
                                             color:{{ $cn->status === 'active' ? '#065f46' : '#991b1b' }};">
                                    {{ $cn->status }}
                                </span>
                            </td>
                            <td>
                                <a href="{{ tenant_route('invoicing.credit-notes.show', ['creditNote' => $cn->id]) }}"
                                   class="btn btn-xs btn-outline-secondary">
                                    View →
                                </a>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    @endif
</div>

@endsection