@props(['trainer'])

@php
    $links = collect([
        [
            'label' => 'تماس تلفنی',
            'value' => $trainer->phone,
            'href' => $trainer->phone ? 'tel:'.$trainer->phone : null,
            'icon' => 'phone',
            'color' => 'text-emerald-700',
        ],
        [
            'label' => 'واتساپ',
            'value' => $trainer->whatsapp ?? $trainer->phone,
            'href' => $trainer->whatsappUrl(),
            'icon' => 'whatsapp',
            'color' => 'text-green-700',
        ],
        [
            'label' => 'تلگرام',
            'value' => $trainer->telegram,
            'href' => $trainer->telegramUrl(),
            'icon' => 'telegram',
            'color' => 'text-sky-700',
        ],
        [
            'label' => 'اینستاگرام',
            'value' => $trainer->instagram,
            'href' => $trainer->instagramUrl(),
            'icon' => 'instagram',
            'color' => 'text-pink-700',
        ],
        [
            'label' => 'ایمیل',
            'value' => $trainer->email,
            'href' => $trainer->email ? 'mailto:'.$trainer->email : null,
            'icon' => 'mail',
            'color' => 'text-gray-700',
        ],
    ])->filter(fn ($item) => filled($item['value']));
@endphp

@if ($links->isEmpty())
    <p class="text-sm text-gray-400">اطلاعات تماسی ثبت نشده است.</p>
@else
    <div class="space-y-2">
        @foreach ($links as $link)
            @if ($link['href'])
                <a href="{{ $link['href'] }}" target="_blank" rel="noopener noreferrer" class="contact-btn">
                    <span class="flex size-9 items-center justify-center rounded-lg bg-gray-50 text-gray-600">
                        @include('components.icons.contact-'.$link['icon'])
                    </span>
                    <span class="min-w-0 flex-1">
                        <span class="block text-xs text-gray-500">{{ $link['label'] }}</span>
                        <span class="block truncate font-medium {{ $link['color'] }}" dir="ltr">{{ $link['value'] }}</span>
                    </span>
                    <svg class="size-4 shrink-0 text-gray-400" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                        <path fill-rule="evenodd" d="M4.25 5.5a.75.75 0 0 1 .75-.75h8.5a.75.75 0 0 1 .75.75v8.5a.75.75 0 0 1-1.5 0V7.56l-7.22 7.22a.75.75 0 0 1-1.06-1.06l7.22-7.22H5a.75.75 0 0 1-.75-.75Z" clip-rule="evenodd"/>
                    </svg>
                </a>
            @else
                <div class="contact-btn cursor-default hover:bg-white">
                    <span class="flex size-9 items-center justify-center rounded-lg bg-gray-50 text-gray-600">
                        @include('components.icons.contact-'.$link['icon'])
                    </span>
                    <span class="min-w-0 flex-1">
                        <span class="block text-xs text-gray-500">{{ $link['label'] }}</span>
                        <span class="block truncate font-medium text-gray-700" dir="ltr">{{ $link['value'] }}</span>
                    </span>
                </div>
            @endif
        @endforeach
    </div>
@endif