@extends('layouts.app')
@section('title', 'Pharmacy | Receive Products')

@section('content')
{{-- Page header removed per UI cleanup; sidebar already names the page.
     The "+ Receive Products" CTA is the page's primary action, so it
     sits on the first row of the filters card at the top right where
     the user expects to find it without scrolling. --}}

{{-- Filters --}}
<div class="bg-white rounded-xl border shadow-sm mb-4">
    <div class="flex items-center justify-between px-4 pt-4">
        <p class="text-xs font-semibold uppercase tracking-wide text-gray-500">Received Stock</p>
        <a href="{{ route('pharmacy.receipts.create') }}" class="btn-primary text-xs flex items-center gap-1.5">
            <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg>
            Receive Products
        </a>
    </div>
    <div class="p-4 pt-3">
        <form method="GET" class="flex flex-wrap gap-3 items-end">
        <div class="flex-1 min-w-[180px]">
            <label class="form-label">Search</label>
            <input type="text" name="search" value="{{ request('search') }}" placeholder="Search by supplier..." class="form-input">
        </div>
        <div class="w-40">
            <label class="form-label">Status</label>
            <select name="status" class="form-input">
                <option value="">All</option>
                <option value="draft"     {{ request('status') === 'draft'     ? 'selected' : '' }}>Draft</option>
                <option value="completed" {{ request('status') === 'completed' ? 'selected' : '' }}>Completed</option>
            </select>
        </div>
        <div class="w-48">
            <label class="form-label">Supplier</label>
            <select name="supplier_id" class="form-input">
                <option value="">All Suppliers</option>
                @foreach($suppliers as $s)
                <option value="{{ $s->id }}" {{ request('supplier_id') == $s->id ? 'selected' : '' }}>{{ $s->name }}</option>
                @endforeach
            </select>
        </div>
        <button type="submit" class="btn-primary text-xs">Filter</button>
        @if(request()->hasAny(['search','status','supplier_id']))
        <a href="{{ route('pharmacy.receipts.index') }}" class="btn-secondary text-xs">Clear</a>
        @endif
    </form>
    </div>
</div>

{{-- Table --}}
<div class="bg-white rounded-xl border shadow-sm overflow-hidden">
    <table class="w-full">
        <thead>
            <tr class="bg-gray-50 border-b">
                <th class="table-header">Date Received</th>
                <th class="table-header">Supplier</th>
                <th class="table-header text-center">Items</th>
                <th class="table-header text-right">Grand Total</th>
                <th class="table-header">Payment</th>
                <th class="table-header">Received By</th>
                <th class="table-header text-center">Status</th>
                <th class="table-header"></th>
            </tr>
        </thead>
        <tbody class="divide-y divide-gray-50">
            @forelse($receipts as $r)
            <tr class="hover:bg-gray-50 transition-colors">
                <td class="table-cell text-sm">
                    <a href="{{ route('pharmacy.receipts.show', $r->id) }}" class="text-blue-700 hover:underline font-medium">{{ $r->date_received->format('d M Y') }}</a>
                </td>
                <td class="table-cell text-sm font-medium">{{ $r->supplier->name ?? '—' }}</td>
                <td class="table-cell text-center text-sm">{{ $r->items_count }}</td>
                <td class="table-cell text-right text-sm font-semibold">KES {{ number_format($r->grand_total, 2) }}</td>
                <td class="table-cell text-xs capitalize">{{ str_replace('_', ' ', $r->payment_method) }}</td>
                <td class="table-cell text-xs text-gray-500">{{ $r->receivedBy->name ?? '—' }}</td>
                <td class="table-cell text-center">
                    @if($r->status === 'completed')
                        <span class="badge badge-success">Completed</span>
                    @else
                        <span class="badge badge-warning">Draft</span>
                    @endif
                </td>
                <td class="table-cell text-right">
                    <a href="{{ route('pharmacy.receipts.show', $r->id) }}" class="text-blue-600 hover:underline text-xs font-medium mr-3">View</a>
                    @if($r->status === 'draft')
                    <a href="{{ route('pharmacy.receipts.edit', $r->id) }}" class="text-amber-600 hover:underline text-xs font-medium">Edit</a>
                    @endif
                </td>
            </tr>
            @empty
            <tr>
                <td colspan="8" class="table-cell text-center text-gray-400 py-10">
                    No goods received notes found.
                    <a href="{{ route('pharmacy.receipts.create') }}" class="text-blue-600 hover:underline ml-1">Receive your first delivery →</a>
                </td>
            </tr>
            @endforelse
        </tbody>
    </table>

    @if($receipts->hasPages())
    <div class="px-4 py-3 border-t">{{ $receipts->links() }}</div>
    @endif
</div>
@endsection