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

@section('content')
<div class="flex flex-col lg:flex-row gap-6">

    {{-- Main Invoice Preview --}}
    <div class="flex-1 space-y-4">
        {{-- Actions bar --}}
        <div class="flex flex-wrap items-center gap-2">
            <a href="{{ route('invoices.index') }}" class="btn-secondary text-sm py-1.5">
                ← Back
            </a>
            <a href="{{ route('invoices.download', $invoice) }}" class="btn-primary text-sm py-1.5">
                <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg>
                Download PDF
            </a>
            <a href="{{ route('invoices.preview', $invoice) }}" target="_blank" class="btn-secondary text-sm py-1.5">
                Preview PDF
            </a>
            @if(!in_array($invoice->status, ['paid','cancelled']))
            <a href="{{ route('invoices.edit', $invoice) }}" class="btn-secondary text-sm py-1.5">
                Edit
            </a>
            @endif
            @if($invoice->customer_email)
            <form method="POST" action="{{ route('invoices.send-email', $invoice) }}" class="inline">
                @csrf
                <button type="submit" class="btn-secondary text-sm py-1.5">
                    <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/></svg>
                    Send Email
                </button>
            </form>
            @endif
            <a href="{{ route('invoices.duplicate', $invoice) }}" class="btn-secondary text-sm py-1.5">Duplicate</a>
            @if(!in_array($invoice->status, ['cancelled']))
            <form method="POST" action="{{ route('invoices.cancel', $invoice) }}"
                  onsubmit="return confirm('Cancel this invoice?')" class="inline">
                @csrf
                <button type="submit" class="btn-danger text-sm py-1.5">Cancel</button>
            </form>
            @endif
        </div>

        {{-- Invoice card --}}
        <div class="card">
            {{-- Header --}}
            <div class="flex justify-between items-start pb-4 mb-4 border-b border-gray-100">
                <div class="flex items-start gap-4">
                    @if($profile->logo)
                    <img src="{{ $profile->logo_url }}" class="h-14 w-auto object-contain">
                    @endif
                    <div>
                        <h2 class="text-lg font-bold text-gray-900">{{ $profile->business_name }}</h2>
                        <p class="text-xs text-gray-500">{{ $profile->full_address }}</p>
                        @if($profile->gstin)<p class="text-xs font-mono text-indigo-700 font-semibold">GSTIN: {{ $profile->gstin }}</p>@endif
                    </div>
                </div>
                <div class="text-right">
                    <h1 class="text-2xl font-bold text-indigo-700">{{ strtoupper(str_replace('_',' ',$invoice->invoice_type)) }}</h1>
                    <p class="text-lg font-semibold text-gray-800">{{ $invoice->invoice_number }}</p>
                    <p class="text-sm text-gray-500">Date: {{ $invoice->invoice_date->format('d M Y') }}</p>
                    @if($invoice->due_date)
                    <p class="text-sm {{ $invoice->isOverdue() ? 'text-red-600 font-semibold' : 'text-gray-500' }}">
                        Due: {{ $invoice->due_date->format('d M Y') }}
                    </p>
                    @endif
                    <span class="badge-{{ $invoice->status_badge_color }} mt-1 inline-block">{{ ucfirst($invoice->payment_status) }}</span>
                </div>
            </div>

            {{-- Bill To --}}
            <div class="grid grid-cols-2 gap-4 mb-6">
                <div class="bg-gray-50 rounded-lg p-4">
                    <p class="text-xs text-gray-400 font-semibold uppercase tracking-wider mb-2">Bill To</p>
                    <p class="font-semibold text-gray-900">{{ $invoice->customer_name }}</p>
                    @if($invoice->billing_address)<p class="text-sm text-gray-600 mt-1">{{ $invoice->billing_address }}</p>@endif
                    @if($invoice->customer_gstin)<p class="text-xs font-mono text-indigo-700 mt-1">GSTIN: {{ $invoice->customer_gstin }}</p>@endif
                    @if($invoice->customer_phone)<p class="text-sm text-gray-500">{{ $invoice->customer_phone }}</p>@endif
                    @if($invoice->customer_email)<p class="text-sm text-gray-500">{{ $invoice->customer_email }}</p>@endif
                </div>
                <div class="bg-gray-50 rounded-lg p-4">
                    <p class="text-xs text-gray-400 font-semibold uppercase tracking-wider mb-2">Invoice Details</p>
                    <div class="space-y-1 text-sm">
                        <div class="flex justify-between"><span class="text-gray-500">FY:</span><span>{{ $invoice->financial_year }}</span></div>
                        <div class="flex justify-between"><span class="text-gray-500">Supply:</span><span class="badge-indigo">{{ ucwords(str_replace('_',' ',$invoice->supply_type)) }}</span></div>
                        <div class="flex justify-between"><span class="text-gray-500">Place of Supply:</span><span>{{ config('erp.states.'.$invoice->place_of_supply, $invoice->place_of_supply) }}</span></div>
                        <div class="flex justify-between"><span class="text-gray-500">Rev. Charge:</span><span>{{ $invoice->reverse_charge }}</span></div>
                    </div>
                </div>
            </div>

            {{-- Items --}}
            <div class="overflow-x-auto rounded-lg border border-gray-100 mb-6">
                <table class="w-full text-sm">
                    <thead class="bg-indigo-600 text-white">
                        <tr>
                            <th class="px-3 py-2.5 text-left text-xs font-semibold">#</th>
                            <th class="px-3 py-2.5 text-left text-xs font-semibold">Item</th>
                            <th class="px-3 py-2.5 text-left text-xs font-semibold">HSN/SAC</th>
                            <th class="px-3 py-2.5 text-right text-xs font-semibold">Qty</th>
                            <th class="px-3 py-2.5 text-right text-xs font-semibold">Rate</th>
                            <th class="px-3 py-2.5 text-right text-xs font-semibold">Disc</th>
                            <th class="px-3 py-2.5 text-right text-xs font-semibold">Taxable</th>
                            @if($invoice->isInterState())
                            <th class="px-3 py-2.5 text-right text-xs font-semibold">IGST</th>
                            @else
                            <th class="px-3 py-2.5 text-right text-xs font-semibold">CGST</th>
                            <th class="px-3 py-2.5 text-right text-xs font-semibold">SGST</th>
                            @endif
                            <th class="px-3 py-2.5 text-right text-xs font-semibold">Total</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-gray-50">
                        @foreach($invoice->items as $item)
                        <tr class="{{ $loop->even ? 'bg-gray-50' : '' }}">
                            <td class="px-3 py-2 text-gray-400 text-center">{{ $item->serial_number }}</td>
                            <td class="px-3 py-2">
                                <p class="font-medium">{{ $item->item_name }}</p>
                                @if($item->description)<p class="text-xs text-gray-400">{{ $item->description }}</p>@endif
                            </td>
                            <td class="px-3 py-2 font-mono text-xs text-gray-500">{{ $item->hsn_sac_code ?: '—' }}</td>
                            <td class="px-3 py-2 text-right">{{ $item->quantity }} {{ $item->unit }}</td>
                            <td class="px-3 py-2 text-right">₹{{ number_format($item->unit_price, 2) }}</td>
                            <td class="px-3 py-2 text-right text-red-500">{{ $item->discount_percent > 0 ? $item->discount_percent.'%' : '—' }}</td>
                            <td class="px-3 py-2 text-right">₹{{ number_format($item->taxable_amount, 2) }}</td>
                            @if($invoice->isInterState())
                            <td class="px-3 py-2 text-right text-xs">{{ $item->igst_rate }}%<br>₹{{ number_format($item->igst_amount, 2) }}</td>
                            @else
                            <td class="px-3 py-2 text-right text-xs">{{ $item->cgst_rate }}%<br>₹{{ number_format($item->cgst_amount, 2) }}</td>
                            <td class="px-3 py-2 text-right text-xs">{{ $item->sgst_rate }}%<br>₹{{ number_format($item->sgst_amount, 2) }}</td>
                            @endif
                            <td class="px-3 py-2 text-right font-semibold">₹{{ number_format($item->total_amount, 2) }}</td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>

            {{-- Totals --}}
            <div class="flex justify-end">
                <div class="w-72 space-y-1.5 text-sm">
                    <div class="flex justify-between"><span class="text-gray-500">Subtotal</span><span>₹{{ number_format($invoice->subtotal, 2) }}</span></div>
                    @if($invoice->discount_amount > 0)
                    <div class="flex justify-between"><span class="text-gray-500">Discount</span><span class="text-red-500">-₹{{ number_format($invoice->discount_amount, 2) }}</span></div>
                    @endif
                    <div class="flex justify-between"><span class="text-gray-500">Taxable Amount</span><span>₹{{ number_format($invoice->taxable_amount, 2) }}</span></div>
                    @if($invoice->cgst_amount > 0)
                    <div class="flex justify-between text-xs"><span class="text-gray-400">CGST</span><span>₹{{ number_format($invoice->cgst_amount, 2) }}</span></div>
                    <div class="flex justify-between text-xs"><span class="text-gray-400">SGST</span><span>₹{{ number_format($invoice->sgst_amount, 2) }}</span></div>
                    @endif
                    @if($invoice->igst_amount > 0)
                    <div class="flex justify-between text-xs"><span class="text-gray-400">IGST</span><span>₹{{ number_format($invoice->igst_amount, 2) }}</span></div>
                    @endif
                    @if(abs($invoice->round_off) > 0)
                    <div class="flex justify-between text-xs"><span class="text-gray-400">Round Off</span><span>₹{{ number_format($invoice->round_off, 2) }}</span></div>
                    @endif
                    <div class="flex justify-between text-base font-bold bg-indigo-600 text-white px-3 py-2 rounded-lg">
                        <span>Total</span><span>₹{{ number_format($invoice->total_amount, 2) }}</span>
                    </div>
                    @if($invoice->amount_paid > 0)
                    <div class="flex justify-between text-green-700 font-medium"><span>Paid</span><span>₹{{ number_format($invoice->amount_paid, 2) }}</span></div>
                    <div class="flex justify-between text-red-600 font-bold text-base border-t pt-1"><span>Balance Due</span><span>₹{{ number_format($invoice->amount_due, 2) }}</span></div>
                    @endif
                    <p class="text-xs text-gray-400 italic pt-1">{{ $invoice->amount_in_words }}</p>
                </div>
            </div>

            @if($invoice->notes || $invoice->terms_conditions)
            <div class="mt-6 pt-4 border-t border-gray-100 grid grid-cols-2 gap-4 text-sm">
                @if($invoice->notes)
                <div><p class="text-xs text-gray-400 font-semibold uppercase mb-1">Notes</p><p class="text-gray-600">{{ $invoice->notes }}</p></div>
                @endif
                @if($invoice->terms_conditions)
                <div><p class="text-xs text-gray-400 font-semibold uppercase mb-1">Terms & Conditions</p><p class="text-gray-600">{{ $invoice->terms_conditions }}</p></div>
                @endif
            </div>
            @endif
        </div>

        {{-- Payment History --}}
        @if($invoice->payments->count() > 0)
        <div class="card">
            <h3 class="text-sm font-semibold text-gray-800 mb-3">Payment History</h3>
            <table class="w-full text-sm">
                <thead class="bg-gray-50"><tr>
                    <th class="table-th">Date</th>
                    <th class="table-th">Amount</th>
                    <th class="table-th">Mode</th>
                    <th class="table-th">Reference</th>
                    <th class="table-th">Notes</th>
                </tr></thead>
                <tbody class="divide-y divide-gray-50">
                    @foreach($invoice->payments as $pmt)
                    <tr>
                        <td class="table-td">{{ $pmt->payment_date->format('d M Y') }}</td>
                        <td class="table-td font-semibold text-green-700">₹{{ number_format($pmt->amount, 2) }}</td>
                        <td class="table-td capitalize">{{ str_replace('_', ' ', $pmt->payment_mode) }}</td>
                        <td class="table-td font-mono text-xs">{{ $pmt->reference_number ?: '—' }}</td>
                        <td class="table-td text-gray-400">{{ $pmt->notes ?: '—' }}</td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
        @endif
    </div>

    {{-- Sidebar: Record Payment --}}
    @if($invoice->amount_due > 0 && $invoice->status !== 'cancelled')
    <div class="w-full lg:w-72 flex-shrink-0">
        <div class="card sticky top-4">
            <h3 class="text-sm font-semibold text-gray-800 mb-4">Record Payment</h3>
            <form method="POST" action="{{ route('invoices.payment', $invoice) }}" class="space-y-3">
                @csrf
                <div>
                    <label class="form-label">Date</label>
                    <input type="date" name="payment_date" value="{{ today()->format('Y-m-d') }}" class="form-input text-sm" required>
                </div>
                <div>
                    <label class="form-label">Amount (Max ₹{{ number_format($invoice->amount_due, 2) }})</label>
                    <input type="number" name="amount" value="{{ $invoice->amount_due }}"
                           min="0.01" max="{{ $invoice->amount_due }}" step="0.01"
                           class="form-input text-sm" required>
                </div>
                <div>
                    <label class="form-label">Payment Mode</label>
                    <select name="payment_mode" class="form-input text-sm">
                        @foreach(['cash'=>'Cash','bank_transfer'=>'Bank Transfer','upi'=>'UPI','cheque'=>'Cheque','credit_card'=>'Credit Card','debit_card'=>'Debit Card','razorpay'=>'Razorpay'] as $val=>$label)
                        <option value="{{ $val }}">{{ $label }}</option>
                        @endforeach
                    </select>
                </div>
                <div>
                    <label class="form-label">Reference #</label>
                    <input type="text" name="reference_number" class="form-input text-sm" placeholder="UTR / Cheque / Txn ID">
                </div>
                <div>
                    <label class="form-label">Notes</label>
                    <textarea name="notes" rows="2" class="form-input text-sm"></textarea>
                </div>
                <button type="submit" class="btn-primary w-full justify-center">
                    Record Payment
                </button>
            </form>
        </div>
    </div>
    @endif
</div>
@endsection