<!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>DATA PENJEMPUTAN</title>
    <link href="{{ base_path() . '/public/assets/vendor/bootstrap-5.0.2-dist/css/bootstrap.css' }}" rel="stylesheet">
    <style>
        @page {
            margin: 0;
        }

        * {
            /* margin: 0; */
            line-height: 1.2;
            color: #000;
        }

        /* html { margin: 0} */

        body {
            font-weight: 400;
            margin: 1.5cm 1cm 1cm 1cm;
        }

        .word-break {
            word-wrap: break-word;
            overflow-wrap: break-word;
        }

        .page-break {
            page-break-after: always;
        }

        strong {
            font-weight: 1000;
        }

        .general-photo {
            max-width: 600px;
            max-height: 400px;
        }

        .dynamic-photo {
            max-width: 80%;
            max-height: 40%;
        }

    </style>
</head>

<body>

    <table class="table mb-2">
        <tbody>
            <tr>
                <td>
                    <p style="margin:0 0 1rem 0.25rem;font-size:24px;"><strong>DATA PENJEMPUTAN</strong></p>
                </td>
                <td class="text-end"><img src="{{ base_path() . '/public/images/bonceng-red.png' }}"
                        alt="PT. BONCENG INDONESIA" style="margin:0 1.5rem 0 0;"></td>
            </tr>
        </tbody>
    </table>

    <table class="table mb-3">
        <tbody>
            <tr>
                <td>
                    <p style="margin:0 0 1rem 0.25rem;font-size:16px;"><strong>Foto Seal</strong></p>
                </td>
            </tr>
            <tr>
                <td><img src="{{ base_path() . '/public/storage/' . $order->ord_pck_seal_img }}" alt="Foto Seal"
                        class="dynamic-photo"></td>
            </tr>
        </tbody>
    </table>

    <table class="table mb-3">
        <tbody>
            <tr>
                <td>
                    <p style="margin:0 0 1rem 0.25rem;font-size:16px;"><strong>Foto Pengemudi + Armada</strong></p>
                </td>
            </tr>
            <tr>
                <td><img src="{{ base_path() . '/public/storage/' . $order->ord_pck_drv_armd_img }}"
                        alt="Foto Pengemudi + Armada" class="dynamic-photo"></td>
            </tr>
        </tbody>
    </table>

    <div class="page-break"></div>

    <table class="table mb-3">
        <tbody>
            <tr>
                <td>
                    <p style="margin:0 0 1rem 0.25rem;font-size:16px;"><strong>Nomor Polisi dan Kendaraan</strong></p>
                </td>
            </tr>
            <tr>
                <td><img src="{{ base_path() . '/public/storage/' . $order->ord_pck_nopol_img }}"
                        alt="Nomor Polisi dan Kendaraan" class="dynamic-photo"></td>
            </tr>
        </tbody>
    </table>

    <div class="page-break"></div>

    <table class="table mb-2">
        <tbody>
            <tr>
                <td>
                    <p style="margin:0 0 1rem 0.25rem;font-size:24px;"><strong>DATA PENJEMPUTAN</strong></p>
                </td>
                <td class="text-end"><img src="{{ base_path() . '/public/images/bonceng-red.png' }}"
                        alt="PT. BONCENG INDONESIA" style="margin:0 1.5rem 0 0;"></td>
            </tr>
        </tbody>
    </table>
    <table class="table mb-3">
        <tbody>
            <div class="page-break"></div>
            <tr>
                <td>
                    <p style="margin:0 0 1rem 0.25rem;font-size:16px;"><strong>Dokumen Kelengkapan Dari Client</strong>
                    </p>
                </td>
            </tr>
            @php
                $i = 1;
            @endphp
            @foreach ($order->ord_pck_docs_client_imgs as $row)
                {{-- @if ($i % 2 === 0)
                    <tr>
                        <td>
                            <p style="margin:0 0 1rem 0.25rem;font-size:24px;"><strong>DATA PENJEMPUTAN</strong></p>
                        </td>
                        <td class="text-end"><img src="{{ base_path() . '/public/images/bonceng-red.png' }}"
                                alt="PT. BONCENG INDONESIA" style="margin:0 1.5rem 0 0;"></td>
                    </tr>
                    <div class="page-break"></div>
                @endif --}}
                <tr>
                    <td><img src="{{ base_path() . '/public/storage/' . $row['img'] }}"
                            alt="Dokumen Kelengkapan Dari Client" class="mb-3 dynamic-photo"></td>
                </tr>
                @php
                    $i++;
                @endphp
            @endforeach
        </tbody>
    </table>

    @if (isset($order->ord_pck_seal_install_img))
        <div class="page-break"></div>
        <table class="table mb-2">
            <tbody>
                <tr>
                    <td>
                        <p style="margin:0 0 1rem 0.25rem;font-size:24px;"><strong>DATA PENJEMPUTAN</strong></p>
                    </td>
                    <td class="text-end"><img src="{{ base_path() . '/public/images/bonceng-red.png' }}"
                            alt="PT. BONCENG INDONESIA" style="margin:0 1.5rem 0 0;"></td>
                </tr>
            </tbody>
        </table>
        <table class="table mb-3">
            <tbody>
                <tr>
                    <td>
                        <p style="margin:0 0 1rem 0.25rem;font-size:16px;"><strong>Foto Pemasangan Seal</strong></p>
                    </td>
                </tr>
                <tr>
                    <td><img src="{{ base_path() . '/public/storage/' . $order->ord_pck_seal_install_img }}"
                            alt="Foto Pemasangan Seal" class="dynamic-photo"></td>
                </tr>
            </tbody>
        </table>
    @endif

    @if (isset($order->ord_pck_goods_img))
        @if (!isset($order->ord_pck_seal_install_img))
            <div class="page-break"></div>
            <table class="table mb-2">
                <tbody>
                    <tr>
                        <td>
                            <p style="margin:0 0 1rem 0.25rem;font-size:24px;"><strong>DATA PENJEMPUTAN</strong></p>
                        </td>
                        <td class="text-end"><img src="{{ base_path() . '/public/images/bonceng-red.png' }}"
                                alt="PT. BONCENG INDONESIA" style="margin:0 1.5rem 0 0;"></td>
                    </tr>
                </tbody>
            </table>
        @endif
        <table class="table mb-3">
            <tbody>
                <tr>
                    <td>
                        <p style="margin:0 0 1rem 0.25rem;font-size:16px;"><strong>Foto Barang</strong></p>
                    </td>
                </tr>
                <tr>
                    <td><img src="{{ base_path() . '/public/storage/' . $order->ord_pck_goods_img }}"
                            alt="Foto Barang" class="dynamic-photo">
                    </td>
                </tr>
            </tbody>
        </table>
    @endif

</body>

</html>
