@extends('layouts.app')

@section('content')
<div class="px-4 py-8 mx-auto sm:px-6 lg:px-8">

    {{-- Breadcrumb --}}
    <nav class="flex pb-4 mb-6 border-b border-stone-200" aria-label="Breadcrumb">
        <ol role="list" class="flex items-center space-x-4 text-sm uppercase">
            <li>
                <a href="{{ route('dashboard') }}" class="text-stone-400 hover:text-stone-500">
                    <svg class="w-5 h-5" viewBox="0 0 20 20" fill="currentColor">
                        <path fill-rule="evenodd"
                            d="M9.293 2.293a1 1 0 011.414 0l7 7A1 1 0 0117 11h-1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-3a1 1 0 00-1-1H9a1 1 0 00-1 1v3a1 1 0 01-1 1H5a1 1 0 01-1-1v-6H3a1 1 0 01-.707-1.707l7-7z"
                            clip-rule="evenodd" />
                    </svg>
                </a>
            </li>
            <li>
                <div class="flex items-center">
                    <svg class="w-5 h-5 text-stone-300" fill="currentColor" viewBox="0 0 20 20">
                        <path d="M5.555 17.776l8-16 .894.448-8 16-.894-.448z" />
                    </svg>
                    <a href="{{ route('companies.show', $invoice->company->slug) }}"
                        class="ml-4 text-stone-500 hover:text-stone-700">
                        {{ $invoice->company->name }}
                    </a>
                </div>
            </li>
            <li>
                <div class="flex items-center">
                    <svg class="w-5 h-5 text-stone-300" fill="currentColor" viewBox="0 0 20 20">
                        <path d="M5.555 17.776l8-16 .894.448-8 16-.894-.448z" />
                    </svg>
                    <a href="{{ route('invoices.show', $invoice->id) }}"
                        class="ml-4 text-stone-500 hover:text-stone-700">
                        Fatura #{{ $invoice->number }}
                    </a>
                </div>
            </li>
            <li>
                <div class="flex items-center">
                    <svg class="w-5 h-5 text-stone-300" fill="currentColor" viewBox="0 0 20 20">
                        <path d="M5.555 17.776l8-16 .894.448-8 16-.894-.448z" />
                    </svg>
                    <span class="ml-4 font-medium text-stone-700">Stok Dağıtımı</span>
                </div>
            </li>
        </ol>
    </nav>

    {{-- Sayfa Başlığı --}}
    <div class="mb-8">
        <h1 class="text-3xl font-bold text-stone-900">Stok Dağıtımı -> Posmanager</h1>
        <p class="mt-2 text-stone-600">
            <strong>{{ $invoice->company->name }}</strong> için <strong>#{{ $invoice->number }}</strong>
            numaralı faturadan stok dağıtımı yapın.
        </p>
    </div>

    {{-- Livewire Component --}}
    <livewire:stock-allocation-form :invoiceId="$invoice->id" />

</div>
@endsection