@extends('layouts.app')

@section('title', __('site.search_results.title'))

@section('content')
@php
    $locale = app()->getLocale();
    $isRtl = $locale === 'ar';
    
    // Fonction pour déterminer la route d'affichage
    function getRouteForModel($model) {
        if ($model instanceof \App\Models\News) {
            return route('news.show', $model->slug);
        } elseif ($model instanceof \App\Models\TropheeSportif) {
            return route('trophees.show', $model->slug);
        } elseif ($model instanceof \App\Models\Guide) {
            if($model->type_contenu === 'builder' && $model->builder_id) {
                return route('front.builder', ['id' => $model->builder_id]);
            } elseif($model->type_contenu === 'lien' && filter_var($model->lien, FILTER_VALIDATE_URL)) {
                return $model->lien;
            } elseif($model->type_contenu === 'lien') {
                return url($model->lien);
            } else {
                return route('guide.redirect', $model->id_G);
            }
        } elseif ($model instanceof \App\Models\Federation) {
            return route('federation.public.list', $model->id);
        } elseif ($model instanceof \App\Models\DescGouvr) {
            return route('detail_gouver', $model->id_desc);
        } elseif ($model instanceof \App\Models\Builder) {
            return route('front.builder', $model->id_builder);
        } elseif ($model instanceof \App\Models\BuilderContenu) {
           return route('front.builder', ['id' => $model->id_builder]);
        } elseif ($model instanceof \App\Models\Concours) {
            return route('concours.show', $model->id);
        } elseif ($model instanceof \App\Models\Auberge) {
            return route('auberge.show', $model->id);
        }
        return '#';
    }
    
    // Fonction pour obtenir le titre localisé
    // Fonction pour obtenir le titre localisé
function getLocalizedTitle($model) {
    $locale = app()->getLocale();
    
    if (method_exists($model, 'getLocalizedTitle')) {
        return $model->getLocalizedTitle();
    }
    
    // Logique par défaut pour chaque modèle
    if ($model instanceof \App\Models\News) {
        return $model->title;
    } elseif ($model instanceof \App\Models\TropheeSportif) {
        return trans_field($model, 'title');
    } elseif ($model instanceof \App\Models\Guide) {
        return trans_field($model, 'titre');
    } elseif ($model instanceof \App\Models\Federation) {
        $field = 'nom_' . $locale;
        return $model->$field ?? $model->nom_ar;
    } elseif ($model instanceof \App\Models\DescGouvr) {
        // Pour DescGouvr, on peut utiliser le nom du gouvernorat
        if ($model->gouvernorat) {
            $field = 'nom_' . $locale;
            return $model->gouvernorat->$field ?? $model->gouvernorat->nom_ar;
        }
        return __('site.result.desc_gouvr');
    } elseif ($model instanceof \App\Models\Builder) {
        $field = 'titre_' . $locale;
        return $model->$field ?? $model->titre_ar;
 } elseif ($model instanceof \App\Models\BuilderContenu) {
    $locale = app()->getLocale();

    // 1) Prefer the parent builder title
    if ($model->relationLoaded('builder') && $model->builder) {
        $field = 'titre_' . $locale;
        return $model->builder->$field
            ?? $model->builder->titre_ar
            ?? $model->builder->titre_fr
            ?? $model->builder->titre_en
            ?? __('site.result.builder');
    }

    // 2) If relation is not loaded, try to fetch it
    if ($model->builder) {
        $field = 'titre_' . $locale;
        return $model->builder->$field
            ?? $model->builder->titre_ar
            ?? $model->builder->titre_fr
            ?? $model->builder->titre_en
            ?? __('site.result.builder');
    }

    // 3) Final fallback
    return __('site.result.builder');
} elseif ($model instanceof \App\Models\Concours) {
        $field = 'titre_' . $locale;
        return $model->$field ?? $model->titre_ar;
    } elseif ($model instanceof \App\Models\Auberge) {
        $field = 'nom_' . $locale;
        return $model->$field ?? $model->nom_ar;
    }
    
    return $model->title ?? $model->name ?? __('site.result.no_title');
}

    // Fonction pour obtenir la description localisée
// Utility: detect PDF anywhere in the raw content (links, iframe src, mime)
function isPdfContent($raw) {
    if (empty($raw)) return false;
    // common signs: .pdf extension in href/src or application/pdf or iframe with pdf src
    if (preg_match('/\.pdf(\?[^"\']*)?/i', $raw)) return true;
    if (stripos($raw, 'application/pdf') !== false) return true;
    if (preg_match('/<iframe[^>]+src=["\'][^"\']+\.pdf/i', $raw)) return true;
    return false;
}

// Utility: determine whether content contains plain text useful for preview
function isPreviewableContent($raw) {
    if (empty($raw)) return false;
    $clean = cleanHtmlContent($raw);
    // If cleaned text remains, it's previewable
    return !empty($clean);
}

// detect presence of <table> (table content usually not previewable in a short snippet)
function isTableContent($raw) {
    if (empty($raw)) return false;
    return (bool) preg_match('/<table\b[^>]*>/i', $raw);
}

// detect embedded objects (iframe/object/embed) which are not previewable
function isEmbedContent($raw) {
    if (empty($raw)) return false;
    return (bool) preg_match('/<(iframe|object|embed)\b[^>]*>/i', $raw);
}

// Function for cleaning HTML content (unchanged logic but ensure available)
function cleanHtmlContent($html) {
    if (empty($html)) {
        return '';
    }
    $html = preg_replace('/<script\b[^>]*>(.*?)<\/script>/is', '', $html);
    $html = preg_replace('/<style\b[^>]*>(.*?)<\/style>/is', '', $html);
    $html = preg_replace('/<!--.*?-->/s', '', $html);
    $html = preg_replace('/<[^>]+>/', ' ', $html);
    $html = html_entity_decode($html, ENT_QUOTES | ENT_HTML5, 'UTF-8');
    $html = preg_replace('/\s+/', ' ', $html);
    return trim($html);
}

// Updated getLocalizedDescription: prefers plain text preview when possible,
// otherwise returns an empty string (so template can display fallback)
function getLocalizedDescription($model) {
    $locale = app()->getLocale();

    // helper to test raw content quickly
    $check = function($raw) {
        if (empty($raw)) return '';
        if (isPdfContent($raw) || isTableContent($raw) || isEmbedContent($raw)) {
            return ''; // force fallback for non-previewable content
        }
        $clean = cleanHtmlContent($raw);
        return !empty($clean) ? \Illuminate\Support\Str::limit($clean, 150) : '';
    };

    if ($model instanceof \App\Models\News) {
        return $check($model->content ?? '');
    } elseif ($model instanceof \App\Models\TropheeSportif) {
        $field = 'content_' . $locale;
        return $check($model->$field ?? '');
    } elseif ($model instanceof \App\Models\Guide) {
        return __('site.result.guide');
    } elseif ($model instanceof \App\Models\Federation) {
        return $model->email ?? __('site.result.federation');
    } elseif ($model instanceof \App\Models\DescGouvr) {
        $field = 'desc1_' . $locale;
        return $check($model->$field ?? $model->desc1 ?? '');
    } elseif ($model instanceof \App\Models\Builder) {
        return __('site.result.builder');
    } elseif ($model instanceof \App\Models\BuilderContenu) {
        $field = 'text_' . $locale;
        $raw = $model->$field ?? $model->text_ar ?? '';
        $res = $check($raw);
        if (empty($res)) {
            // try title fallback when content not previewable
            $titleField = 'titre_' . $locale;
            $title = $model->$titleField ?? $model->titre_ar ?? '';
            return !empty($title) ? \Illuminate\Support\Str::limit(strip_tags($title), 150) : '';
        }
        return $res;
    } elseif ($model instanceof \App\Models\Concours) {
        return __('site.result.concours');
    } elseif ($model instanceof \App\Models\Auberge) {
        $field = 'description_' . $locale;
        return $check($model->$field ?? $model->description_ar ?? '');
    }

    return '';
}


    
    // Fonction pour obtenir le badge selon le type
    function getBadgeForModel($model) {
        if ($model instanceof \App\Models\News) {
            return ['text' => __('site.badge.news'), 'color' => 'danger'];
        } elseif ($model instanceof \App\Models\TropheeSportif) {
            return ['text' => __('site.badge.trophees'), 'color' => 'success'];
        } elseif ($model instanceof \App\Models\Guide) {
            return ['text' => __('site.badge.guides'), 'color' => 'info'];
        } elseif ($model instanceof \App\Models\Federation) {
            return ['text' => __('site.badge.federations'), 'color' => 'warning'];
        } elseif ($model instanceof \App\Models\DescGouvr) {
            return ['text' => __('site.badge.desc_gouvr'), 'color' => 'primary'];
        } elseif ($model instanceof \App\Models\Builder) {
            return ['text' => __('site.badge.builders'), 'color' => 'secondary'];
        } elseif ($model instanceof \App\Models\BuilderContenu) {
            return ['text' => __('site.badge.builder_contenus'), 'color' => 'dark'];
        } elseif ($model instanceof \App\Models\Concours) {
            return ['text' => __('site.badge.concours'), 'color' => 'danger'];
        } elseif ($model instanceof \App\Models\Auberge) {
            return ['text' => __('site.badge.auberges'), 'color' => 'success'];
        }
        
        return ['text' => __('site.badge.general'), 'color' => 'light'];
    }
    
    // Combinez tous les résultats dans un tableau UNIQUE
    $allResults = collect();
    
    // Fonction pour ajouter des résultats avec leur type
    function addResults($collection, $type) {
        return $collection->map(function ($item) use ($type) {
            $item->result_type = $type;
            $item->result_id = $type . '_' . ($item->id ?? $item->id_desc ?? $item->id_G ?? uniqid());
            return $item;
        });
    }
    
    // Ajoutez tous les résultats UNIQUEMENT DANS allResults
    $allResults = $allResults->concat(addResults($news, 'news'));
    $allResults = $allResults->concat(addResults($trophees, 'trophees'));
    $allResults = $allResults->concat(addResults($guides, 'guides'));
    $allResults = $allResults->concat(addResults($federations, 'federations'));
    $allResults = $allResults->concat(addResults($descGouvr, 'descGouvr'));
    $allResults = $allResults->concat(addResults($builders, 'builders'));
    $allResults = $allResults->concat(addResults($builderContenus, 'builderContenus'));
    $allResults = $allResults->concat(addResults($concours, 'concours'));
    $allResults = $allResults->concat(addResults($auberges, 'auberges'));
    
    // Grouper les résultats par type pour les filtres
    $groupedResults = $allResults->groupBy('result_type');
@endphp

<main dir="{{ $isRtl ? 'rtl' : 'ltr' }}" lang="{{ $locale }}">
<div class="it-hero-2-area">
   <div class="slider">
      <!-- First Slide -->
      <div class="slide active">
         <div class="it-hero-2-overlay fix gray-bg z-index-1" data-background="assets/img/hero/images2.jpg">
            <div class="container">
               <div class="row align-items-center">
                  <div class="col-xl-6 col-lg-6">
                     <div class="it-hero-2-content">
                        
                        <h1 class="it-hero-2-title it-split-in-right">
                           {{ __('site.hero.welcome_title') }}
                        </h1>
                        <h4 class="it-hero-3-subtitle it-split-in-right">
                           <span>{{ __('site.hero.subtitle') }}</span>
                        </h4>

                        <div class="it-hero-2-text wow itfadeUp" data-wow-duration=".9s" data-wow-delay=".5s">
                           <p class="mb-30"><br/></p>
                        </div>
                        <div class="it-hero-btn d-sm-flex align-items-center">
                           <div class="it-fade-anim" data-fade-from="top" data-ease="bounce" data-delay=".8">
                              <a href="#results" class="it-btn-orange mr-30 wow itfadeUp" data-wow-duration=".9s" data-wow-delay=".7s">
                                 <span>
                                    <span class="text-1">{{ __('site.hero.view_results') }}</span>
                                    <span class="text-2">{{ __('site.hero.view_results') }}</span>
                                 </span>
                                 <i>
                                    <svg width="12" height="13" viewBox="0 0 12 13" fill="none" xmlns="http://www.w3.org/2000/svg">
                                       <path d="M10.0035 3.90804L1.41153 12.5L0 11.0885L8.59097 2.49651H1.01922V0.5H12V11.4808H10.0035V3.90804Z" fill="white" />
                                    </svg>
                                    <svg width="12" height="13" viewBox="0 0 12 13" fill="none" xmlns="http://www.w3.org/2000/svg">
                                       <path d="M10.0035 3.90804L1.41153 12.5L0 11.0885L8.59097 2.49651H1.01922V0.5H12V11.4808H10.0035V3.90804Z" fill="white" />
                                    </svg>
                                 </i>
                              </a>
                           </div>
                        </div>
                     </div>
                  </div>
                  <div class="col-xl-6 col-lg-6">
                     <div class="it-contact-form-box z-index-1 p-relative wow img-anim-top" data-wow-duration="1.5s" data-wow-delay="0.1">
                        <h4 class="it-contact-form-title mb-10" style="color:#FFFFFF;">{{ __('site.search.title') }}</h4>
                        <form action="{{ route('search') }}">
                           <div class="it-contact-input-wrap">
                              <div class="row gx-30">
                                 <div class="col-sm-12 mb-20">
                                    <div class="it-contact-input-box">
                                       <input required class="ph" type="text" name="q" value="{{ request('q') }}" placeholder="{{ __('site.search.placeholder') }}" style="color:#FFFFFF;">
                                    </div>
                                 </div>
                              </div>
                              <div class="it-contact-btn">
                                 <button type="submit" class="it-btn-orange">
                                    <span>
                                       <span class="text-1">{{ __('site.search.button') }}</span>
                                       <span class="text-2">{{ __('site.search.button') }}</span>
                                    </span>
                                    <i>
                                       <svg width="12" height="13" viewBox="0 0 12 13" fill="none" xmlns="http://www.w3.org/2000/svg">
                                          <path d="M10.0035 3.90804L1.41153 12.5L0 11.0885L8.59097 2.49651H1.01922V0.5H12V11.4808H10.0035V3.90804Z" fill="white" />
                                       </svg>
                                       <svg width="12" height="13" viewBox="0 0 12 13" fill="none" xmlns="http://www.w3.org/2000/svg">
                                          <path d="M10.0035 3.90804L1.41153 12.5L0 11.0885L8.59097 2.49651H1.01922V0.5H12V11.4808H10.0035V3.90804Z" fill="white" />
                                       </svg>
                                    </i>
                                 </button>
                              </div>
                           </div>
                        </form>
                        <img class="it-contact-shape-1" src="assets/img/shape/contact-1-1.png" alt="{{ __('site.no_image_alt') }}">
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </div>
    </div>
</div>

<div class="container mt-5 results-section" id="results" dir="{{ $isRtl ? 'rtl' : 'ltr' }}">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h3 class="mb-0">
            {{ __('site.results.header_query') }} <span class="text-danger">{{ $query }}</span>
        </h3>
        <small class="text-muted">
            {{ __('site.results.total_results') }} {{ $totalResults }}
        </small>
    </div>

    @if($totalResults == 0)
        <div class="alert alert-info text-center">{{ __('site.results.no_results') }}</div>
    @else
        {{-- Boutons de filtrage par catégorie --}}
        <div class="filter-buttons mb-4">
            <button class="btn btn-outline-primary filter-category active" data-category="all">
                {{ __('site.results.all_results') }} ({{ $allResults->count() }})
            </button>
            
            @foreach($groupedResults as $type => $items)
                @php
                    $typeNames = [
                        'news' => ['name' => __('site.results.section_news'), 'color' => 'danger'],
                        'trophees' => ['name' => __('site.results.section_trophees'), 'color' => 'success'],
                        'guides' => ['name' => __('site.results.section_guides'), 'color' => 'info'],
                        'federations' => ['name' => __('site.results.section_federations'), 'color' => 'warning'],
                        'descGouvr' => ['name' => __('site.results.section_desc_gouvr'), 'color' => 'primary'],
                        'builders' => ['name' => __('site.results.section_builders'), 'color' => 'secondary'],
                        'builderContenus' => ['name' => __('site.results.section_builder_contenus'), 'color' => 'dark'],
                        'concours' => ['name' => __('site.results.section_concours'), 'color' => 'danger'],
                        'auberges' => ['name' => __('site.results.section_auberges'), 'color' => 'success'],
                    ];
                @endphp
                
                @if(isset($typeNames[$type]))
                    <button class="btn btn-outline-{{ $typeNames[$type]['color'] }} filter-category" data-category="{{ $type }}">
                        {{ $typeNames[$type]['name'] }} ({{ $items->count() }})
                    </button>
                @endif
            @endforeach
        </div>
        
        
        
        {{-- Tous les résultats combinés --}}
        <div id="all-results-container">
            @if($allResults->count() > 0)
                <div class="row gy-4">
                    @foreach($allResults as $index => $item)
                        @php
                            $badge = getBadgeForModel($item);
                            $title = getLocalizedTitle($item);
                            $description = getLocalizedDescription($item);
                            $route = getRouteForModel($item);
                            $target = ($item instanceof \App\Models\Guide && $item->open_new_tab) ? ' target="_blank"' : '';
                            
                            // Déterminer l'image à afficher
                            $image = null;
                            if (property_exists($item, 'image') && !empty($item->image)) {
                                $image = $item->image;
                            } elseif (property_exists($item, 'image_gouv') && !empty($item->image_gouv)) {
                                $image = $item->image_gouv;
                            } elseif (property_exists($item, 'logo') && !empty($item->logo)) {
                                $image = $item->logo;
                            }
                        @endphp
                        
                        <div class="col-md-6 col-lg-4" data-category="{{ $item->result_type }}" data-index="{{ $index }}">
                            <article class="card result-card h-100" 
                                     data-type="{{ $item->result_type }}" 
                                     data-date="{{ $item->created_at ?? $item->date ?? now() }}">
                                <div class="card-body d-flex flex-column">
                                    

                                    <h5 class="card-title mb-1">
                                        <a href="{{ $route }}" class="stretched-link text-decoration-none" {!! $target !!}>
                                            {!! highlight($title, $query) !!}
                                        </a>
                                    </h5>

                                    @if(property_exists($item, 'created_at') || property_exists($item, 'date'))
                                        <small class="text-muted mb-2">
                                            <i class="far fa-calendar-alt me-1"></i>
                                            {{ ($item->created_at ?? $item->date)->format('Y-m-d') }}
                                        </small>
                                    @elseif(property_exists($item, 'ville') && !empty($item->ville))
                                        <small class="text-muted mb-2">
                                            <i class="fas fa-map-marker-alt me-1"></i>
                                            {{ $item->ville }}
                                        </small>
                                    @endif

                                  @php
    // Try to get raw content to detect PDF/table/embed (for a few model types)
    $rawPreview = '';
    if ($item instanceof \App\Models\BuilderContenu) {
        $rawPreview = $item->{'text_'.$locale} ?? $item->text_ar ?? '';
    } elseif ($item instanceof \App\Models\News) {
        $rawPreview = $item->content ?? '';
    } elseif ($item instanceof \App\Models\DescGouvr) {
        $rawPreview = $item->{'desc1_'.$locale} ?? $item->desc1 ?? '';
    } elseif ($item instanceof \App\Models\Auberge) {
        $rawPreview = $item->{'description_'.$locale} ?? $item->description_ar ?? '';
    } elseif ($item instanceof \App\Models\TropheeSportif) {
        $rawPreview = $item->{'content_'.$locale} ?? $item->content ?? '';
    }
    $isPdf = isPdfContent($rawPreview);
    $isTable = isTableContent($rawPreview);
    $isEmbed = isEmbedContent($rawPreview);
    $hasPreview = !empty($description) && trim(strip_tags($description)) !== '';
@endphp

@if($hasPreview && !$isPdf && !$isTable && !$isEmbed)
    <p class="card-text mb-3 text-truncate-3">
        {!! highlight($description, $query) !!}
    </p>
@else
    <p class="card-text mb-3 text-truncate-3">
        <a href="{{ $route }}" class="text-decoration-none fw-medium">
            {{ __('site.result.click_to_display') }}
       
        </a>
    </p>
@endif

                                    <div class="mt-auto d-flex justify-content-between align-items-center">
                                        <span class="badge bg-{{ $badge['color'] }}">
                                            {{ $badge['text'] }}
                                        </span>
                                        <a href="{{ $route }}" class="btn btn-sm btn-success" {!! $target !!}>
                                            {{ __('site.action.view') }}
                                            <i class="fas fa-external-link-alt ms-1"></i>
                                        </a>
                                    </div>
                                </div>
                            </article>
                        </div>
                    @endforeach
                </div>
            @else
                <div class="alert alert-warning text-center">
                    {{ __('site.results.no_results_found') }}
                </div>
            @endif
        </div>
        
        {{-- Statistiques par catégorie --}}
        <div class="mt-5 pt-4 border-top">
            <h5 class="mb-3">{{ __('site.results.results_by_category') }}</h5>
            <div class="row">
                @foreach($groupedResults as $type => $items)
                    @php
                        $typeInfo = [
                            'news' => ['name' => __('site.results.section_news'), 'color' => 'danger', 'icon' => 'newspaper'],
                            'trophees' => ['name' => __('site.results.section_trophees'), 'color' => 'success', 'icon' => 'trophy'],
                            'guides' => ['name' => __('site.results.section_guides'), 'color' => 'info', 'icon' => 'book'],
                            'federations' => ['name' => __('site.results.section_federations'), 'color' => 'warning', 'icon' => 'users'],
                            'descGouvr' => ['name' => __('site.results.section_desc_gouvr'), 'color' => 'primary', 'icon' => 'landmark'],
                            'builders' => ['name' => __('site.results.section_builders'), 'color' => 'secondary', 'icon' => 'cubes'],
                            'builderContenus' => ['name' => __('site.results.section_builder_contenus'), 'color' => 'dark', 'icon' => 'file-alt'],
                            'concours' => ['name' => __('site.results.section_concours'), 'color' => 'danger', 'icon' => 'medal'],
                            'auberges' => ['name' => __('site.results.section_auberges'), 'color' => 'success', 'icon' => 'hotel'],
                        ];
                    @endphp
                    
                    @if(isset($typeInfo[$type]))
                    <div class="col-md-4 col-lg-3 mb-3">
                        <div class="category-stat-card p-3 rounded border">
                            <div class="d-flex align-items-center">
                                <div class="me-3">
                                    <i class="fas fa-{{ $typeInfo[$type]['icon'] }} fa-2x text-{{ $typeInfo[$type]['color'] }}"></i>
                                </div>
                                <div>
                                    <h6 class="mb-1">{{ $typeInfo[$type]['name'] }}</h6>
                                    <p class="mb-0">
                                        <span class="badge bg-{{ $typeInfo[$type]['color'] }}">
                                            {{ $items->count() }} {{ __('site.results.results') }}
                                        </span>
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                    @endif
                @endforeach
            </div>
        </div>
        
    @endif
</div>
</main>

<script>
document.addEventListener('DOMContentLoaded', function() {
    // Filtrage par catégorie
    const filterButtons = document.querySelectorAll('.filter-category');
    const resultItems = document.querySelectorAll('#all-results-container [data-category]');
    
    filterButtons.forEach(button => {
        button.addEventListener('click', function() {
            const category = this.dataset.category;
            
            // Active le bouton cliqué
            filterButtons.forEach(btn => btn.classList.remove('active'));
            this.classList.add('active');
            
            // Filtre les résultats
            resultItems.forEach(item => {
                if (category === 'all' || item.dataset.category === category) {
                    item.style.display = 'block';
                } else {
                    item.style.display = 'none';
                }
            });
            
            // Scroll vers les résultats
            document.getElementById('all-results-container').scrollIntoView({
                behavior: 'smooth'
            });
        });
    });
    
    // Tri des résultats
    const sortButtons = document.querySelectorAll('[data-sort]');
    const resultCards = document.querySelectorAll('.result-card');
    
    sortButtons.forEach(button => {
        button.addEventListener('click', function() {
            // Active le bouton cliqué
            sortButtons.forEach(btn => btn.classList.remove('active'));
            this.classList.add('active');
            
            const sortType = this.dataset.sort;
            const cardsArray = Array.from(resultCards);
            const container = document.querySelector('#all-results-container .row');
            
            if (sortType === 'date') {
                // Tri par date (le plus récent en premier)
                cardsArray.sort((a, b) => {
                    const dateA = new Date(a.dataset.date);
                    const dateB = new Date(b.dataset.date);
                    return dateB - dateA;
                });
            } else {
                // Tri par index d'origine (pertinence)
                cardsArray.sort((a, b) => {
                    const parentA = a.closest('[data-index]');
                    const parentB = b.closest('[data-index]');
                    const indexA = parseInt(parentA.dataset.index);
                    const indexB = parseInt(parentB.dataset.index);
                    return indexA - indexB;
                });
            }
            
            // Réorganise les cartes
            cardsArray.forEach(card => {
                const parentDiv = card.closest('.col-md-6');
                container.appendChild(parentDiv);
            });
        });
    });
    
    // Highlight des termes de recherche dans les titres et descriptions
    function highlightSearchTerms() {
        const searchQuery = "{{ $query }}";
        if (!searchQuery) return;
        
        const elements = document.querySelectorAll('.card-title a, .card-text');
        elements.forEach(element => {
            const html = element.innerHTML;
            const regex = new RegExp(`(${searchQuery})`, 'gi');
            element.innerHTML = html.replace(regex, '<mark class="bg-warning">$1</mark>');
        });
    }
    
    highlightSearchTerms();
});
</script>

<style>
.filter-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px;
}

.filter-buttons .btn {
    border-radius: 20px;
    padding: 8px 16px;
    font-weight: 500;
}

.filter-buttons .btn.active {
    font-weight: bold;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.category-stat-card {
    background: #f8f9fa;
    transition: all 0.3s ease;
}

.category-stat-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    background: white;
}

.result-card {
    transition: all 0.3s ease;
    border: 1px solid #eee;
    overflow: hidden;
}

.result-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    border-color: #007bff;
}

.result-card .card-body {
    position: relative;
}

.result-card .stretched-link::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.text-truncate-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 4.5em;
}

mark.bg-warning {
    padding: 2px 4px;
    border-radius: 3px;
    font-weight: bold;
}
</style>
@endsection