@extends('layouts.pwa')

@section('title', 'Salidas')

@section('content')

@if(session('error'))
    <div class="alert alert-danger">{{ session('error') }}</div>
@endif

@if(session('success'))
    <div class="alert alert-success">✔ {{ session('success') }}</div>
@endif

<form method="GET" class="mb-3">
    <input type="text"
           name="buscar"
           value="{{ request('buscar') }}"
           class="form-control form-control-lg text-uppercase"
           placeholder="Buscar contenedor..."
           autofocus
           oninput="this.value = this.value.toUpperCase()">
</form>

@forelse($contenedores as $c)
    <div class="card border-0 shadow-sm rounded-4 mb-2">
        <div class="card-body">
            <div class="d-flex justify-content-between align-items-center">
                <div>
                    <strong>{{ $c->contenedor }}</strong><br>
                    <small class="text-muted">{{ $c->naviera ?: 'Sin naviera' }}</small><br>
                    <small class="text-muted">{{ $c->cliente ?: 'Sin cliente' }}</small>
                </div>

                <a href="{{ route('pwa.salidas.create', $c) }}"
                   class="btn btn-danger btn-sm rounded-4">
                    📤 Salida
                </a>
            </div>
        </div>
    </div>
@empty
    <div class="alert alert-light text-center">
        No hay contenedores disponibles para salida.
    </div>
@endforelse

<div class="mt-3">
    {{ $contenedores->links() }}
</div>

<a href="{{ route('pwa.dashboard') }}" class="btn btn-light btn-lg w-100 mt-3 rounded-4">
    Volver
</a>

@endsection