@php
  use App\Support\ConfrontoSubetapa;

  $mvp = $mvpProgress ?? ['steps' => [], 'progresso_pct' => 0, 'etapa_atual' => 1, 'concluido' => false, 'tab_etapas' => []];
  $steps = $mvp['steps'] ?? [];
  $fluxoEtapa = $mvp['etapa_atual'] ?? 1;
  $etapaVisivel = (int) ($etapaVisivel ?? $mvp['etapa_visivel'] ?? $fluxoEtapa);
  $rotuloEtapaVisivel = ($etapaVisivel === 2)
      ? ConfrontoSubetapa::rotulo(request('confronto'))
      : (string) $etapaVisivel;
  $confrontoSubetapas = isset($sim)
      ? ConfrontoSubetapa::estadosStepper(
          $sim->idsimulacao,
          request('confronto'),
          $confrontoPainel ?? null,
          $etapaVisivel
      )
      : [];
@endphp
<div class="mvp-stepper mb-4" data-tour="mvp-stepper" id="mvp-stepper"
     data-tab-etapas='@json($mvp['tab_etapas'] ?? [])'
     data-fluxo-etapa="{{ $fluxoEtapa }}">
  <div class="mvp-stepper-head d-flex justify-content-between align-items-center flex-wrap gap-2 mb-2">
    <div>
      <span class="text-xs text-uppercase text-muted fw-semibold">Etapas da simulação</span>
      @if($mvp['concluido'] ?? false)
        <span class="badge bg-success ms-2">Concluído</span>
      @else
        <span class="text-xs text-muted ms-2">
          Etapa {{ $rotuloEtapaVisivel }} de 5
          @if($etapaVisivel === 2)
            <span class="text-muted">({{ ConfrontoSubetapa::info(request('confronto'))['titulo'] }})</span>
          @endif
        </span>
      @endif
    </div>
    <div class="mvp-stepper-progress text-xs">
      <div class="progress" style="width:120px;height:6px;">
        <div class="progress-bar bg-success" style="width:{{ $mvp['progresso_pct'] ?? 0 }}%"></div>
      </div>
      <span class="ms-1 text-muted">{{ $mvp['progresso_pct'] ?? 0 }}%</span>
    </div>
  </div>
  <div class="mvp-stepper-track" id="mvp-stepper-track">
    @foreach($steps as $step)
      @php
        $numStep = (int) ($step['numero'] ?? 0);
        $isEtapa2 = $numStep === 2;

        if ($step['concluido'] ?? false) {
            $state = ($numStep === $etapaVisivel) ? 'done-active' : 'done';
        } elseif ($numStep === $etapaVisivel) {
            $state = 'current';
        } else {
            $state = 'pending';
        }
      @endphp

      @if($isEtapa2 && !empty($confrontoSubetapas))
        <div class="mvp-step-column mvp-step-column--confronto">
          <a href="{{ $step['url'] ?? '#' }}"
             class="mvp-step mvp-step--{{ $state }}"
             data-mvp-step="{{ $step['numero'] }}"
             data-mvp-tab="{{ $step['tab'] ?? '' }}"
             @if(empty($step['url'])) onclick="return false;" @endif
             title="{{ $step['subtitulo'] ?? '' }}">
            <span class="mvp-step__icon">
              @if(($step['concluido'] ?? false) && $numStep !== $etapaVisivel)
                <i class="fas fa-check"></i>
              @else
                <i class="fas {{ $step['icone'] ?? 'fa-circle' }}"></i>
              @endif
            </span>
            <span class="mvp-step__num">{{ $step['numero'] }}</span>
            <span class="mvp-step__label">{{ $step['titulo'] }}</span>
          </a>

          <div class="mvp-substeps" aria-label="Sub-etapas da Conferência de dados" data-tour="confronto-substeps">
            @php $subLista = array_values($confrontoSubetapas); @endphp
            @foreach($subLista as $sub)
              @php
                $prev = $loop->index > 0 ? $subLista[$loop->index - 1] : null;
                $topLineDone = $prev && in_array($prev['estado'], ['done', 'current'], true);
                $bottomLineDone = in_array($sub['estado'], ['done'], true);
                $bloqueada = ($sub['estado'] ?? '') === 'locked' || empty($sub['liberada']);
              @endphp
              @if($bloqueada)
                <span class="mvp-substep mvp-substep--locked"
                      title="{{ \App\Support\ConfrontoSubetapa::motivoBloqueio($sub['secao'], $confrontoPainel ?? null) ?? 'Conclua a etapa anterior' }}">
                  <span class="mvp-substep__rail">
                    @if($loop->index > 0)
                      <span class="mvp-substep__connector mvp-substep__connector--top mvp-substep__connector--{{ $topLineDone ? 'done' : 'pending' }}"></span>
                    @endif
                    <span class="mvp-substep__dot"><i class="fas fa-lock"></i></span>
                    @if(!$loop->last)
                      <span class="mvp-substep__connector mvp-substep__connector--bottom mvp-substep__connector--pending"></span>
                    @endif
                  </span>
                  <span class="mvp-substep__body">
                    <span class="mvp-substep__num">{{ $sub['rotulo'] }}</span>
                    <span class="mvp-substep__label">{{ $sub['titulo'] }}</span>
                    @if($sub['badge'])
                      <span class="mvp-substep__badge">{{ $sub['badge'] }}</span>
                    @endif
                  </span>
                </span>
              @else
                <a href="{{ $sub['url'] }}"
                   class="mvp-substep mvp-substep--{{ $sub['estado'] }}"
                   title="{{ $sub['titulo'] }}">
                  <span class="mvp-substep__rail">
                    @if($loop->index > 0)
                      <span class="mvp-substep__connector mvp-substep__connector--top mvp-substep__connector--{{ $topLineDone ? 'done' : 'pending' }}"></span>
                    @endif
                    <span class="mvp-substep__dot">
                      @if($sub['estado'] === 'done')
                        <i class="fas fa-check"></i>
                      @endif
                    </span>
                    @if(!$loop->last)
                      <span class="mvp-substep__connector mvp-substep__connector--bottom mvp-substep__connector--{{ $bottomLineDone ? 'done' : 'pending' }}"></span>
                    @endif
                  </span>
                  <span class="mvp-substep__body">
                    <span class="mvp-substep__num">{{ $sub['rotulo'] }}</span>
                    <span class="mvp-substep__label">{{ $sub['titulo'] }}</span>
                    @if($sub['badge'])
                      <span class="mvp-substep__badge">{{ $sub['badge'] }}</span>
                    @endif
                  </span>
                </a>
              @endif
            @endforeach
          </div>
        </div>
      @else
        <a href="{{ $step['url'] ?? '#' }}"
           class="mvp-step mvp-step--{{ $state }}"
           data-mvp-step="{{ $step['numero'] }}"
           data-mvp-tab="{{ $step['tab'] ?? '' }}"
           @if(empty($step['url'])) onclick="return false;" @endif
           title="{{ $step['subtitulo'] ?? '' }}">
          <span class="mvp-step__icon">
            @if(($step['concluido'] ?? false) && !($step['aba_ativa'] ?? false))
              <i class="fas fa-check"></i>
            @else
              <i class="fas {{ $step['icone'] ?? 'fa-circle' }}"></i>
            @endif
          </span>
          <span class="mvp-step__num">{{ $step['numero'] }}</span>
          <span class="mvp-step__label">{{ $step['titulo'] }}</span>
        </a>
      @endif

      @if(!$loop->last)
        @php
          $lineDone = ($step['concluido'] ?? false);
          if ($isEtapa2 && $etapaVisivel === 2) {
              $lineDone = collect($confrontoSubetapas)->every(fn ($s) => $s['estado'] === 'done');
          }
        @endphp
        <span class="mvp-stepper-line mvp-stepper-line--{{ $lineDone ? 'done' : 'pending' }}"></span>
      @endif
    @endforeach
  </div>
</div>