{{-- Month Skeleton – gleiche Struktur wie echte Monatsansicht --}}
<div class="animate-pulse">

    {{-- Scroll-Bereich (wie echt: overflow-y-auto + max-height) --}}
    <div class="overflow-y-auto" style="max-height: 560px">

        {{-- Wochentag-Header (grid grid-cols-7 wie echt) --}}
        <div class="grid grid-cols-7 border-b border-gray-100 bg-white sticky top-0 z-10">
            @foreach(['Mo','Di','Mi','Do','Fr','Sa','So'] as $dn)
                <div class="py-2 flex justify-center">
                    <div class="h-2.5 w-5 bg-gray-100 rounded"></div>
                </div>
            @endforeach
        </div>

        {{-- Tage-Grid (grid grid-cols-7 divide wie echt) --}}
        <div class="grid grid-cols-7 divide-x divide-y divide-gray-100">
            @for($cell = 0; $cell < 35; $cell++)
                @php $row = intdiv($cell, 7); $col = $cell % 7; @endphp
                <div class="min-h-[110px] p-1.5 flex flex-col bg-white">

                    {{-- Tag-Nummer-Platzhalter --}}
                    <div class="flex justify-center mb-1">
                        <div class="w-6 h-6 bg-gray-100 rounded-full"></div>
                    </div>

                    {{-- Fake Event-Balken (verteilt) --}}
                    @if(($row === 0 && $col === 1) || ($row === 1 && $col === 3) || ($row === 2 && $col === 0) || ($row === 3 && $col === 4) || ($row === 4 && $col === 2))
                        <div class="h-[18px] w-full rounded mb-0.5" style="background: #EEF2FF; border-left: 2px solid #C7D2FE;"></div>
                    @endif
                    @if(($row === 0 && $col === 4) || ($row === 1 && $col === 0) || ($row === 2 && $col === 5) || ($row === 3 && $col === 2) || ($row === 4 && $col === 6))
                        <div class="h-[18px] w-full rounded mb-0.5" style="background: #ECFDF5; border-left: 2px solid #A7F3D0;"></div>
                    @endif
                    @if(($row === 0 && $col === 3) || ($row === 2 && $col === 3) || ($row === 3 && $col === 6))
                        <div class="h-[18px] w-full rounded mb-0.5" style="background: #EEF2FF; border-left: 2px solid #C7D2FE;"></div>
                        <div class="h-[18px] w-full rounded mb-0.5" style="background: #ECFDF5; border-left: 2px solid #A7F3D0;"></div>
                    @endif
                </div>
            @endfor
        </div>

    </div>
</div>
