<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Purchase Invoice</title>
    <style>
        @media print {
            body { -webkit-print-color-adjust: exact; }
            .comments-section { background: #fff9e6 !important; }
            .print-btn { display: none !important; }
        }

        body {
            margin: 0 auto;
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            background: black;
            line-height: 1.1;
            font-size: 16px;
        }

        .print-container {
            position: relative;
            margin: 0 auto;
            width: 210mm;
            min-height: 297mm;
            padding: 10mm 15mm;
            background: white;
            box-sizing: border-box;
            overflow: hidden;
        }

        .header-section {
            width: calc(100% + 30mm);
            height: 138px;
            margin: -10mm -15mm 20px -15mm;
            /* background-image: url('/Invoiceheader2.png'); */
            background-image: url('{{ url('Invoiceheader2.png') }}');
            background-size: 100% 100%;
            background-repeat: no-repeat;
            background-position: top center;
        }

        .bottom-section {
            width: calc(100% + 30mm);
            height: 95px;
            margin: 20px -15mm -10mm -15mm;
            background-image: url('/footer.jpeg'); /* Change path */
            background-size: 100% 100%;
            background-repeat: no-repeat;
            background-position: bottom center;
        }

        .watermark {
            position: absolute;
            top: 50%;
            left: 50%;
            width: 700px;
            height: 700px;
            opacity: 0.05;
            transform: translate(-50%, -50%);
            background-image: url('{{ url('header1.jpeg') }}');
            background-size: contain;
            z-index: 0;
        }

        h2 {
            text-align: center;
            margin-bottom: 8px;
            text-transform: uppercase;
            font-size: 20px;
            position: relative;
            z-index: 2;
        }

        h3 { margin-top: 15px; }

        .detail-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 35px;
            margin: 5px 0;
            position: relative;
            z-index: 2;
        }

        .detail-item {
            display: flex;
            justify-content: space-between;
            padding: 5px 0;
            border-bottom: 1px solid #ddd;
            font-size: 15px;
        }

        .highlight-note {
            background: #f8f4fa;
            padding: 4px;
            font-style: italic;
            font-size: 14px;
            margin: 20px 0;
            border-left: 5px solid #ccc;
        }

        .comments-section {
            border: 2px solid #ffc107;
            padding: 10px 15px;
            margin-top: 10px;
            background: #fff9e6;
            font-size: 15px;
        }

        .signature-container {
            display: flex;
            justify-content: space-between;
            margin-top: 5rem;
            width: 100%;
        }
        .signature { text-align: center; width: 50%; }

        .printee {
            font-size: 12px;
            text-align: right;
            margin-top: 20px;
        }

        .print-btn {
            display: block;
            margin: 30px auto 10px;
            padding: 12px 25px;
            background: #007bff;
            color: #fff;
            font-size: 16px;
            border: none;
            border-radius: 6px;
            cursor: pointer;
        }
    </style>
</head>
<body>

<div class="print-container">
    <div class="header-section"></div>
    <div class="watermark"></div>

    {{-- Invoice Section --}}
    <div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:10px;">
        <div><strong>Invoice No:</strong> PI-{{ \Carbon\Carbon::parse($invoice->purchase_date)->format('Y') }}-{{ $invoice->id }}</div>
        <h2>Purchase Invoice</h2>
        <div><strong>Date:</strong> {{ $invoice->purchase_date }}</div>
    </div>

    <div class="detail-grid">
        <div>
            <h3>Seller Information</h3>
            <div class="detail-item"><span>Seller Name</span><strong>{{ $invoice->vendor_name ?? 'N/A' }}</strong></div>
            <!-- <div class="detail-item"><span>Invoice File</span>
                <strong>
                    @if($invoice->invoice_file_path)
                    <a href="{{ asset('storage/' . $invoice->invoice_file_path) }}" target="_blank">File Uploaded</a>
                    @else N/A @endif
                </strong>
            </div> -->
            <div class="detail-item"><span>CNIC</span><strong>{{ $invoice->seller_cnic }}</strong></div>
            <div class="detail-item"><span>Phone</span><strong>{{ $invoice->seller_phone }}</strong></div>
            <div class="detail-item"><span>Address</span><strong>{{ $invoice->seller_address }}</strong></div>
        </div>

        <div>
            <h3>Car Information</h3>
            <div class="detail-item"><span>Make</span><strong>{{ $invoice->make }}</strong></div>
            <div class="detail-item"><span>Model</span><strong>{{ $invoice->model }}</strong></div>
            <div class="detail-item"><span>Varient</span><strong>{{ $invoice->varient }}</strong></div>
            <div class="detail-item"><span>Registration No</span><strong>{{ $invoice->registration_no }}</strong></div>
        </div>
    </div>

    <h3>Payment Information</h3>
    <div class="detail-item"><span>Purchase Price</span><strong>${{ number_format($invoice->purchase_price) }}</strong></div>

    <div class="highlight-note" align="justify">
        * This invoice confirms that the vehicle with registration number <strong>{{ $invoice->registration_no }}</strong> 
        was purchased on <strong>{{ $invoice->purchase_date }}</strong> at a price of 
        <strong>${{ number_format($invoice->purchase_price) }}</strong>.
    </div>

    {{-- Receipt Section --}}
    <h2>Payment Receipt</h2>
    <table border="1" style="width:100%; border-collapse:collapse; margin-top:10px;">
        <tr><td colspan="2" style="text-align:center; font-weight:bold; background:#235849; color:white; height:25px;">Payment Information</td></tr>
        <tr><td>Total Amount</td><td>${{ number_format($invoice->purchase_price) }}</td></tr>
        <tr><td>Paid Amount</td><td>${{ number_format($invoice->purchase_price) }}</td></tr>
        <tr><td>Balance Due</td><td>0</td></tr>
    </table>

    <div class="comments-section">
        <strong>Notes:</strong> This payment receipt confirms that full payment has been made to the vendor.
    </div>

    <div class="signature-container">
        <p class="signature">Vendor Signature __________________</p>
        <p class="signature">Purchaser Signature __________________</p>
    </div>

    <p class="printee">Printed By: {{ Auth::user()->name }}</p>

    <!-- <div class="bottom-section"></div> -->
</div>

<button class="print-btn" onclick="window.print()">Print</button>

</body>
</html>
