@if(empty($pdf))
    @extends('layouts.sneat')
@endif
@section('content')
    <div class="container">
        @if(session('success'))
            <div class="alert alert-success">{{ session('success') }}</div>
        @endif
        <div class="card p-4">
            <table style="width: 100%;  margin-bottom: 20px;" class="table-bordered table">
    <tr>
        <!-- Left: Logo -->
        <td style="width: 30%; vertical-align: top; text-align: center;">
            <img src="{{ asset('images/zillion-logo-invoice.png') }}" style="width:150px; margin-bottom: 5px;">
            <p style="margin: 5px 0 0 0;"><strong>Zillion IT Solutions</strong></p>
            <p style="margin: 0;">
                S1, 2nd Floor, Kairali Complex<br>
                Thondayad, Calicut -17 Kerala, India
            </p>
        </td>

        <!-- Right: Invoice Info + Client Details -->
        <td style="width: 60%; vertical-align: top; text-align: left;">
            <h4 style="margin: 0 0 10px 0;">ZITS Proforma Invoice</h4>

            <p style="margin: 0 0 5px 0;">
                <strong>Invoice No:</strong> {{ $invoice->invoice_number }}<br>
                <strong>Invoice Date:</strong> {{ \Carbon\Carbon::parse($invoice->date)->format('d-m-Y') }}
            </p>

            <h5 style="margin: 10px 0 5px 0;">To:</h5>
            <p style="margin: 0; line-height: 1.4;">
                <strong>Client Name:</strong> M/s {{ $invoice->client->name }}<br>
                <strong>Address:</strong> {{ $invoice->client->address ?? '' }}
            </p>
        </td>
    </tr>
</table>

            <table class="table table-bordered">
                <thead>
                    <tr>
                        <th style="width: 5%;">SL.NO.</th>
                        <th>Particulars Of Services HSN/SAC</th>
                        <th style="width: 20%;">Amount</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($invoice->items as $index => $item)
                        <tr>
                            <td>{{ $index + 1 }}</td>
                            <td>
                                @if($item->module)
                                    {{ $item->module->name }}
                                @elseif($item->custom_module)
                                    {{ $item->custom_module }}
                                @else
                                    {{ $item->description }}
                                @endif
                            </td>

                            <td>{{ number_format($item->amount, 2) }}</td>
                        </tr>
                    @endforeach
                 <tr>
    <th style="width: 5%;"></th>
    <th>Resources Involved</th>
    <th></th>
</tr>
<tr>
    <td></td>
    <td>
        {{ $invoice->designations->map(function ($designation) {
            return $designation->name . ' - ' . $designation->pivot->count;
        })->join(', ') }}
    </td>
    <td></td>
</tr>


                    @php
                        $selectedTechnologies = old('technologies', json_decode($invoice->technologies ?? '[]', true));
                        if (!is_array($selectedTechnologies)) {
                            $selectedTechnologies = [];
                        }
                    @endphp
                    <tr>
                        {{-- <td colspan="3" class="text-start"><strong>Resources Involved</strong></td> --}}
                        <th style="width: 5%;"></th>
                        <th>Used Technology</th>
                        <th></th>


                    </tr>
                    <td>

                    </td>
                    <td colspan="3">
                        {{ $technologies->whereIn('id', $selectedTechnologies)->pluck('technology')->implode(', ') }}
                    </td>
                    <td>

                    </td>


                    <tr>
                        <td colspan="2" class="text-end"><strong>Service Total</strong></td>
                        <td><strong>₹{{ number_format($invoice->total_amount, 2) }}</strong></td>
                    </tr>
                    <tr>
                        <td colspan="2" class="text-end"><strong>Received Amount</strong></td>
                        <td><strong>{{ $invoice->received_amount ? '₹' . number_format($invoice->received_amount, 2) : 'NIL' }}</strong>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2" class="text-end"><strong>Balance</strong></td>
                        <td><strong>₹{{ number_format($invoice->total_amount - ($invoice->received_amount ?? 0), 2) }}</strong>
                        </td>
                    </tr>
                    <tr>
                        <td colspan="2" class="text-end"><strong>Grand Total</strong></td>
                        <td><strong>₹{{ number_format($invoice->total_amount, 2) }}</strong></td>
                    </tr>
                    <tr>
                        <td colspan="3" class="text-start">Total Invoice Amount In Words: {{ $amountInWords }} only</td>

                    </tr>
                </tbody>
            </table>
            <!-- Footer Section with Bank Details -->
            <table class="table table-bordered mt-4" style="width: 100%;">
                <tr>
                    <td style="width: 50%; vertical-align: top;">
                        <h6 class="mb-2"><strong>Bank Details:</strong></h6>

                        <h6 style="font-size: 14px;
                        line-height: 25px;">Beneficiary: <strong>Zillion IT Solutions</strong><br>
                            Bank Name: <strong>State Bank Of India</strong></br>
                            Branch: PBB Branch, Pottammal</br>
                            Bank Account Number: <strong>38456815606</strong></br>
                            Bank Branch IFSC: SBIN0070758
                            </p>

                            <p style="font-size: 13px;">Amount of Tax Subject to Reverse Charge.</p>
                    </td>
                    <td style="width: 50%; vertical-align: top; text-align: center;">
                        <p>Certified that the particulars given above are true and correct.</p><br>
                        <h6>For Zillion IT Solutions</h6><br>
                        ____________________________<br><br>
                        <h6>Authorised Signatory</h6>
                    </td>
                </tr>
            </table>
            <small class="mt-4">*Note:
                {{ $invoice->remarks }}
            </small>
            <div class="text-end mt-4 no-print">
                <a href="{{ route('zits-proforma-invoices.index') }}" class="btn btn-secondary me-2"><span
                        class="mdi mdi-skip-backward"></span></a>
                <a href="{{ route('zits-proforma-invoices.download', $invoice->id) }}" class="btn btn-outline-success me-2"><span
                        class="mdi mdi-file-pdf-box"></span></a>
                <button onclick="window.print()" class="btn btn-outline-primary"><span
                        class="mdi mdi-printer-outline"></span></button>
                <form action="{{ route('zits-proforma-invoices.sendEmail', $invoice->id) }}" method="POST">
                    @csrf

                    <button type="submit" class="btn btn-success mt-4">Send Email</button>
                </form>
                @if(session('message'))
                    <div class="alert alert-success">
                        {{ session('message') }}
                    </div>
                @endif
            </div>
        </div>
    </div>
    <!-- Modal -->
    <div class="modal fade" id="sendInvoiceModal" tabindex="-1" aria-labelledby="sendInvoiceModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="sendInvoiceModalLabel">Confirm Invoice Details</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <h6>Invoice Details:</h6>
                    <p><strong>Invoice Number:</strong> {{ $invoice->invoice_number }}</p>
                    <p><strong>Invoice Date:</strong> {{ \Carbon\Carbon::parse($invoice->date)->format('d M, Y') }}</p>
                    <p><strong>Client Name:</strong> M/s {{ $invoice->client->name }}</p>
                    <p><strong>Subject:</strong> <span id="emailSubject">{{ $invoice->subject ?? '' }}</span></p>
                    <p><strong>Message:</strong></p>
                    <p id="emailMessage">{{ $invoice->message ?? '' }}</p>

                    <form id="sendInvoiceForm" action="{{ route('zits-proforma-invoices.sendEmail', $invoice->id) }}"
                        method="POST">
                        @csrf
                        <button type="submit" class="btn btn-primary">Confirm Send</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <script>
        function prepareModalData() {
            // Get the subject and message from the form fields
            var subject = document.getElementById('subject').value;
            var message = document.getElementById('message').value;

            // Update the modal with the data
            document.getElementById('emailSubject').innerText = subject;
            document.getElementById('emailMessage').innerText = message;
        }
    </script>
    <style>
        @media print {

            /* Hide layout elements */
            nav.navbar,
            .layout-navbar,
            .layout-menu,
            .btn,
            .text-end.mt-4,
            footer {
                display: none !important;

            }

            /* Full-width print page */
            @page {
                size: A4;
                margin: 0;
                /* remove browser default margins */
            }

            html,
            body {
                margin: 0 !important;
                padding: 0 !important;
                width: 100% !important;
            }

            .container,
            .card {
                margin: 0 !important;
                padding: 20px !important;
                /* optional, for some breathing space */
                width: 100% !important;
                max-width: 100% !important;
                box-shadow: none !important;
                border: none !important;
            }

            .table {
                width: 100% !important;
            }
        }
    </style>
@endsection