@php
    $appName      = $appName ?? config('app.name', 'Thế Giới Số');
    $fullName     = $fullName ?? 'Quý khách';
    $supportEmail = $supportEmail ?? 'support@tgs.com.vn';
    $supportPhone = $supportPhone ?? '1900. 6119';
@endphp

<table style="border-collapse: collapse; width: 100%; background-color: #efefef;" border="0" cellspacing="0" cellpadding="0">
    <tbody>
        <tr>
            <td style="padding: 20px;" align="center" valign="top">
                <table style="padding-top: 20px; padding-bottom: 20px; border-collapse: collapse; background-color: #ffffff; width: 700px;" border="0" cellspacing="0" cellpadding="0">
                    <tbody>
                        <tr class="NoiDungKM">
                            <td style="width: 700px;" valign="top">
                                <table style="border-collapse: collapse; width: 100%;" border="0" cellspacing="0" cellpadding="0">
                                    <tbody>
                                        <tr>
                                            <td style="background-color: #f06824; padding: 34px 30px 30px; text-align: center; font-family: Arial, Helvetica, sans-serif; color: #ffffff;" align="center" valign="top" bgcolor="#f06824">
                                                <div style="font-size: 42px; line-height: 1; margin-bottom: 12px;">🎫</div>
                                                <h1 style="margin: 0 0 8px; padding: 0; color: #ffffff; font-family: Arial, Helvetica, sans-serif; font-size: 24px; line-height: 1.35; font-weight: 700;">
                                                    Yêu cầu hỗ trợ đã được tiếp nhận
                                                </h1>
                                                <div style="font-size: 14px; line-height: 1.6; color: #ffffff;">
                                                    Chúng tôi sẽ phản hồi trong thời gian sớm nhất
                                                </div>
                                            </td>
                                        </tr>
                                        <tr class="MXH">
                                            <td style="text-align: center; padding: 0 30px;" align="center" valign="top">
                                                <table style="border-collapse: collapse; background-color: #ffffff; width: 100%;" border="0" cellspacing="0" cellpadding="0">
                                                    <tbody>
                                                        <tr>
                                                            <td style="height: 15px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; line-height: 1.7; color: #000000;" valign="top" height="15">
                                                                <div style="text-align: left;">&nbsp;</div>
                                                                <div style="text-align: left;">Xin chào <strong>{{ $fullName }}</strong>,</div>
                                                                <div style="text-align: left;">&nbsp;</div>
                                                                <div style="text-align: left;">
                                                                    Chúng tôi đã nhận được yêu cầu hỗ trợ của Quý khách và sẽ xử lý trong thời gian sớm nhất. Dưới đây là thông tin ticket của Quý khách:
                                                                </div>
                                                                <div style="text-align: left;">&nbsp;</div>

                                                                {{-- Ticket info box --}}
                                                                <table style="border-collapse: collapse; width: 100%; background-color: #f9f9f9; border: 1px solid #e0e0e0; border-radius: 4px;" border="0" cellspacing="0" cellpadding="0">
                                                                    <tbody>
                                                                        <tr>
                                                                            <td style="padding: 16px 20px;">
                                                                                <table style="border-collapse: collapse; width: 100%;" border="0" cellspacing="0" cellpadding="0">
                                                                                    <tbody>
                                                                                        <tr>
                                                                                            <td style="font-family: Arial, Helvetica, sans-serif; font-size: 13px; color: #666666; padding: 4px 0; width: 140px;" valign="top">Mã ticket:</td>
                                                                                            <td style="font-family: Arial, Helvetica, sans-serif; font-size: 13px; color: #000000; padding: 4px 0; font-weight: 700;" valign="top">#{{ $ticketNum }}</td>
                                                                                        </tr>
                                                                                        <tr>
                                                                                            <td style="font-family: Arial, Helvetica, sans-serif; font-size: 13px; color: #666666; padding: 4px 0;" valign="top">Tiêu đề:</td>
                                                                                            <td style="font-family: Arial, Helvetica, sans-serif; font-size: 13px; color: #000000; padding: 4px 0;" valign="top">{{ $subject }}</td>
                                                                                        </tr>
                                                                                        @if($room)
                                                                                        <tr>
                                                                                            <td style="font-family: Arial, Helvetica, sans-serif; font-size: 13px; color: #666666; padding: 4px 0;" valign="top">Phòng ban:</td>
                                                                                            <td style="font-family: Arial, Helvetica, sans-serif; font-size: 13px; color: #000000; padding: 4px 0;" valign="top">{{ $room }}</td>
                                                                                        </tr>
                                                                                        @endif
                                                                                        <tr>
                                                                                            <td style="font-family: Arial, Helvetica, sans-serif; font-size: 13px; color: #666666; padding: 4px 0;" valign="top">Trạng thái:</td>
                                                                                            <td style="font-family: Arial, Helvetica, sans-serif; font-size: 13px; padding: 4px 0;" valign="top">
                                                                                                <span style="background-color: #28a745; color: #ffffff; padding: 2px 8px; border-radius: 3px; font-size: 11px; font-weight: 700;">Đang mở</span>
                                                                                            </td>
                                                                                        </tr>
                                                                                    </tbody>
                                                                                </table>
                                                                            </td>
                                                                        </tr>
                                                                    </tbody>
                                                                </table>

                                                                <div style="text-align: left;">&nbsp;</div>
                                                                <div style="text-align: center;">
                                                                    <a style="display: inline-block; background-color: #f06824; color: #ffffff !important; text-decoration: none; padding: 12px 28px; border-radius: 3px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: 700;" href="{{ $ticketUrl }}" target="_blank" rel="noopener">
                                                                        Xem chi tiết ticket
                                                                    </a>
                                                                </div>
                                                                <div style="text-align: left;">&nbsp;</div>
                                                                <div style="text-align: left;">
                                                                    Đội ngũ hỗ trợ của <strong>{{ $appName }}</strong> sẽ liên hệ với Quý khách qua email hoặc cập nhật trực tiếp trên hệ thống. Cảm ơn Quý khách đã tin tưởng sử dụng dịch vụ của chúng tôi.
                                                                </div>
                                                                <div style="text-align: left;">&nbsp;</div>
                                                                <div style="text-align: left; color: #666666; font-size: 13px;">
                                                                    Email này được gửi tự động. Vui lòng không trả lời email này.
                                                                </div>
                                                                <div style="text-align: left;">&nbsp;</div>
                                                            </td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </td>
                        </tr>
                        <tr class="CacDV">
                            <td style="background-color: #f06824; width: 700px; color: #ffffff;" valign="top" bgcolor="#f06824">
                                <table style="border-collapse: collapse; background-color: #f06824; width: 100%; color: #ffffff;" border="0" cellspacing="0" cellpadding="0" align="left" bgcolor="#f06824">
                                    <tbody>
                                        <tr>
                                            <td style="padding: 0;" width="100%">
                                                <table style="border-collapse: collapse; width: 100%;" border="0" cellspacing="0" cellpadding="0">
                                                    <tbody>
                                                        <tr>
                                                            <td style="width: 100%; height: 1px; background: #ffffff;" bgcolor="#ffffff" width="100%" height="1"><span style="font-size: 14px; color: #ffffff;">&nbsp;</span></td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="height: 10px; color: #ffffff;" valign="top" height="10"><span style="font-size: 14px; color: #ffffff;">&nbsp;</span></td>
                                        </tr>
                                        <tr>
                                            <td style="padding: 0; text-align: left; font-family: Helvetica, Arial, sans-serif; color: #ffffff; font-size: 16px; line-height: 150%;" align="center" valign="top">
                                                <table style="border-collapse: collapse; color: #ffffff;" border="0" cellspacing="0" cellpadding="0" align="center">
                                                    <tbody>
                                                        <tr>
                                                            <td style="width: 3%; color: #ffffff;"><span style="color: #ffffff;">&nbsp;</span></td>
                                                            <td style="vertical-align: middle; text-align: center; padding: 5px 10px; border: 1px solid #ffffff; color: #ffffff;" valign="top">
                                                                <a style="color: #ffffff; font-family: Helvetica, Arial, sans-serif; font-size: 10px; line-height: 1; font-weight: normal; text-transform: uppercase; word-wrap: break-word; text-decoration: none;" href="https://tgs.com.vn/premium-hosting/" target="_blank" rel="noopener"><span style="color: #ffffff;">Premium HOSTING</span></a>
                                                            </td>
                                                            <td style="width: 3%; color: #ffffff;"><span style="color: #ffffff;">&nbsp;</span></td>
                                                            <td style="vertical-align: middle; text-align: center; padding: 5px 10px; border: 1px solid #ffffff; color: #ffffff;" valign="top">
                                                                <a style="color: #ffffff; font-family: Helvetica, Arial, sans-serif; font-size: 10px; line-height: 1; font-weight: normal; text-transform: uppercase; word-wrap: break-word; text-decoration: none;" href="https://tgs.com.vn/cloud-server/" target="_blank" rel="noopener"><span style="color: #ffffff;">Cloud SERVER</span></a>
                                                            </td>
                                                            <td style="width: 3%; color: #ffffff;"><span style="color: #ffffff;">&nbsp;</span></td>
                                                            <td style="vertical-align: middle; text-align: center; padding: 5px 10px; border: 1px solid #ffffff; color: #ffffff;" valign="top">
                                                                <a style="color: #ffffff; font-family: Helvetica, Arial, sans-serif; font-size: 10px; line-height: 1; font-weight: normal; text-transform: uppercase; word-wrap: break-word; text-decoration: none;" href="https://cloudemail.vn/" target="_blank" rel="noopener"><span style="color: #ffffff;">EMAIL DOANH NGHIỆP</span></a>
                                                            </td>
                                                            <td style="width: 3%; color: #ffffff;"><span style="color: #ffffff;">&nbsp;</span></td>
                                                            <td style="vertical-align: middle; text-align: center; padding: 5px 10px; border: 1px solid #ffffff; color: #ffffff;" valign="top">
                                                                <a style="color: #ffffff; font-family: Helvetica, Arial, sans-serif; font-size: 10px; line-height: 1; font-weight: normal; text-transform: uppercase; word-wrap: break-word; text-decoration: none;" href="https://tgs.com.vn/thiet-ke-website/" target="_blank" rel="noopener"><span style="color: #ffffff;">Thiết Kế WEBSITE</span></a>
                                                            </td>
                                                            <td style="width: 3%; color: #ffffff;"><span style="color: #ffffff;">&nbsp;</span></td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="height: 10px; color: #ffffff;" valign="top" height="10"><span style="font-size: 14px; color: #ffffff;">&nbsp;</span></td>
                                        </tr>
                                        <tr>
                                            <td style="padding: 0;" width="100%">
                                                <table style="border-collapse: collapse; width: 100%;" border="0" cellspacing="0" cellpadding="0">
                                                    <tbody>
                                                        <tr>
                                                            <td style="width: 100%; height: 1px; background: #ffffff;" bgcolor="#ffffff" width="100%" height="1"><span style="font-size: 14px; color: #ffffff;">&nbsp;</span></td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </td>
                        </tr>
                        <tr class="ThongTin">
                            <td align="center" valign="top" bgcolor="#065d88">
                                <table style="border-collapse: collapse; background-color: #f06824; border-top: 0; border-bottom: 0; width: 100%;" border="0" cellspacing="0" cellpadding="0">
                                    <tbody>
                                        <tr style="height: 30px;">
                                            <td style="height: 30px;" valign="top" height="10">&nbsp;</td>
                                        </tr>
                                        <tr style="height: 148px;">
                                            <td style="padding: 0; font-family: Helvetica, Arial, sans-serif; text-decoration: none; color: #e7e7e7; font-size: 16px; font-weight: normal; line-height: 150%; vertical-align: top; text-align: center; height: 148px;" align="center">
                                                <p style="margin: 0; padding: 0; font-family: Helvetica, Arial, sans-serif; color: white; font-size: 11pt; line-height: 200%;">
                                                    <span style="color: #ffffff; font-family: 'times new roman', times, serif;"><strong style="font-size: 20px;">CÔNG TY CỔ PHẦN GIẢI PHÁP CÔNG NGHỆ THẾ GIỚI SỐ</strong></span><br>
                                                    <span style="color: #ffffff; font-family: arial, helvetica, sans-serif; font-size: 12pt;">Địa chỉ: 128/38 Tân Hương, Phường Phú Thọ Hòa, Thành Phố Hồ Chí Minh</span><br>
                                                    <span style="color: #ffffff; font-family: arial, helvetica, sans-serif; font-size: 12pt;">Tel: (028) 7309. 7379 - Tổng đài: {{ $supportPhone }}</span><br>
                                                    <span style="font-family: arial, helvetica, sans-serif; font-size: 12pt;">Email: <span style="color: #ffffff;"><a style="color: #ffffff; text-decoration: none;" href="mailto:{{ $supportEmail }}">{{ $supportEmail }}</a></span></span><br>
                                                    <span style="text-decoration: none; font-family: arial, helvetica, sans-serif; font-size: 12pt; color: #ffffff !important;">
                                                        <a style="color: #ffffff !important; text-decoration: none;" href="https://www.tgs.com.vn">www.TGS.com.vn</a> &amp;
                                                        <a style="color: #ffffff !important; text-decoration: none;" href="https://www.thegioiso.cloud">www.thegioiso.CLOUD</a> &amp;
                                                        <a style="color: #ffffff !important; text-decoration: none;" href="https://www.thegioiserver.com">www.thegioiSERVER.com</a> &amp;
                                                        <a style="color: #ffffff !important; text-decoration: none;" href="https://www.cloudemail.vn">www.CloudEmail.vn</a>
                                                    </span>
                                                </p>
                                                <p style="margin: 0; padding: 0; font-family: Helvetica, Arial, sans-serif; color: white; font-size: 11pt; line-height: 200%;">
                                                    <span style="text-decoration: none; font-family: 'times new roman', times, serif; color: #ffffff !important; font-size: 12pt;">
                                                        <span style="color: #ffffff; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10pt;">
                                                            <span style="text-decoration: none; font-family: 'times new roman', times, serif; color: #ffffff !important;">
                                                                <span style="font-family: arial, sans-serif;"><strong>🥇Thế Giới Số🥇</strong>- Premium HOSTING • CLOUD • SERVER &amp; WEBSITE | 15+ năm Phụng Sự 🚀</span>
                                                            </span>
                                                        </span>
                                                    </span>
                                                </p>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td style="height: 30px; color: #ffffff;" valign="top" height="30"><span style="font-size: 14px; color: #ffffff;">&nbsp;</span></td>
                                        </tr>
                                    </tbody>
                                </table>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>
    </tbody>
</table>