<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Ticket - {{ $booking->booking_reference }}</title>
    <style>
        body { font-family: DejaVu Sans, sans-serif; font-size: 13px; color: #222; }
        .ticket { border: 2px dashed #1e40af; padding: 25px; max-width: 800px; margin: 0 auto; }
        .header { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid #1e40af; padding-bottom: 15px; }
        .company { font-size: 20px; font-weight: bold; color: #1e40af; }
        .ref { font-family: monospace; font-size: 16px; font-weight: bold; background: #f1f5f9; padding: 4px 10px; border-radius: 4px; }
        .section { margin-top: 20px; }
        .row { display: flex; margin-bottom: 8px; }
        .label { width: 160px; color: #666; font-size: 12px; }
        .value { font-weight: 600; }
        .footer { margin-top: 25px; font-size: 11px; color: #666; text-align: center; border-top: 1px solid #ddd; padding-top: 15px; }
        .warning { background: #fefce8; border: 1px solid #fde047; padding: 10px; font-size: 12px; margin-top: 20px; }
    </style>
</head>
<body>
    <div class="ticket">
        <div class="header">
            <div>
                <div class="company">{{ {{ $siteName }} }}</div>
                <div style="color:#666; font-size:12px;">Travel Confirmation</div>
            </div>
            <div style="text-align:right">
                <div class="ref">{{ $booking->booking_reference }}</div>
                <div style="font-size:11px; color:#666; margin-top:3px;">CONFIRMED</div>
            </div>
        </div>

        <div class="section">
            <div class="row">
                <div class="label">Passenger</div>
                <div class="value">{{ $booking->full_name }}</div>
            </div>
            <div class="row">
                <div class="label">Package</div>
                <div class="value">{{ $booking->package->title }}</div>
            </div>
            <div class="row">
                <div class="label">Destination</div>
                <div class="value">{{ $booking->package->destination?->name ?? 'Multiple Destinations' }}</div>
            </div>
            <div class="row">
                <div class="label">Travel Date</div>
                <div class="value">{{ $booking->travel_date->format('l, F j, Y') }}</div>
            </div>
            <div class="row">
                <div class="label">Duration</div>
                <div class="value">{{ $booking->package->duration_days }} days</div>
            </div>
            <div class="row">
                <div class="label">Travelers</div>
                <div class="value">{{ $booking->number_of_people }} person(s)</div>
            </div>
        </div>

        <div class="warning">
            <strong>Important:</strong> Please arrive at the meeting point at least 30 minutes before departure. 
            Carry a valid photo ID and this ticket (printed or digital).
        </div>

        <div class="footer">
            This is your official travel ticket.<br>
            For any changes or questions, contact us at {{ \App\Models\Setting::get('site_email', 'info@tourism.com') }}
        </div>
    </div>
</body>
</html>