{{-- Contacts Card - Card with contacts table --}}
{{-- Props: $entityType, $entityId, $contacts, $canEdit = true --}}
@php
    $canEdit = $canEdit ?? true;
    $contactTypes = [
        'primary' => __('Primary'),
        'billing' => __('Billing'),
        'technical' => __('Technical'),
        'sales' => __('Sales'),
        'support' => __('Support'),
        'other' => __('Other'),
    ];
@endphp

<div class="card mb-4">
    <div class="card-header d-flex justify-content-between align-items-center">
        <h5 class="mb-0">
            <i class="bx bx-user me-1"></i>{{ __('Contacts') }}
            <span class="badge bg-label-primary ms-2">{{ $contacts->count() }}</span>
        </h5>
        @if($canEdit)
        <button type="button" class="btn btn-sm btn-primary" onclick="openContactOffcanvas()">
            <i class="bx bx-plus me-1"></i>{{ __('Add') }}
        </button>
        @endif
    </div>
    <div class="card-body">
        @if($contacts->count() > 0)
            <div class="table-responsive">
                <table class="table table-sm table-hover">
                    <thead>
                        <tr>
                            <th>{{ __('Name') }}</th>
                            <th>{{ __('Position') }}</th>
                            <th>{{ __('Email') }}</th>
                            <th>{{ __('Phone') }}</th>
                            <th class="text-center">{{ __('Primary') }}</th>
                            @if($canEdit)
                            <th class="text-center" style="width: 80px;">{{ __('Actions') }}</th>
                            @endif
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($contacts as $contact)
                        <tr>
                            <td>
                                <div class="d-flex align-items-center">
                                    <div class="avatar avatar-sm me-2">
                                        <span class="avatar-initial rounded-circle bg-label-primary">
                                            {{ strtoupper(substr($contact->first_name, 0, 1)) }}{{ strtoupper(substr($contact->last_name, 0, 1)) }}
                                        </span>
                                    </div>
                                    <div>
                                        <span class="fw-medium">{{ $contact->full_name }}</span>
                                        @if($contact->contact_type && $contact->contact_type !== 'other')
                                        <br><small class="text-muted">{{ $contactTypes[$contact->contact_type] ?? ucfirst($contact->contact_type) }}</small>
                                        @endif
                                    </div>
                                </div>
                            </td>
                            <td>
                                <span>{{ $contact->job_title ?? '-' }}</span>
                                @if($contact->department)
                                <br><small class="text-muted">{{ $contact->department }}</small>
                                @endif
                            </td>
                            <td>
                                @if($contact->email)
                                <a href="mailto:{{ $contact->email }}" class="text-body">
                                    <i class="bx bx-envelope me-1"></i>{{ $contact->email }}
                                </a>
                                @else
                                <span class="text-muted">-</span>
                                @endif
                            </td>
                            <td>
                                @if($contact->phone)
                                <a href="tel:{{ $contact->phone }}" class="text-body">
                                    <i class="bx bx-phone me-1"></i>{{ $contact->phone }}
                                </a>
                                @elseif($contact->mobile)
                                <a href="tel:{{ $contact->mobile }}" class="text-body">
                                    <i class="bx bx-mobile me-1"></i>{{ $contact->mobile }}
                                </a>
                                @else
                                <span class="text-muted">-</span>
                                @endif
                            </td>
                            <td class="text-center">
                                @if($contact->is_primary)
                                <span class="badge bg-success">{{ __('Yes') }}</span>
                                @else
                                <span class="badge bg-secondary">{{ __('No') }}</span>
                                @endif
                            </td>
                            @if($canEdit)
                            <td class="text-center">
                                <div class="dropdown">
                                    <button class="btn btn-sm btn-icon btn-text-secondary rounded-pill dropdown-toggle hide-arrow" data-bs-toggle="dropdown">
                                        <i class="bx bx-dots-vertical-rounded"></i>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li>
                                            <a class="dropdown-item" href="javascript:void(0);" onclick="editContact({{ $contact->id }})">
                                                <i class="bx bx-edit me-1"></i>{{ __('Edit') }}
                                            </a>
                                        </li>
                                        <li>
                                            <a class="dropdown-item text-danger" href="javascript:void(0);" onclick="deleteContact({{ $contact->id }})">
                                                <i class="bx bx-trash me-1"></i>{{ __('Delete') }}
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </td>
                            @endif
                        </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        @else
            <div class="text-center py-5">
                <div class="mb-3">
                    <i class="bx bx-user-plus bx-lg text-muted"></i>
                </div>
                <p class="text-muted mb-3">{{ __('No contacts found') }}</p>
                @if($canEdit)
                <button type="button" class="btn btn-primary" onclick="openContactOffcanvas()">
                    <i class="bx bx-plus me-1"></i>{{ __('Add First Contact') }}
                </button>
                @endif
            </div>
        @endif
    </div>
</div>

{{-- Include the offcanvas form --}}
@include('systemcore::partials.entity._contact_offcanvas', [
    'entityType' => $entityType,
    'entityId' => $entityId
])
