<div class="space-y-6">
    <!-- Header -->
    <div class="flex items-center justify-between">
        <div>
            <h1 class="text-2xl font-semibold text-zinc-900 dark:text-white dark:text-white">Record Stock Movement</h1>
            <p class="mt-1 text-sm text-zinc-500 dark:text-zinc-400 dark:text-gray-400">Manually record inventory adjustments and movements</p>
        </div>
        <flux:button wire:navigate href="{{ route('inventory.stock-movements.index') }}" variant="ghost">
            <flux:icon.arrow-left class="w-4 h-4" />
            Back to Stock Movements
        </flux:button>
    </div>

    <!-- Form -->
    <div class="bg-white dark:bg-zinc-800 rounded-lg border border-zinc-200 dark:border-zinc-700 p-6">
        <form wire:submit="save" class="space-y-6">
            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                <!-- Part Selection -->
                <div class="md:col-span-2">
                    <flux:field>
                        <flux:label>Part*</flux:label>
                        <select wire:model="part_id" class="block w-full rounded-md border-0 py-1.5 text-zinc-900 dark:text-white border border-zinc-200 dark:border-zinc-700 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6 dark:bg-zinc-800 dark:text-white dark:ring-zinc-600">
                            <option value="">Select a part</option>
                            @foreach($parts as $part)
                                <option value="{{ $part->id }}">
                                    {{ $part->name }} ({{ $part->part_number }}) - Current Stock: {{ $part->quantity_on_hand }}
                                </option>
                            @endforeach
                        </select>
                        <flux:error name="part_id" />
                    </flux:field>
                </div>

                <!-- Movement Type -->
                <div>
                    <flux:field>
                        <flux:label>Movement Type*</flux:label>
                        <select wire:model="movement_type" class="block w-full rounded-md border-0 py-1.5 text-zinc-900 dark:text-white border border-zinc-200 dark:border-zinc-700 ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6 dark:bg-zinc-800 dark:text-white dark:ring-zinc-600">
                            <option value="in">Stock In (Add inventory)</option>
                            <option value="out">Stock Out (Remove inventory)</option>
                            <option value="adjustment">Adjustment (Correct inventory)</option>
                        </select>
                        <flux:error name="movement_type" />
                    </flux:field>
                </div>

                <!-- Quantity -->
                <div>
                    <flux:field>
                        <flux:label>Quantity*</flux:label>
                        <flux:input wire:model="quantity" type="number" min="1" placeholder="Enter quantity" />
                        <flux:error name="quantity" />
                    </flux:field>
                </div>

                <!-- Notes -->
                <div class="md:col-span-2">
                    <flux:field>
                        <flux:label>Notes*</flux:label>
                        <flux:textarea wire:model="notes" placeholder="Explain the reason for this stock movement..." rows="4" />
                        <flux:error name="notes" />
                        <flux:description>
                            Please provide a detailed explanation for this stock movement for audit purposes.
                        </flux:description>
                    </flux:field>
                </div>
            </div>

            <!-- Form Actions -->
            <div class="flex items-center justify-end space-x-4 pt-6 border-t border-zinc-200 dark:border-zinc-700">
                <flux:button wire:navigate href="{{ route('inventory.stock-movements.index') }}" variant="ghost">
                    Cancel
                </flux:button>
                <flux:button type="submit" variant="primary">
                    Record Movement
                </flux:button>
            </div>
        </form>
    </div>

    <!-- Current Stock Info -->
    @if($part_id)
        @php
            $selectedPart = $parts->find($part_id);
        @endphp
        @if($selectedPart)
            <div class="bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800 p-4">
                <div class="flex items-center">
                    <flux:icon.information-circle class="w-5 h-5 text-blue-600 dark:text-blue-400 mr-2" />
                    <div>
                        <p class="text-sm font-medium text-blue-900 dark:text-blue-100">
                            Current Stock: {{ number_format($selectedPart->quantity_on_hand) }} units
                        </p>
                        <p class="text-sm text-blue-700 dark:text-blue-300">
                            @if($selectedPart->quantity_on_hand <= $selectedPart->minimum_stock_level)
                                ⚠️ This part is currently at or below minimum stock level ({{ $selectedPart->minimum_stock_level }})
                            @endif
                        </p>
                    </div>
                </div>
            </div>
        @endif
    @endif
</div>
