<x-app-layout>

<x-module-hero
    title="Partner: {{ $partner->organization_name }}"
    description="{{ $partner->type_label }}{{ $partner->category ? ' · ' . ucfirst($partner->category) : '' }}"
    icon="fa-building">

    <x-slot name="backButton">
        <a href="{{ route('partners.index') }}"
           class="inline-flex items-center gap-1 text-sm text-[#475569] hover:text-[#1e293b] transition-colors">
            <i class="fas fa-arrow-left text-xs"></i> Back to Partners
        </a>
    </x-slot>

    <x-slot name="tabs">
        @can('view partners')
        <a href="{{ route('partners.index') }}"
           class="module-hero-tab {{ request()->routeIs('partners.index') && !request()->routeIs('partners.forum.*') ? 'border-b-2 border-[#1e293b]' : 'opacity-70 hover:opacity-100 transition-opacity' }}
                  inline-flex items-center gap-2 px-4 py-3 text-[#1e293b] text-sm font-medium
                  md:w-auto w-full border-b border-[#cbd5e1] md:border-b-0">
            <i class="fas fa-building text-sm"></i> All Partners
        </a>
        @endcan
        @can('create partners')
        <a href="{{ route('partners.create') }}"
           class="module-hero-tab {{ request()->routeIs('partners.create') ? 'border-b-2 border-[#1e293b]' : 'opacity-70 hover:opacity-100 transition-opacity' }}
                  inline-flex items-center gap-2 px-4 py-3 text-[#1e293b] text-sm font-medium
                  md:w-auto w-full border-b border-[#cbd5e1] md:border-b-0">
            <i class="fas fa-plus text-sm"></i> Add Partner
        </a>
        @endcan
        @can('view forum')
        <a href="{{ route('partners.forum.index') }}"
           class="module-hero-tab {{ request()->routeIs('partners.forum.*') ? 'border-b-2 border-[#1e293b]' : 'opacity-70 hover:opacity-100 transition-opacity' }}
                  inline-flex items-center gap-2 px-4 py-3 text-[#1e293b] text-sm font-medium
                  md:w-auto w-full border-b border-[#cbd5e1] md:border-b-0">
            <i class="fas fa-comments text-sm"></i> Forum
        </a>
        @endcan
    </x-slot>

    <x-slot name="actions">
        @if(auth()->user()->can('edit partners') || (auth()->user()->can('edit own partners') && auth()->user()->partner?->id === $partner->id))
        <a href="{{ route('partners.edit', $partner) }}"
           class="inline-flex items-center gap-2 px-4 py-2 bg-[#1e293b] hover:bg-[#334155] text-white text-sm font-medium rounded-lg transition-colors">
            <i class="fas fa-edit"></i> Edit
        </a>
        @endif
        <a href="{{ route('partners.public.show', $partner) }}" target="_blank"
           class="inline-flex items-center gap-2 px-4 py-2 bg-[#475569] hover:bg-[#334155] text-white text-sm font-medium rounded-lg transition-colors">
            <i class="fas fa-external-link-alt"></i> Public Profile
        </a>
    </x-slot>

</x-module-hero>

<div class="p-6">
    @if(session('success'))
        <div class="mb-4 p-4 bg-green-100 border border-green-400 text-green-700 rounded-lg flex items-center gap-2">
            <i class="fas fa-check-circle"></i> {{ session('success') }}
        </div>
    @endif

    <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">

        {{-- Main Content --}}
        <div class="lg:col-span-2 space-y-6">

            {{-- Organization Header Card --}}
            <div class="bg-white rounded-lg shadow-sm border border-gray-200 overflow-hidden">
                @if($partner->banner_image)
                    <div class="h-40 bg-gray-900 relative">
                        <img src="{{ asset('storage/' . $partner->banner_image) }}"
                             alt="{{ $partner->organization_name }}"
                             class="w-full h-full object-cover opacity-80">
                    </div>
                @endif
                <div class="p-6">
                    <div class="flex items-start gap-4">
                        @if($partner->logo)
                            <img src="{{ asset('storage/' . $partner->logo) }}"
                                 alt="{{ $partner->organization_name }}"
                                 class="w-16 h-16 rounded-lg object-contain border border-gray-200 flex-shrink-0">
                        @else
                            <div class="w-16 h-16 bg-blue-100 rounded-lg flex items-center justify-center flex-shrink-0">
                                <i class="fas fa-building text-blue-600 text-xl"></i>
                            </div>
                        @endif
                        <div class="flex-1 min-w-0">
                            <div class="flex items-start justify-between gap-2">
                                <h2 class="text-xl font-bold text-gray-900">{{ $partner->organization_name }}</h2>
                                <div class="flex gap-2 flex-shrink-0">
                                    @if($partner->is_verified)
                                        <span class="px-2 py-0.5 bg-green-100 text-green-800 text-xs font-semibold rounded-full">
                                            <i class="fas fa-check-circle mr-1"></i>Verified
                                        </span>
                                    @endif
                                    @if($partner->is_featured)
                                        <span class="px-2 py-0.5 bg-yellow-100 text-yellow-800 text-xs font-semibold rounded-full">
                                            <i class="fas fa-star mr-1"></i>Featured
                                        </span>
                                    @endif
                                </div>
                            </div>
                            @if($partner->legal_name && $partner->legal_name !== $partner->organization_name)
                                <p class="text-sm text-gray-500 mt-0.5">Legal: {{ $partner->legal_name }}</p>
                            @endif
                        </div>
                    </div>
                </div>
            </div>

            {{-- About --}}
            <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6">
                <h3 class="text-base font-semibold text-gray-900 mb-3 flex items-center gap-2">
                    <i class="fas fa-info-circle text-blue-600"></i> About
                </h3>
                @if($partner->description)
                    <p class="text-gray-700 leading-relaxed text-sm">{{ $partner->description }}</p>
                @else
                    <p class="text-gray-400 italic text-sm">No description provided.</p>
                @endif
                @if($partner->mission_statement)
                    <div class="mt-4 p-4 bg-blue-50 rounded-lg border-l-4 border-blue-500">
                        <p class="text-xs font-semibold text-blue-900 mb-1">Mission Statement</p>
                        <p class="text-sm text-blue-800 italic">{{ $partner->mission_statement }}</p>
                    </div>
                @endif
                @if($partner->services_offered && is_array($partner->services_offered) && count($partner->services_offered) > 0)
                    <div class="mt-4">
                        <p class="text-xs font-semibold text-gray-600 mb-2">Services Offered</p>
                        <div class="flex flex-wrap gap-2">
                            @foreach($partner->services_offered as $service)
                                <span class="px-2 py-0.5 bg-gray-100 text-gray-700 text-xs rounded-full">{{ $service }}</span>
                            @endforeach
                        </div>
                    </div>
                @endif
            </div>

            {{-- Partnership Details --}}
            <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6">
                <h3 class="text-base font-semibold text-gray-900 mb-4 flex items-center gap-2">
                    <i class="fas fa-file-contract text-blue-600"></i> Partnership Details
                </h3>
                <div class="grid grid-cols-2 gap-3">
                    <div class="p-3 bg-gray-50 rounded-lg">
                        <p class="text-xs text-gray-500 mb-1">Status</p>
                        @php
                            $sc = ['active'=>'text-green-600','pending'=>'text-yellow-600','inactive'=>'text-gray-600','suspended'=>'text-red-600'];
                        @endphp
                        <p class="font-semibold text-sm {{ $sc[$partner->partnership_status] ?? 'text-gray-600' }}">
                            {{ ucfirst($partner->partnership_status) }}
                        </p>
                    </div>
                    <div class="p-3 bg-gray-50 rounded-lg">
                        <p class="text-xs text-gray-500 mb-1">Level</p>
                        <p class="font-semibold text-sm capitalize">{{ $partner->partnership_level ?? 'Bronze' }}</p>
                    </div>
                    <div class="p-3 bg-gray-50 rounded-lg">
                        <p class="text-xs text-gray-500 mb-1">Start Date</p>
                        <p class="font-semibold text-sm">
                            {{ $partner->partnership_start_date ? $partner->partnership_start_date->format('M d, Y') : 'N/A' }}
                        </p>
                    </div>
                    <div class="p-3 bg-gray-50 rounded-lg">
                        <p class="text-xs text-gray-500 mb-1">End Date</p>
                        <p class="font-semibold text-sm">
                            @if($partner->partnership_end_date)
                                @if($partner->isPartnershipExpiringSoon())
                                    <span class="text-orange-600">
                                        {{ $partner->partnership_end_date->format('M d, Y') }}
                                        <i class="fas fa-exclamation-triangle ml-1"></i>
                                    </span>
                                @else
                                    {{ $partner->partnership_end_date->format('M d, Y') }}
                                @endif
                            @else
                                N/A
                            @endif
                        </p>
                    </div>
                </div>
            </div>

            {{-- MOUs & Agreements --}}
            @if($partner->partnerships->count() > 0)
                <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6">
                    <h3 class="text-base font-semibold text-gray-900 mb-4 flex items-center gap-2">
                        <i class="fas fa-file-signature text-blue-600"></i>
                        MOUs & Agreements ({{ $partner->partnerships->count() }})
                    </h3>
                    <div class="space-y-3">
                        @foreach($partner->partnerships as $partnership)
                            <div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg">
                                <div>
                                    <p class="font-medium text-gray-900 text-sm">{{ $partnership->title }}</p>
                                    <p class="text-xs text-gray-500">{{ $partnership->type_label }}</p>
                                </div>
                                <div class="text-right">
                                    <span class="px-2 py-0.5 text-xs font-semibold rounded-full
                                        @if($partnership->status === 'active') bg-green-100 text-green-800
                                        @elseif($partnership->status === 'expired') bg-red-100 text-red-800
                                        @else bg-gray-100 text-gray-800 @endif">
                                        {{ ucfirst($partnership->status) }}
                                    </span>
                                    @if($partnership->end_date)
                                        <p class="text-xs text-gray-400 mt-1">Until {{ $partnership->end_date->format('M d, Y') }}</p>
                                    @endif
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
            @endif

            {{-- Recent Forum Activity --}}
            @if($partner->forumThreads->count() > 0)
                <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-6">
                    <h3 class="text-base font-semibold text-gray-900 mb-4 flex items-center gap-2">
                        <i class="fas fa-comments text-blue-600"></i> Recent Forum Activity
                    </h3>
                    <div class="space-y-2">
                        @foreach($partner->forumThreads as $thread)
                            <a href="{{ route('partners.forum.show', $thread) }}"
                               class="flex items-center justify-between p-3 bg-gray-50 rounded-lg hover:bg-gray-100 transition">
                                <div>
                                    <p class="font-medium text-gray-900 text-sm">{{ $thread->title }}</p>
                                    <p class="text-xs text-gray-500">{{ $thread->replies_count }} replies · {{ $thread->views_count }} views</p>
                                </div>
                                <span class="text-xs text-gray-400">{{ $thread->created_at->diffForHumans() }}</span>
                            </a>
                        @endforeach
                    </div>
                </div>
            @endif
        </div>

        {{-- Sidebar --}}
        <div class="space-y-6">

            {{-- Quick Actions --}}
            <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-5">
                <h3 class="text-sm font-semibold text-gray-900 mb-3">Quick Actions</h3>
                <div class="space-y-2">
                    @can('verify partners')
                        @if(!$partner->is_verified)
                            <button onclick="verifyPartner()"
                                    class="w-full flex items-center gap-2 px-3 py-2 bg-green-50 text-green-700 rounded-lg hover:bg-green-100 transition text-sm">
                                <i class="fas fa-check-circle"></i> Verify Partner
                            </button>
                        @endif
                    @endcan
                    @can('feature partners')
                        <button onclick="toggleFeatured()"
                                class="w-full flex items-center gap-2 px-3 py-2 bg-yellow-50 text-yellow-700 rounded-lg hover:bg-yellow-100 transition text-sm">
                            <i class="fas fa-star"></i>
                            {{ $partner->is_featured ? 'Remove Featured' : 'Make Featured' }}
                        </button>
                    @endcan
                    @can('delete partners')
                        <form action="{{ route('partners.destroy', $partner) }}" method="POST"
                              onsubmit="return confirm('Delete this partner? This cannot be undone.')">
                            @csrf
                            @method('DELETE')
                            <button type="submit"
                                    class="w-full flex items-center gap-2 px-3 py-2 bg-red-50 text-red-700 rounded-lg hover:bg-red-100 transition text-sm">
                                <i class="fas fa-trash"></i> Delete Partner
                            </button>
                        </form>
                    @endcan
                </div>
            </div>

            {{-- Contact Information --}}
            <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-5">
                <h3 class="text-sm font-semibold text-gray-900 mb-3 flex items-center gap-2">
                    <i class="fas fa-address-card text-blue-600"></i> Contact
                </h3>
                <ul class="space-y-2 text-sm">
                    @if($partner->email)
                        <li class="flex items-center gap-2">
                            <i class="fas fa-envelope text-gray-400 w-4"></i>
                            <a href="mailto:{{ $partner->email }}" class="text-blue-600 hover:underline truncate">{{ $partner->email }}</a>
                        </li>
                    @endif
                    @if($partner->phone)
                        <li class="flex items-center gap-2">
                            <i class="fas fa-phone text-gray-400 w-4"></i>
                            <a href="tel:{{ $partner->phone }}" class="text-gray-700">{{ $partner->phone }}</a>
                        </li>
                    @endif
                    @if($partner->website)
                        <li class="flex items-center gap-2">
                            <i class="fas fa-globe text-gray-400 w-4"></i>
                            <a href="{{ $partner->website }}" target="_blank" class="text-blue-600 hover:underline">Visit Website</a>
                        </li>
                    @endif
                    @if($partner->full_address)
                        <li class="flex items-start gap-2">
                            <i class="fas fa-map-marker-alt text-gray-400 w-4 mt-0.5"></i>
                            <span class="text-gray-700">{{ $partner->full_address }}</span>
                        </li>
                    @endif
                </ul>
            </div>

            {{-- Key Contacts --}}
            @if($partner->contacts->count() > 0)
                <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-5">
                    <h3 class="text-sm font-semibold text-gray-900 mb-3 flex items-center gap-2">
                        <i class="fas fa-users text-blue-600"></i> Key Contacts
                    </h3>
                    <div class="space-y-3">
                        @foreach($partner->contacts as $contact)
                            <div class="flex items-start gap-3">
                                <div class="w-8 h-8 bg-blue-100 rounded-full flex items-center justify-center flex-shrink-0">
                                    <span class="text-blue-600 font-semibold text-xs">{{ Str::substr($contact->name, 0, 1) }}</span>
                                </div>
                                <div>
                                    <p class="font-medium text-gray-900 text-sm">{{ $contact->name }}</p>
                                    <p class="text-xs text-gray-500">{{ $contact->role_label }}</p>
                                    @if($contact->email)
                                        <a href="mailto:{{ $contact->email }}" class="text-xs text-blue-600 hover:underline">{{ $contact->email }}</a>
                                    @endif
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
            @endif

            {{-- Internal Notes --}}
            @if($partner->internal_notes)
                <div class="bg-yellow-50 rounded-lg border border-yellow-200 p-5">
                    <h3 class="text-sm font-semibold text-yellow-900 mb-2 flex items-center gap-2">
                        <i class="fas fa-sticky-note text-yellow-600"></i> Internal Notes
                    </h3>
                    <p class="text-yellow-800 text-sm">{{ $partner->internal_notes }}</p>
                </div>
            @endif

            {{-- Metadata --}}
            <div class="bg-white rounded-lg shadow-sm border border-gray-200 p-5">
                <h3 class="text-sm font-semibold text-gray-900 mb-3">Metadata</h3>
                <ul class="space-y-1.5 text-xs">
                    <li class="flex justify-between">
                        <span class="text-gray-500">Created</span>
                        <span class="text-gray-900">{{ $partner->created_at->format('M d, Y H:i') }}</span>
                    </li>
                    <li class="flex justify-between">
                        <span class="text-gray-500">Updated</span>
                        <span class="text-gray-900">{{ $partner->updated_at->format('M d, Y H:i') }}</span>
                    </li>
                    @if($partner->verified_at)
                        <li class="flex justify-between">
                            <span class="text-gray-500">Verified</span>
                            <span class="text-gray-900">{{ $partner->verified_at->format('M d, Y') }}</span>
                        </li>
                    @endif
                    @if($partner->user)
                        <li class="flex justify-between">
                            <span class="text-gray-500">Linked User</span>
                            <span class="text-gray-900">{{ $partner->user->name }}</span>
                        </li>
                    @endif
                </ul>
            </div>
        </div>
    </div>
</div>

@push('scripts')
<script>
    function verifyPartner() {
        if (!confirm('Verify this partner?')) return;
        fetch(`/api/partners/{{ $partner->id }}/verify`, {
            method: 'POST',
            headers: { 'Content-Type': 'application/json', 'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content }
        }).then(r => r.json()).then(data => {
            if (data.success) { window.showToast(data.message, 'success'); setTimeout(() => location.reload(), 1000); }
            else { window.showToast(data.message || 'Failed', 'error'); }
        });
    }
    function toggleFeatured() {
        fetch(`/api/partners/{{ $partner->id }}/toggle-featured`, {
            method: 'POST',
            headers: { 'Content-Type': 'application/json', 'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content }
        }).then(r => r.json()).then(data => {
            if (data.success) { location.reload(); }
            else { window.showToast(data.message || 'Failed', 'error'); }
        });
    }
</script>
@endpush

</x-app-layout>
