@extends('front-end.layouts.apps')

@section('title', $blog->title ?? 'بلاګ تفصیلات')

@section('page_title', $blog->title ?? 'بلاګ تفصیلات')

@section('main_container')
<div class="container" dir="rtl">
    {{-- Back button --}}
    <div class="mb-3">
        <a href="{{ route('public.blog') }}" class="btn-outline-secondary rounded-pill">
            <i class="fas fa-arrow-right ms-1"></i> ټول بلاګونه
        </a>
    </div>

    {{-- Blog post card --}}
    <div class="blog-detail-card">
        {{-- Featured image --}}
        @if($blog->image)
            <div class="blog-detail-image">
                <img src="{{ asset('storage/' . $blog->image) }}" alt="{{ $blog->title }}">
            </div>
        @endif

        {{-- Content --}}
        <div class="blog-detail-content">
            {{-- Meta info --}}
            <div class="blog-meta">
                @if($blog->category)
                    <span class="badge-custom">{{ $blog->category->name ?? 'بلاګ' }}</span>
                @endif
                <span class="blog-date">
                    <i class="fas fa-calendar-alt"></i>
                    {{ $blog->created_at ? $blog->created_at->format('Y/m/d') : '' }}
                </span>
                @if($blog->author)
                    <span class="blog-author">
                        <i class="fas fa-user"></i> {{ $blog->author }}
                    </span>
                @endif
            </div>

            {{-- Title --}}
            <h1 class="blog-detail-title">{{ $blog->title }}</h1>

            {{-- Body --}}
            <div class="blog-detail-body">
                {!! $blog->body !!}
            </div>

            {{-- Share buttons --}}
            <div class="blog-share">
                <span class="share-label">شریکول:</span>
                <a href="https://www.facebook.com/sharer/sharer.php?u={{ urlencode(request()->url()) }}" target="_blank" class="share-btn facebook">
                    <i class="fab fa-facebook-f"></i>
                </a>
                <a href="https://twitter.com/intent/tweet?text={{ urlencode($blog->title) }}&url={{ urlencode(request()->url()) }}" target="_blank" class="share-btn twitter">
                    <i class="fab fa-twitter"></i>
                </a>
                <a href="https://api.whatsapp.com/send?text={{ urlencode($blog->title . ' - ' . request()->url()) }}" target="_blank" class="share-btn whatsapp">
                    <i class="fab fa-whatsapp"></i>
                </a>
                <a href="https://telegram.me/share/url?url={{ urlencode(request()->url()) }}&text={{ urlencode($blog->title) }}" target="_blank" class="share-btn telegram">
                    <i class="fab fa-telegram-plane"></i>
                </a>
            </div>
        </div>
    </div>

    {{-- Related posts --}}
    @if(isset($relatedBlogs) && $relatedBlogs->count() > 0)
        <div class="section-header mt-5">
            <i class="fas fa-blog"></i>
            <h3>ورته بلاګونه</h3>
        </div>
        <div class="row">
            @foreach($relatedBlogs as $related)
                <div class="col-md-4 mb-4">
                    <div class="related-blog-card">
                        @if($related->image)
                            <img src="{{ asset('storage/' . $related->image) }}" alt="{{ $related->title }}" class="related-blog-image">
                        @endif
                        <div class="related-blog-content">
                            <h5 class="related-blog-title">{{ Str::limit($related->title, 50) }}</h5>
                            <a href="{{ route('public.blog_details', $related->id) }}" class="btn-blog-small">
                                <i class="fas fa-book-open me-1"></i> ولولئ
                            </a>
                        </div>
                    </div>
                </div>
            @endforeach
        </div>
    @endif

    {{-- Bottom Navigation --}}
    <nav class="bottom-nav">
        <a href="{{ url('/') }}" class="nav-item {{ request()->is('/') ? 'active' : '' }}">
            <i class="fas fa-home"></i> <span>کور</span>
        </a>
        <a href="{{ route('public.categories') }}" class="nav-item {{ request()->is('categories') || request()->is('categories*') ? 'active' : '' }}">
            <i class="fas fa-list-ul"></i> <span>کټګورۍ</span>
        </a>
        <a href="{{ route('public.poetry_search') }}" class="nav-item {{ request()->is('poetry/search') ? 'active' : '' }}">
            <i class="fas fa-search"></i> <span>لټون</span>
        </a>
    </nav>
</div>
@endsection