<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Resi - <?php echo e($pesanan->kode_pesanan); ?></title>
    <style>
        * { margin: 0; padding: 0; box-sizing: border-box; }

        body {
            font-family: Arial, sans-serif;
            font-size: 8pt;
            color: #000;
            background: white;
            line-height: 1.25;
        }

        @media print {
            @page {
                size: A5 portrait;
                margin: 3mm;
            }
            body { margin: 0; }
        }

        .resi {
            width: 142mm;
            margin: 0 auto;
            border: 1.2px solid #000;
            page-break-inside: avoid;
        }

        /* ===== HEADER TOKO ===== */
        .header {
            padding: 5px 8px;
            border-bottom: 1.2px solid #000;
            display: table;
            width: 100%;
        }
        .header-left {
            display: table-cell;
            vertical-align: middle;
            width: 60%;
        }
        .header-right {
            display: table-cell;
            vertical-align: middle;
            text-align: right;
            width: 40%;
        }
        .toko-nama {
            font-size: 12pt;
            font-weight: bold;
            color: #000;
            letter-spacing: 0.3px;
        }
        .toko-sub {
            font-size: 6.5pt;
            color: #444;
            margin-top: 0;
        }
        .label-resi {
            font-size: 7.5pt;
            font-weight: bold;
            letter-spacing: 0.5px;
            text-transform: uppercase;
        }

        /* ===== KODE + NO RESI ROW ===== */
        .kode-row {
            display: table;
            width: 100%;
            border-bottom: 1.2px dashed #000;
        }
        .kode-cell {
            display: table-cell;
            padding: 4px 8px;
            border-right: 1.2px dashed #000;
            width: 50%;
            vertical-align: middle;
        }
        .kode-cell:last-child { border-right: none; }
        .kode-cell .klabel {
            font-size: 6.5pt;
            color: #444;
            text-transform: uppercase;
        }
        .kode-cell .kval {
            font-size: 10pt;
            font-weight: bold;
            letter-spacing: 0.5px;
            color: #000;
        }

        /* ===== BARCODE AREA ===== */
        .barcode-area {
            border-bottom: 1.2px dashed #000;
            padding: 4px 8px;
            text-align: center;
        }
        .barcode-lines {
            display: inline-block;
            height: 25px;
            width: 180px;
            background: repeating-linear-gradient(
                to right,
                #000 0px, #000 1.5px,
                white 1.5px, white 3px,
                #000 3px, #000 4px,
                white 4px, white 6px,
                #000 6px, #000 7px,
                white 7px, white 9px,
                #000 9px, #000 11px
            );
        }
        .barcode-text {
            font-size: 6.5pt;
            letter-spacing: 1.5px;
            margin-top: 1px;
            font-family: 'Courier New', monospace;
        }

        /* ===== PENERIMA + PENGIRIM ===== */
        .addr-row {
            display: table;
            width: 100%;
            border-bottom: 1.2px dashed #000;
        }
        .addr-cell {
            display: table-cell;
            vertical-align: top;
            padding: 4px 8px;
            width: 50%;
        }
        .addr-cell.left { border-right: 1.2px dashed #000; }
        .addr-label {
            font-size: 6.5pt;
            text-transform: uppercase;
            color: #444;
            margin-bottom: 1px;
        }
        .addr-name {
            font-size: 10pt;
            font-weight: bold;
            color: #000;
            line-height: 1.1;
        }
        .addr-hp {
            font-size: 8.5pt;
            font-weight: bold;
            margin: 1px 0;
        }
        .addr-detail {
            font-size: 7.5pt;
            color: #222;
            line-height: 1.3;
            margin-top: 1px;
        }

        /* ===== KOTA BOX ===== */
        .kota-row {
            display: table;
            width: 100%;
            border-bottom: 1.2px dashed #000;
        }
        .kota-cell {
            display: table-cell;
            border: 0.8px solid #000;
            padding: 3px 8px;
            text-align: center;
            font-size: 8pt;
            font-weight: bold;
            text-transform: uppercase;
            width: 50%;
        }
        .kota-cell:first-child { border-right: none; }

        /* ===== INFO STRIP ===== */
        .info-strip {
            border-bottom: 1.2px dashed #000;
            padding: 3px 8px;
            display: table;
            width: 100%;
        }
        .info-strip-left  { display: table-cell; vertical-align: middle; width: 60%; }
        .info-strip-right { display: table-cell; vertical-align: middle; text-align: right; width: 40%; }
        .info-strip .row  { font-size: 7.5pt; margin-bottom: 0px; }
        .info-strip .row b { font-weight: bold; }

        /* ===== METODE BAYAR BADGE ===== */
        .metode-badge {
            display: inline-block;
            border: 1.2px solid #000;
            padding: 1px 6px;
            font-size: 7.5pt;
            font-weight: bold;
            text-transform: uppercase;
        }
        .metode-note {
            font-size: 7pt;
            color: #444;
            font-style: italic;
            margin-left: 4px;
            vertical-align: middle;
        }

        /* ===== PRODUK TABLE ===== */
        .produk-section {
            border-bottom: 1.2px dashed #000;
        }
        .produk-tbl {
            width: 100%;
            border-collapse: collapse;
            font-size: 7.5pt;
        }
        .produk-tbl th {
            font-size: 7pt;
            font-weight: bold;
            text-transform: uppercase;
            padding: 3px 8px;
            text-align: left;
            background: #f0f0f0;
            color: #000;
        }
        .produk-tbl td {
            padding: 3px 8px;
            vertical-align: top;
            border-bottom: 0.5px solid #eee;
        }
        .pnama   { font-weight: bold; color: #000; }
        .pvarian { font-size: 6.5pt; color: #444; margin-top: 0px; }

        /* ===== SUMMARY ===== */
        .summary-section {
            border-bottom: 1.2px dashed #000;
            padding: 2px 8px;
        }
        .sum-row {
            display: table;
            width: 100%;
            font-size: 7.5pt;
            padding: 1px 0;
        }
        .sum-label { display: table-cell; color: #333; }
        .sum-val   { display: table-cell; text-align: right; font-weight: 600; }

        /* ===== TOTAL ===== */
        .total-row {
            display: table;
            width: 100%;
            padding: 6px 10px;
            border-bottom: 1.5px dashed #000;
            border-top: 1.5px solid #000;
        }
        .total-label { display: table-cell; font-size: 10pt; font-weight: bold; text-transform: uppercase; letter-spacing: 0.5px; }
        .total-val   { display: table-cell; text-align: right; font-size: 13pt; font-weight: bold; }

        /* ===== CATATAN ===== */
        .catatan {
            padding: 5px 10px;
            font-size: 7.5pt;
            color: #444;
            border-bottom: 1.5px dashed #000;
            line-height: 1.5;
        }

        /* ===== FOOTER ===== */
        .footer {
            padding: 5px 10px;
            display: table;
            width: 100%;
        }
        .footer-left  { display: table-cell; font-size: 7pt; color: #555; vertical-align: middle; }
        .footer-right { display: table-cell; text-align: right; font-size: 7pt; color: #555; vertical-align: middle; }
        .footer-right b { color: #000; }
    </style>
</head>
<body>

<?php
    // Bersihkan emoji dan karakter non-latin dari nama toko
    function bersihkanTeks($str) {
        return trim(preg_replace('/[\x{10000}-\x{10FFFF}]/u', '', $str));
    }
    $namaToko = $toko ? bersihkanTeks($toko->nama_toko) : 'Raja Futsal';
    if (empty($namaToko)) $namaToko = 'Raja Futsal';
?>

<div class="resi">

    
    <div class="header">
        <div class="header-left">
            <div class="toko-nama"><?php echo e($namaToko); ?></div>
            <div class="toko-sub">
                <?php if($toko && $toko->alamat_jalan): ?>
                    <?php echo e($toko->alamat_jalan); ?>

                <?php else: ?>
                    Toko Perlengkapan Futsal
                <?php endif; ?>
            </div>
        </div>
        <div class="header-right">
            <div class="label-resi">Resi Pengiriman</div>
            <?php if($toko && ($toko->no_hp ?? $toko->telepon ?? null)): ?>
                <div style="font-size:7.5pt;color:#555;margin-top:2px;">
                    Telp: <?php echo e($toko->no_hp ?? $toko->telepon); ?>

                </div>
            <?php endif; ?>
        </div>
    </div>

    
    <div class="kode-row">
        <div class="kode-cell">
            <div class="klabel">No. Pesanan</div>
            <div class="kval"><?php echo e($pesanan->kode_pesanan); ?></div>
        </div>
        <div class="kode-cell">
            <div class="klabel">Tanggal Pesan</div>
            <div class="kval" style="font-size:9pt;">
                <?php echo e($pesanan->created_at->format('d M Y')); ?><br>
                <span style="font-size:8pt;font-weight:normal;"><?php echo e($pesanan->created_at->format('H:i')); ?> WIB</span>
            </div>
        </div>
    </div>

    
    <div class="barcode-area">
        <div class="barcode-lines"></div>
        <div class="barcode-text"><?php echo e($pesanan->kode_pesanan); ?></div>
    </div>

    
    <div class="addr-row">
        <div class="addr-cell left">
            <div class="addr-label">Penerima:</div>
            <?php if($pesanan->alamat): ?>
                <div class="addr-name"><?php echo e($pesanan->alamat->nama_penerima); ?></div>
                <div class="addr-hp"><?php echo e($pesanan->alamat->no_hp); ?></div>
                <div class="addr-detail">
                    <?php echo e($pesanan->alamat->alamat_lengkap); ?><br>
                    <?php if(optional($pesanan->alamat->village)->name): ?>
                        <?php echo e(strtoupper(optional($pesanan->alamat->village)->name)); ?>,
                    <?php endif; ?>
                    <?php echo e(strtoupper(optional($pesanan->alamat->district)->name ?? '')); ?><br>
                    <?php echo e(strtoupper(optional($pesanan->alamat->city)->name ?? '')); ?>,
                    <?php echo e(strtoupper(optional($pesanan->alamat->province)->name ?? '')); ?>

                    <?php if($pesanan->alamat->kode_pos): ?> <?php echo e($pesanan->alamat->kode_pos); ?> <?php endif; ?>
                </div>
            <?php else: ?>
                <div class="addr-detail">Alamat tidak tersedia</div>
            <?php endif; ?>
        </div>
        <div class="addr-cell">
            <div class="addr-label">Pengirim:</div>
            <div class="addr-name" style="font-size:10pt;"><?php echo e($namaToko); ?></div>
            <?php if($toko && $toko->alamat_jalan): ?>
                <div class="addr-detail"><?php echo e($toko->alamat_jalan); ?></div>
            <?php endif; ?>
            <?php if($toko && ($toko->no_hp ?? $toko->telepon ?? null)): ?>
                <div class="addr-detail">Telp: <?php echo e($toko->no_hp ?? $toko->telepon); ?></div>
            <?php endif; ?>

            <?php if($pesanan->kurir): ?>
            <div style="margin-top:5px;padding-top:5px;border-top:1px dashed #ccc;">
                <div class="addr-label">Kurir:</div>
                <div class="addr-name" style="font-size:9pt;"><?php echo e($pesanan->kurir->name); ?></div>
                <?php if($pesanan->kurir->no_hp): ?>
                    <div class="addr-hp" style="font-size:8pt;"><?php echo e($pesanan->kurir->no_hp); ?></div>
                <?php endif; ?>
            </div>
            <?php endif; ?>
        </div>
    </div>

    
    <div class="kota-row">
        <div class="kota-cell">
            <?php echo e(strtoupper(optional($pesanan->alamat->district)->name ?? optional($pesanan->alamat->city)->name ?? '-')); ?>

        </div>
        <div class="kota-cell">
            <?php echo e(strtoupper(optional($pesanan->alamat->province)->name ?? '-')); ?>

        </div>
    </div>

    
    <div class="info-strip">
        <div class="info-strip-left">
            <div class="row">
                <span class="metode-badge">
                    <?php if($pesanan->pembayaran): ?>
                        <?php echo e(strtoupper(str_replace('_', ' ', $pesanan->pembayaran->metode))); ?>

                    <?php else: ?>
                        BELUM BAYAR
                    <?php endif; ?>
                </span>
                <span class="metode-note">
                    <?php if($pesanan->pembayaran && $pesanan->pembayaran->metode == 'cod'): ?>
                        Bayar di tempat
                    <?php else: ?>
                        Sudah lunas
                    <?php endif; ?>
                </span>
            </div>
            <div class="row" style="margin-top:3px;">
                <b>No. Pesanan:</b> <?php echo e($pesanan->kode_pesanan); ?>

            </div>
            <?php if($pesanan->no_resi): ?>
            <div class="row">
                <b>No. Resi:</b> <?php echo e($pesanan->no_resi); ?>

            </div>
            <?php endif; ?>
        </div>
        <div class="info-strip-right">
            <div style="height:28px;width:90px;display:inline-block;background:repeating-linear-gradient(to right,#000 0,#000 1.5px,white 1.5px,white 3px,#000 3px,#000 4px,white 4px,white 6px,#000 6px,#000 8px,white 8px,white 10px,#000 10px,#000 11px,white 11px,white 13px,#000 13px,#000 15px,white 15px,white 17px,#000 17px,#000 18px,white 18px,white 20px,#000 20px,#000 22px,white 22px,white 24px,#000 24px,#000 25px,white 25px,white 27px,#000 27px,#000 29px,white 29px,white 31px,#000 31px,#000 32px,white 32px,white 34px,#000 34px,#000 36px,white 36px,white 38px,#000 38px,#000 40px);"></div>
        </div>
    </div>

    
    <div class="produk-section">
        <table class="produk-tbl">
            <thead>
                <tr>
                    <th style="width:5%">#</th>
                    <th style="width:50%">Nama Produk</th>
                    <th style="width:20%">Variasi</th>
                    <th class="c" style="width:10%">Qty</th>
                    <th class="r" style="width:15%">Subtotal</th>
                </tr>
            </thead>
            <tbody>
                <?php $__currentLoopData = $pesanan->detail; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $i => $detail): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                <tr>
                    <td><?php echo e($i + 1); ?></td>
                    <td>
                        <div class="pnama"><?php echo e($detail->nama_produk); ?></div>
                        <?php if($detail->warna || $detail->ukuran): ?>
                        <div class="pvarian">(<?php echo e(implode(', ', array_filter([$detail->warna, $detail->ukuran ? 'Uk.'.$detail->ukuran : null]))); ?>)</div>
                        <?php endif; ?>
                    </td>
                    <td style="font-size:7.5pt;color:#444;">
                        <?php if($detail->warna): ?> <?php echo e($detail->warna); ?> <?php endif; ?>
                        <?php if($detail->ukuran): ?> / <?php echo e($detail->ukuran); ?> <?php endif; ?>
                    </td>
                    <td class="c" style="font-weight:bold;"><?php echo e($detail->qty); ?></td>
                    <td class="r" style="font-weight:bold;">Rp <?php echo e(number_format($detail->subtotal, 0, ',', '.')); ?></td>
                </tr>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
            </tbody>
        </table>
    </div>

    
    <div class="summary-section">
        <div class="sum-row">
            <span class="sum-label">Subtotal (<?php echo e($pesanan->detail->sum('qty')); ?> item)</span>
            <span class="sum-val">Rp <?php echo e(number_format($subtotalProduk, 0, ',', '.')); ?></span>
        </div>
        <div class="sum-row">
            <span class="sum-label">Ongkos Kirim</span>
            <span class="sum-val">
                <?php if($ongkir <= 0): ?> GRATIS
                <?php else: ?> Rp <?php echo e(number_format($ongkir, 0, ',', '.')); ?>

                <?php endif; ?>
            </span>
        </div>
    </div>

    
    <div class="total-row">
        <span class="total-label">Total Pembayaran</span>
        <span class="total-val">Rp <?php echo e(number_format($pesanan->total_harga, 0, ',', '.')); ?></span>
    </div>

    
    <div class="catatan">
        Mohon periksa kondisi paket sebelum ditandatangani atau diterima.
        Bila ada kerusakan, segera hubungi penjual.
        Pesanan ini telah lunas dibayar — penerima tidak perlu membayar lagi kepada kurir.
    </div>

    
    <div class="footer">
        <div class="footer-left">
            Dicetak: <?php echo e(now()->format('d M Y, H:i')); ?> WIB
        </div>
        <div class="footer-right">
            <b><?php echo e($namaToko); ?></b> &mdash; Perlengkapan Futsal Terpercaya
        </div>
    </div>

</div>
</body>
</html><?php /**PATH C:\laragon\www\ecommerce\resources\views/pesanan/resi.blade.php ENDPATH**/ ?>