{{-- Detalhe do Vessel (Sprint): carga documentada, donut de progresso e
     a grade de containers (cards) — clicar num container abre o documento. --}}
@extends('manifest.layout')

@section('title', $vessel['label'])

@section('content')
    @php
        $pct           = $vessel['total'] > 0 ? round($vessel['documented'] / $vessel['total'] * 100) : 0;
        $radius        = 64;
        $circumference = 2 * M_PI * $radius;
        $dash          = $circumference * $pct / 100;
        $stampLabels   = ['project' => 'Projeto', 'issue' => 'Melhoria', 'bug' => 'Bug', 'pending' => 'Pendente'];
    @endphp

    <div class="doc-head">
        <div class="wrap">
            <a class="back-circle" title="Voltar ao início" href="{{ route('manifest.index') }}">
                <i class="fa-solid fa-arrow-left"></i>
            </a>
            <h1>{{ $vessel['label'] }}</h1>
            @if ($vessel['voyage'])
                <div class="date">{{ $vessel['voyage']['month'] }} {{ $vessel['voyage']['in'] }} / {{ $vessel['voyage']['out'] }}</div>
            @endif
            <div class="kicker">
                Vessel · {{ $vessel['status'] ?? 'Sprint' }}
                @if ($vessel['period'])
                    · {{ \Illuminate\Support\Carbon::parse($vessel['period'][0])->format('d/m') }}
                    – {{ \Illuminate\Support\Carbon::parse($vessel['period'][1])->format('d/m') }}
                @endif
            </div>
        </div>
    </div>

    <div class="wrap">
        <div class="stats-row" style="margin-bottom: 24px;">
            <div class="stat-card">
                <div class="lbl"><i class="fa-solid fa-box"></i> Tasks</div>
                <div class="val">{{ str_pad($vessel['total'], 2, '0', STR_PAD_LEFT) }}</div>
            </div>
            <div class="stat-card project">
                <div class="lbl"><i class="fa-regular fa-circle-check"></i> Documentados</div>
                <div class="val">{{ str_pad($vessel['documented'], 2, '0', STR_PAD_LEFT) }}</div>
            </div>
            <div class="stat-card bug">
                <div class="lbl"><i class="fa-regular fa-clock"></i> Pendentes</div>
                <div class="val">{{ str_pad(max($vessel['total'] - $vessel['documented'], 0), 2, '0', STR_PAD_LEFT) }}</div>
            </div>
        </div>

        <article class="doc" style="padding: 32px 36px; margin-bottom: 24px;">
            <h2>Carga documentada</h2>
            <div class="donut-wrap">
                <div class="donut">
                    <svg width="150" height="150" viewBox="0 0 150 150">
                        <circle cx="75" cy="75" r="{{ $radius }}" fill="none" stroke="#E3E9EF" stroke-width="14"/>
                        <circle cx="75" cy="75" r="{{ $radius }}" fill="none" stroke="#0F766E" stroke-width="14"
                                stroke-linecap="round"
                                stroke-dasharray="{{ $dash }} {{ $circumference }}"/>
                    </svg>
                    <div class="donut-label">
                        <b>{{ $pct }}%</b>
                        <span>Documentado</span>
                    </div>
                </div>
                <div class="donut-legend">
                    <div><span class="dot" style="background:#0F766E"></span> {{ $vessel['documented'] }} tasks documentadas</div>
                    <div><span class="dot" style="background:#E3E9EF"></span> {{ max($vessel['total'] - $vessel['documented'], 0) }} aguardando documentação</div>
                </div>
            </div>
        </article>

        <div class="catalog" style="padding-top: 0;">
            <section class="group">
                <header>
                    <h2><i class="fa-solid fa-boxes-stacked"></i> Tasks a bordo</h2>
                    <span class="count">{{ $vessel['total'] }} registro(s)</span>
                </header>

                @foreach ($vessel['containers'] as $c)
                    @if ($c['doc_id'])
                        <div class="card">
                            <span class="no">{{ $c['number'] ?? '—' }}</span>
                            <div class="body">
                                <h3>
                                    <a href="{{ route('manifest.show', $c['doc_id']) }}">
                                        {{ $c['title'] }}
                                    </a>
                                </h3>
                                @if ($c['date'])
                                    <div class="meta">
                                        <span><i class="fa-regular fa-calendar"></i>
                                            {{ \Illuminate\Support\Carbon::parse($c['date'])->format('d/m/Y') }}</span>
                                    </div>
                                @endif
                            </div>
                            <span class="stamp {{ $c['category'] }}">{{ $stampLabels[$c['category']] ?? $c['category'] }}</span>
                            <i class="fa-solid fa-chevron-right go"></i>
                        </div>
                    @else
                        <div class="card" style="opacity:.65">
                            <span class="no">{{ $c['number'] ?? '—' }}</span>
                            <div class="body">
                                <h3 style="font-style:italic">{{ $c['title'] }}</h3>
                                <div class="meta"><span>Ainda em desenvolvimento</span></div>
                            </div>
                            <span class="stamp pending">Pendente</span>
                        </div>
                    @endif
                @endforeach
            </section>
        </div>
    </div>
@endsection
