<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <title>Struk #{{ $transaction->invoice_number }}</title>
    <style>
        @page { margin: 0; }
        * { margin:0; padding:0; box-sizing:border-box; }
        body {
            font-family: 'Courier New', Courier, monospace;
            font-size: {{ \App\Models\Setting::get('printer_font_size', 'sm') == 'xs' ? '9px' : (\App\Models\Setting::get('printer_font_size', 'sm') == 'base' ? '13px' : '11px') }};
            line-height: 1.2;
            width: {{ \App\Models\Setting::get('printer_width', '80') }}mm;
            padding: 2mm;
            background: white;
            color: #000;
        }
        .center { text-align: center; }
        .bold { font-weight: bold; }
        .hr { border-top: 1px dashed #000; margin: 5px 0; }
        .hr-double { border-top: 1px double #000; margin: 5px 0; }
        .flex { display: flex; justify-content: space-between; align-items: flex-start; }
        .item-row { margin-bottom: 3px; }
        .store-name { font-size: 14px; font-weight: bold; text-transform: uppercase; margin-bottom: 2px; }
        .grand { font-size: 13px; font-weight: bold; margin-top: 2px; }
        .footer { font-size: 10px; text-align: center; margin-top: 10px; }
        .logo { max-width: 40mm; height: auto; margin-bottom: 5px; filter: grayscale(1); }
        @media print {
            .no-print { display: none; }
        }
    </style>
</head>
<body>

<div class="center">
    @if(\App\Models\Setting::get('printer_show_logo') && \App\Models\Setting::get('store_logo'))
        <img src="{{ asset(\App\Models\Setting::get('store_logo')) }}" class="logo">
    @endif
    <div class="store-name">{{ $settings['store_name'] }}</div>
    @if($settings['store_address'])
    <div style="font-size: 10px;">{{ $settings['store_address'] }}</div>
    @endif
    @if($settings['store_phone'])
    <div style="font-size: 10px;">Telp: {{ $settings['store_phone'] }}</div>
    @endif
</div>

<div class="hr"></div>

<div style="font-size: 10px; margin-bottom: 5px;">
    <div class="flex"><span>Tgl: {{ $transaction->transaction_date->format('d/m/Y H:i') }}</span></div>
    <div class="flex"><span>No : {{ $transaction->invoice_number }}</span></div>
    <div class="flex"><span>Ksr: {{ $transaction->user->name }}</span></div>
    @if($transaction->customer_name !== 'Umum')
    <div class="flex"><span>Plg: {{ $transaction->customer_name }}</span></div>
    @endif
</div>

<div class="hr-double"></div>

@foreach($transaction->items as $item)
<div class="item-row">
    <div class="bold">{{ strtoupper($item->product_name) }}</div>
    <div class="flex">
        <span>{{ $item->quantity }} x {{ number_format($item->unit_price,0,',','.') }}</span>
        <span>{{ number_format($item->subtotal,0,',','.') }}</span>
    </div>
    @if($item->discount_amount > 0)
    <div class="flex" style="font-size:9px; color: #333;">
        <span>(Diskon Item)</span><span>-{{ number_format($item->discount_amount,0,',','.') }}</span>
    </div>
    @endif
</div>
@endforeach

<div class="hr"></div>

<div class="flex"><span>Subtotal</span><span>{{ number_format($transaction->subtotal,0,',','.') }}</span></div>

@if($transaction->discount_amount > 0)
<div class="flex"><span>Diskon Final</span><span>-{{ number_format($transaction->discount_amount,0,',','.') }}</span></div>
@endif

@if($transaction->tax_amount > 0)
<div class="flex"><span>Pajak ({{ $transaction->tax_percent }}%)</span><span>{{ number_format($transaction->tax_amount,0,',','.') }}</span></div>
@endif

<div class="flex grand"><span>TOTAL</span><span>{{ number_format($transaction->grand_total,0,',','.') }}</span></div>

@if($transaction->payment_method === 'cash')
<div class="hr"></div>
<div class="flex"><span>Metode: TUNAI</span><span></span></div>
<div class="flex"><span>Bayar</span><span>{{ number_format($transaction->amount_paid,0,',','.') }}</span></div>
<div class="flex bold"><span>Kembali</span><span>{{ number_format($transaction->change_amount,0,',','.') }}</span></div>
@else
<div class="hr"></div>
<div class="flex"><span>Metode</span><span>{{ strtoupper($transaction->payment_method) }}</span></div>
@endif

<div class="hr-double"></div>

<div class="footer">
    <p>{{ \App\Models\Setting::get('receipt_footer', 'Terima Kasih!') }}</p>
    <p style="margin-top:5px; font-size:8px;">{{ date('d/m/Y H:i:s') }}</p>
</div>

{{-- Spasi bawah struk agar tidak terpotong saat keluar dari printer thermal --}}
<div style="height: 15mm;"></div>

<div class="no-print" style="position: fixed; bottom: 20px; left: 0; right: 0; text-align: center;">
    <button onclick="window.print()" style="padding:10px 25px; background:#000; color:#fff; border:none; border-radius:50px; cursor:pointer; font-weight:bold; box-shadow: 0 4px 12px rgba(0,0,0,0.3);">
        🖨️ CETAK SEKARANG
    </button>
</div>

<script>
    @if(\App\Models\Setting::get('printer_auto_print', true))
    window.onload = function() {
        window.print();
        setTimeout(function() {
            // Jika dalam iframe, beri tahu parent
            if (window.self !== window.top) {
                // ...
            }
        }, 1000);
    }
    @endif
</script>
</body>
</html>
