<x-app-layout>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Home') }}
        </h2>
    </x-slot>

    <div class="py-8">
        <div class="max-w-6xl mx-auto sm:px-6 lg:px-8 space-y-6">

            {{-- Saludo --}}
            <div>
                <h3 class="text-lg font-bold">{{ __('Hello, :name', ['name' => $user?->first_name ?? auth()->user()->name]) }}</h3>
                <p class="text-sm text-base-content/60">{{ __('A quick summary of your items.') }}</p>
            </div>

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

                {{-- ───────────── Mis proyectos ───────────── --}}
                <div class="card bg-base-100 border border-base-300">
                    <div class="card-body p-4">
                        <div class="flex items-center justify-between mb-1">
                            <h3 class="font-bold flex items-center gap-2">
                                <x-heroicon-o-folder class="w-5 h-5" /> {{ __('My Projects') }}
                                <span class="badge badge-sm">{{ $projectsCount }}</span>
                            </h3>
                            <a href="{{ route('projects.index') }}" wire:navigate class="link link-primary text-sm">{{ __('View all') }}</a>
                        </div>
                        @forelse($projects as $project)
                            @php $pct = round($project->phases->avg('progress_percent') ?? 0); @endphp
                            <a href="{{ route('projects.dashboard', $project) }}" wire:navigate
                               class="flex items-center gap-3 py-2 border-b border-base-200 last:border-0 hover:bg-base-200/50 rounded px-1">
                                <div class="flex-1 min-w-0">
                                    <div class="font-medium text-sm truncate">{{ $project->name }}</div>
                                    <progress class="progress progress-primary w-full h-1.5 mt-1" value="{{ $pct }}" max="100"></progress>
                                </div>
                                <span class="text-xs text-base-content/50 w-9 text-right">{{ $pct }}%</span>
                            </a>
                        @empty
                            <p class="text-sm text-base-content/40 py-3">{{ __('You have no assigned projects.') }}</p>
                        @endforelse
                    </div>
                </div>

                {{-- ───────────── Mis tareas ───────────── --}}
                <div class="card bg-base-100 border border-base-300">
                    <div class="card-body p-4">
                        <h3 class="font-bold flex items-center gap-2 mb-1">
                            <x-heroicon-o-clipboard-document-check class="w-5 h-5" /> {{ __('My Tasks') }}
                            <span class="badge badge-sm">{{ $myTasksCount }}</span>
                        </h3>
                        @forelse($myTasks as $task)
                            <a href="{{ $task->issue ? route('projects.issues.show', [$task->issue->project_id, $task->issue_id]) : '#' }}"
                               wire:navigate
                               class="flex items-center gap-2 py-2 border-b border-base-200 last:border-0 hover:bg-base-200/50 rounded px-1">
                                <div class="flex-1 min-w-0">
                                    <div class="text-sm truncate">{{ $task->title }}</div>
                                    <div class="text-xs text-base-content/50 truncate">{{ $task->issue?->project?->name ?? '—' }}</div>
                                </div>
                                @if($task->due_date)
                                    <span class="text-xs whitespace-nowrap {{ $task->is_overdue ? 'text-error font-semibold' : 'text-base-content/50' }}">
                                        {{ $task->due_date->format('d/m/Y') }}
                                    </span>
                                @endif
                            </a>
                        @empty
                            @if($myTasksFromTasks->isNotEmpty())
                                @foreach($myTasksFromTasks as $task)
                                    <a href="{{ route('projects.tasks.show', [$task->project_id, $task->id]) }}"
                                       wire:navigate
                                       class="flex items-center gap-2 py-2 border-b border-base-200 last:border-0 hover:bg-base-200/50 rounded px-1">
                                        <div class="flex-1 min-w-0">
                                            <div class="text-sm truncate">{{ $task->title }}</div>
                                            <div class="text-xs text-base-content/50 truncate">{{ $task->project?->name ?? '—' }}</div>
                                        </div>
                                        @if($task->due_date)
                                            <span class="text-xs whitespace-nowrap {{ $task->is_overdue ? 'text-error font-semibold' : 'text-base-content/50' }}">
                                                {{ $task->due_date->format('d/m/Y') }}
                                            </span>
                                        @endif
                                    </a>
                                @endforeach
                            @else
                                <p class="text-sm text-base-content/40 py-3">{{ __('You have no pending tasks. 🎉') }}</p>
                            @endif
                        @endforelse
                    </div>
                </div>

                {{-- ───────────── Mis incidencias ───────────── --}}
                <div class="card bg-base-100 border border-base-300">
                    <div class="card-body p-4">
                        <h3 class="font-bold flex items-center gap-2 mb-1">
                            <x-heroicon-o-exclamation-triangle class="w-5 h-5" /> {{ __('Assigned Issues') }}
                            <span class="badge badge-sm">{{ $myIssuesCount }}</span>
                        </h3>
                        @forelse($myIssues as $issue)
                            @php
                                $sLabel = ['open'=>__('Open'),'in_review'=>__('In Review')][$issue->status] ?? $issue->status;
                            @endphp
                            <a href="{{ route('projects.issues.show', [$issue->project_id, $issue->id]) }}" wire:navigate
                               class="flex items-center gap-2 py-2 border-b border-base-200 last:border-0 hover:bg-base-200/50 rounded px-1">
                                <span class="badge badge-xs shrink-0" style="background-color: {{ $issue->priority_color }}; color:#fff; border:0;">&nbsp;</span>
                                <div class="flex-1 min-w-0">
                                    <div class="text-sm truncate">{{ $issue->title }}</div>
                                    <div class="text-xs text-base-content/50 truncate">{{ $issue->project?->name ?? '—' }}</div>
                                </div>
                                <span class="badge badge-ghost badge-xs whitespace-nowrap">{{ $sLabel }}</span>
                            </a>
                        @empty
                            <p class="text-sm text-base-content/40 py-3">{{ __('You have no assigned issues.') }}</p>
                        @endforelse
                    </div>
                </div>

                {{-- ───────────── Notificaciones ───────────── --}}
                <div class="card bg-base-100 border border-base-300">
                    <div class="card-body p-4">
                        <h3 class="font-bold flex items-center gap-2 mb-1">
                            <x-heroicon-o-bell class="w-5 h-5" /> {{ __('Notifications') }}
                            @if($unreadCount)<span class="badge badge-error badge-sm">{{ $unreadCount }}</span>@endif
                        </h3>
                        @forelse($notifications as $note)
                            @php
                                $d = $note->data;
                                $url = (isset($d['project_id'], $d['issue_id']))
                                    ? route('projects.issues.show', [$d['project_id'], $d['issue_id']])
                                    : null;
                            @endphp
                            <a href="{{ $url ?? '#' }}" @if($url) wire:navigate @endif
                               class="flex items-start gap-2 py-2 border-b border-base-200 last:border-0 hover:bg-base-200/50 rounded px-1 {{ is_null($note->read_at) ? 'font-medium' : '' }}">
                                <span class="mt-1 w-2 h-2 rounded-full shrink-0 {{ is_null($note->read_at) ? 'bg-error' : 'bg-base-300' }}"></span>
                                <div class="flex-1 min-w-0">
                                    <div class="text-sm">{{ $d['message'] ?? __('Notification') }}</div>
                                    <div class="text-xs text-base-content/40">{{ $note->created_at->diffForHumans() }}</div>
                                </div>
                            </a>
                        @empty
                            <p class="text-sm text-base-content/40 py-3">{{ __('No notifications.') }}</p>
                        @endforelse
                    </div>
                </div>

            </div>
        </div>
    </div>
</x-app-layout>