@extends('layouts.app')
@section('title', 'Air Booking #'.optional($booking)->awb_number)
@section('breadcrumbs')
<nav aria-label="breadcrumb"><ol class="breadcrumb"><li class="breadcrumb-item"><a href="{{ route('freight.air.index') }}">Air Freight</a></li><li class="breadcrumb-item active">{{ $booking->awb_number ?? 'Details' }}</li></ol></nav>
@endsection
@section('content')
<div class="d-flex justify-content-between align-items-center mb-4">
    <div><h1 class="h3 mb-1 text-dark fw-semibold">{{ $booking->awb_number ?? 'N/A' }}</h1><p class="text-muted mb-0">{{ $booking->airline->name ?? '' }} | {{ $booking->origin_port->code ?? '' }} → {{ $booking->destination_port->code ?? '' }}</p></div>
    <div class="d-flex gap-2"><a href="{{ route('freight.air.index') }}" class="btn btn-outline-secondary"><i class="bi bi-arrow-left me-1"></i>Back</a><button class="btn btn-outline-secondary" onclick="window.print()"><i class="bi bi-printer me-1"></i>Print</button></div>
</div>
<x-status-timeline :steps="[['status'=>'draft','label'=>'Draft','icon'=>'bi-pencil'],['status'=>'confirmed','label'=>'Confirmed','icon'=>'bi-check-circle'],['status'=>'in_transit','label'=>'In Transit','icon'=>'bi-airplane'],['status'=>'arrived','label'=>'Arrived','icon'=>'bi-geo-alt'],['status'=>'completed','label'=>'Delivered','icon'=>'bi-check-circle-fill']]" :current="$booking->status ?? 'draft'" />
<div class="card border-0 shadow-sm mb-4">
    <div class="card-header bg-white border-0 py-3"><ul class="nav nav-tabs card-header-tabs" role="tablist"><li class="nav-item"><a class="nav-link active" data-bs-toggle="tab" href="#overview">Overview</a></li><li class="nav-item"><a class="nav-link" data-bs-toggle="tab" href="#tracking">Tracking</a></li><li class="nav-item"><a class="nav-link" data-bs-toggle="tab" href="#documents">Documents</a></li></ul></div>
    <div class="card-body">
        <div class="tab-content">
            <div class="tab-pane fade show active" id="overview">
                <div class="row g-4">
                    <div class="col-md-4"><h6 class="fw-semibold text-muted mb-2">Booking Info</h6><table class="table table-sm table-borderless"><tr><td class="text-muted" style="width:45%">AWB #</td><td class="fw-medium">{{ $booking->awb_number ?? 'N/A' }}</td></tr><tr><td class="text-muted">Airline</td><td>{{ $booking->airline->name ?? 'N/A' }}</td></tr><tr><td class="text-muted">Date</td><td>{{ optional($booking->booking_date)->format('d M Y') ?? 'N/A' }}</td></tr><tr><td class="text-muted">Status</td><td><x-status-badge :status="$booking->status ?? 'draft'" /></td></tr></table></div>
                    <div class="col-md-4"><h6 class="fw-semibold text-muted mb-2">Route</h6><table class="table table-sm table-borderless"><tr><td class="text-muted" style="width:45%">Origin</td><td>{{ $booking->origin_port->name ?? 'N/A' }}</td></tr><tr><td class="text-muted">Destination</td><td>{{ $booking->destination_port->name ?? 'N/A' }}</td></tr><tr><td class="text-muted">ETD</td><td>{{ optional($booking->etd)->format('d M Y H:i') ?? 'TBD' }}</td></tr><tr><td class="text-muted">ETA</td><td>{{ optional($booking->eta)->format('d M Y H:i') ?? 'TBD' }}</td></tr></table></div>
                    <div class="col-md-4"><h6 class="fw-semibold text-muted mb-2">Cargo</h6><table class="table table-sm table-borderless"><tr><td class="text-muted" style="width:45%">Commodity</td><td>{{ $booking->commodity ?? 'N/A' }}</td></tr><tr><td class="text-muted">Pieces</td><td>{{ $booking->piece_count ?? 0 }}</td></tr><tr><td class="text-muted">Gross Weight</td><td>{{ number_format($booking->gross_weight ?? 0, 2) }} KGS</td></tr><tr><td class="text-muted">Chargable Weight</td><td>{{ number_format($booking->chargeable_weight ?? 0, 2) }} KGS</td></tr></table></div>
                </div>
            </div>
            <div class="tab-pane fade" id="tracking"><div class="text-center py-5 text-muted"><i class="bi bi-airplane display-4 d-block mb-2"></i><p>Flight tracking information will appear here</p></div></div>
            <div class="tab-pane fade" id="documents"><div class="row g-3">@foreach(['Air Waybill', 'Cargo Insurance', 'Shipper Letter of Instructions'] as $doc)<div class="col-md-4"><div class="card border h-100"><div class="card-body d-flex justify-content-between align-items-center"><div><i class="bi bi-file-earmark-text text-muted me-2"></i><span class="fw-medium">{{ $doc }}</span></div><a href="#" class="btn btn-sm btn-outline-primary"><i class="bi bi-eye"></i></a></div></div></div>@endforeach</div></div>
        </div>
    </div>
</div>
@endsection