@extends('layouts.app')

@section('title', 'BL #'.optional($bill)->bl_number)

@section('breadcrumbs')
<nav aria-label="breadcrumb">
    <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="{{ route('export.dashboard') }}">Export</a></li>
        <li class="breadcrumb-item"><a href="{{ route('export.bills-of-lading.index') }}">Bills of Lading</a></li>
        <li class="breadcrumb-item active">{{ $bill->bl_number }}</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">{{ $bill->bl_number }}</h1><p class="text-muted mb-0">Bill of Lading</p></div>
    <div class="d-flex gap-2">
        <a href="{{ route('export.bills-of-lading.edit', $bill) }}" class="btn btn-outline-primary"><i class="bi bi-pencil me-1"></i> Edit</a>
        <button class="btn btn-outline-secondary" onclick="window.print()"><i class="bi bi-printer me-1"></i> Print</button>
    </div>
</div>

<div class="card border-0 shadow-sm mb-4">
    <div class="card-body p-4">
        <div class="text-center mb-4">
            <h4 class="fw-bold text-primary mb-0">BILL OF LADING</h4>
            <div class="fw-semibold">{{ $bill->bl_number ?? 'Draft' }}</div>
        </div>

        <div class="row g-4 mb-4">
            <div class="col-md-6"><h6 class="text-muted">Shipper</h6><div class="fw-medium">{{ $bill->shipper->name ?? 'N/A' }}</div><div class="text-muted small">{{ $bill->shipper_address ?? '' }}</div></div>
            <div class="col-md-6 text-end"><h6 class="text-muted">BL Type</h6><div>{{ ucfirst(str_replace('_', ' ', $bill->bl_type ?? '')) }}</div></div>
            <div class="col-md-6"><h6 class="text-muted">Consignee</h6><div class="fw-medium">{{ $bill->consignee->name ?? 'N/A' }}</div><div class="text-muted small">{{ $bill->consignee_address ?? '' }}</div></div>
            <div class="col-md-6"><h6 class="text-muted">Notify Party</h6><div class="fw-medium">{{ $bill->notifyParty->name ?? 'Same as Consignee' }}</div></div>
        </div>

        <div class="row g-4 mb-4 pb-4 border-bottom">
            <div class="col-md-3"><h6 class="text-muted small mb-0">Vessel</h6><div class="fw-medium">{{ $bill->vessel_name ?? 'TBD' }}</div></div>
            <div class="col-md-3"><h6 class="text-muted small mb-0">Voyage</h6><div>{{ $bill->voyage_number ?? '' }}</div></div>
            <div class="col-md-3"><h6 class="text-muted small mb-0">Port of Loading</h6><div>{{ $bill->portOfLoading->name ?? 'N/A' }}</div></div>
            <div class="col-md-3"><h6 class="text-muted small mb-0">Port of Discharge</h6><div>{{ $bill->portOfDischarge->name ?? 'N/A' }}</div></div>
        </div>

        <div class="mb-4">
            <h6 class="text-muted mb-2">Description of Goods</h6>
            <div class="bg-light rounded p-3">{{ $bill->cargo_description ?? 'N/A' }}</div>
        </div>

        <div class="row g-4">
            <div class="col-md-3"><h6 class="text-muted small">Gross Weight</h6><div class="fw-medium">{{ number_format($bill->gross_weight ?? 0, 3) }} MT</div></div>
            <div class="col-md-3"><h6 class="text-muted small">Volume</h6><div>{{ number_format($bill->volume ?? 0, 3) }} CBM</div></div>
            <div class="col-md-3"><h6 class="text-muted small">Packages</h6><div>{{ $bill->no_of_packages ?? 0 }}</div></div>
            <div class="col-md-3"><h6 class="text-muted small">Freight</h6><div class="fw-medium">{{ ucfirst($bill->freight_terms ?? 'prepaid') }}</div></div>
        </div>
    </div>
</div>
@endsection