@extends('../layouts/partials/header')

@section('content')

<div class="container mt-3">
    <br>
    <div class="card shadow-sm">

        <div class="card-header d-flex align-items-center justify-content-between flex-wrap gap-2">
            <span class="fw-bold fs-6">
                <i class="bi bi-file-earmark-text"></i> Carta Porte
                @if($cartaporte->conte)
                    <span class="text-muted">— {{ $cartaporte->conte }}</span>
                @endif
            </span>
            <div class="d-flex gap-2">
                <a href="{{ route('cartaportes.edit', $cartaporte) }}" class="btn btn-warning btn-sm">
                    <i class="bi bi-pencil"></i> Editar
                </a>
                <a href="{{ route('cartaportes.index') }}" class="btn btn-secondary btn-sm">
                    <i class="bi bi-arrow-left"></i> Regresar
                </a>
            </div>
        </div>

        <div class="card-body">

            {{-- Cliente --}}
            <h6 class="text-secondary border-bottom pb-1 mb-3">
                <i class="bi bi-person"></i> Cliente
            </h6>
            <div class="row g-3 mb-4">
                <div class="col-md-4">
                    <p class="mb-0 text-muted small">Cliente</p>
                    @if($cartaporte->cliente_rel)
                        <a href="{{ route('clientes.show', $cartaporte->cliente_rel) }}" class="fw-bold text-decoration-none">
                            {{ $cartaporte->cliente ?? $cartaporte->cliente_rel->razon_social }}
                        </a>
                        <span class="text-muted small d-block">{{ $cartaporte->cliente_rel->rfc }}</span>
                    @else
                        <strong>{{ $cartaporte->cliente ?? '—' }}</strong>
                    @endif
                </div>
                <div class="col-md-8">
                    <p class="mb-0 text-muted small">Domicilio</p>
                    <strong>{{ $cartaporte->cli_domicilio ?? '—' }}</strong>
                </div>
            </div>

            {{-- Datos del Viaje --}}
            <h6 class="text-secondary border-bottom pb-1 mb-3 mt-1">
                <i class="bi bi-map"></i> Datos del Viaje
            </h6>
            <div class="row g-3 mb-4">
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Fecha</p>
                    <strong>{{ $cartaporte->fecha?->format('d/m/Y') ?? '—' }}</strong>
                </div>
                <div class="col-md-3">
                    <p class="mb-0 text-muted small">Origen</p>
                    <strong>{{ $cartaporte->origen ?? '—' }}</strong>
                </div>
                <div class="col-md-3">
                    <p class="mb-0 text-muted small">Destino</p>
                    <strong>{{ $cartaporte->destino ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Recoger en</p>
                    <strong>{{ $cartaporte->recoger ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Entregar en</p>
                    <strong>{{ $cartaporte->entregar ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Cita</p>
                    <strong>{{ $cartaporte->cita ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Custodia</p>
                    <strong>{{ $cartaporte->custodia ?? '—' }}</strong>
                </div>
            </div>

            {{-- Arribo y Salida --}}
            <h6 class="text-secondary border-bottom pb-1 mb-3">
                <i class="bi bi-clock"></i> Arribo y Salida
            </h6>
            <div class="row g-3 mb-4">
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Fecha Arribo</p>
                    <strong>{{ $cartaporte->arribo_fecha?->format('d/m/Y') ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Hora Arribo</p>
                    <strong>{{ $cartaporte->arribo_hora ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Fecha Salida</p>
                    <strong>{{ $cartaporte->salida_fecha?->format('d/m/Y') ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Hora Salida</p>
                    <strong>{{ $cartaporte->salida_hora ?? '—' }}</strong>
                </div>
            </div>

            {{-- Naviera y Buque --}}
            <h6 class="text-secondary border-bottom pb-1 mb-3">
                <i class="bi bi-anchor"></i> Naviera y Buque
            </h6>
            <div class="row g-3 mb-4">
                <div class="col-md-3">
                    <p class="mb-0 text-muted small">Naviera</p>
                    <strong>{{ $cartaporte->naviera ?? '—' }}</strong>
                </div>
                <div class="col-md-4">
                    <p class="mb-0 text-muted small">Buque</p>
                    <strong>{{ $cartaporte->buque ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Viaje</p>
                    <strong>{{ $cartaporte->viaje ?? '—' }}</strong>
                </div>
            </div>


            

            {{-- Operador y Unidad --}}
            <h6 class="text-secondary border-bottom pb-1 mb-3">
                <i class="bi bi-truck"></i> Operador y Unidad
            </h6>
            <div class="row g-3 mb-4">
                <div class="col-md-4">
                    <p class="mb-0 text-muted small">Operador</p>
                    <strong>{{ $cartaporte->operador ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Tel. Operador</p>
                    <strong>{{ $cartaporte->op_tel ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Placas</p>
                    <strong class="text-uppercase">{{ $cartaporte->placas ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Placa Remolque 1</p>
                    <strong class="text-uppercase">{{ $cartaporte->placa_remolque1 ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Placa Remolque 2</p>
                    <strong class="text-uppercase">{{ $cartaporte->placa_remolque2 ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Eco</p>
                    <strong class="text-uppercase">{{ $cartaporte->eco ?? '—' }}</strong>
                </div>
            </div>

            {{-- Observaciones para el operador --}}
            @if($cartaporte->ope_nota)
            <h6 class="text-secondary border-bottom pb-1 mb-3">
                <i class="bi bi-chat-left-text"></i> Observaciones para el Operador
            </h6>
            <div class="row g-3 mb-4">
                <div class="col-md-12">
                    <p class="mb-0" style="white-space: pre-wrap;">{{ $cartaporte->ope_nota }}</p>
                </div>
            </div>
            @endif

            {{-- Contenedor --}}
            <h6 class="text-secondary border-bottom pb-1 mb-3">
                <i class="bi bi-box-seam"></i> Contenedor
            </h6>
            <div class="row g-3 mb-4">
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">No. Contenedor</p>
                    <strong class="text-uppercase">{{ $cartaporte->conte ?? '—' }}</strong>
                </div>
                <div class="col-md-1">
                    <p class="mb-0 text-muted small">Tipo</p>
                    <strong class="text-uppercase">{{ $cartaporte->conte_tipo ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Sello</p>
                    <strong class="text-uppercase">{{ $cartaporte->conte_sello ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">BKG</p>
                    <strong class="text-uppercase">{{ $cartaporte->bkg ?? '—' }}</strong>
                </div>
                <div class="col-md-2">
                    <p class="mb-0 text-muted small">Folio Imprenta</p>
                    <strong class="text-uppercase">{{ $cartaporte->folio_imprenta ?? '—' }}</strong>
                </div>
            </div>

        </div>{{-- /card-body --}}

        <div class="card-footer text-muted small d-flex gap-4 flex-wrap">
            <span>Capturó: <strong>{{ $cartaporte->creadoPor->name ?? '—' }}</strong> el {{ $cartaporte->created_at?->format('d/m/Y H:i') ?? '—' }}</span>
            <span>Modificó: <strong>{{ $cartaporte->modificadoPor->name ?? $cartaporte->creadoPor->name ?? '—' }}</strong> el {{ $cartaporte->updated_at?->format('d/m/Y H:i') ?? '—' }}</span>
        </div>

    </div>{{-- /card --}}
</div>

@endsection
@extends('../layouts/partials/footer')