@props([
    'block',
])

@php
    /** @var \App\Models\PageBlock $block */
    use Illuminate\Support\Facades\Storage;

    $c = $block->content ?? [];
    $path = data_get($c, 'image');
    $src = is_string($path) && $path !== '' ? Storage::disk('public')->url($path) : null;
    $rawLink = data_get($c, 'link_url');
    $linkUrl = null;
    if (is_string($rawLink) && preg_match('/\Ahttps?:\/\//i', trim($rawLink)) === 1) {
        $linkUrl = trim($rawLink);
    }
    $alt = is_string(data_get($c, 'alt')) ? (string) data_get($c, 'alt') : '';
    $maxW = max(48, min(800, (int) data_get($c, 'max_width_px', 320)));
    $align = (string) data_get($c, 'text_alignment', 'center');
    // text-align + inline-block centers reliably; flex + max-w-full often yields full-width flex items.
    $textAlignClass = match ($align) {
        'left' => 'text-left',
        'right' => 'text-right',
        default => 'text-center',
    };
@endphp

@if ($src !== null)
    <div class="w-full {{ $textAlignClass }}">
        @if ($linkUrl !== null)
            <a
                href="{{ e($linkUrl) }}"
                target="_blank"
                rel="noopener noreferrer"
                class="inline-block max-w-full align-middle"
            >
        @endif
        <img
            src="{{ e($src) }}"
            alt="{{ e($alt) }}"
            class="inline-block h-auto w-auto max-w-full align-middle object-contain drop-shadow-[0_8px_32px_rgba(0,0,0,0.35)]"
            style="max-width: min(100%, {{ $maxW }}px)"
            loading="lazy"
        >
        @if ($linkUrl !== null)
            </a>
        @endif
    </div>
@endif