<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ $order->invoice_number }} - MyOpticals</title>
    <style>
        body { font-family: Arial, sans-serif; color: #111827; max-width: 850px; margin: 30px auto; padding: 20px; }
        .header { display: flex; justify-content: space-between; border-bottom: 3px solid #EC4899; padding-bottom: 18px; }
        table { width: 100%; border-collapse: collapse; margin-top: 24px; }
        th, td { padding: 11px; border-bottom: 1px solid #E5E7EB; text-align: left; }
        th { background: #F8FAFC; }
        .totals { width: 330px; margin: 25px 0 0 auto; }
        .totals div { display: flex; justify-content: space-between; padding: 6px; }
        .grand { font-size: 1.2rem; font-weight: bold; border-top: 2px solid #111827; }
        @media print { .no-print { display: none; } body { margin: 0 auto; } }
    </style>
</head>
<body>
    <button class="no-print" onclick="window.print()" style="float: right; padding: 10px 18px;">Print Invoice</button>
    <div class="header">
        <div><h1 style="margin: 0;">{{ $order->vendor->vendorProfile->vendor_name ?? 'MyOpticals Store' }}</h1><p>{{ $order->vendor->vendorProfile->address ?? '' }}<br>{{ $order->vendor->phone }}</p></div>
        <div style="text-align: right;"><h2>INVOICE</h2><strong>{{ $order->invoice_number }}</strong><p>{{ $order->ordered_at->format('d M Y, h:i A') }}</p></div>
    </div>
    <div style="margin-top: 22px;"><strong>Bill To:</strong><br>{{ $order->customer_name }}<br>{{ $order->customer_phone }}<br>{{ $order->customer_email }}<br>{{ $order->billing_address }}</div>
    <table><thead><tr><th>Item</th><th>Type</th><th>Qty</th><th>Rate</th><th>Amount</th></tr></thead><tbody>@foreach($order->items as $item)<tr><td>{{ $item->item_name }}</td><td>{{ ucfirst($item->item_type) }}</td><td>{{ $item->quantity }}</td><td>₹{{ number_format($item->unit_price, 2) }}</td><td>₹{{ number_format($item->total_price, 2) }}</td></tr>@endforeach</tbody></table>
    <div class="totals"><div><span>Subtotal</span><span>₹{{ number_format($order->subtotal, 2) }}</span></div><div><span>Discount</span><span>- ₹{{ number_format($order->discount_amount, 2) }}</span></div><div class="grand"><span>Total</span><span>₹{{ number_format($order->total, 2) }}</span></div><div><span>Payment</span><span>{{ ucfirst($order->payment_status) }}</span></div></div>
    @if($order->notes)<p><strong>Notes:</strong> {{ $order->notes }}</p>@endif
    <p style="text-align: center; margin-top: 45px; color: #64748B;">Thank you for shopping with us.</p>
</body>
</html>
