@extends('layouts.app')

@php
    use Illuminate\Support\Facades\Storage;

    $title = 'Checkout - ' . $product->name;
@endphp

@section('title', $title)

@section('content')
    <section class="shop-details-section section-padding fix shop-bg">
        <div class="container">
            <div class="shop-details-wrapper">
                <div class="row g-4">

                    {{-- Col stânga: formularul de comandă --}}
                    <div class="col-lg-7">
                        <h3 class="mb-3">Finalizare comandă</h3>

                        @if(!empty($warnings))
                            <div class="alert alert-warning">
                                <ul class="mb-0">
                                    @foreach($warnings as $w)
                                        <li>{{ $w }}</li>
                                    @endforeach
                                </ul>
                            </div>
                        @endif

                        <form id="checkoutForm" method="post" action="{{ route('checkout.submit', $product->slug) }}">
                            @csrf

                            <div class="row g-3">
                                <div class="col-12">
                                    <label class="form-label">Nume și prenume *</label>
                                    <input type="text" name="name" class="form-control" placeholder="Ex: Popescu Ion" required>
                                </div>

                                <div class="col-md-6">
                                    <label class="form-label">Telefon *</label>
                                    <input type="tel" name="tel" class="form-control" placeholder="07xx xxx xxx" autocomplete="tel" required>
                                </div>

                                <div class="col-md-6">
                                    <label class="form-label">Adresă *</label>
                                    <input type="text" name="street-address" class="form-control" placeholder="Str. Exemplu nr. 10, oraș" autocomplete="street-address" required>
                                </div>

                                {{-- opțional dacă vrei cantitate --}}
                                <input type="hidden" name="qty" value="{{ $qty ?? 1 }}">

                                <div class="col-12 mt-2">
                                    <p class="mb-1"><strong>Plata:</strong> doar la livrare (ramburs).</p>
                                    <p class="mb-1"><strong>Livrare:</strong> {{ $product->shipping_info ?: '—' }}</p>
                                </div>

                                <div class="col-12 mt-3">
                                    <button type="submit" class="theme-btn">
                                        <span>Finalizează comanda</span>
                                    </button>
                                </div>
                            </div>
                        </form>
                    </div>

                    {{-- Col dreapta: sumar comandă --}}
                    <div class="col-lg-5">
                        <div class="product-details-content p-4" style="background:#fff;border:1px solid #eee;border-radius:12px;">
                            <h4 class="pb-3">Sumar comandă</h4>

                            @php
                                $img = $product->mainImage;
                                $disk = $img->disk ?? 'public';
                                $thumb = $img ? (data_get($img->meta, 'thumb_312x340') ?: $img->path) : null;
                                $thumbUrl = $img ? Storage::disk($disk)->url($thumb) : asset('assets/img/product/default.webp');
                            @endphp

                            <div class="d-flex align-items-center mb-3">
                                <div style="width:90px;flex:0 0 90px;">
                                    <img src="{{ $thumbUrl }}" alt="{{ $product->name }}" style="width:100%;border-radius:8px;">
                                </div>
                                <div class="ms-3">
                                    <div class="fw-semibold">{{ $product->name }}</div>
                                    <div class="text-muted small">Cantitate: <span id="sum-qty">{{ $qty }}</span></div>
                                </div>
                            </div>

                            <div class="border-top pt-3">
                                <div class="d-flex justify-content-between">
                                    <span>Preț unitar</span>
                                    <span>{{ number_format($unitPrice, 2) }} {{ $currency }}</span>
                                </div>
                                <div class="d-flex justify-content-between">
                                    <span>Subtotal</span>
                                    <span id="sum-subtotal">{{ number_format($subtotal, 2) }} {{ $currency }}</span>
                                </div>
                                <div class="d-flex justify-content-between text-muted">
                                    <span>Livrare</span>
                                    <span>Conform informațiilor produsului</span>
                                </div>
                                <hr>
                                <div class="d-flex justify-content-between fw-bold">
                                    <span>Total</span>
                                    <span id="sum-total">{{ number_format($subtotal, 2) }} {{ $currency }}</span>
                                </div>
                            </div>

                            <div class="mt-3 small text-muted">
                                * Totalul nu include eventuale taxe/variații comunicate de curier. Plata se face la livrare.
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </section>

    {{-- dacă vrei recalcul live la qty (dacă vei adăuga un input qty în checkout) --}}
    <script>
        document.addEventListener('DOMContentLoaded', function () {
            // dacă vei adăuga pe viitor un control de cantitate în checkout,
            // folosește acest bloc pentru a recalcula totalul.
            const qtyEl = document.getElementById('qty');
            const unitPriceEl = document.getElementById('unit-price');
            const sumQty = document.getElementById('sum-qty');
            const sumSub = document.getElementById('sum-subtotal');
            const sumTot = document.getElementById('sum-total');

            if (qtyEl && unitPriceEl) {
                const currency = @json($currency);
                function fmt(n){ return Number(n).toFixed(2); }
                function recalc(){
                    const q = parseInt(qtyEl.value || '{{ $qty }}', 10);
                    const p = parseFloat(unitPriceEl.value || '{{ $unitPrice }}');
                    const sub = p * q;
                    if (sumQty) sumQty.textContent = q;
                    if (sumSub) sumSub.textContent = fmt(sub) + ' ' + currency;
                    if (sumTot) sumTot.textContent = fmt(sub) + ' ' + currency;
                }
                recalc();
            }
        });
    </script>
@endsection