

<?php $__env->startSection('admin'); ?>
    <div class="min-h-screen bg-gray-50 dark:bg-dark-primary">
        <!-- Header Section -->
        <div class="bg-white dark:bg-dark-secondary shadow-sm border-b border-gray-200 dark:border-gray-700 no-print">
            <div class="px-4 sm:px-6 lg:px-8 py-6">
                <div class="flex flex-col md:flex-row md:items-center md:justify-between">
                    <div class="flex-1 min-w-0">
                        <div class="flex items-center">
                            <div class="flex-shrink-0 bg-gradient-to-r from-purple-500 to-indigo-600 rounded p-3 shadow-md">
                                <i class="fas fa-file-invoice text-white text-xl"></i>
                            </div>
                            <div class="ml-4">
                                <h1 class="text-2xl font-bold text-gray-900 dark:text-white">Invoice Details</h1>
                                <div class="flex flex-wrap items-center mt-1">
                                    <p class="text-sm text-gray-500 dark:text-gray-400">
                                        Invoice #: <span
                                            class="font-medium text-gray-700 dark:text-gray-300">INV-<?php echo e(str_pad($payment->id, 6, '0', STR_PAD_LEFT)); ?></span>
                                    </p>
                                    <span class="mx-2 text-gray-300 dark:text-gray-600">•</span>
                                    <p class="text-sm text-gray-500 dark:text-gray-400">
                                        Project: <span
                                            class="font-medium text-gray-700 dark:text-gray-300"><?php echo e($payment->project->name ?? 'N/A'); ?></span>
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="mt-4 flex md:mt-0 md:ml-4 space-x-3">
                        <a href="<?php echo e(route('admin.payments.invoice')); ?>"
                            class="inline-flex items-center px-4 py-2 border border-gray-300 dark:border-gray-600 rounded shadow-sm text-sm font-medium text-gray-700 dark:text-gray-300 bg-white dark:bg-dark-secondary hover:bg-gray-50 dark:hover:bg-gray-800 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-colors">
                            <i class="fas fa-arrow-left mr-2 text-gray-500"></i>
                            Back to Invoices
                        </a>
                        <button onclick="window.print()"
                            class="inline-flex items-center px-4 py-2 border border-gray-300 dark:border-gray-600 rounded shadow-sm text-sm font-medium text-gray-700 dark:text-gray-300 bg-white dark:bg-dark-secondary hover:bg-gray-50 dark:hover:bg-gray-800 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-colors">
                            <i class="fas fa-print mr-2 text-gray-500"></i>
                            Print
                        </button>
                        <button
                            class="inline-flex items-center px-4 py-2 border border-transparent rounded shadow-sm text-sm font-medium text-white bg-gradient-to-r from-purple-500 to-indigo-600 hover:from-purple-600 hover:to-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition-all">
                            <i class="fas fa-download mr-2"></i>
                            Download PDF
                        </button>
                    </div>
                </div>
            </div>
        </div>

        <!-- Invoice Content -->
        <div class="">
            <!-- Invoice Card -->
            <div
                class="bg-white dark:bg-dark-secondary rounded print:shadow-none shadow-lg print:border-0 border border-gray-200 dark:border-gray-700 overflow-hidden">
                <!-- Invoice Header -->
                <div class="bg-gradient-to-r px-8 py-6 ">
                    <div class="flex flex-col md:flex-row md:items-center md:justify-between">
                        <div class="mb-4 md:mb-0">
                            <h1 class="text-3xl font-bold  text-gray-900 dark:text-white">INVOICE</h1>
                            <p class="text-gray-500 mt-1">Payment Receipt</p>
                        </div>
                        <div class="text-right">
                            <div class="text-2xl font-bold">INV-<?php echo e(str_pad($payment->id, 6, '0', STR_PAD_LEFT)); ?></div>
                            <p class="text-gray-500 mt-1">Issued: <?php echo e($payment->created_at->format('M d, Y')); ?></p>
                        </div>
                    </div>
                </div>

                <!-- Company & Client Info -->
                <div class="px-8 py-6 border-b border-gray-200 dark:border-gray-700">
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
                        <!-- Company Info -->
                        <div>
                            <h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">From</h3>
                            <div class="space-y-2">
                                <p class="text-sm font-medium text-gray-900 dark:text-white"><?php echo e($branch->name); ?></p>
                                <p class="text-sm font-medium text-gray-900 dark:text-white"><?php echo e($branch->branch_type_name); ?></p>
                                <p class="text-sm text-gray-600 dark:text-gray-400"><?php echo e($branch->addressline1); ?></p>
                                <p class="text-sm text-gray-600 dark:text-gray-400"><?php echo e($branch->addressline2); ?></p>
                                <p class="text-sm text-gray-600 dark:text-gray-400">Email: <?php echo e($branch->email); ?>

                                </p>
                                <p class="text-sm text-gray-600 dark:text-gray-400">Phone: <?php echo e($branch->phone); ?>

                                </p>
                            </div>
                        </div>

                        <!-- Client Info -->
                        <div>
                            <h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">Bill To</h3>
                            <div class="space-y-2">
                                <?php
                                    $contactInfo = is_array($payment->project->serviceRequest->contact_info ?? [])
                                        ? $payment->project->serviceRequest->contact_info
                                        : json_decode($payment->project->serviceRequest->contact_info ?? '[]', true);
                                ?>
                                <p class="text-sm font-medium text-gray-900 dark:text-white">
                                    <?php echo e($contactInfo['name'] ?? ($payment->user->name ?? 'N/A')); ?>

                                </p>
                                <p class="text-sm text-gray-600 dark:text-gray-400">
                                    <?php echo e($contactInfo['company'] ?? 'No Company'); ?>

                                </p>
                                <p class="text-sm text-gray-600 dark:text-gray-400">
                                    <?php echo e($contactInfo['email'] ?? ($payment->user->email ?? 'N/A')); ?>

                                </p>
                                <p class="text-sm text-gray-600 dark:text-gray-400">
                                    <?php echo e($contactInfo['phone'] ?? 'N/A'); ?>

                                </p>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Invoice Details -->
                <div class="px-8 py-6 border-b border-gray-200 dark:border-gray-700">
                    <div class="grid grid-cols-1 md:grid-cols-4 gap-6">
                        <div>
                            <p class="text-sm font-medium text-gray-500 dark:text-gray-400">Invoice Date</p>
                            <p class="text-lg font-semibold text-gray-900 dark:text-white">
                                <?php echo e($payment->created_at->format('M d, Y')); ?>

                            </p>
                        </div>
                        <div>
                            <p class="text-sm font-medium text-gray-500 dark:text-gray-400">Payment Date</p>
                            <p class="text-lg font-semibold text-gray-900 dark:text-white">
                                <?php echo e(\Carbon\Carbon::parse($payment->payment_date)->format('M d, Y')); ?>

                            </p>
                        </div>
                        <div>
                            <p class="text-sm font-medium text-gray-500 dark:text-gray-400">Payment Method</p>
                            <p class="text-lg font-semibold text-gray-900 dark:text-white capitalize">
                                <?php echo e(str_replace('_', ' ', $payment->payment_method)); ?>

                            </p>
                        </div>
                        <div>
                            <p class="text-sm font-medium text-gray-500 dark:text-gray-400">Status</p>
                            <span
                                class="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium
                            <?php if($payment->status === 'paid'): ?> bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300
                            <?php elseif($payment->status === 'pending'): ?>
                                bg-yellow-100 text-yellow-800 dark:bg-yellow-900/30 dark:text-yellow-300
                            <?php else: ?>
                                bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-300 <?php endif; ?>">

                                <?php echo e(ucfirst($payment->status)); ?>

                            </span>
                        </div>
                    </div>
                </div>

                <!-- Project & Payment Details -->
                <div class="px-8 py-6">
                    <!-- Project Information -->
                    <div class="mb-8">
                        <h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">Project Information</h3>
                        <div class="bg-gray-50 dark:bg-gray-800 rounded-lg p-4">
                            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                                <div>
                                    <p class="text-sm font-medium text-gray-500 dark:text-gray-400">Project Name</p>
                                    <p class="text-sm text-gray-900 dark:text-white font-medium">
                                        <?php echo e($payment->project->name ?? 'N/A'); ?>

                                    </p>
                                </div>
                                <div>
                                    <p class="text-sm font-medium text-gray-500 dark:text-gray-400">Project ID</p>
                                    <p class="text-sm text-gray-900 dark:text-white font-medium">
                                        <?php echo e($payment->project_id); ?>

                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!-- Payment Items -->
                    <div class="mb-8">
                        <h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-4">Payment Details</h3>
                        <div class="overflow-hidden rounded-lg border border-gray-200 dark:border-gray-700">
                            <table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
                                <thead class="bg-gray-50 dark:bg-gray-800">
                                    <tr>
                                        <th
                                            class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
                                            Description
                                        </th>
                                        <th
                                            class="px-6 py-3 text-right text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
                                            Amount
                                        </th>
                                    </tr>
                                </thead>
                                <tbody
                                    class="bg-white dark:bg-dark-secondary divide-y divide-gray-200 dark:divide-gray-700">
                                    <tr>
                                        <td class="px-6 py-4">
                                            <div>
                                                <p class="text-sm font-medium text-gray-900 dark:text-white">
                                                    Project Payment - <?php echo e($payment->project->name ?? 'N/A'); ?>

                                                </p>
                                                <p class="text-xs text-gray-500 dark:text-gray-400">
                                                    Payment via <?php echo e(str_replace('_', ' ', $payment->payment_method)); ?>

                                                    <?php if($payment->transaction_id): ?>
                                                        • Transaction: <?php echo e($payment->transaction_id); ?>

                                                    <?php endif; ?>
                                                </p>
                                                <?php if($payment->notes): ?>
                                                    <p class="text-xs text-gray-500 dark:text-gray-400 mt-1">
                                                        Note: <?php echo e($payment->notes); ?>

                                                    </p>
                                                <?php endif; ?>
                                            </div>
                                        </td>
                                        <td class="px-6 py-4 text-right">
                                            <p class="text-lg font-bold text-gray-900 dark:text-white">
                                                <?php echo e(number_format($payment->amount, 2)); ?> SR
                                            </p>
                                        </td>
                                    </tr>
                                </tbody>
                                <tfoot class="bg-gray-50 dark:bg-gray-800">
                                    <tr>
                                        <td class="px-6 py-4 text-right text-sm font-medium text-gray-900 dark:text-white"
                                            colspan="1">
                                            Total Amount:
                                        </td>
                                        <td class="px-6 py-4 text-right">
                                            <p class="text-2xl font-bold text-green-600 dark:text-green-400">
                                                <?php echo e(number_format($payment->amount, 2)); ?> SR
                                            </p>
                                        </td>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>



                    <!-- Notes & Footer -->
                    <div class="mt-8 pt-6 border-t border-gray-200 dark:border-gray-700">
                        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                            <div>
                                <h4 class="text-sm font-semibold text-gray-900 dark:text-white mb-2">Notes</h4>
                                <?php if($payment->notes): ?>
                                    <p class="text-sm text-gray-600 dark:text-gray-400"><?php echo e($payment->notes); ?></p>
                                <?php else: ?>
                                    <p class="text-sm text-gray-400 dark:text-gray-500 italic">No additional notes</p>
                                <?php endif; ?>
                            </div>

                        </div>
                    </div>
                </div>

                <!-- Invoice Footer -->
                <div class="bg-gray-50 dark:bg-gray-800 px-8 py-4 border-t border-gray-200 dark:border-gray-700">
                    <div class="flex flex-col md:flex-row md:items-center md:justify-between text-center md:text-left">
                        <div class="mb-2 md:mb-0">
                            <p class="text-xs text-gray-500 dark:text-gray-400">
                                Thank you for your business
                            </p>
                        </div>
                        <div>
                            <p class="text-xs text-gray-500 dark:text-gray-400">
                                This is a computer-generated invoice. No signature required.
                            </p>
                        </div>
                    </div>
                </div>
            </div>


        </div>
    </div>

    <style>
        @media print {
            .no-print {
                display: none !important;
            }

            body {
                background: white !important;
            }



            .dark\:bg-dark-secondary {
                background: white !important;
            }

            .dark\:text-white {
                color: black !important;
            }

            .dark\:text-gray-400 {
                color: #6B7280 !important;
            }
        }
    </style>

    <script>
        document.addEventListener('DOMContentLoaded', function() {
            console.log('Invoice view page loaded');
        });
    </script>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('admin.layout.main', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\laragon\www\crm_new\resources\views/admin/payments/view.blade.php ENDPATH**/ ?>