@extends('layouts.app')
@section('page-title', 'Voucher Products')
@section('content')
    <div class="page-header">
        <h2>Voucher Products</h2>
        <a href="{{ route('vouchers.create') }}" class="btn btn-primary">+ Add Voucher</a>
    </div>
    @if($products->isEmpty())
        <div class="card empty">No voucher products yet. <a href="{{ route('vouchers.create') }}">Add the first →</a></div>
    @else
        <div class="table-wrap">
            <table>
                <thead><tr><th>Name</th><th>Category</th><th>SKU</th><th style="text-align:right">Cost</th><th style="text-align:right">Selling</th><th style="text-align:right">Stock</th><th>Status</th><th></th></tr></thead>
                <tbody>
                @foreach($products as $p)
                    <tr>
                        <td><strong>{{ $p->name }}</strong></td>
                        <td>{{ $p->category ?? '—' }}</td>
                        <td>{{ $p->sku ?? '—' }}</td>
                        <td style="text-align:right">{{ $p->currency }} {{ number_format($p->cost_price, 2) }}</td>
                        <td style="text-align:right">{{ $p->currency }} {{ number_format($p->selling_price, 2) }}</td>
                        <td style="text-align:right; font-weight:600">{{ $p->stock }}</td>
                        <td><span class="badge {{ $p->is_active ? 'badge-active' : 'badge-inactive' }}">{{ $p->is_active ? 'Active' : 'Inactive' }}</span></td>
                        <td style="text-align:right; white-space:nowrap;">
                            <a href="{{ route('vouchers.edit', $p) }}" class="btn btn-sm">Edit</a>
                            <form method="POST" action="{{ route('vouchers.destroy', $p) }}" style="display:inline" onsubmit="return confirm('Delete this voucher product?')">
                                @csrf @method('DELETE')
                                <button class="btn btn-sm btn-danger" type="submit">Delete</button>
                            </form>
                        </td>
                    </tr>
                @endforeach
                </tbody>
            </table>
        </div>
    @endif
@endsection