@extends('layouts.app')
@section('title', 'Invoice '.$invoice->invoice_number)
@section('page-title', 'Invoice')

@section('content')
<div class="page-header">
    <div>
        <div class="breadcrumb"><a href="{{ route('hotel.dashboard') }}">Dashboard</a><span>/</span><a href="{{ route('hotel.invoices.index') }}">Invoices</a><span>/</span>{{ $invoice->invoice_number }}</div>
        <h1>{{ $invoice->invoice_number }}</h1>
    </div>
    <div style="display:flex;gap:8px;">
        @if(!$invoice->isPaid() && !$invoice->isVoided())
            <button onclick="openModal('payment-modal')" class="btn btn-success"><i class="fas fa-money-bill-wave"></i> Record Payment</button>
            <button onclick="openModal('void-modal')" class="btn btn-danger btn-sm"><i class="fas fa-ban"></i> Void</button>
        @endif
        @if($invoice->receipt)
            <a href="{{ route('hotel.receipts.show', $invoice->receipt) }}" class="btn btn-primary"><i class="fas fa-receipt"></i> View Receipt</a>
        @endif
        <a href="{{ route('hotel.bookings.show', $invoice->booking) }}" class="btn btn-outline"><i class="fas fa-arrow-left"></i> Back to Booking</a>
    </div>
</div>

<div style="max-width:720px;">
<div class="card">
    <div class="card-header">
        <span class="card-title">Invoice Details</span>
        @if($invoice->status==='paid') <span class="badge badge-success">Paid</span>
        @elseif($invoice->status==='partial') <span class="badge badge-warning">Partial Payment</span>
        @elseif($invoice->status==='voided') <span class="badge badge-danger">Voided</span>
        @else <span class="badge badge-secondary">Unpaid</span> @endif
    </div>
    <div class="card-body">
        <div class="form-row" style="margin-bottom:20px;">
            <div>
                <div style="font-size:11px;color:#9ca3af;font-weight:700;text-transform:uppercase;margin-bottom:4px;">Guest</div>
                <div style="font-weight:700;">{{ $invoice->booking->guest->full_name }}</div>
                <div style="font-size:13px;color:#6b7280;">{{ $invoice->booking->guest->phone }}</div>
            </div>
            <div>
                <div style="font-size:11px;color:#9ca3af;font-weight:700;text-transform:uppercase;margin-bottom:4px;">Booking</div>
                <div style="font-weight:700;">{{ $invoice->booking->booking_reference }}</div>
                <div style="font-size:13px;color:#6b7280;">Room {{ $invoice->booking->room->room_number }} — {{ $invoice->booking->nights }} nights</div>
            </div>
        </div>

        <table style="width:100%;font-size:13.5px;border-collapse:collapse;margin-bottom:16px;">
            <thead><tr>
                <th style="text-align:left;padding:8px 0;border-bottom:2px solid #e5e7eb;font-size:11px;color:#6b7280;text-transform:uppercase;">Description</th>
                <th style="text-align:center;padding:8px 0;border-bottom:2px solid #e5e7eb;font-size:11px;color:#6b7280;text-transform:uppercase;">Qty</th>
                <th style="text-align:right;padding:8px 0;border-bottom:2px solid #e5e7eb;font-size:11px;color:#6b7280;text-transform:uppercase;">Amount</th>
            </tr></thead>
            <tbody>
                <tr>
                    <td style="padding:10px 0;">Room {{ $invoice->booking->room->room_number }} ({{ $invoice->booking->room->roomType->name }})</td>
                    <td style="text-align:center;color:#6b7280;">{{ $invoice->booking->nights }}n</td>
                    <td style="text-align:right;font-weight:600;">₦{{ number_format($invoice->booking->room->roomType->base_price * $invoice->booking->nights, 2) }}</td>
                </tr>
                @foreach($invoice->booking->extras as $extra)
                <tr>
                    <td style="padding:8px 0;color:#374151;">{{ $extra->item_name }}</td>
                    <td style="text-align:center;color:#6b7280;">{{ $extra->quantity }}</td>
                    <td style="text-align:right;">₦{{ number_format($extra->total, 2) }}</td>
                </tr>
                @endforeach
            </tbody>
            <tfoot>
                @if($invoice->discount > 0)<tr><td colspan="2" style="padding:8px 0;color:#059669;">Discount</td><td style="text-align:right;color:#059669;">-₦{{ number_format($invoice->discount, 2) }}</td></tr>@endif
                @if($invoice->tax > 0)<tr><td colspan="2" style="padding:8px 0;">Tax</td><td style="text-align:right;">₦{{ number_format($invoice->tax, 2) }}</td></tr>@endif
                <tr style="border-top:2px solid #111827;">
                    <td colspan="2" style="padding:10px 0;font-weight:700;font-size:15px;">Total</td>
                    <td style="text-align:right;font-weight:700;font-size:15px;">₦{{ number_format($invoice->total, 2) }}</td>
                </tr>
                @php $paid = $invoice->payments->sum('amount'); @endphp
                @if($paid > 0)
                <tr><td colspan="2" style="padding:4px 0;color:#059669;">Paid</td><td style="text-align:right;color:#059669;font-weight:600;">₦{{ number_format($paid, 2) }}</td></tr>
                @if($paid < $invoice->total)
                <tr><td colspan="2" style="padding:4px 0;color:#dc2626;font-weight:700;">Balance Due</td><td style="text-align:right;color:#dc2626;font-weight:700;">₦{{ number_format($invoice->total - $paid, 2) }}</td></tr>
                @endif
                @endif
            </tfoot>
        </table>

        @if($invoice->payments->count())
        <div style="background:#f8fafc;border-radius:8px;padding:14px;margin-top:8px;">
            <div style="font-size:12px;font-weight:700;color:#6b7280;text-transform:uppercase;letter-spacing:.05em;margin-bottom:10px;">Payment History</div>
            @foreach($invoice->payments as $payment)
            <div style="display:flex;justify-content:space-between;align-items:center;font-size:13px;padding:6px 0;border-bottom:1px solid #e5e7eb;">
                <div>
                    <span style="font-weight:600;">₦{{ number_format($payment->amount, 2) }}</span>
                    <span class="badge badge-success" style="font-size:10px;margin-left:6px;">{{ ucfirst($payment->method) }}</span>
                    @if($payment->reference)<span style="color:#6b7280;font-size:12px;"> — {{ $payment->reference }}</span>@endif
                </div>
                <div style="font-size:12px;color:#9ca3af;">{{ $payment->created_at->format('d M Y H:i') }}</div>
            </div>
            @endforeach
        </div>
        @endif

        @if($invoice->isVoided())
        <div class="alert alert-danger" style="margin-top:16px;">
            <i class="fas fa-ban"></i>
            Voided on {{ $invoice->voided_at->format('d M Y H:i') }}. Reason: {{ $invoice->void_reason }}
        </div>
        @endif
    </div>
</div>
</div>

<!-- Payment Modal -->
<div class="modal-overlay" id="payment-modal">
    <div class="modal">
        <div class="modal-header"><span class="modal-title">Record Payment</span><button class="modal-close" onclick="closeModal('payment-modal')">×</button></div>
        <form method="POST" action="{{ route('hotel.invoices.payment', $invoice) }}">@csrf
            <div class="modal-body">
                <div class="form-group">
                    <label class="form-label">Amount (₦) <span class="required">*</span></label>
                    <input type="number" name="amount" class="form-control" required min="0.01" step="0.01" value="{{ $invoice->total - $invoice->payments->sum('amount') }}">
                </div>
                <div class="form-group">
                    <label class="form-label">Payment Method <span class="required">*</span></label>
                    <select name="method" class="form-control" required>
                        <option value="cash">Cash</option>
                        <option value="transfer">Bank Transfer</option>
                        <option value="pos">POS</option>
                        <option value="online">Online</option>
                    </select>
                </div>
                <div class="form-group">
                    <label class="form-label">Reference / Transaction ID</label>
                    <input type="text" name="reference" class="form-control" placeholder="Optional reference number">
                </div>
                <div class="form-group">
                    <label class="form-label">Note</label>
                    <textarea name="note" class="form-control" rows="2" placeholder="Any additional notes..."></textarea>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-outline" onclick="closeModal('payment-modal')">Cancel</button>
                <button type="submit" class="btn btn-success"><i class="fas fa-check"></i> Confirm Payment</button>
            </div>
        </form>
    </div>
</div>

<!-- Void Modal -->
<div class="modal-overlay" id="void-modal">
    <div class="modal">
        <div class="modal-header"><span class="modal-title">Void Invoice</span><button class="modal-close" onclick="closeModal('void-modal')">×</button></div>
        <form method="POST" action="{{ route('hotel.invoices.void', $invoice) }}">@csrf
            <div class="modal-body">
                <div class="alert alert-danger"><i class="fas fa-exclamation-triangle"></i> This action is recorded in the audit log and cannot be reversed.</div>
                <div class="form-group">
                    <label class="form-label">Reason for voiding <span class="required">*</span></label>
                    <textarea name="void_reason" class="form-control" required placeholder="e.g. Booking was cancelled, duplicate invoice..."></textarea>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-outline" onclick="closeModal('void-modal')">Cancel</button>
                <button type="submit" class="btn btn-danger"><i class="fas fa-ban"></i> Void Invoice</button>
            </div>
        </form>
    </div>
</div>
@endsection