@extends('employee.layouts.app')
@section('title', get_setting('site_name').' | '.__('Appraisal #').$instance->id)
@section('content')
    @php
        $settings = \App\Models\PerformanceAppraisalSetting::settings();
        $paperWorkflow = $settings->paperFormWorkflow();
        $isAppraisee = (int) $instance->staff_id === (int) $staff->id;
        $stages = \App\Support\PerformanceAppraisal\AppraisalStages::ordered();
        $currentStageIdx = \App\Support\PerformanceAppraisal\AppraisalStages::index($instance->current_stage);
        if ($currentStageIdx === false) {
            $currentStageIdx = 0;
        }
        $workflowStopped = ! $instance->isActive();
        $workflowComplete = in_array($instance->status, [
            \App\Models\AppraisalInstance::STATUS_FINALIZED,
            \App\Models\AppraisalInstance::STATUS_CLOSED,
        ], true);
        $scoringSubmission = $instance->submissions->firstWhere('stage', \App\Support\PerformanceAppraisal\AppraisalStages::scoringStage($paperWorkflow));
        $scoringResponses = is_array($scoringSubmission?->responses) ? $scoringSubmission->responses : [];
        $showKpiReference = $instance->evaluationForm && ! $canSubmitThisStage;
    @endphp
    <style>
        .eps-wrap .card { border-radius: 14px; border: 1px solid #edf0f6; box-shadow: 0 2px 10px rgba(15,23,42,.04); margin-bottom: 16px; }
        .eps-wrap .card-header { background: #fff; border-bottom: 1px solid #edf0f6; font-weight: 800; font-size: 14px; }
        .eps-hero { background: linear-gradient(135deg, #f8fafc 0%, #fff 100%); border: 1px solid #edf0f6; border-radius: 14px; padding: 20px 22px; margin-bottom: 16px; }
        .eps-score { font-size: 1.6rem; font-weight: 800; color: #4f46e5; line-height: 1.1; }
        .eps-meta-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
        .eps-meta-item { background: #f8fafc; border: 1px solid #edf0f6; border-radius: 10px; padding: 12px 14px; }
        .eps-meta-item .k { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: #64748b; font-weight: 700; margin-bottom: 4px; }
        .eps-meta-item .v { font-weight: 700; color: #1e293b; margin: 0; font-size: 0.95rem; }
        .eps-stepper { display: flex; flex-wrap: wrap; gap: 0; padding: 16px 8px; background: #fff; border: 1px solid #edf0f6; border-radius: 12px; margin-bottom: 16px; }
        .eps-step { flex: 1 1 90px; text-align: center; position: relative; padding: 0 4px; min-width: 72px; }
        .eps-step:not(:last-child)::after { content: ''; position: absolute; top: 15px; left: calc(50% + 16px); width: calc(100% - 32px); height: 2px; background: #e2e8f0; z-index: 0; }
        .eps-step.done:not(:last-child)::after { background: #22c55e; }
        .eps-step.active:not(:last-child)::after { background: linear-gradient(90deg, #4f46e5 0%, #e2e8f0 100%); }
        .eps-step-dot { width: 30px; height: 30px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 800; background: #f1f5f9; color: #64748b; border: 2px solid #e2e8f0; position: relative; z-index: 1; }
        .eps-step.active .eps-step-dot { background: #4f46e5; color: #fff; border-color: #4f46e5; box-shadow: 0 0 0 4px rgba(79,70,229,.12); }
        .eps-step.done .eps-step-dot { background: #22c55e; color: #fff; border-color: #22c55e; }
        .eps-step-label { margin-top: 6px; font-size: 9px; font-weight: 700; color: #64748b; line-height: 1.25; }
        .eps-step.active .eps-step-label { color: #4f46e5; }
        .eps-step.done .eps-step-label { color: #166534; }
        .eps-table thead th { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; white-space: nowrap; border-top: 0; }
        .eps-table td { vertical-align: top; }
        .pa-kpi-desc { font-size: 0.8rem; line-height: 1.45; white-space: pre-line; color: #64748b !important; }
        .eps-kpi-item { padding: 12px 0; border-bottom: 1px solid #edf0f6; }
        .eps-kpi-item:last-child { border-bottom: 0; padding-bottom: 0; }
        .eps-action-card .card-header { background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%); border: 0; }
    </style>

    <div class="container-fluid eps-wrap">
        <div class="row mt-3 mb-4">
            <div class="col-12 col-xl-10 mx-auto">

                @if (session()->has('message'))
                    <div class="alert alert-success">{{ session('message') }}</div>
                @endif

                {{-- Hero --}}
                <div class="eps-hero">
                    <div class="d-flex flex-wrap justify-content-between align-items-start gap-3">
                        <div>
                            <div class="d-flex flex-wrap align-items-center gap-2 mb-2">
                                <h4 class="page-title mb-0">{{ __('Performance appraisal') }} #{{ $instance->id }}</h4>
                                @include('partials.appraisal_status_badge', [
                                    'label' => $instance->listDisplayStatus($paperWorkflow),
                                    'variant' => $instance->listDisplayStatusVariant(),
                                    'class' => 'lg',
                                ])
                            </div>
                            @if($isAppraisee)
                                <p class="text-muted mb-0">{{ __('Your review') }} · <strong>{{ $instance->cycle?->name ?? '—' }}</strong></p>
                            @else
                                <p class="text-muted mb-0">
                                    {{ __('Evaluating') }}: <strong>{{ staff_evaluator_label($instance->staff) }}</strong>
                                    · {{ $instance->cycle?->name ?? '—' }}
                                </p>
                            @endif
                            @include('partials.appraisal_eval_form_banner', ['title' => $instance->evaluationForm?->title])
                        </div>
                        <div class="text-right">
                            @if($instance->final_total_score !== null)
                                <div class="small text-muted text-uppercase font-weight-bold">{{ __('Final score') }}</div>
                                <div class="eps-score">{{ number_format((float) $instance->final_total_score, 2) }}%</div>
                            @endif
                            <a href="{{ route('employee.pa.instances.index') }}" class="btn btn-sm btn-light mt-2">
                                <i class="fas fa-arrow-left"></i> {{ __('Back') }}
                            </a>
                        </div>
                    </div>

                    <div class="eps-meta-grid mt-3 pt-3 border-top">
                        @if(! $isAppraisee)
                            <div class="eps-meta-item">
                                <div class="k">{{ __('Employee') }}</div>
                                <p class="v">{{ staff_evaluator_label($instance->staff) }}</p>
                            </div>
                        @endif
                        <div class="eps-meta-item">
                            <div class="k">{{ __('Status') }}</div>
                            <p class="v mb-0">{{ $instance->listDisplayStatus($paperWorkflow) }}</p>
                        </div>
                        <div class="eps-meta-item">
                            <div class="k">{{ __('Due date') }}</div>
                            <p class="v mb-0">{{ $instance->due_at?->format('d/m/Y') ?? '—' }}</p>
                        </div>
                        @if($instance->evaluation_period_from || $instance->evaluation_period_to)
                            <div class="eps-meta-item">
                                <div class="k">{{ __('Evaluation period') }}</div>
                                <p class="v mb-0">
                                    {{ $instance->evaluation_period_from?->format('d/m/Y') ?? '—' }}
                                    – {{ $instance->evaluation_period_to?->format('d/m/Y') ?? '—' }}
                                </p>
                            </div>
                        @endif
                    </div>
                </div>

                {{-- Stage stepper --}}
                <div class="eps-stepper">
                    @foreach($stages as $idx => $stageKey)
                        @php
                            $sub = $instance->submissions->firstWhere('stage', $stageKey);
                            $isActive = ! $workflowStopped && ! $workflowComplete && $instance->current_stage === $stageKey;
                            $isDone = $sub?->submitted_at || ($workflowComplete && $idx <= $currentStageIdx) || ($workflowStopped && $idx < $currentStageIdx);
                            $stepClass = $isActive ? 'active' : ($isDone ? 'done' : '');
                        @endphp
                        <div class="eps-step {{ $stepClass }}">
                            <div class="eps-step-dot">
                                @if($isDone && ! $isActive)
                                    <i class="fas fa-check" style="font-size:10px"></i>
                                @else
                                    {{ $idx + 1 }}
                                @endif
                            </div>
                            <div class="eps-step-label">{{ \App\Support\PerformanceAppraisal\AppraisalStages::label($stageKey, $paperWorkflow) }}</div>
                        </div>
                    @endforeach
                </div>

                {{-- Workflow table --}}
                <div class="card">
                    <div class="card-header py-3"><i class="fas fa-tasks mr-1 text-muted"></i> {{ __('Workflow progress') }}</div>
                    <div class="card-body p-0">
                        <div class="table-responsive">
                            <table class="table table-sm eps-table mb-0">
                                <thead class="thead-light">
                                <tr>
                                    <th>{{ __('Stage') }}</th>
                                    <th>{{ __('Evaluator') }}</th>
                                    <th>{{ __('Score') }}</th>
                                    <th>{{ __('Submitted') }}</th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($instance->submissions->sortBy(fn ($s) => \App\Support\PerformanceAppraisal\AppraisalStages::index($s->stage)) as $sub)
                                    <tr class="{{ $instance->current_stage === $sub->stage && ! $workflowComplete && ! $workflowStopped ? 'table-primary' : '' }}">
                                        <td>
                                            {{ \App\Support\PerformanceAppraisal\AppraisalStages::label($sub->stage, $paperWorkflow) }}
                                            @if($instance->current_stage === $sub->stage && ! $workflowComplete && ! $workflowStopped)
                                                <span class="badge badge-primary ml-1">{{ __('Current') }}</span>
                                            @endif
                                        </td>
                                        <td>{{ staff_evaluator_label($sub->evaluator) }}</td>
                                        <td>{{ $sub->total_score !== null ? number_format((float) $sub->total_score, 2).'%' : '—' }}</td>
                                        <td>
                                            @if($sub->submitted_at)
                                                <span class="text-success"><i class="fas fa-check-circle"></i> {{ $sub->submitted_at->format('d/m/Y H:i') }}</span>
                                            @else
                                                <span class="text-muted">{{ __('Pending') }}</span>
                                            @endif
                                        </td>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>

                @if($instance->probation_recommendation)
                    <div class="alert alert-secondary">
                        <strong>{{ __('Final decision') }}:</strong>
                        {{ \App\Support\PerformanceAppraisal\AppraisalDecisionOptions::labelForCode($instance->probation_recommendation) }}
                    </div>
                @endif

                @if($instance->strength_1 || $instance->weakness_1)
                    <div class="card">
                        <div class="card-header py-3"><i class="fas fa-comment-dots mr-1 text-muted"></i> {{ __('Saved feedback on record') }}</div>
                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-6 mb-3 mb-md-0">
                                    <p class="font-weight-bold mb-2 text-success">{{ __('Strengths') }}</p>
                                    <ol class="pl-3 mb-0 small">
                                        <li class="mb-1">{{ $instance->strength_1 ?: '—' }}</li>
                                        <li class="mb-1">{{ $instance->strength_2 ?: '—' }}</li>
                                        <li>{{ $instance->strength_3 ?: '—' }}</li>
                                    </ol>
                                </div>
                                <div class="col-md-6">
                                    <p class="font-weight-bold mb-2 text-danger">{{ __('Weaknesses') }}</p>
                                    <ol class="pl-3 mb-0 small">
                                        <li class="mb-1">{{ $instance->weakness_1 ?: '—' }}</li>
                                        <li class="mb-1">{{ $instance->weakness_2 ?: '—' }}</li>
                                        <li>{{ $instance->weakness_3 ?: '—' }}</li>
                                    </ol>
                                </div>
                            </div>
                        </div>
                    </div>
                @endif

                {{-- KPI reference / submitted scores (when not actively submitting) --}}
                @if($showKpiReference && $instance->evaluationForm->formKpis->isNotEmpty())
                    <div class="card">
                        <div class="card-header py-3 d-flex justify-content-between align-items-center">
                            <span><i class="fas fa-chart-bar mr-1 text-muted"></i> {{ __('KPI indicators') }}</span>
                            @if($scoringSubmission?->submitted_at && $scoringSubmission->total_score !== null)
                                <span class="badge badge-primary">{{ __('Score') }}: {{ number_format((float) $scoringSubmission->total_score, 2) }}%</span>
                            @endif
                        </div>
                        <div class="card-body py-2">
                            @if($scoringSubmission?->submitted_at)
                                <div class="table-responsive">
                                    <table class="table table-sm eps-table mb-0">
                                        <thead class="thead-light">
                                        <tr>
                                            <th>{{ __('KPI') }}</th>
                                            <th>{{ __('Description') }}</th>
                                            <th class="text-right" style="width:70px">{{ __('Score') }}</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        @foreach($instance->evaluationForm->formKpis as $fk)
                                            @php $k = $fk->kpiIndicator; @endphp
                                            @if($k)
                                                <tr>
                                                    <td>
                                                        @if($k->title_bn)<span class="text-primary d-block">{{ $k->title_bn }}</span>@endif
                                                        <strong>{{ $k->title }}</strong>
                                                        <span class="text-muted small">({{ $fk->weightage }}%)</span>
                                                    </td>
                                                    <td>@include('partials.kpi_description_hint', ['indicator' => $k])</td>
                                                    <td class="text-right font-weight-bold">{{ $scoringResponses[$k->id] ?? '—' }}</td>
                                                </tr>
                                            @endif
                                        @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            @else
                                @foreach($instance->evaluationForm->formKpis as $fk)
                                    @php $k = $fk->kpiIndicator; @endphp
                                    @if($k)
                                        <div class="eps-kpi-item">
                                            @if($k->title_bn)<span class="text-primary d-block small">{{ $k->title_bn }}</span>@endif
                                            <strong>{{ $k->title }}</strong>
                                            <span class="text-muted small">· {{ __('weight') }} {{ $fk->weightage }}%</span>
                                            @include('partials.kpi_description_hint', ['indicator' => $k])
                                        </div>
                                    @endif
                                @endforeach
                            @endif
                        </div>
                    </div>
                @endif

                @if($canSubmitThisStage && $activeSubmission && $instance->evaluationForm)
                    <div class="card eps-action-card border-0">
                        <div class="card-header text-white py-3">
                            <h6 class="mb-1 text-white">
                                <i class="fas fa-pen mr-1"></i>
                                {{ __('Your action') }}: {{ \App\Support\PerformanceAppraisal\AppraisalStages::label($activeSubmission->stage, $paperWorkflow) }}
                            </h6>
                            @php
                                $actionHint = match (true) {
                                    $paperWorkflow && $activeSubmission->stage === \App\Support\PerformanceAppraisal\AppraisalStages::SELF_ASSESSMENT
                                        => __('Fill the evaluation form (all KPI scores), then submit.'),
                                    $paperWorkflow && $activeSubmission->stage === \App\Support\PerformanceAppraisal\AppraisalStages::PRIMARY_EVALUATION
                                        => __('Enter three strengths, three weaknesses, and comments, then submit.'),
                                    $paperWorkflow && $activeSubmission->stage === \App\Support\PerformanceAppraisal\AppraisalStages::EXECUTIVE_APPROVAL
                                        => __('Review all previous comments, select one final decision, add your remarks, then submit.'),
                                    default => __('Complete the form below and submit this stage.'),
                                };
                            @endphp
                            <small class="text-white-50">{{ $actionHint }}</small>
                        </div>
                        <div class="card-body">
                            <form method="post" action="{{ route('employee.pa.submissions.submit', $activeSubmission->id) }}">
                                @csrf
                                @include('partials.appraisal_submission_form', [
                                    'instance' => $instance,
                                    'activeSubmission' => $activeSubmission,
                                ])
                                <div class="text-right pt-3 border-top mt-2">
                                    <button type="submit" class="btn btn-primary btn-lg px-4">
                                        <i class="fas fa-paper-plane mr-1"></i> {{ __('Submit this stage') }}
                                    </button>
                                </div>
                            </form>
                        </div>
                    </div>
                @elseif($activeSubmission && ! $activeSubmission->submitted_at)
                    <div class="alert alert-info mb-0">
                        <i class="fas fa-hourglass-half mr-1"></i>
                        {{ __('Waiting for :name on this stage.', ['name' => $activeSubmission->evaluator ? staff_evaluator_label($activeSubmission->evaluator) : __('assigned evaluator')]) }}
                    </div>
                @elseif(! $instance->evaluationForm)
                    <div class="alert alert-warning mb-0">{{ __('No evaluation form is linked to this instance. Contact HR.') }}</div>
                @elseif($activeSubmission?->submitted_at && ! $showKpiReference)
                    <div class="alert alert-success mb-0">
                        <i class="fas fa-check-circle mr-1"></i> {{ __('You have already submitted this stage.') }}
                    </div>
                @endif
            </div>
        </div>
    </div>
@endsection