@extends('layouts.app')
@section('title', 'Stock Takes')

@section('content')
<div class="space-y-6" x-data="{ ...modal() }">
    <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3">
        <div>
            <h1 class="text-xl font-bold">Stock Takes</h1>
            <p class="text-sm text-ink-muted">Physical counts reconciled against the system's expected quantity — variances post automatically as stock adjustments.</p>
        </div>
        @can('stocktakes.manage')
        <button class="btn-primary btn-sm" x-on:click="$dispatch('open-modal-start')"><i data-lucide="clipboard-list" class="w-3.5 h-3.5"></i> Start stock take</button>
        @endcan
    </div>

    <div class="card overflow-x-auto">
        <table class="data-table">
            <thead><tr><th>Date</th><th>Store</th><th>Started by</th><th>Status</th><th></th></tr></thead>
            <tbody>
                @forelse ($stockTakes as $take)
                    <tr>
                        <td>{{ $take->take_date->format('d M Y') }}</td>
                        <td>{{ $take->store->name }}</td>
                        <td>{{ $take->user->name ?? '—' }}</td>
                        <td><x-badge :color="$take->status === 'completed' ? 'emerald' : 'amber'">{{ ucfirst($take->status) }}</x-badge></td>
                        <td class="text-right"><a href="{{ route('inventory.stock-takes.show', $take) }}" class="btn-ghost btn-sm">Open</a></td>
                    </tr>
                @empty
                    <tr><td colspan="5" class="text-center text-ink-muted py-8">No stock takes yet.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    {{ $stockTakes->links() }}

    <x-modal id="start" title="Start a stock take">
        <form method="POST" action="{{ route('inventory.stock-takes.create') }}" id="start-form" class="space-y-4">
            @csrf
            <div>
                <label class="field-label">Store to count</label>
                <select name="store_id" class="input" required>
                    @foreach ($stores as $store)<option value="{{ $store->id }}">{{ $store->name }}</option>@endforeach
                </select>
            </div>
            <p class="text-xs text-ink-muted">This snapshots every product's current expected quantity in this store, ready for you to enter actual counts.</p>
        </form>
        <x-slot:footer>
            <button class="btn-secondary" x-on:click="open = false">Cancel</button>
            <button form="start-form" class="btn-primary">Start count</button>
        </x-slot:footer>
    </x-modal>
</div>
@endsection