@php
    $sections = collect($block->get('sections') ?: []);
    $headingTag = $block->get('heading_level') === 'h2' ? 'h2' : 'h1';
    $ruleClass = $block->get('heading_rule') === 'accent_bar' ? 'ec-heading-rule ec-heading-rule--start' : '';
    $width = match ($variant) {
        'prose_narrow' => 'max-w-3xl', 'two_column' => 'max-w-6xl', 'with_toc' => 'max-w-6xl', default => 'max-w-4xl',
    };
@endphp
<div class="{{ $width }} mx-auto px-4 sm:px-6 lg:px-8">
    @if ($block->get('title'))
        <{{ $headingTag }} class="ec-heading text-3xl sm:text-4xl font-bold mb-3 {{ $ruleClass }}">
            {!! website_highlight($block->get('title')) !!}
        </{{ $headingTag }}>
    @endif
    @if ($block->get('last_updated'))
        <p class="ec-muted text-sm mb-8">{{ $block->get('last_updated') }}</p>
    @endif

    <div class="{{ $variant === 'with_toc' ? 'grid lg:grid-cols-[16rem_1fr] gap-12' : '' }}">
        @if ($variant === 'with_toc' && $sections->isNotEmpty())
            <nav class="hidden lg:block self-start sticky top-24" aria-label="{{ __('فهرس الصفحة') }}">
                <ul class="flex flex-col gap-2 text-sm">
                    @foreach ($sections as $i => $s)
                        @php $anchor = website_text(data_get($s, 'anchor')) ?: 'sec-' . ($i + 1); @endphp
                        <li><a href="#{{ $anchor }}" class="ec-muted hover:underline">{{ $block->get("sections.{$i}.heading") ?: website_text(data_get($s, 'heading')) }}</a></li>
                    @endforeach
                </ul>
            </nav>
        @endif

        <div class="ec-prose {{ $variant === 'two_column' ? 'md:columns-2 md:gap-12' : '' }}">
            @if ($block->get('body'))
                {!! clean_html($block->get('body')) !!}
            @endif

            @foreach ($sections as $i => $s)
                @php $anchor = website_text(data_get($s, 'anchor')) ?: 'sec-' . ($i + 1); @endphp
                <section id="{{ $anchor }}" class="mt-10 break-inside-avoid scroll-mt-24">
                    @if (website_text(data_get($s, 'heading')))
                        <{{ $headingTag === 'h1' ? 'h2' : 'h3' }} class="ec-heading text-xl font-semibold mb-3">{{ $block->get("sections.{$i}.heading") ?: website_text(data_get($s, 'heading')) }}</{{ $headingTag === 'h1' ? 'h2' : 'h3' }}>
                    @endif
                    {!! clean_html($block->get("sections.{$i}.body") ?: website_text(data_get($s, 'body'))) !!}
                </section>
            @endforeach
        </div>
    </div>
</div>
