@extends('layout.app')
@section('title','Rapport déplacement')
@section('page_title',"Détails du déplacement #$deplacement->id")

@section('content')
<div class="d-flex justify-content-between mb-3">
    <a href="{{ route('admin.deplacements.index') }}" class="btn btn-secondary"><i class="fa fa-arrow-left"></i> Retour</a>
    <button onclick="window.print()" class="btn btn-glo-primary"><i class="fa fa-print"></i> Imprimer</button>
</div>

<div class="card shadow-sm border-0 p-4 rounded-4" id="print-area" style="max-width:800px; margin:auto;">
    <div class="text-center mb-4">
        <img src="{{ asset('images/glo-logo.png') }}" style="height:60px;">
        <h4 class="mt-2 text-primary">Rapport de Déplacement</h4>
        <small class="text-muted">#{{ $deplacement->id }}</small>
        <hr>
    </div>

    <table class="table table-borderless">
        <tr><th>Délégué :</th><td>{{ $deplacement->user?->name }}</td></tr>
        <tr><th>Départ :</th><td>{{ $deplacement->from_city }}</td></tr>
        <tr><th>Arrivée :</th><td>{{ $deplacement->to_city }}</td></tr>
        <tr><th>Distance :</th><td>{{ $deplacement->distance_km ?? '—' }} km</td></tr>
        <tr><th>Date départ :</th><td>{{ $deplacement->date_depart->format('d/m/Y H:i') }}</td></tr>
        <tr><th>Statut :</th><td>{{ ucfirst($deplacement->status) }}</td></tr>
    </table>

    <hr>
    <div class="text-end small text-muted">
        Rapport généré le {{ now()->format('d/m/Y H:i') }}
    </div>
</div>

<style>
@media print {
  body * { visibility:hidden; }
  #print-area, #print-area * { visibility:visible; }
  #print-area { position:absolute; left:0; top:0; width:210mm; background:#fff; }
}
</style>
@endsection