@extends('layouts.app')

@section('content')
<div class="container-fluid px-4 py-4" style="background-color: #f8fafc; min-height: 100vh;">

    <div class="d-flex justify-content-between align-items-center mb-4 flex-wrap gap-2">
        <div>
            <div class="d-flex align-items-center gap-2 mb-1">
                <i class="bi bi-boxes text-indigo-600 fs-4" style="color: #4f46e5;"></i>
                <h4 class="fw-bold text-dark mb-0">Stock Transfer Matrix</h4>
            </div>
            <p class="text-muted small mb-0">Monitor live transit logistics challans allocated from central warehouse
                distribution cells.</p>
        </div>
        <a href="{{ route('admin.inventory.create') }}" class="btn btn-primary px-4 shadow-sm"
            style="background-color: #4f46e5; border: none; border-radius: 10px;">
            <i class="bi bi-plus-lg me-1"></i> Request New Allocation
        </a>
    </div>

    @if(session('success'))
    <div class="alert alert-success border-0 shadow-sm rounded-3 mb-4 d-flex align-items-center">
        <i class="bi bi-check-circle-fill me-2 text-success"></i>
        <div>{{ session('success') }}</div>
    </div>
    @endif

    @if(session('error'))
    <div class="alert alert-danger border-0 shadow-sm rounded-3 mb-4 d-flex align-items-center">
        <i class="bi bi-exclamation-triangle-fill me-2 text-danger"></i>
        <div>{{ session('error') }}</div>
    </div>
    @endif

    <div class="card border-0 shadow-sm rounded-4 bg-white">
        <div class="card-header bg-white border-bottom py-3 px-4">
            <h6 class="mb-0 fw-bold text-dark"><i class="bi bi-journal-text me-2 text-indigo-600"
                    style="color: #4f46e5;"></i>Active Transfer Challans Register</h6>
        </div>
        <div class="table-responsive">
            <table class="table table-hover align-middle mb-0 bg-white">
                <thead class="table-light text-uppercase small fw-bold text-secondary" style="font-size: 11px;">
                    <tr>
                        <th class="py-3 ps-4">Challan Token</th>
                        <th class="py-3">Allocated Product Item</th>
                        <th class="py-3">Destination Terminal Counter</th>
                        <th class="py-3 text-center">Qty Sent</th>
                        <th class="py-3 text-center">Qty Received</th>
                        <th class="py-3 text-center">Workflow Status</th>
                        <th class="py-3 text-center" style="width: 200px;">Actions Matrix</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($transfers as $transfer)
                    <tr>
                        <td class="py-3 ps-4 font-monospace fw-bold text-indigo-600"
                            style="color: #4f46e5; font-size: 0.85rem;">
                            {{ $transfer->transfer_challan_no }}
                        </td>
                        <td class="fw-bold text-dark" style="font-size: 0.88rem;">
                            {{ $transfer->product->name ?? 'N/A' }}
                        </td>
                        <td>
                            <span class="fw-bold text-dark d-block" style="font-size: 0.85rem;">
                                {{ $transfer->exhibition->name ?? 'Main Warehouse Terminal' }}
                            </span>
                            <small class="text-muted" style="font-size: 11px;">
                                📍 {{ $transfer->exhibition->venue ?? 'On-Site' }}, {{ $transfer->exhibition->city ?? ''
                                }}
                            </small>
                        </td>
                        <td class="text-center font-monospace fw-bold text-dark">{{ $transfer->quantity_sent }} pcs</td>
                        <td class="text-center font-monospace fw-bold text-secondary">{{ $transfer->status ===
                            'received' ? $transfer->quantity_received . ' pcs' : '--' }}</td>
                        <td class="text-center">
                            @if($transfer->status === 'pending')
                            <span class="badge px-2.5 py-1 border text-primary"
                                style="background-color: #eff6ff; border-color: #bfdbfe !important; font-size: 10px;">Awaiting
                                Approval</span>
                            @elseif($transfer->status === 'dispatched')
                            <span class="badge px-2.5 py-1 border text-warning"
                                style="background-color: #fffbeb; border-color: #fef3c7 !important; font-size: 10px;">In
                                Transit Loop</span>
                            @elseif($transfer->status === 'received')
                            <span class="badge px-2.5 py-1 border text-success"
                                style="background-color: #f0fdf4; border-color: #bbf7d0 !important; font-size: 10px;">Received
                                & Settled</span>
                            @else
                            <span class="badge px-2.5 py-1 border text-danger"
                                style="background-color: #fef2f2; border-color: #fecaca !important; font-size: 10px;">Request
                                Rejected</span>
                            @endif
                        </td>
                        <td class="text-center pe-4">
                            @if($transfer->status === 'pending')
                            <div class="d-flex gap-1 justify-content-center">
                                <form action="{{ route('admin.inventory.approve', $transfer->id) }}" method="POST"
                                    class="d-inline m-0">
                                    @csrf
                                    <button type="submit"
                                        class="btn btn-xs btn-success text-white fw-bold px-2 py-1 shadow-sm rounded-3"
                                        style="font-size: 0.72rem;">
                                        <i class="bi bi-check-lg"></i> Approve
                                    </button>
                                </form>
                                <form action="{{ route('admin.inventory.reject', $transfer->id) }}" method="POST"
                                    class="d-inline m-0">
                                    @csrf
                                    <button type="submit"
                                        class="btn btn-xs btn-outline-danger fw-bold px-2 py-1 rounded-3"
                                        style="font-size: 0.72rem;"
                                        onclick="return confirm('Reject this challan sequence?')">
                                        <i class="bi bi-x-lg"></i> Reject
                                    </button>
                                </form>
                            </div>
                            @else
                            <span class="text-muted small font-monospace" style="font-size: 11px;">
                                Logs Locked <i class="bi bi-lock-fill"></i>
                            </span>
                            @endif
                        </td>
                    </tr>
                    @empty
                    <tr>
                        <td colspan="7" class="text-center py-5 text-muted">
                            <i class="bi bi-box-seam d-block mb-2 fs-3 text-secondary"></i> No stock inventory transfers
                            routed through this station pool yet.
                        </td>
                    </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>

</div>
@endsection