@extends('layouts.public')

@section('title', $post->title)

@section('content')
    <div class="row g-4">
        <div class="col-lg-8">
            <div class="single-post-container">

                <div class="post-meta-bar d-flex justify-content-between align-items-center flex-wrap">
                    <div>
                        <span>کد خبر: {{ to_persian_digits($post->id) }}</span>
                    </div>
                    <div>
                        @if($post->published_at)
                            <span>تاریخ انتشار: {{ to_persian_digits(jdate($post->published_at)->format('%A, %d %B %Y - H:i')) }}</span>
                        @endif
                    </div>
                </div>

                <div class="post-header-content">
                    @if($post->kicker)
                        <h2 class="post-kicker">{{ $post->kicker }}</h2>
                    @endif
                    <h1 class="post-main-title">{{ $post->title }}</h1>
                </div>

                <div class="post-lead-section">
                    <div class="row align-items-center">
                        @if($post->featured_image)
                            <div class="col-md-7">
                                <p class="post-lead-text mb-0">{{ $post->lead }}</p>
                            </div>
                            <div class="col-md-5">

                                <img src="{{ asset('storage/' . $post->featured_image) }}" class="img-fluid" alt="{{ $post->title }}">
                            </div>
                        @else
                            <div class="col-12">
                                <p class="post-lead-text mb-0">{{ $post->lead }}</p>
                            </div>
                        @endif
                    </div>
                </div>

                <div class="post-body-content">
                    <div class="post-content">
                        {!! $post->content !!}
                    </div>

                    <hr class="my-4">

                    @if($post->tags->isNotEmpty())
                        <div>
                            <strong>برچسب‌ها:</strong>
                            @foreach($post->tags as $tag)
                                <a href="{{ route('public.tags.show', $tag->slug) }}" class="badge bg-secondary text-decoration-none">{{ $tag->name }}</a>
                            @endforeach
                        </div>
                    @endif
                </div>

                <div class="p-4 bg-light">
                    @include('partials.comments-section', ['post' => $post])
                </div>

            </div>
        </div>

        <div class="col-lg-4">
            @include('layouts.partials.sidebar')
        </div>
    </div>
@endsection