@extends('layouts.print')

@section('content')
<style>
@page {
    size: 80mm auto;
    margin: 0;
}

body {
    margin: 0;
    padding: 0;
    font-family: monospace;
    font-size: 11px;
    color: #000;
}

.receipt {
    padding: 6px;
}

.center {
    text-align: center;
}

.right {
    text-align: right;
}

hr {
    border: none;
    border-top: 1px dashed #000;
    margin: 6px 0;
}

.row {
    display: flex;
    justify-content: space-between;
    gap: 4px;
}

.label {
    font-weight: bold;
}

.value {
    text-align: right;
    word-break: break-word;
}

/* Item layout */
.item {
    margin-bottom: 6px;
}

.item-title {
    font-weight: bold;
    word-break: break-word;
}

.item-meta {
    display: flex;
    justify-content: space-between;
    margin-top: 2px;
}
</style>

<div class="receipt">

    {{-- Header --}}
    <div class="center">
        <img src="{{ url('images/logo-removebg-preview.png') }}"
             style="max-width:70mm;height:auto;">
    </div>

    <hr>

    <div class="center">
        <strong>{{ __('menu.devotee') }}</strong><br>
        {{ $data['devotee_name'] }}<br>
        {{ $data['devotee_mobile'] }}
    </div>

    <hr>

    <div class="center">
        <strong>{{ __('common.invoice') }}</strong><br>
        {{ $data['invoice_id'] }}
    </div>

    <div class="center">
        {{ __('seva.date') }} : {{ $data['donation_date'] }}
    </div>

    <hr>

    {{-- Items --}}
    <div>
        <strong>{{ __('common.donation_item') }}</strong>
    </div>

    <hr>

    @foreach($data['items'] as $item)
        <div class="item">
            <div class="item-title">
                {{ $item['sr'] }}. {{ $item['title'] }}
            </div>

            <div class="item-meta">
                <div>
                    {{ __('common.quantity') }}:
                    {{ rtrim(rtrim(number_format($item['quantity'], 3, '.', ''), '0'), '.') }} {{ $item['unit'] }}
                </div>
                <div class="right">
                    ₹{{ number_format($item['price'], 2) }}
                </div>
            </div>
        </div>
    @endforeach

    <hr>

    {{-- Total --}}
    <div class="row">
        <div class="label">{{ __('common.total_price') }}</div>
        <div class="value">
            ₹{{ number_format($data['total_price'], 2) }}
        </div>
    </div>

    <hr>

    {{-- Remarks --}}
    @if(!empty($data['remarks']))
        <div>
            <strong>{{ __('devotee.remarks') }}:</strong><br>
            {{ $data['remarks'] }}
        </div>
        <hr>
    @endif

    {{-- Footer --}}
    <div class="center">
        {{ __('common.thank_you') ?? 'Thank You' }} 🙏
    </div>

</div>
@endsection