@props([
    'tags',
    'lang' => null,
    'limit' => 15
])

@php
    $lang = $lang ?? (request()->route('lang') ?? config('drama.default_home_language'));
@endphp

@if(!empty($tags) && count($tags))
    <div class="flex justify-center gap-2 flex-wrap mb-8">
        @foreach(collect($tags)->take($limit) as $tag)
            @if(!empty($tag))
                @php
                    // Handle both string tags and array tags (e.g., FlickReels format)
                    $tagName = is_array($tag) ? ($tag['tag_name'] ?? $tag['name'] ?? '') : $tag;
                    
                    if (empty($tagName)) {
                        continue;
                    }
                    
                    // Only slug if tag contains Latin letters, else use rawurlencode on original tag
                    if (preg_match('/[a-zA-Z]/', $tagName)) {
                        $slug = \Illuminate\Support\Str::slug($tagName);
                    } else {
                        $slug = $tagName;
                    }
                    $encodedSlug = rawurlencode($slug);
                @endphp
                <a href="{{ route('tag.page', ['lang' => $lang, 'tag' => $encodedSlug]) }}" class="bg-zinc-700 px-3 py-1 rounded-full text-sm hover:bg-zinc-600 transition-colors">{{ $tagName }}</a>
            @endif
        @endforeach
    </div>
@endif