<!DOCTYPE html>
<html>
<head>
    <title>Tiket Dukungan NgekosYuk</title>
</head>
<body style="font-family: Arial, sans-serif; line-height: 1.6; color: #333; max-width: 600px; margin: 0 auto; padding: 20px;">
    
    <div style="text-align: center; margin-bottom: 20px;">
        <h2>NgekosYuk Support</h2>
    </div>

    <div style="background-color: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 20px;">
        <h3 style="margin-top: 0; color: #111827;">Halo, {{ $ticket->name }}!</h3>
        <p>Terima kasih telah menghubungi kami. Pesan Anda telah kami terima dan akan segera ditangani oleh tim Customer Service kami.</p>
        
        <div style="background-color: #fff; padding: 15px; border-radius: 6px; margin: 20px 0; border-left: 4px solid #10b981;">
            <p style="margin: 0;"><strong>Nomor Tiket:</strong> {{ $ticket->ticket_number }}</p>
            <p style="margin: 5px 0 0 0;"><strong>Subjek:</strong> {{ $ticket->subject }}</p>
            <p style="margin: 5px 0 0 0;"><strong>Status:</strong> Menunggu Balasan Tim CS</p>
        </div>

        <p>Untuk memantau perkembangan tiket Anda, membalas pesan, atau melampirkan gambar tambahan, silakan klik tautan aman di bawah ini:</p>
        
        <div style="text-align: center; margin: 30px 0;">
            {{-- Ini adalah link rahasia yang menggabungkan Nomor Tiket dan Token --}}
            <a href="{{ url('/tiket/' . $ticket->ticket_number . '?token=' . $ticket->token) }}" 
               style="background-color: #10b981; color: #ffffff; padding: 12px 24px; text-decoration: none; border-radius: 6px; font-weight: bold; display: inline-block;">
               Cek / Balas Tiket Saya
            </a>
        </div>

        <p style="font-size: 13px; color: #6b7280; margin-bottom: 0;">
            <em>Penting: Jangan bagikan tautan atau email ini kepada siapa pun karena tautan tersebut berisi akses langsung ke obrolan tiket Anda.</em>
        </p>
    </div>

</body>
</html>