@component('emails.Components.CustomerBody', ['merchant' => $merchant])
    <div>
        <h1 class="h-3 color-{{ config('app.type') }}-site font-regular  mb-4">
            {{ $title }}
        </h1>
        <table>
            <tr>
                <td class="pb-4 h-6">
                    {!! html_entity_decode(nl2br($template)) !!}
                </td>
            </tr>
        </table>

        <h3 class="h-4 color-{{ config('app.type') }}-site mb-3 font-regular">
            {{ $orderTitle }}
        </h3>
        <table class="sectionOrderInfo w-100 p-3 bg-{{ config('app.type') }}-primary-light">
            <tr>
                <td class="p-3">
                    <table class="w-100">
                        <tr>
                            <td>
                                <span class="color-{{ config('app.type') }}-site font-medium">{{ $blueSessionTitle }}</span>
                                {!! html_entity_decode(nl2br($blueSessionTemplate)) !!}
                            </td>
                        </tr>
                        <!-- 小訂單區塊 -->
                        <tr>
                            <td class="pt-3">
                                <table class="bg-white w-100">
                                    <tr>
                                        <td class="p-3">
                                            <table class="w-100">
                                                <tr>
                                                    <td class="pb-3">
                                                        <!-- 小訂單區塊標題 -->
                                                        @if(config('app.type') == 'ipetbooking')
                                                            <img src="{{ asset('email/images/site/ipetbooking-footstep.png') }}" width="18"
                                                                alt="" class="" style="vertical-align: middle;">
                                                        @else
                                                            <img src="{{ asset('email/images/site/dingbeauty-footstep.png') }}" width="18"
                                                             alt="" class="" style="vertical-align: middle;">
                                                        @endif
                                                        <span class="color-{{ config('app.type') }}-primary"> <!-- 狗的名稱 --></span> <span class="h-6">{{ $size->parent->title }} | {{ $size->title }}</span>
                                                        <!-- 小訂單區塊標題結束 -->
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        <table class="w-100">
                                                            @foreach($prepaidOrder->pItems as $item)
                                                                <!-- 每一條的價格迴圈 -->
                                                                @if(in_array($item->type, ['+', '-', '%', 'coupon', 'deposit', 'prepaid']))
                                                                    <tr>
                                                                        <td valign="top" class="color-danger pb-3">
                                                                            <span>{{ \DaydreamLab\Dddream\Helpers\OrderItemHelper::getTitle($item)  }}</span>
                                                                        </td>
                                                                        <td valign="top" align="right" width="50" class="pr-2 color-danger pb-3">

                                                                        </td>
                                                                        <td valign="top" align="right" class="color-danger pb-3"
                                                                            style="white-space: nowrap;">
                                                                            <!-- 價格 -->
                                                                            @if ($item->total >= 0)
                                                                                NT$ {{ $item->total }}
                                                                            @else
                                                                                - NT$ {{ abs($item->total) }}
                                                                            @endif
                                                                        <!-- 價格結束 -->
                                                                        </td>
                                                                    </tr>
                                                                @else
                                                                    <tr>
                                                                        <td valign="top" class="color-{{ config('app.type') }}-text-dark pb-3">
                                                                            <span>{{ $item->title }}</span>
                                                                            <br>
                                                                            <span class="h-6 color-{{ config('app.type') }}-text">{{ $size->parent->title }} | {{ $size->title }}</span>
                                                                        </td>
                                                                        <td valign="top" align="right" width="50" class="pr-2 color-{{ config('app.type') }}-text-dark pb-3">
                                                                            X {{ $item->qty }}
                                                                        </td>
                                                                        <td valign="top" align="right" class="color-{{ config('app.type') }}-text-dark pb-3"
                                                                            style="white-space: nowrap;">
                                                                            @if($item->levelDiscount > 0)
                                                                                會員價 NT$ {{$item->total}}
                                                                                <br><span class='sectionOrderInfo__originPrice h-6'>售價 NT$ {{$item->price}}</span>
                                                                            @else
                                                                                售價 NT$ {{$item->total}}
                                                                            @endif
                                                                        </td>
                                                                    </tr>
                                                                @endif
                                                            @endforeach
                                                            <!-- 每一條的價格迴圈結束 -->
                                                        </table>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        <hr>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        <table class="w-100">
                                                            <tr>
                                                                <td class="color-{{ config('app.type') }}-text-dark pt-3">
                                                                    小計
                                                                </td>
                                                                <td align="right" class="color-{{ config('app.type') }}-text-dark pt-3">
                                                                    NT$ {{$prepaidOrder->total}}
                                                                </td>
                                                            </tr>
                                                        </table>
                                                    </td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                        <!-- 迴圈小訂單區塊結束 -->
                    </table>
                </td>
            </tr>
            <tr>
                <td class="px-3 pb-3">
                    <hr>
                </td>
            </tr>
            <tr>
                <td class="px-3">
                    <table class="w-100">
                        <tr>
                            <td>
                                小計
                            </td>
                            <td align="right">
                                NT$ {{ $prepaidOrder->total }}
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr>
                <td class="px-3 pb-3 pt-3">
                    <hr>
                </td>
            </tr>
            <tr>
                <td class="px-3 pb-4">
                    <table class="w-100">
                        <tr>
                            <td class="color-{{ config('app.type') }}-site font-medium">
                                總計金額
                            </td>
                            <td align="right" class="color-{{ config('app.type') }}-site font-medium">
                                NT$ {{ $prepaidOrder->total }}
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <!-- 藍色區塊結束 -->
        @foreach ($sessions as $session)
            <h3 class="h-4 color-{{ config('app.type') }}-site font-regular pt-5">{{ $session['title'] }}</h3>
            <table class="border w-100">
                <tr>
                    <td class="p-3 h-6">
                        {!! html_entity_decode(nl2br($session['content'])) !!}
                    </td>
                </tr>
            </table>
        @endforeach
        <div class="mb-5 mt-5">
            <a href="{{ $orderLink }}"
               class="baseButton {{config('app.type')}}-isSite isFull {{ config('app.type') == 'ipetbooking' ? 'isRadius' : '' }}">
                查看訂單完整明細
            </a>
        </div>
        <div class="link-box mb-5">
            <p class="h-6">
                若無法點選上方連結，請複製下面的網址到您的瀏覽器中：
            </p>
            <a href="{{ $orderLink }}"
               class="color-{{ config('app.type') }}-primary mail-link h-6">
                {{ $orderLink }}
            </a>
        </div>
    </div>
@endcomponent