@extends('backend.layouts.master')
@section('title')
    Log Email #{{ $log->id }} - {{ $campaign->title }}
@endsection

@section('content')
    <div class="page-title-box">
        <div class="row align-items-center">
            <div class="col-md-12 d-flex justify-content-between align-items-center">
                <h4 class="page-title">Détail Email envoyé - Campagne : {{ $campaign->title }}</h4>
                <a href="{{ route('backend.campaigns.logs.index', $campaign) }}" class="btn btn-secondary">← Retour aux
                    logs</a>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-body">

                    <table class="table table-bordered">
                        <tr>
                            <th>ID</th>
                            <td>{{ $log->id }}</td>
                        </tr>
                        <tr>
                            <th>Destinataire</th>
                            <td>{{ $log->recipient?->user?->firstname ?? '-' }}</td>
                        </tr>
                        <tr>
                            <th>Email</th>
                            <td>{{ $log->email }}</td>
                        </tr>
                        <tr>
                            <th>Envoyé le</th>
                            <td>{{ $log->sent_at?->format('d/m/Y H:i') ?? '-' }}</td>
                        </tr>
                        <tr>
                            <th>Contexte / Statut</th>
                            <td>{{ $log->context ?? '-' }}</td>
                        </tr>
                        <tr>
                            <th>Contenu envoyé</th>
                            <td>
                                <div class="border p-3 bg-light" style="white-space: pre-wrap;">
                                    {!! $log->content !!}
                                </div>
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    </div>
@endsection