@php
    $network = $link['network'] ?? 'other';
    $label = $link['label'] ?? 'Social';
    $class = match ($network) {
        'facebook' => 'fb',
        'x' => 'x',
        'linkedin' => 'li',
        'youtube' => 'yt',
        default => 'other',
    };
@endphp
<a class="{{ $class }}" href="{{ $href }}" target="_blank" rel="noopener" aria-label="{{ $label }}">
    @switch($network)
        @case('facebook')
            <svg width="16" height="16" viewBox="0 0 24 24" aria-hidden="true"><path d="M13.5 21v-7h2.4l.4-2.9h-2.8V9.3c0-.8.2-1.4 1.5-1.4h1.5V5.3c-.3 0-1.2-.1-2.2-.1-2.2 0-3.7 1.3-3.7 3.8v2.1H8.2V14h2.4v7h2.9Z" fill="currentColor"></path></svg>
            @break
        @case('x')
            <svg width="16" height="16" viewBox="0 0 24 24" aria-hidden="true"><path d="M17.2 4.5h2.6l-5.7 6.5 6.7 8.5h-5.3l-4.1-5.3-4.7 5.3H4.1l6.1-6.9L3.8 4.5h5.4l3.8 5 4.2-5Zm-.9 13.4h1.4L8.1 5.9H6.6l9.7 12Z" fill="currentColor"></path></svg>
            @break
        @case('linkedin')
            <svg width="16" height="16" viewBox="0 0 24 24" aria-hidden="true"><path d="M6.9 9.4h2.6V19H6.9V9.4Zm1.3-4.1a1.5 1.5 0 1 1 0 3.1 1.5 1.5 0 0 1 0-3.1ZM11.3 9.4h2.5v1.3h.1c.4-.8 1.4-1.5 2.8-1.5 2.2 0 3.1 1.4 3.1 3.7V19h-2.6v-5.2c0-1.3-.5-2-1.6-2-1 0-1.7.7-1.7 2V19h-2.6V9.4Z" fill="currentColor"></path></svg>
            @break
        @case('youtube')
            <svg width="16" height="16" viewBox="0 0 24 24" aria-hidden="true"><path d="M21 8.6a2.4 2.4 0 0 0-1.7-1.7C17.8 6.5 12 6.5 12 6.5s-5.8 0-7.3.4A2.4 2.4 0 0 0 3 8.6C2.6 10.1 2.6 12 2.6 12s0 1.9.4 3.4a2.4 2.4 0 0 0 1.7 1.7c1.5.4 7.3.4 7.3.4s5.8 0 7.3-.4a2.4 2.4 0 0 0 1.7-1.7c.4-1.5.4-3.4.4-3.4s0-1.9-.4-3.4ZM10.2 15V9l5 3-5 3Z" fill="currentColor"></path></svg>
            @break
        @default
            <span>{{ mb_strtoupper(mb_substr($label, 0, 1)) }}</span>
    @endswitch
</a>