{{-- resources/views/finance/invoices/show.blade.php --}}
@extends('layouts.finance.finance')

@section('content')
    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-8">

        {{-- Header & Actions --}}
        <div class="flex justify-between items-center mb-6">
            <div class="flex items-center space-x-4">
                <a href="{{ url()->previous() }}" class="text-gray-500 hover:text-gray-700 transition">
                    <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                            d="M10 19l-7-7m0 0l7-7m-7 7h18"></path>
                    </svg>
                </a>
                <h1 class="text-2xl font-bold text-gray-900">
                    Invoice {{ $invoice->invoice_number ?? ('#' . $invoice->id) }}
                </h1>

                @php 
                                    $statusColor = in_array(strtolower($invoice->status ?? ''), ['paid', 'completed'])
    ? 'bg-green-100 text-green-800'
    : (strtolower($invoice->status ?? '') === 'overdue' ? 'bg-red-100 text-red-800' : 'bg-yellow-100 text-yellow-800'); 
                @endphp
                <span class="px-3 py-1 inline-flex text-sm leading-5 font-semibold rounded-full {{ $statusColor }}">
                    {{ ucfirst($invoice->status ?? 'Pending') }}
                </span>
            </div>

            <div>
                {{-- Placeholder for a Print/Download PDF button --}}
                <button onclick="window.print()"
                    class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
                    <svg class="mr-2 -ml-1 h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                            d="M17 17h2a2 2 0 002-2v-4a2 2 0 00-2-2H5a2 2 0 00-2 2v4a2 2 0 002 2h2m2 4h6a2 2 0 002-2v-4a2 2 0 00-2-2H9a2 2 0 00-2 2v4a2 2 0 002 2zm8-12V5a2 2 0 00-2-2H9a2 2 0 00-2 2v4h10z" />
                    </svg>
                    Print Invoice
                </button>
            </div>
        </div>

        {{-- Invoice Document Card --}}
        <div class="bg-white rounded-lg shadow-lg border border-gray-200 overflow-hidden">

            {{-- Top Section: Company & Client Info --}}
            <div class="p-8 border-b border-gray-200 flex justify-between">
                <div>
                    <h2 class="text-xl font-bold text-gray-800 mb-1">Meking Steel</h2>
                    <p class="text-sm text-gray-500">Old No.110, New No. 37, Nelson Manickam Road, Aminjikarai</p>
                    <p class="text-sm text-gray-500">Chennai, Tamil Nadu, 600029</p>
                    <p class="text-sm text-gray-500">info@mekingsteel.com</p>
                </div>

                <div class="text-right">
                    <p class="text-sm font-semibold text-gray-600 uppercase tracking-wider mb-1">Billed To</p>
                    <h3 class="text-lg font-bold text-gray-800">{{ $invoice->project->client_name ?? 'Client Name' }}</h3>
                    <p class="text-sm text-gray-500">Project: {{ $invoice->project->title ?? 'N/A' }}</p>
                    <p class="text-sm text-gray-500">Project ID: #{{ $invoice->project_id }}</p>
                </div>
            </div>

            {{-- Middle Section: Dates & Details --}}
            <div class="px-8 py-6 bg-gray-50 flex justify-between border-b border-gray-200">
                <div>
                    <p class="text-xs font-semibold text-gray-500 uppercase tracking-wider">Invoice Date</p>
                    <p class="text-sm font-medium text-gray-900 mt-1">
                        {{ \Carbon\Carbon::parse($invoice->created_at)->format('M d, Y') }}
                    </p>
                </div>

                {{-- Optional: Add a Due Date if your database tracks it --}}
                <div>
                    <p class="text-xs font-semibold text-gray-500 uppercase tracking-wider">Due Date</p>
                    <p class="text-sm font-medium text-gray-900 mt-1">
                        {{ $invoice->due_date ? \Carbon\Carbon::parse($invoice->due_date)->format('M d, Y') : 'Upon Receipt' }}
                    </p>
                </div>

                <div>
                    <p class="text-xs font-semibold text-gray-500 uppercase tracking-wider">Total Amount</p>
                    <p class="text-lg font-bold text-gray-900 mt-1">
                        Rs
                        {{ number_format($invoice->amount ?? $invoice->total_amount ?? $invoice->total ?? $invoice->grand_total ?? 0, 2) }}
                    </p>
                </div>
            </div>

            {{-- Bottom Section: Invoice Notes / Description --}}
            <div class="p-8">
                <h3 class="text-sm font-semibold text-gray-800 uppercase tracking-wider mb-4">Invoice Description</h3>

                <div class="bg-gray-50 rounded p-4 border border-gray-100">
                    <p class="text-gray-700 whitespace-pre-line">
                        {{ $invoice->description ?? $invoice->notes ?? 'Standard invoice for project services rendered.' }}
                    </p>
                </div>

                {{-- Payment Summary --}}
                <div class="mt-8 flex justify-end">
                    <div class="w-64 space-y-3">
                        <div class="flex justify-between text-sm text-gray-600">
                            <span>Subtotal:</span>
                            <span>Rs
                                {{ number_format($invoice->amount ?? $invoice->total_amount ?? $invoice->total ?? 0, 2) }}</span>
                        </div>
                        <div class="flex justify-between text-lg font-bold text-gray-900 border-t border-gray-200 pt-2">
                            <span>Total:</span>
                            <span>Rs
                                {{ number_format($invoice->amount ?? $invoice->total_amount ?? $invoice->total ?? 0, 2) }}</span>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
@endsection