@php
    $color = $block->get('color') ?: 'currentColor';
    $h = ['sm' => 40, 'md' => 70, 'lg' => 110][$block->get('size', 'md')] ?? 70;
    $flip = $block->get('flip') ? 'rotate-180' : '';
@endphp
@if ($variant === 'line')
    <div class="max-w-7xl mx-auto px-4"><hr class="border-t" style="border-color:{{ $color }}"></div>
@elseif ($variant === 'dots')
    <div class="flex justify-center gap-2" aria-hidden="true">
        @for ($i = 0; $i < 3; $i++)
            <span class="w-2 h-2 rounded-full" style="background:{{ $color }}"></span>
        @endfor
    </div>
@else
    <div class="w-full leading-none {{ $flip }}" aria-hidden="true">
        <svg viewBox="0 0 1440 {{ $h }}" preserveAspectRatio="none" class="w-full" style="height:{{ $h }}px" fill="{{ $color }}">
            @switch ($variant)
                @case('wave')
                    <path d="M0,{{ $h * 0.5 }} C240,{{ $h }} 480,0 720,{{ $h * 0.5 }} C960,{{ $h }} 1200,0 1440,{{ $h * 0.5 }} L1440,{{ $h }} L0,{{ $h }} Z"/>
                    @break
                @case('angle')
                    <path d="M0,{{ $h }} L1440,0 L1440,{{ $h }} Z"/>
                    @break
                @case('curve')
                    <path d="M0,{{ $h }} Q720,-{{ $h * 0.4 }} 1440,{{ $h }} Z"/>
                    @break
                @case('zigzag')
                    <path d="M0,{{ $h }} L180,0 L360,{{ $h }} L540,0 L720,{{ $h }} L900,0 L1080,{{ $h }} L1260,0 L1440,{{ $h }} Z"/>
                    @break
            @endswitch
        </svg>
    </div>
@endif
