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

@section('title', $poetry->title ?? 'د شعر تفصیلات')

@section('page_title', $poetry->title ?? 'د شعر تفصیلات')

@section('main_container')
<div class="container" dir="rtl">
    {{-- Back button and category badge --}}
    <div class="d-flex justify-content-between align-items-center mt-3 mb-4">
        <a href="javascript:history.back()" class="btn-outline-secondary rounded-pill">
            <i class="fas fa-arrow-right ms-1"></i> شاته
        </a>
        @if($poetry->category)
            <span class="badge-custom">{{ $poetry->category->title_ps ?? $poetry->category->title }}</span>
        @endif
    </div>

    {{-- Poetry Card --}}
    <div class="poetry-card">
        <div class="poetry-header">
            <h1 class="poetry-title">{{ $poetry->title ?? 'بې نوم شعر' }}</h1>
            <div class="poet-info">
                <a href="{{ route('public.poet_details', $poetry->poet_id) }}" class="poet-link">
                    <i class="fas fa-feather-alt"></i> {{ $poetry->poet->name ?? 'نامعلوم شاعر' }}
                </a>
            </div>
        </div>

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

        {{-- Action toolbar: copy and share --}}
        <div class="poetry-actions">
            <button class="action-btn copy-btn" onclick="copyPoetry()" title="کاپي کول">
                <i class="fas fa-copy"></i>
            </button>
            <a href="https://wa.me/?text={{ urlencode($poetry->title . ' - ' . strip_tags($poetry->body)) }}" target="_blank" class="action-btn" title="واتساپ">
                <i class="fab fa-whatsapp"></i>
            </a>
            <a href="https://www.facebook.com/sharer/sharer.php?u={{ urlencode(request()->url()) }}" target="_blank" class="action-btn" title="فیسبوک">
                <i class="fab fa-facebook-f"></i>
            </a>
            <a href="https://twitter.com/intent/tweet?text={{ urlencode($poetry->title . ' - ' . strip_tags($poetry->body)) }}" target="_blank" class="action-btn" title="ټویټر">
                <i class="fab fa-twitter"></i>
            </a>
        </div>

        <div class="poetry-footer">
            <small class="text-muted">
                <i class="fas fa-calendar"></i>
                @if($poetry->created_at)
                    {{ $poetry->created_at->format('Y/m/d') }}
                @endif
            </small>
        </div>
    </div>

    {{-- Related Poetries by same poet --}}
    @if($poetry->poet)
        <div class="section-header mt-5">
            <i class="fas fa-feather"></i>
            <h3>د {{ $poetry->poet->name }} نور شعرونه</h3>
        </div>
        <div class="folk-grid">
            @php
                $related = \App\Models\Poetries::where('poet_id', $poetry->poet_id)
                    ->where('id', '!=', $poetry->id)
                    ->with('poet')
                    ->limit(6)
                    ->get();
            @endphp
            @foreach($related as $rel)
                <div class="folk-item">
                    <a href="{{ route('public.poet_poetry_details_single', $rel->id) }}" class="folk-link">
                        <i class="fas fa-star folk-icon"></i>
                        <span>{{ $rel->title ?? 'بې نوم' }}</span>
                        <i class="fas fa-arrow-left folk-arrow"></i>
                    </a>
                </div>
            @endforeach
        </div>
    @endif

    {{-- spacer for bottom nav --}}
    <div style="height: 30px;"></div>
</div>

{{-- 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>
@endsection

