{{--
    Wraps every block. Owns presentation concerns (background, spacing,
    animation, responsive visibility) so individual block partials only
    describe their own content.
--}}
@php
    $style = $block->style ?? [];
    $get = fn ($k, $d = null) => data_get($style, $k, $d);

    $padding = match ($get('padding_y', 'md')) {
        'none'  => 'py-0',
        'xs'    => 'py-4',
        'sm'    => 'py-8',
        'md'    => 'py-16',
        'lg'    => 'py-24',
        'xl'    => 'py-32',
        '2xl'   => 'py-40',
        default => 'py-16',
    };

    $visibility = collect([
        $get('hide_on_mobile') ? 'hidden md:block' : null,
        $get('hide_on_desktop') ? 'md:hidden' : null,
    ])->filter()->implode(' ');

    $bgType = $get('bg_type', 'none');
    $animation = $get('animation', 'none');
    $anchor = $get('anchor') ?: 'block-' . $block->uuid;

    $inline = [];
    if ($bgType === 'solid' && $get('bg_color')) {
        $inline[] = 'background-color:' . $get('bg_color');
    }
    if ($bgType === 'gradient' && $get('bg_gradient_from')) {
        $inline[] = sprintf(
            'background-image:linear-gradient(%ddeg, %s, %s)',
            (int) $get('bg_gradient_angle', 180),
            $get('bg_gradient_from'),
            $get('bg_gradient_to', $get('bg_gradient_from')),
        );
    }
    if ($get('text_color')) {
        $inline[] = 'color:' . $get('text_color');
    }
@endphp

<section id="{{ $anchor }}"
         data-block-type="{{ $block->type }}"
         data-block-variant="{{ $block->variant }}"
         @if ($animation && $animation !== 'none')
             data-animation="{{ $animation }}"
             data-animation-delay="{{ (int) $get('animation_delay', 0) }}"
             data-animation-stagger="{{ (int) $get('animation_stagger', 0) }}"
         @endif
         class="ec-block relative {{ $padding }} {{ $visibility }} {{ $get('custom_classes', '') }}"
         @if ($inline) style="{{ implode(';', $inline) }}" @endif>

    @if ($bgType === 'image' && $get('bg_image'))
        <div class="absolute inset-0 -z-10 bg-cover bg-center"
             style="background-image:url('{{ $get('bg_image') }}')"
             @if ($get('bg_fixed')) data-parallax="true" @endif
             aria-hidden="true"></div>
        <div class="absolute inset-0 -z-10"
             style="background-color:{{ $get('bg_overlay_color', '#000') }};opacity:{{ (int) $get('bg_overlay_opacity', 50) / 100 }}"
             aria-hidden="true"></div>
    @endif

    @if ($bgType === 'video' && $get('bg_video'))
        <video class="absolute inset-0 -z-10 h-full w-full object-cover"
               autoplay muted loop playsinline aria-hidden="true"
               @if ($get('bg_image')) poster="{{ $get('bg_image') }}" @endif>
            <source src="{{ $get('bg_video') }}">
        </video>
        <div class="absolute inset-0 -z-10"
             style="background-color:{{ $get('bg_overlay_color', '#000') }};opacity:{{ (int) $get('bg_overlay_opacity', 50) / 100 }}"
             aria-hidden="true"></div>
    @endif

    {{ $content }}
</section>
