@props([
    'companies' => [],
])

@php
    $palette = ['#0098A6', '#21A038', '#0018A8', '#1E1E1E', '#E20074', '#003781', '#C84A1E', '#5A6E2F'];

    $companies = collect($companies)->take(6)->values();

    if ($companies->isEmpty()) {
        $companies = collect([
            ['initial' => 'S', 'name' => 'Siemens AG', 'count' => 18, 'color' => '#0098A6'],
            ['initial' => 'B', 'name' => 'BASF SE', 'count' => 14, 'color' => '#21A038'],
            ['initial' => 'D', 'name' => 'Deutsche Bank', 'count' => 11, 'color' => '#0018A8'],
            ['initial' => 'V', 'name' => 'Volkswagen AG', 'count' => 16, 'color' => '#1E1E1E'],
            ['initial' => 'T', 'name' => 'Deutsche Telekom', 'count' => 9, 'color' => '#E20074'],
            ['initial' => 'A', 'name' => 'Allianz SE', 'count' => 8, 'color' => '#003781'],
        ]);
    }
@endphp

<section>
    <header class="flex items-baseline justify-between mb-3.5 min-h-[34px]">
        <h2 class="font-serif text-[28px] font-semibold m-0 tracking-[-0.3px] leading-[1.2] text-ink">Aktive Newsrooms</h2>
        <span class="eyebrow muted text-[10px]">Heute</span>
    </header>
    <hr class="rule-strong mb-1">

    @foreach ($companies as $index => $company)
        @php
            $initial = $company['initial'] ?? strtoupper(mb_substr($company['name'] ?? '?', 0, 1));
            $name = $company['name'] ?? '';
            $count = (int) ($company['count'] ?? 0);
            $color = $company['color'] ?? $palette[$index % count($palette)];
            $slug = $company['slug'] ?? null;
            $href = $slug ? url('/newsroom/'.$slug) : route('newsrooms');
            $isLast = $loop->last;
        @endphp
        <a href="{{ $href }}"
            class="grid items-center gap-3 py-3 {{ $isLast ? '' : 'border-b border-bg-rule' }} cursor-pointer hover:bg-bg-elev transition-colors group"
            style="grid-template-columns: 32px 1fr auto;">
            <div class="w-8 h-8 text-white flex items-center justify-center text-[14px] font-bold font-serif"
                style="background: {{ $color }};">
                {{ $initial }}
            </div>
            <div class="min-w-0">
                <div class="text-[13.5px] font-semibold leading-[1.2] text-ink truncate group-hover:text-brand transition-colors">{{ $name }}</div>
                <div class="text-[11px] text-ink-3 mt-0.5">
                    <span class="font-mono">{{ $count }}</span> Meldungen letzte 7 Tage
                </div>
            </div>
            <span class="inline-flex items-center gap-1.5 text-[10.5px] font-semibold text-ink-2 px-2 py-0.5 bg-brand/[0.06] border border-brand/20 whitespace-nowrap rounded-[2px]">
                <span class="w-1.5 h-1.5 rounded-full bg-brand pulse-dot"></span>
                heute aktiv
            </span>
        </a>
    @endforeach

    <a href="{{ route('newsrooms') }}" class="block mt-3 text-[12px] text-brand font-semibold cursor-pointer hover:text-brand-deep transition-colors">
        Alle Newsrooms anzeigen →
    </a>
</section>