@extends('layouts.site')

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

@section('content')
@php($lc = ['locale' => app()->getLocale()])
<div class="site-container eca-account-page py-8">
    <div class="mx-auto max-w-3xl">
        <a href="{{ route('site.account.requests', array_merge($lc, ['tab' => 'commissions'])) }}" class="text-sm text-[var(--eca-text-muted)] hover:text-[var(--eca-accent)]">
            ← {{ __('site.account_tab_commissions') }}
        </a>

        <article class="mt-6 space-y-5">
            @if ($post->image)
                <img src="{{ site_media_url($post->image) }}" alt="" class="w-full rounded-2xl object-cover" />
            @endif
            <div>
                <p class="text-xs font-semibold text-[var(--eca-text-muted)]">{{ $post->category?->localizedName() }} · {{ $post->formattedPublishedAt() }}</p>
                <h1 class="mt-2 text-2xl font-bold tracking-tight text-[var(--eca-text)]">{{ $post->localizedTitle() }}</h1>
                @if ($post->localizedExcerpt() !== '')
                    <p class="mt-3 text-[var(--eca-text-muted)]">{{ $post->localizedExcerpt() }}</p>
                @endif
            </div>

            <div class="prose prose-sm max-w-none space-y-4 text-[var(--eca-text)]">
                @foreach ($post->bodyBlocks() as $block)
                    @if (($block['type'] ?? '') === 'text')
                        <p class="whitespace-pre-line leading-7">{{ $block['content'] ?? '' }}</p>
                    @elseif (($block['type'] ?? '') === 'image' && ! empty($block['path']))
                        <figure>
                            <img src="{{ site_media_url($block['path']) }}" alt="{{ $block['alt'] ?? '' }}" class="w-full rounded-xl" />
                        </figure>
                    @endif
                @endforeach
            </div>
        </article>
    </div>
</div>
@endsection