{{-- resources/views/reservation_auberge/receipt.blade.php --}}
@extends('layouts.app')

@section('styles')
<style>
    /* Styles spécifiques pour la page du reçu */
    .receipt-page {
        background: #f8f9fa;
        min-height: 100vh;
        padding: 30px 0;
    }

    .receipt-container {
        background: white;
        border-radius: 12px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.1);
        max-width: 1000px;
        margin: 0 auto;
        padding: 40px;
        position: relative;
        overflow: hidden;
    }

    /* En-tête officiel */
    .official-header {
        background: linear-gradient(135deg, #2c3e50 0%, #1a2530 100%);
        color: white;
        padding: 25px;
        text-align: center;
        border-radius: 10px;
        margin-bottom: 30px;
        position: relative;
        overflow: hidden;
    }

    .official-header::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        background: linear-gradient(90deg, #bb2323, #ffd700, #bb2323);
    }

    .republic-title {
        font-size: 1.8rem;
        font-weight: 700;
        color: #ffd700;
        margin-bottom: 5px;
        letter-spacing: 1px;
    }

    .ministry-title {
        font-size: 1.4rem;
        margin-bottom: 5px;
        opacity: 0.95;
    }

    .department-title {
        font-size: 1.1rem;
        opacity: 0.85;
    }

    /* Titre principal */
    .main-title-section {
        text-align: center;
        padding: 20px 0;
        margin-bottom: 30px;
        background: linear-gradient(to right, rgba(187, 35, 35, 0.1), rgba(255, 215, 0, 0.1));
        border-radius: 8px;
    }

    .receipt-main-title {
        color: #2c3e50;
        font-weight: 700;
        font-size: 2.2rem;
        margin-bottom: 10px;
    }

    .receipt-subtitle {
        color: #666;
        font-size: 1.2rem;
    }

    /* Informations principales */
    .info-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: 20px;
        margin-bottom: 30px;
    }

    .info-card {
        background: #f8f9fa;
        border: 1px solid #e9ecef;
        border-radius: 8px;
        padding: 20px;
        position: relative;
        transition: all 0.3s ease;
    }

    .info-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    }

    .info-card-title {
        color: #bb2323;
        font-weight: 600;
        margin-bottom: 15px;
        padding-bottom: 10px;
        border-bottom: 2px solid #e9ecef;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .info-item {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 8px 0;
        border-bottom: 1px dashed #dee2e6;
    }

    .info-item:last-child {
        border-bottom: none;
    }

    .info-label {
        font-weight: 600;
        color: #555;
    }

    .info-value {
        font-weight: 500;
        color: #2c3e50;
        text-align: right;
    }

    /* Période de séjour */
    .period-section {
        background: #f8f9fa;
        border-radius: 8px;
        padding: 25px;
        margin-bottom: 30px;
        border: 1px solid #e9ecef;
    }

    .period-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
        text-align: center;
    }

    @media (max-width: 768px) {
        .period-grid {
            grid-template-columns: 1fr;
        }
    }

    .period-box {
        padding: 20px;
        background: white;
        border-radius: 8px;
        border: 2px solid #e9ecef;
        transition: all 0.3s ease;
    }

    .period-box:hover {
        border-color: #bb2323;
    }

    .period-label {
        color: #666;
        font-size: 0.9rem;
        margin-bottom: 8px;
    }

    .period-value {
        font-size: 1.4rem;
        font-weight: 700;
        color: #bb2323;
    }

    /* Table des personnes */
    .persons-table-container {
        margin-bottom: 30px;
    }

    .table-title {
        color: #2c3e50;
        font-weight: 600;
        margin-bottom: 15px;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .table-custom {
        border: 1px solid #e9ecef;
        border-radius: 8px;
        overflow: hidden;
    }

    .table-custom thead {
        background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    }

    .table-custom th {
        color: #2c3e50;
        font-weight: 600;
        border: none;
        padding: 15px;
    }

    .table-custom td {
        padding: 12px 15px;
        vertical-align: middle;
    }

    /* Services */
    .services-section {
        margin-bottom: 30px;
    }

    .services-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 15px;
    }

    .service-item {
        background: white;
        border: 1px solid #e9ecef;
        border-radius: 8px;
        padding: 15px;
        border-left: 4px solid #bb2323;
        transition: all 0.3s ease;
    }

    .service-item:hover {
        transform: translateX(5px);
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    }

    .service-name {
        font-weight: 600;
        color: #2c3e50;
        margin-bottom: 5px;
    }

    .service-desc {
        color: #666;
        font-size: 0.9rem;
        margin-bottom: 5px;
    }

    .service-price {
        font-weight: 600;
        color: #bb2323;
    }

    /* Résumé financier */
    .summary-section {
        background: #f8f9fa;
        border-radius: 8px;
        padding: 25px;
        margin-bottom: 30px;
        border: 1px solid #e9ecef;
    }

    .summary-grid {
        display: grid;
        grid-template-columns: 2fr 1fr;
        gap: 30px;
    }

    @media (max-width: 768px) {
        .summary-grid {
            grid-template-columns: 1fr;
        }
    }

    .summary-list {
        padding-right: 20px;
    }

    .summary-item {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px 0;
        border-bottom: 1px solid #e9ecef;
    }

    .summary-item:last-child {
        border-bottom: none;
    }

    .summary-label {
        color: #555;
    }

    .summary-value {
        font-weight: 600;
        color: #2c3e50;
    }

    .total-box {
        background: linear-gradient(135deg, #bb2323 0%, #8b0000 100%);
        color: white;
        padding: 25px;
        border-radius: 8px;
        text-align: center;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .total-label {
        font-size: 1.1rem;
        opacity: 0.9;
        margin-bottom: 10px;
    }

    .total-amount {
        font-size: 2.5rem;
        font-weight: 700;
        margin-bottom: 5px;
    }

    .total-currency {
        font-size: 1rem;
        opacity: 0.8;
    }

    /* Section officielle */
    .official-signature {
        background: #f5f5f5;
        border-radius: 8px;
        padding: 30px;
        margin-bottom: 30px;
        border: 1px dashed #ccc;
    }

    .signature-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 30px;
        text-align: center;
    }

    @media (max-width: 768px) {
        .signature-grid {
            grid-template-columns: 1fr;
        }
    }

    .stamp-box {
        padding: 20px;
        border: 2px dashed #bb2323;
        border-radius: 50%;
        display: inline-block;
        color: #bb2323;
    }

    .stamp-icon {
        font-size: 2.5rem;
        margin-bottom: 10px;
    }

    .stamp-text {
        font-weight: 600;
    }

    .signature-box {
        padding: 20px;
    }

    .signature-line {
        width: 200px;
        height: 1px;
        background: #333;
        margin: 20px auto;
    }

    .signature-text {
        color: #666;
        margin-bottom: 10px;
    }

    .director-name {
        font-weight: 600;
        color: #2c3e50;
    }

    /* Pied de page */
    .receipt-footer {
        text-align: center;
        padding-top: 20px;
        border-top: 1px solid #e9ecef;
        color: #666;
        font-size: 0.9rem;
    }

    /* Boutons d'action */
    .action-buttons {
        display: flex;
        justify-content: center;
        gap: 15px;
        margin-top: 30px;
        flex-wrap: wrap;
    }

    .btn-print, .btn-download, .btn-back {
        min-width: 150px;
        padding: 12px 25px;
        font-weight: 600;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        transition: all 0.3s ease;
    }

    .btn-print:hover {
        transform: translateY(-2px);
        box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    }

    .btn-download:hover {
        transform: translateY(-2px);
        box-shadow: 0 5px 15px rgba(0,123,255,0.2);
    }

    /* Styles d'impression */
    @media print {
        .receipt-page {
            padding: 0;
            background: white;
        }

        .receipt-container {
            box-shadow: none;
            border: none;
            padding: 20px;
            max-width: none;
        }

        .action-buttons,
        .breadcrumb-nav {
            display: none !important;
        }

        .official-header {
            -webkit-print-color-adjust: exact;
            print-color-adjust: exact;
        }

        .total-box {
            -webkit-print-color-adjust: exact;
            print-color-adjust: exact;
        }

        .info-card:hover,
        .period-box:hover,
        .service-item:hover {
            transform: none !important;
            box-shadow: none !important;
        }
    }
</style>
@endsection

@section('content')
@php
    // Fonction de secours si trans_field n'existe pas
    if (!function_exists('trans_field')) {
        function trans_field($object, $fieldName, $default = null) {
            if (!$object) {
                return $default ?? 'N/A';
            }
            
            // Si c'est un tableau, le convertir en objet
            if (is_array($object)) {
                $object = (object) $object;
            }
            
            // Si ce n'est pas un objet, retourner la valeur telle quelle
            if (!is_object($object)) {
                return $object;
            }

            $locale = app()->getLocale();
            
            // Essayer d'abord le champ spécifique à la langue
            $localizedField = $fieldName . '_' . $locale;
            if (isset($object->{$localizedField}) && !empty($object->{$localizedField})) {
                return $object->{$localizedField};
            }

            // Essayer le champ par défaut
            if (isset($object->{$fieldName}) && !empty($object->{$fieldName})) {
                return $object->{$fieldName};
            }

            // Essayer les autres langues
            $otherLanguages = ['fr', 'ar', 'en'];
            foreach ($otherLanguages as $lang) {
                $otherField = $fieldName . '_' . $lang;
                if (isset($object->{$otherField}) && !empty($object->{$otherField})) {
                    return $object->{$otherField};
                }
            }

            return $default ?? 'N/A';
        }
    }

    // Fonction safe pour afficher les valeurs
    function safe_value($value, $default = 'N/A') {
        if (is_array($value)) {
            return json_encode($value);
        }
        if (is_object($value) && method_exists($value, '__toString')) {
            return $value->__toString();
        }
        if (is_object($value)) {
            return json_encode($value);
        }
        if (empty($value) && $value !== 0 && $value !== '0') {
            return $default;
        }
        return $value;
    }
@endphp

<div class="receipt-page">
    <div class="container">
        <!-- Fil d'Ariane -->
        <nav class="breadcrumb-nav mb-4" aria-label="breadcrumb">
            <ol class="breadcrumb mb-0">
                <li class="breadcrumb-item">
                    <a href="{{ route('dashboard') }}">
                        <i class="bi bi-house-fill"></i>
                        <span>{{ __('site.reservation.breadcrumb_home') }}</span>
                    </a>
                </li>
                <li class="breadcrumb-item">
                    <a href="{{ route('reservation.index') }}">
                        <span>{{ __('site.reservation.reservation_index') }}</span>
                    </a>
                </li>
                <li class="breadcrumb-item active" aria-current="page">{{ __('site.reservation.receipt_title') }}</li>
            </ol>
        </nav>

        <!-- Conteneur principal du reçu -->
        <div class="receipt-container" id="receiptContent">
            <!-- En-tête officiel -->
            <div class="official-header">
                <h1 class="republic-title">{{ __('site.reservation.republic') }}</h1>
                <h2 class="ministry-title">{{ __('site.reservation.ministry') }}</h2>
                <h3 class="department-title">{{ __('site.reservation.department') }}</h3>
            </div>

            <!-- Titre principal -->
            <div class="main-title-section">
                <h1 class="receipt-main-title">
                    <i class="bi bi-file-earmark-text"></i>
                    {{ __('site.reservation.official_receipt') }}
                </h1>
                <p class="receipt-subtitle">{{ __('site.reservation.accommodation_reservation') }}</p>
                <p class="text-muted mb-0">
                    {{ __('site.reservation.issued_on') }}: {{ date('d/m/Y') }} | 
                    {{ __('site.reservation.receipt_number') }}: {{ safe_value($reservation->id_reserv ?? '') }}
                </p>
            </div>

            <!-- Informations principales -->
            <div class="info-grid">
                <!-- Auberge -->
                <div class="info-card">
                    <h3 class="info-card-title">
                        <i class="bi bi-building"></i>
                        {{ __('site.reservation.institution_info') }}
                    </h3>
                    <div class="info-item">
                        <span class="info-label">{{ __('site.reservation.auberge_name') }}:</span>
                        <span class="info-value">{{ trans_field($reservation->auberge ?? null, 'nom', 'N/A') }}</span>
                    </div>
                    <div class="info-item">
                        <span class="info-label">{{ __('site.reservation.reservation_id') }}:</span>
                        <span class="info-value badge bg-primary">{{ safe_value($reservation->id_reserv ?? '') }}</span>
                    </div>
                    <div class="info-item">
                        <span class="info-label">{{ __('site.reservation.reservation_date') }}:</span>
                        <span class="info-value">{{ $reservation->date_reserv ? \Carbon\Carbon::parse($reservation->date_reserv)->format('d/m/Y') : 'N/A' }}</span>
                    </div>
                </div>

                <!-- Client -->
                <div class="info-card">
                    <h3 class="info-card-title">
                        <i class="bi bi-person-badge"></i>
                        {{ __('site.reservation.client_info') }}
                    </h3>
                    <div class="info-item">
                        <span class="info-label">{{ __('site.reservation.client_name') }}:</span>
                        <span class="info-value">{{ safe_value($reservation->nom_prenom ?? '') }}</span>
                    </div>
                    <div class="info-item">
                        <span class="info-label">{{ __('site.reservation.client_email') }}:</span>
                        <span class="info-value">{{ safe_value($reservation->email ?? '') }}</span>
                    </div>
                    <div class="info-item">
                        <span class="info-label">{{ __('site.reservation.client_phone') }}:</span>
                        <span class="info-value">{{ safe_value($reservation->telephone ?? '') }}</span>
                    </div>
                </div>
            </div>

            <!-- Période de séjour -->
            <div class="period-section">
                <h3 class="info-card-title mb-4">
                    <i class="bi bi-calendar-range"></i>
                    {{ __('site.reservation.stay_period') }}
                </h3>
                <div class="period-grid">
                    <div class="period-box">
                        <div class="period-label">{{ __('site.reservation.arrival_date') }}</div>
                        <div class="period-value">{{ $reservation->date_arrive ? \Carbon\Carbon::parse($reservation->date_arrive)->format('d/m/Y') : 'N/A' }}</div>
                    </div>
                    <div class="period-box">
                        <div class="period-label">{{ __('site.reservation.departure_date') }}</div>
                        <div class="period-value">{{ $reservation->date_depart ? \Carbon\Carbon::parse($reservation->date_depart)->format('d/m/Y') : 'N/A' }}</div>
                    </div>
                    <div class="period-box">
                        <div class="period-label">{{ __('site.reservation.duration') }}</div>
                        <div class="period-value">{{ $nbrNuits ?? 0 }} {{ __('site.reservation.nights') }}</div>
                    </div>
                </div>
            </div>

            <!-- Détails des personnes -->
            <div class="persons-table-container">
                <h3 class="table-title">
                    <i class="bi bi-people-fill"></i>
                    {{ __('site.reservation.occupancy_details') }}
                    <span class="badge bg-info ms-2">{{ $totalPersons ?? 0 }} {{ __('site.reservation.persons') }}</span>
                </h3>
                
                @if(isset($reservation->reservationPersons) && count($reservation->reservationPersons) > 0)
                <div class="table-responsive">
                    <table class="table table-custom">
                        <thead>
                            <tr>
                                <th>{{ __('site.reservation.category') }}</th>
                                <th>{{ __('site.reservation.accomodation') }}</th>
                                <th class="text-center">{{ __('site.reservation.men') }}</th>
                                <th class="text-center">{{ __('site.reservation.women') }}</th>
                                <th class="text-center">{{ __('site.reservation.total') }}</th>
                                <th class="text-end">{{ __('site.reservation.rate') }}</th>
                                <th class="text-end">{{ __('site.reservation.amount') }}</th>
                            </tr>
                        </thead>
                        <tbody>
                            @php
                                $grandTotal = 0;
                            @endphp
                            @foreach($reservation->reservationPersons as $person)
                            @php
                                $nbrTotal = (intval($person->nbr_hommes ?? 0)) + (intval($person->nbr_femmes ?? 0));
                                $subtotal = floatval($person->subtotal ?? 0);
                                $grandTotal += $subtotal;
                            @endphp
                            <tr>
                                <td>
                                    @if($person->typeTarif ?? false)
                                        <span class="badge bg-secondary">{{ trans_field($person->typeTarif, 'type', '-') }}</span>
                                    @else
                                        -
                                    @endif
                                </td>
                                <td>
                                    @if(($person->accomodation_type ?? '') == 'chambre')
                                        <span class="badge bg-success">{{ __('site.reservation.room') }}</span>
                                    @else
                                        <span class="badge bg-warning">{{ __('site.reservation.tent') }}</span>
                                    @endif
                                </td>
                                <td class="text-center">{{ $person->nbr_hommes ?? 0 }}</td>
                                <td class="text-center">{{ $person->nbr_femmes ?? 0 }}</td>
                                <td class="text-center">{{ $nbrTotal }}</td>
                                <td class="text-end">{{ number_format(floatval($person->tarif ?? 0), 3) }} {{ __('site.currency') }}</td>
                                <td class="text-end fw-bold">{{ number_format($subtotal, 3) }} {{ __('site.currency') }}</td>
                            </tr>
                            @endforeach
                        </tbody>
                        <tfoot class="table-light">
                            <tr>
                                <td colspan="4" class="text-end fw-bold">{{ __('site.reservation.total') }}:</td>
                                <td class="text-center fw-bold">{{ $totalPersons ?? 0 }}</td>
                                <td></td>
                                <td class="text-end fw-bold">{{ number_format($grandTotal, 3) }} {{ __('site.currency') }}</td>
                            </tr>
                        </tfoot>
                    </table>
                </div>
                @else
                <div class="text-center text-muted py-4">
                    <i class="bi bi-info-circle fs-1"></i>
                    <p class="mt-2">{{ __('site.reservation.no_persons_data') }}</p>
                </div>
                @endif
            </div>

            <!-- Services de restauration -->
            @if(isset($reservation->restaurations) && count($reservation->restaurations) > 0)
            <div class="services-section">
                <h3 class="table-title">
                    <i class="bi bi-cup-straw"></i>
                    {{ __('site.reservation.additional_services') }}
                </h3>
                <div class="services-grid">
                    @foreach($reservation->restaurations as $resto)
                    <div class="service-item">
                        <div class="service-name">{{ trans_field($resto, 'nom', 'Service') }}</div>
                        <div class="service-desc">{{ trans_field($resto, 'description', '') }}</div>
                        <div class="service-price">{{ number_format(floatval($resto->tarif ?? 0), 3) }} {{ __('site.currency') }}/pers/nuit</div>
                    </div>
                    @endforeach
                </div>
            </div>
            @endif

            <!-- Résumé financier -->
            <div class="summary-section">
                <h3 class="info-card-title mb-4">
                    <i class="bi bi-calculator"></i>
                    {{ __('site.reservation.financial_summary') }}
                </h3>
                <div class="summary-grid">
                    <div class="summary-list">
                        <div class="summary-item">
                            <span class="summary-label">{{ __('site.reservation.accommodation_total') }} (×{{ $totalPersons ?? 0 }} pers):</span>
                            <span class="summary-value">{{ number_format(floatval($totalTarif ?? 0), 3) }} {{ __('site.currency') }}</span>
                        </div>
                        <div class="summary-item">
                            <span class="summary-label">{{ __('site.reservation.nights_count') }}:</span>
                            <span class="summary-value">{{ $nbrNuits ?? 0 }} {{ __('site.reservation.nights') }}</span>
                        </div>
                        <div class="summary-item">
                            <span class="summary-label">{{ __('site.reservation.total_accommodation') }}:</span>
                            <span class="summary-value">{{ number_format(floatval(($totalTarif ?? 0) * ($nbrNuits ?? 0)), 3) }} {{ __('site.currency') }}</span>
                        </div>
                    </div>
                    <div class="total-box">
                        <div class="total-label">{{ __('site.reservation.total_amount') }}</div>
                        <div class="total-amount">{{ number_format(floatval($reservation->total_price ?? 0), 3) }}</div>
                        <div class="total-currency">{{ __('site.reservation.tunisian_dinar') }}</div>
                    </div>
                </div>
            </div>

            <!-- Remarques -->
            @if(!empty($reservation->remarque))
            <div class="period-section">
                <h3 class="info-card-title mb-4">
                    <i class="bi bi-chat-left-text"></i>
                    {{ __('site.reservation.additional_notes') }}
                </h3>
                <div class="p-3 bg-light border rounded">
                    <i class="bi bi-quote text-muted"></i>
                    {{ safe_value($reservation->remarque) }}
                </div>
            </div>
            @endif

            <!-- Section officielle -->
            <div class="official-signature">
                <div class="signature-grid">
                    <div class="stamp-box">
                        <div class="stamp-icon">
                            <i class="bi bi-stamp"></i>
                        </div>
                        <div class="stamp-text">{{ __('site.reservation.official_stamp') }}</div>
                    </div>
                    <div class="signature-box">
                        <div class="signature-text">{{ __('site.reservation.director_signature') }}</div>
                        <div class="signature-line"></div>
                        <div class="director-name">{{ trans_field($reservation->auberge ?? null, 'nom', 'N/A') }}</div>
                    </div>
                </div>
            </div>

            <!-- Pied de page -->
            <div class="receipt-footer">
                <p>
                    <i class="bi bi-info-circle"></i>
                    {{ __('site.reservation.receipt_footer') }}
                </p>
                <div class="mt-2">
                    <span class="badge bg-dark">REF: {{ safe_value($reservation->id_reserv ?? '') }}-{{ date('Y') }}</span>
                </div>
            </div>
        </div>

        <!-- Boutons d'action -->
        <div class="action-buttons">
            <a href="{{ route('reservation.index') }}" class="btn btn-outline-secondary btn-back">
                <i class="bi bi-arrow-left"></i> {{ __('site.back') }}
            </a>
            <button onclick="window.print()" class="btn btn-success btn-print">
                <i class="bi bi-printer"></i> {{ __('site.print_receipt') }}
            </button>
            <a href="{{ route('reservation.receipt.download', $reservation->id_reserv ?? '') }}" 
               class="btn btn-primary btn-download">
                <i class="bi bi-download"></i> {{ __('site.download_pdf') }}
            </a>
        </div>
    </div>
</div>
@endsection

@section('scripts')
<script>
// Fonction pour imprimer le reçu
function printReceipt() {
    window.print();
}

// Fonction pour télécharger en PDF (utilise la route)
function downloadPDF() {
    window.location.href = "{{ route('reservation.receipt.download', $reservation->id_reserv ?? '') }}";
}

// Afficher un message lors de l'impression
window.addEventListener('beforeprint', () => {
    console.log('Impression du reçu en cours...');
});

window.addEventListener('afterprint', () => {
    console.log('Impression terminée');
});
</script>
@endsection