<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="utf-8">
    <title>Struk_Nawasena_{{ $transaction->anggota->uid }}</title>
    <style>
        /* Pengaturan Halaman: Fokus pada lebar printer thermal 58mm */
        @page {
            size: 58mm auto;
            margin: 0;
        }

        body {
            font-family: 'Courier New', Courier, monospace;
            width: 58mm;
            margin: 0;
            padding: 5px 8px; /* Padding sedikit agar teks tidak menempel ke pinggir fisik printer */
            font-size: 13px;
            line-height: 1.2;
            color: #000;
            background-color: #fff;
        }

        .text-center { text-align: center; }
        .text-right { text-align: right; }
        .fw-bold { font-weight: bold; }
        .uppercase { text-transform: uppercase; }

        /* Divider Garis Putus-putus Khas Struk Belanja */
        .divider {
            border-top: 1px dashed #000;
            margin: 5px 0;
            width: 100%;
        }

        /* Tabel Data agar rapi kiri-kanan */
        .info-table {
            width: 100%;
            border-collapse: collapse;
        }
        .info-table td {
            vertical-align: top;
            padding: 2px 0;
        }

        /* Styling Judul Koleksi/Buku */
        .item-box { margin: 8px 0; }
        .item-title {
            display: block;
            font-weight: bold;
            text-transform: uppercase;
            font-size: 14px; /* Judul buku diperbesar agar menonjol */
        }

        /* Khusus saat dicetak: Menangani scaling browser */
        @media print {
            body { 
                width: 58mm;
                /* Jika dicetak di Epson L5190 terlihat kecil, gunakan zoom 1.3 */
                zoom: 1.3; 
            }
            @page { margin: 0; }
        }
    </style>
</head>
<body>

    <div class="header text-center">
        <strong style="font-size: 16px;">PERPUSTAKAAN NAWASENA</strong><br>
        <span style="font-size: 11px;">Bakorwil III Malang</span><br>
        <span style="font-size: 10px;">Jl. Simpang Ijen No.2, Malang</span>
    </div>

    <div class="divider"></div>

    <table class="info-table">
        <tr>
            <td width="35%">ID ANGGOTA</td>
            <td class="fw-bold">: {{ $transaction->anggota->uid }}</td>
        </tr>
        <tr>
            <td>TANGGAL</td>
            <td>: {{ date('d/m/Y H:i') }}</td>
        </tr>
        <tr>
            <td>NAMA</td>
            <td class="uppercase">: {{ $transaction->anggota->nama }}</td>
        </tr>
    </table>

    <div class="divider"></div>

    <div class="item-box">
        <span style="font-size: 11px;">KOLEKSI DIPINJAM:</span><br>
        <span class="item-title">{{ $transaction->koleksi->title }}</span>
    </div>

    <div class="divider"></div>

    <table class="info-table">
        <tr>
            <td>Tgl Pinjam</td>
            <td class="text-right">{{ \Carbon\Carbon::parse($transaction->tanggal_pinjam)->format('d/m/y') }}</td>
        </tr>
        <tr>
            <td class="fw-bold">Tgl Kembali</td>
            <td class="text-right fw-bold">{{ \Carbon\Carbon::parse($transaction->tanggal_kembali)->format('d/m/y') }}</td>
        </tr>
    </table>

    <div class="divider"></div>

    <div class="text-center" style="margin-top: 15px; font-size: 11px;">
        <span>SIMPAN STRUK INI SEBAGAI<br>BUKTI TRANSAKSI YANG SAH</span>
        <br><br>
        <strong>* Harap kembali tepat waktu *</strong><br>
        <span>--- Terima Kasih ---</span>
    </div>

</body>
</html>

