{{--
    Icon resolver for the public website.

    Order of resolution:
      1. brand/social glyph shipped in resources/views/website/icons
      2. supplementary outline icons defined below
      3. the app-wide <x-ui.icon> set
      4. a visible neutral placeholder

    Step 4 matters: <x-ui.icon> renders nothing for an unknown name, which in a
    builder context looks like a broken layout with no explanation. A visible
    placeholder tells the editor the icon name is wrong.
--}}
@props(['name' => null, 'class' => 'w-5 h-5'])

@php
    $key = \Illuminate\Support\Str::of((string) $name)->lower()->trim()->replace([' ', '_'], '-')->value();

    $aliases = [
        'x' => 'twitter', 'x-twitter' => 'twitter', 'fb' => 'facebook',
        'ig' => 'instagram', 'yt' => 'youtube', 'location' => 'map-pin',
        'mail' => 'envelope', 'email' => 'envelope', 'tel' => 'phone',
        'mobile' => 'device-phone-mobile', 'close' => 'x-mark', 'tick' => 'check',
    ];
    $key = $aliases[$key] ?? $key;

    $socialView = 'website.icons.' . $key;

    // Outline paths on a 24x24 grid, stroked with currentColor.
    $supplementary = [
        'map-pin' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 21s7-5.686 7-11a7 7 0 10-14 0c0 5.314 7 11 7 11z"/><circle cx="12" cy="10" r="2.5" stroke-width="2"/>',
        'phone' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 5a1 1 0 011-1h2.2a1 1 0 01.97.757l.75 3a1 1 0 01-.29.98l-1.4 1.32a13 13 0 005.71 5.71l1.32-1.4a1 1 0 01.98-.29l3 .75A1 1 0 0120 16.8V19a1 1 0 01-1 1A15 15 0 014 5z"/>',
        'envelope' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16a1 1 0 011 1v10a1 1 0 01-1 1H4a1 1 0 01-1-1V7a1 1 0 011-1z"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.5 7l8.5 6 8.5-6"/>',
        'check' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>',
        'building-office' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 21V5a2 2 0 012-2h6a2 2 0 012 2v16M15 21V9h3a2 2 0 012 2v10M3 21h18"/><path stroke-linecap="round" stroke-width="2" d="M8 7h2M8 11h2M8 15h2"/>',
        'trophy' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 4h8v5a4 4 0 11-8 0V4z"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 5H5.5A1.5 1.5 0 004 6.5C4 8.5 5.5 10 8 10M16 5h2.5A1.5 1.5 0 0120 6.5c0 2-1.5 3.5-4 3.5M10 13v3M14 13v3M8 20h8"/>',
        'users' => '<circle cx="9" cy="8" r="3.2" stroke-width="2"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.5 19a5.5 5.5 0 0111 0M16 6.2a3 3 0 010 5.6M17.5 19a5 5 0 00-2-4"/>',
        'bolt' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 3L5 13h6l-1 8 8-10h-6l1-8z"/>',
        'lock-closed' => '<rect x="5" y="10" width="14" height="10" rx="2" stroke-width="2"/><path stroke-linecap="round" stroke-width="2" d="M8.5 10V7.5a3.5 3.5 0 117 0V10"/>',
        'eye' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12z"/><circle cx="12" cy="12" r="3" stroke-width="2"/>',
        'flag' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 21V4m0 0h11l-2 3.5L16 11H5"/>',
        'award' => '<circle cx="12" cy="9" r="5" stroke-width="2"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 13.5L8 21l4-2 4 2-1-7.5"/>',
        'academic-cap' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4L2.5 8.5 12 13l9.5-4.5L12 4z"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6.5 10.7V15c0 1.4 2.5 2.8 5.5 2.8s5.5-1.4 5.5-2.8v-4.3M20.5 9v5"/>',
        'sparkles' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3l1.6 4.4L18 9l-4.4 1.6L12 15l-1.6-4.4L6 9l4.4-1.6L12 3zM18 15l.8 2.2L21 18l-2.2.8L18 21l-.8-2.2L15 18l2.2-.8L18 15z"/>',
        'chat-bubble' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 12a7 7 0 01-7 7H8l-4 3 1-4.2A7 7 0 1120 12z"/>',
        'x-mark' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>',
        'star' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3.5l2.6 5.3 5.9.9-4.3 4.1 1 5.8-5.2-2.7-5.2 2.7 1-5.8-4.3-4.1 5.9-.9z"/>',
        'globe' => '<circle cx="12" cy="12" r="9" stroke-width="2"/><path stroke-width="2" d="M3 12h18M12 3c2.5 2.6 2.5 15.4 0 18M12 3c-2.5 2.6-2.5 15.4 0 18"/>',
        'device-phone-mobile' => '<rect x="7" y="3" width="10" height="18" rx="2" stroke-width="2"/><path stroke-linecap="round" stroke-width="2" d="M11 18.5h2"/>',
        'arrow-down-tray' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v12m0 0l-4-4m4 4l4-4M4 19h16"/>',
        'link' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 13a4 4 0 006 .5l2.5-2.5a4 4 0 00-5.66-5.66L11.5 6.7M14 11a4 4 0 00-6-.5L5.5 13a4 4 0 005.66 5.66l1.3-1.3"/>',
        'share' => '<circle cx="18" cy="6" r="2.5" stroke-width="2"/><circle cx="6" cy="12" r="2.5" stroke-width="2"/><circle cx="18" cy="18" r="2.5" stroke-width="2"/><path stroke-width="2" d="M8.3 10.8l7.4-3.6M8.3 13.2l7.4 3.6"/>',
        'whatsapp' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.5 20.5l1.3-4a8 8 0 113.2 3.1z"/><path stroke-linecap="round" stroke-width="2" d="M9 9.5c0 3 2.5 5.5 5.5 5.5"/>',
        'squares-2x2' => '<rect x="3" y="3" width="7" height="7" rx="1.5" stroke-width="2"/><rect x="14" y="3" width="7" height="7" rx="1.5" stroke-width="2"/><rect x="3" y="14" width="7" height="7" rx="1.5" stroke-width="2"/><rect x="14" y="14" width="7" height="7" rx="1.5" stroke-width="2"/>',
        'view-columns' => '<rect x="3" y="4" width="18" height="16" rx="2" stroke-width="2"/><path stroke-width="2" d="M9 4v16M15 4v16"/>',
        'rectangle-group' => '<rect x="3" y="4" width="8" height="7" rx="1.5" stroke-width="2"/><rect x="13" y="4" width="8" height="12" rx="1.5" stroke-width="2"/><rect x="3" y="13" width="8" height="7" rx="1.5" stroke-width="2"/>',
        'identification' => '<rect x="3" y="5" width="18" height="14" rx="2" stroke-width="2"/><circle cx="9" cy="11" r="2" stroke-width="2"/><path stroke-linecap="round" stroke-width="2" d="M6 16c.8-1.3 1.8-2 3-2s2.2.7 3 2M14.5 10H18M14.5 13.5H18"/>',
        'arrows-up-down' => '<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 4v16m0-16L5 7m3-3l3 3M16 20V4m0 16l-3-3m3 3l3-3"/>',
    ];
@endphp

@if (view()->exists($socialView))
    @include($socialView, ['class' => $class])
@elseif (isset($supplementary[$key]))
    <svg {{ $attributes->merge(['class' => $class]) }} fill="none" stroke="currentColor"
         viewBox="0 0 24 24" aria-hidden="true" focusable="false">{!! $supplementary[$key] !!}</svg>
@elseif ($key !== '')
    @php
        // Probe the shared set; it renders empty output for unknown names.
        $shared = trim(\Illuminate\Support\Facades\Blade::render(
            '<x-ui.icon :name="$n" :class="$c" />',
            ['n' => $key, 'c' => $class],
        ));
    @endphp
    @if ($shared !== '')
        {!! $shared !!}
    @else
        <svg {{ $attributes->merge(['class' => $class]) }} fill="none" stroke="currentColor"
             viewBox="0 0 24 24" aria-hidden="true" focusable="false"
             data-unknown-icon="{{ $key }}">
            <rect x="3.5" y="3.5" width="17" height="17" rx="3" stroke-width="1.5" stroke-dasharray="3 3"/>
        </svg>
    @endif
@endif
