@extends('layouts.dashboard')

@section('content')
@php

/**
 * "Get started" — the restaurant's setup console (app.css §35h). A sticky
 * summary rail — the completion figure over a hairline meter, stage anchors,
 * and the single accent CTA pointing at the next open step — beside a flat
 * task list: one bordered card per stage, hairline-separated rows, open work
 * sorted first (required, then optional), finished rows dimmed to a thin
 * grey tick. Colour is rationed to the CTA and the required markers.
 * Same read-only scorer (App\Services\Setup), same keys, same links.
 *
 * @var array $progress @var array|null $restaurant
 */
$p       = $progress;
// Steps, not scorer weights: the weighted score can reach 100 while required
// work is still open, and a "complete" headline beside outstanding required
// rows reads as a broken page. done/total matches the list below.
$score   = (int) $p['total'] > 0 ? (int) floor(((int) $p['done'] / (int) $p['total']) * 100) : 0;
$allDone = (int) $p['done'] >= (int) $p['total'];
$reqLeft = (int) $p['requiredTotal'] - (int) $p['requiredDone'];
$optLeft = ((int) $p['total'] - (int) $p['done']) - $reqLeft;

// "You are here": the first outstanding required step anywhere, else the first
// optional one still open. The rail CTA points at it; its row carries the bar.
$next  = null;
$curGi = null;
foreach (['required', 'skipped'] as $want) {
    foreach ($p['groups'] as $gi => $g) {
        foreach ($g['steps'] as $s) {
            if ($s['status'] === $want) { $next = $s; $curGi = $gi; break 3; }
        }
    }
}
// Open work first — required, then optional — finished rows last. usort() is
// stable on PHP 8, so the scorer's own order holds within each band.
$rank = static fn (array $s): int => $s['status'] === 'required' ? 0 : ($s['status'] === 'skipped' ? 1 : 2);
@endphp
@php /* .qm-d2: the dashboard density standard (app.css §35) */
@endphp
<div class="qm-d2">
<div class="qm-su">

    <div class="qm-su-side">
        <div class="qm-card qm-su-panel mb-0">
            <div class="qm-su-brand">
                @if (!empty($restaurant)){!! restaurant_logo_html($restaurant, 'sm') !!}@endif
                <span>{{ (string) ($restaurant['name'] ?? '') }}</span>
            </div>
            <div class="qm-su-title">
                <h2>
                    @if ($allDone){{ t_raw('vendor.setup.title_complete') }}
                    @elseif ($p['requiredComplete']){{ t_raw('vendor.setup.title_ready') }}
                    @else{{ t_raw('vendor.setup.title_todo') }}@endif
                </h2>
                <p>
                    @if ($p['requiredComplete'])
                        {{ t_raw('vendor.setup.all_essential_done') }} {!! $optLeft > 0 ? t($optLeft === 1 ? 'vendor.setup.optional_left_singular' : 'vendor.setup.optional_left_plural', [':n' => $optLeft]) : t('vendor.setup.all_extra_configured') !!}
                    @else
                        {{ t_raw($reqLeft === 1 ? 'vendor.setup.required_left_singular' : 'vendor.setup.required_left_plural', [':n' => $reqLeft]) }}
                    @endif
                </p>
            </div>
            <div class="qm-su-meter">
                <div class="qm-su-meter-row">
                    <strong>{{ $score }}<span>%</span></strong>
                    <em>{{ (int) $p['done'] }} / {{ (int) $p['total'] }}</em>
                </div>
                <div class="qm-su-bar{{ $allDone ? ' is-done' : '' }}"><i style="width: {{ $score }}%"></i></div>
            </div>
            <nav class="qm-su-nav">
                @foreach ($p['groups'] as $gi => $g)
                @php $gDone = (int) $g['done'] >= (int) $g['total'];
@endphp
                <a href="#setup-g{{ $gi }}" class="{{ $gDone ? 'is-done' : ($gi === $curGi ? 'is-current' : '') }}">
                    {{ $g['title'] }}<em>{{ (int) $g['done'] }}/{{ (int) $g['total'] }}</em>
                </a>
                @endforeach
            </nav>
            @if ($next !== null)
                <a class="qm-btn qm-su-cta" href="{{ url($next['url']) }}">{{ $next['label'] }} <i class="fas fa-arrow-right" aria-hidden="true"></i></a>
            @else
                <a class="qm-btn qm-btn-ghost qm-su-cta" href="{{ route('vendor') }}">{{ t_raw('nav.dashboard') }}</a>
            @endif
        </div>
    </div>

    <div class="qm-su-main">
        @foreach ($p['groups'] as $gi => $g)
        @php $steps = $g['steps']; usort($steps, static fn (array $a, array $b): int => $rank($a) <=> $rank($b));
@endphp
        <section class="qm-card qm-su-group mb-0" id="setup-g{{ $gi }}">
            <header class="qm-su-group-head">
                <h3>{{ $g['title'] }}</h3>
                <p>{{ $g['sub'] }}</p>
                <span class="qm-su-count">{{ (int) $g['done'] }}/{{ (int) $g['total'] }}</span>
            </header>
            <ul class="qm-su-list">
                @foreach ($steps as $s)
                @php
                $done = $s['status'] === 'done';
                $req  = $s['status'] === 'required';
                $cls  = $done ? 'is-done' : ($req ? 'is-req' : 'is-opt');
                if ($next !== null && $s['key'] === $next['key']) { $cls .= ' is-next'; }
@endphp
                <li>
                    <a class="qm-su-row {{ $cls }}" href="{{ url($s['url']) }}">
                        <span class="qm-su-st" aria-hidden="true">@if ($done)<i class="fas fa-check"></i>@endif</span>
                        <span class="qm-su-tx">
                            <strong>{{ $s['label'] }}</strong>
                            @if (!$done)<small>{{ $s['desc'] }}</small>@endif
                        </span>
                        @if ($done)
                            <span class="qm-su-sr">{{ t_raw('common.completed') }}</span>
                        @else
                            <span class="qm-su-tag">{!! $req ? t('common.required') : t('vendor.setup.status_optional') !!}</span>
                        @endif
                        @php /* Every row stays a door back into its screen — completed ones
                                 included, so the console never reads inert at 100%. */
@endphp
                        <i class="fas fa-arrow-right qm-su-go" aria-hidden="true"></i>
                    </a>
                </li>
                @endforeach
            </ul>
        </section>
        @endforeach
    </div>

</div>
</div>@php /* /.qm-d2 */
@endphp
@endsection