<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
@php
    use App\Facades\Settings;
    use Mtc\MercuryDataModels\Dealership;
    if (isset($reservation)) {
        $location = $reservation->vehicle?->dealership;
    }

    $branchId = null;

    if (isset($enquiry)) {
        if ($enquiry?->reason_type == 'reservation') {
            $location = $enquiry->reason?->vehicle?->dealership;
        } elseif ($enquiry?->reason_type === 'vehicle') {
            $location = $enquiry->reason?->dealership;
        } elseif ($enquiry?->reason_type === 'offer') {
            $location = $enquiry->reason?->dealership;
        } elseif ($enquiry?->reason_type === 'dealership') {
            $location = $enquiry->reason;
        } elseif ($enquiry?->reason_type === 'new-car') {
            $location = $enquiry->reason->franchise?->dealerships()->first();
        }

        foreach ($enquiry?->details as $question) {
            if ($question['question'] === "Select Branch" && !empty($question['answer'])) {
                $branchId = (int)$question['answer'];
                break;
            }
        }
    }

    if (empty($branchId) && isset($reservation)) {
        $branchId = $reservation->vehicle?->dealership?->id;
    }

    if (!empty($branchId)) {
        $location = Dealership::find($branchId);
    }

    if (!empty($location)) {
        $phone_number = $location->contact_no;
        $phone_number_formatted = match (Settings::get('app-phone-number-format')) {
            '3-3-4' => substr($phone_number, 0, 3) . ' ' . substr($phone_number, 3, 3) . ' ' . substr($phone_number, 6),
            '4-3-3' => substr($phone_number, 0, 4) . ' ' . substr($phone_number, 4, 3) . ' ' . substr($phone_number, 7),
            '5-3-3' => substr($phone_number, 0, 5) . ' ' . substr($phone_number, 5, 3) . ' ' . substr($phone_number, 8),
            '5-6' => substr($phone_number, 0, 5) . ' ' . substr($phone_number, 5),
            default => $phone_number
        };
    }
@endphp
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>{{ $subject ?? 'Japan Exotics' }}</title>
    <style type="text/css">
        #outlook a {padding:0;}
        body{width:100% !important; height:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0; padding:0;}
        .ExternalClass {width:100%;}
        .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;}
        #backgroundTable {margin:0; padding:0; width:100% !important; height:100% !important; line-height: 100% !important;}
        img {outline:none; text-decoration:none; -ms-interpolation-mode: bicubic;}
        a img {border:none;}
        .imageFix {display:block;}
        p {margin: 0 0 1em 0;}
        h1, h2, h3, h4, h5, h6 {color: #f6f6f6 !important;}
        h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color: #f55800 !important;}
        h1 a:active, h2 a:active, h3 a:active, h4 a:active, h5 a:active, h6 a:active {color: #f55800 !important;}
        h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited {color: #f55800 !important;}
        table td {border-collapse: collapse;}
        table {border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;}
        a {color: #f55800;}

        @media only screen and (max-device-width: 700px) {
            a[href^="tel"], a[href^="sms"] {
                text-decoration: none;
                color: #f6f6f6;
                pointer-events: none;
                cursor: default;
            }
            .mobileLink a[href^="tel"], .mobileLink a[href^="sms"] {
                text-decoration: default;
                color: #f55800 !important;
                pointer-events: auto;
                cursor: default;
            }
        }

        @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
            a[href^="tel"], a[href^="sms"] {
                text-decoration: none;
                color: #f55800;
                pointer-events: none;
                cursor: default;
            }
            .mobileLink a[href^="tel"], .mobileLink a[href^="sms"] {
                text-decoration: default;
                color: #f55800 !important;
                pointer-events: auto;
                cursor: default;
            }
        }
    </style>

    <!--[if gte mso 9]>
    <style>
        /* Target Outlook 2007 and 2010 */
    </style>
    <![endif]-->
</head>
<body>
<table cellpadding="0" cellspacing="0" border="0" id="backgroundTable" bgcolor="#1a1a1a" style="background-color:#1a1a1a;font-family: 'Clash Display', -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;">
    <tr>
        <td valign="top" height="80"></td>
    </tr>
    <tr>
        <td>
            <!-- MAIN CARD -->
            <table cellpadding="0" cellspacing="0" border="0" align="center" width="600" style="border-radius:20px; overflow:hidden;">
                <!-- ========== HEADER (dark) ========== -->
                <tr>
                    <td bgcolor="#2a2a2a" style="background-color:#2a2a2a; padding:40px 40px 30px;">
                        <table cellpadding="0" cellspacing="0" border="0" width="100%">
                            <tr>
                                <td valign="middle" align="left">
                                    <a href="{{ $site_url ?? '' }}" target="_blank" title="{{ $site_name ?? 'Japan Exotics' }}" style="text-decoration: none;">
                                        <img class="imageFix" src="{{ config('app.url') . '/api/assets/japan-exotics/japan-exotics-logo.png'}}" alt="Logo" title="{{ $site_name ?? 'Japan Exotics' }}" width="197" height="36" style="display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic; border:none;" />
                                    </a>
                                </td>
                                @if(!empty($phone_number_formatted))
                                <td align="right">
                                    <table cellpadding="0" cellspacing="0" border="0" align="right">
                                        <tr>
                                            <td valign="top" align="right">
                                                <p style="color:#f6f6f6; margin:0; font-size:14px; font-weight:500; letter-spacing:-0.28px; font-family: 'Clash Display', -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;">
                                                    Speak to the team</p>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td valign="top" align="right" height="4"></td>
                                        </tr>
                                        <tr>
                                            <td valign="top" align="right">
                                                <a href="tel:{{ $phone_number }}" target="_blank"
                                                   style="color:#f6f6f6; margin:0; font-size:22px; font-weight:700; letter-spacing:-0.44px; font-family: 'Clash Display', -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif; text-decoration: none;">{{ $phone_number_formatted }}</a>
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                                @endif
                            </tr>
                        </table>
                    </td>
                </tr>

                <!-- ========== CONTENT (orange) ========== -->
                <tr>
                    <td bgcolor="#f55800" style="background-color:#f55800;">
                        <table cellpadding="0" cellspacing="0" border="0" width="100%">
                            @yield('content')
                        </table>
                    </td>
                </tr>

                <!-- ========== FOOTER (dark) ========== -->
                <tr>
                    <td bgcolor="#2a2a2a" style="background-color:#2a2a2a; padding:40px;">
                        <table cellpadding="0" cellspacing="0" border="0" width="100%">
                            <!-- LOGO LEFT + SOCIALS RIGHT -->
                            <tr>
                                <td valign="middle" align="left">
                                    <a href="{{ $site_url ?? '' }}" target="_blank" title="{{ $site_name ?? 'Japan Exotics' }}" style="text-decoration: none;">
                                        <img class="imageFix" src="{{ config('app.url') . '/api/assets/japan-exotics/japan-exotics-logo.png'}}" alt="Logo" title="{{ $site_name ?? 'Japan Exotics' }}" width="197" height="36" style="display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic; border:none;" />
                                    </a>
                                </td>
                                @if(isset($socials) && $socials->count())
                                <td valign="middle" align="right">
                                    <table cellpadding="0" cellspacing="0" border="0" align="right">
                                        <tr>
                                            @if($socials->where('key', 'facebook')->isNotEmpty())
                                            <td valign="top" align="right" width="48">
                                                <a href="{{ $socials->where('key', 'facebook')->first()['url'] }}" target="_blank" title="Facebook" style="text-decoration: none;">
                                                    <img class="imageFix" src="{{ config('app.url') . '/api/assets/japan-exotics/social/facebook-logo.png'}}" alt="Facebook" title="Facebook" width="32" height="32" style="display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic; border:none;" />
                                                </a>
                                            </td>
                                            @endif

                                            @if($socials->where('key', 'linkedin')->isNotEmpty())
                                            <td valign="top" align="right" width="8"></td>
                                            <td valign="top" align="right" width="48">
                                                <a href="{{ $socials->where('key', 'linkedin')->first()['url'] }}" target="_blank" title="LinkedIn" style="text-decoration: none;">
                                                    <img class="imageFix" src="{{ config('app.url') . '/api/assets/japan-exotics/social/linked-in-logo.png'}}" alt="LinkedIn" title="LinkedIn" width="32" height="32" style="display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic; border:none;" />
                                                </a>
                                            </td>
                                            @endif

                                            @if($socials->where('key', 'instagram')->isNotEmpty())
                                            <td valign="top" align="right" width="8"></td>
                                            <td valign="top" align="right" width="48">
                                                <a href="{{ $socials->where('key', 'instagram')->first()['url'] }}" target="_blank" title="Instagram" style="text-decoration: none;">
                                                    <img class="imageFix" src="{{ config('app.url') . '/api/assets/japan-exotics/social/insta-logo.png'}}" alt="Instagram" title="Instagram" width="32" height="32" style="display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic; border:none;" />
                                                </a>
                                            </td>
                                            @endif

                                            @if($socials->where('key', 'twitter')->isNotEmpty())
                                            <td valign="top" align="right" width="8"></td>
                                            <td valign="top" align="right" width="48">
                                                <a href="{{ $socials->where('key', 'twitter')->first()['url'] }}" target="_blank" title="X" style="text-decoration: none;">
                                                    <img class="imageFix" src="{{ config('app.url') . '/api/assets/japan-exotics/social/x-twitter-logo.png'}}" alt="X" title="X" width="32" height="32" style="display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic; border:none;" />
                                                </a>
                                            </td>
                                            @endif

                                            @if($socials->where('key', 'youtube')->isNotEmpty())
                                            <td valign="top" align="right" width="8"></td>
                                            <td valign="top" align="right" width="48">
                                                <a href="{{ $socials->where('key', 'youtube')->first()['url'] }}" target="_blank" title="YouTube" style="text-decoration: none;">
                                                    <img class="imageFix" src="{{ config('app.url') . '/api/assets/japan-exotics/social/yt-logo.png'}}" alt="YouTube" title="YouTube" width="32" height="32" style="display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic; border:none;" />
                                                </a>
                                            </td>
                                            @endif
                                        </tr>
                                    </table>
                                </td>
                                @endif
                            </tr>
                            <!-- ADDRESS + PHONE -->
                            <tr>
                                <td valign="top" height="20" colspan="2"></td>
                            </tr>
                            <tr>
                                <td valign="top" align="left" colspan="2">
                                    <p style="color:#f6f6f6; margin:0; font-size:14px; font-weight:500; line-height:22px; font-family: 'Clash Display', -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;">
                                        @if(!empty($location) && !empty($location->address1))
                                            {{ $location->address1 }},<br/>
                                        @endif
                                        @if(!empty($location) && !empty($location->address2))
                                            {{ $location->address2 }},<br/>
                                        @endif
                                        @if(!empty($location) && !empty($location->city))
                                            {{ $location->city }},<br/>
                                        @endif
                                        @if(!empty($location) && !empty($location->county))
                                            {{ $location->county }},<br/>
                                        @endif
                                        @if(!empty($location) && !empty($location->postcode))
                                            {{ $location->postcode }}<br/>
                                        @endif
                                        @if(!empty($phone_number_formatted))
                                            {{ $phone_number_formatted }}
                                        @endif
                                    </p>
                                </td>
                            </tr>
                            <!-- FOOTER YIELD -->
                            <tr>
                                <td valign="top" height="20" colspan="2"></td>
                            </tr>
                            <tr>
                                <td align="left" valign="middle" colspan="2" style="font-size: 14px; color:#f6f6f6; font-family: 'Clash Display', -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;">
                                    @yield('footer')
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
            <!-- END MAIN CARD -->
        </td>
    </tr>
    <!-- VISIT US ONLINE -->
    <tr>
        <td valign="top" height="25"></td>
    </tr>
    <tr>
        <td valign="top">
            <table cellpadding="0" cellspacing="0" border="0" align="center" width="600">
                <tr>
                    <td valign="top" height="1" bgcolor="#444" style="background-color:#444;"></td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td valign="top" height="20"></td>
    </tr>
    <tr>
        <td valign="top">
            <table cellpadding="0" cellspacing="0" border="0" align="center" width="600">
                <tr>
                    <td valign="top" align="center">
                        <p style="color:#f6f6f6; margin:0; font-size:14px; font-weight:400; font-family: 'Clash Display', -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;">
                            Visit us online at <a href="{{ $site_url ?? '' }}" target="_blank" style="color:#f55800; text-decoration: underline;">{{ $site_url ?? '' }}</a>
                        </p>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
    <!-- END VISIT US ONLINE -->
    <tr>
        <td valign="top" height="50"></td>
    </tr>
    <!-- END OF FOOTER -->
</table>
</body>
</html>
