@php
    // Komponent modalny kreatora. Dane pobierane wyłącznie po ID szkolenia.
    $trainingId = (int)($trainingId ?? 0);
    $overlayId = !empty($overlayId) ? (string)$overlayId : 'trainingPreparationWizardOverlay_'.$trainingId;

    $wizardTraining = null;
    $wizardMaterialsCount = 0;
    $wizardMaterialsIntroExists = false;
    $wizardTestRecord = null;
    $wizardParticipantsCount = 0;

    if ($trainingId > 0) {
        $wizardTraining = DB::table('t051_szkolenia')->where('id', $trainingId)->first();

        if (!empty($wizardTraining)) {
            $hasMaterialsTable = \Illuminate\Support\Facades\Schema::hasTable('t056_szkolenie_materialy');
            if ($hasMaterialsTable) {
                $wizardMaterialsCount = (int) DB::table('t056_szkolenie_materialy')
                    ->where('id_szkolenie', $trainingId)
                    ->count();
            }

            if (\Illuminate\Support\Facades\Schema::hasColumn('t051_szkolenia', 'wprowadzenie_html')) {
                $wizardMaterialsIntroExists = trim((string) ($wizardTraining->wprowadzenie_html ?? '')) !== '';
            }

            if (\Illuminate\Support\Facades\Schema::hasTable('t057_testy')) {
                $wizardTestRecord = DB::table('t057_testy')
                    ->where('id_szkolenie', $trainingId)
                    ->orderBy('id', 'asc')
                    ->first();
            }

            $wizardParticipantsCount = (int) DB::table('v052_uczestnicy_szkolenia')
                ->where('v052_id_szkolenie', $trainingId)
                ->where('v052_osoba_status_aktywny', '1')
                ->distinct()
                ->count('v052_osoba_id');
        }
    }

    $wizardTraining = $wizardTraining ?: (object)[];

    // Logika gotowości publikacji.
    $isElearning = (int)($wizardTraining->forma_szkolenia ?? -1) === 0;
    $placeNormalized = trim(mb_strtolower((string)($wizardTraining->miejsce_szkolenia ?? ''), 'UTF-8'));
    $isInternalPlace = strpos($placeNormalized, 'szkolenie wewn') !== false;

    $checkElearningInternal = $isElearning && $isInternalPlace;
    $checkTopicAndGoal = trim((string)($wizardTraining->temat ?? '')) !== '' && trim((string)($wizardTraining->cel_szkolenia_opis ?? '')) !== '';
    $checkSchedule = !empty($wizardTraining->data) && !empty($wizardTraining->godzina_start) && !empty($wizardTraining->data_do) && !empty($wizardTraining->godzina_stop);
    $checkMaterials = ($wizardMaterialsCount > 0) || $wizardMaterialsIntroExists;
    $checkActiveTest = !empty($wizardTestRecord) && (int)($wizardTestRecord->status_aktywny ?? 0) === 1;
    $checkParticipants = $wizardParticipantsCount > 0;

    $preparationSteps = [
        ['label' => 'Tryb e-Learning + miejsce Szkolenie Wewnętrzne', 'done' => $checkElearningInternal],
        ['label' => 'Temat i cel szkolenia', 'done' => $checkTopicAndGoal],
        ['label' => 'Harmonogram (daty i godziny)', 'done' => $checkSchedule],
        ['label' => 'Materiały szkoleniowe', 'done' => $checkMaterials],
        ['label' => 'Aktywny test', 'done' => $checkActiveTest],
        ['label' => 'Lista uczestnikow', 'done' => $checkParticipants],
    ];

    $preparedSteps = 0;
    foreach ($preparationSteps as $stepItem) {
        if (!empty($stepItem['done'])) {
            $preparedSteps++;
        }
    }
    $totalPreparationSteps = count($preparationSteps);
    $isReadyToPublish = $preparedSteps === $totalPreparationSteps;
@endphp

<div id="{{ $overlayId }}" class="training-preparation-overlay" aria-hidden="true" role="dialog" aria-modal="true">
    <div class="training-preparation-backdrop" onclick="closeTrainingPreparationWizard('{{ $overlayId }}')"></div>
    <div class="training-preparation-panel" role="document">
        <div class="training-preparation-header">
            <strong>Kreator etapów przygotowania szkolenia</strong>
            <button type="button" class="close training-preparation-close" onclick="closeTrainingPreparationWizard('{{ $overlayId }}')" aria-label="Zamknij">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>

        <div class="training-preparation-body">
            <div class="szkol-stepper mb-4">
                @php $wizardBlocked = false; @endphp
                @foreach($preparationSteps as $stepIndex => $stepItem)
                    @php
                        $stepNo = $stepIndex + 1;
                        $isDone = !empty($stepItem['done']);
                        $isLocked = !$isDone && $wizardBlocked;
                        if (!$isDone) {
                            $wizardBlocked = true;
                        }
                        $stepClass = $isDone ? 'is-done' : ($isLocked ? 'is-locked' : 'is-open');
                    @endphp

                    <div class="szkol-step {{ $stepClass }}" data-toggle="tooltip" title="{{ $stepItem['label'] }}">
                        <span class="szkol-step-circle">
                            @if($isDone)
                                <i class="fas fa-check"></i>
                            @elseif($isLocked)
                                <i class="fas fa-lock"></i>
                            @else
                                {{ $stepNo }}
                            @endif
                        </span>
                        <span class="szkol-step-label">{{ $stepNo }}</span>
                    </div>

                    @if(!$loop->last)
                        <span class="szkol-step-line {{ $isDone ? 'is-done' : '' }}"></span>
                    @endif
                @endforeach
            </div>

            <div class="d-flex justify-content-between align-items-center flex-wrap mb-3">
                <div class="mb-2 mb-md-0">
                    Etap przygotowania: <strong>{{ $preparedSteps }}/{{ $totalPreparationSteps }}</strong>
                </div>
                <div>
                    @if($isReadyToPublish)
                        <span class="badge badge-success p-2" style="font-size: 1rem;">
                            <i class="fas fa-check-circle mr-1"></i>Gotowe do publikacji
                        </span>
                    @else
                        <span class="badge badge-warning p-2" style="font-size: 1rem;">
                            <i class="fas fa-exclamation-circle mr-1"></i>Wymaga uzupełnienia przed publikacja
                        </span>
                    @endif
                </div>
            </div>

            <div class="card border-0 bg-light p-3">
                <div class="small text-muted">
                    Wymagane do oznaczenia gotowosci:
                    1) e-Learning + miejsce "Szkolenie Wewnętrzne",
                    2) temat i cel,
                    3) harmonogram,
                    4) materiały,
                    5) aktywny test,
                    6) uczestnicy.
                </div>
            </div>
        </div>
    </div>
</div>

@once
    <style>
        .szkol-training-info-content {
            position: relative;
        }
        .training-preparation-overlay {
            position: absolute;
            inset: 0;
            z-index: 1045;
            opacity: 0;
            visibility: hidden;
            pointer-events: none;
            overflow-y: auto;
            transition: opacity .5s ease, visibility 0s linear .5s;
        }
        .training-preparation-overlay.is-visible {
            opacity: 1;
            visibility: visible;
            pointer-events: auto;
            transition: opacity .5s ease;
        }
        .training-preparation-backdrop {
            position: absolute;
            inset: 0;
            background: rgba(19, 32, 49, .52);
            opacity: 0;
            transition: opacity .5s ease;
        }
        .training-preparation-overlay.is-visible .training-preparation-backdrop {
            opacity: 1;
        }
        .training-preparation-panel {
            position: relative;
            z-index: 1;
            min-height: 100%;
            width: 100%;
            background: #fff;
            transform: translateX(-105%);
            opacity: 0;
            transition: transform .5s ease, opacity .5s ease;
            box-shadow: 1rem 0 2rem rgba(20, 36, 58, .18);
        }
        .training-preparation-overlay.is-visible .training-preparation-panel {
            transform: translateX(0);
            opacity: 1;
        }
        .training-preparation-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: .9rem 1.1rem;
            border-bottom: 1px solid #d9e2ef;
            background: #eef3fa;
            color: #2e4260;
        }
        .training-preparation-close {
            margin: 0;
            padding: .1rem .5rem;
            line-height: 1;
        }
        .training-preparation-body {
            padding: 1.2rem 1.1rem 1.5rem;
        }
        .szkol-stepper {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: .4rem;
            flex-wrap: wrap;
        }
        .szkol-step {
            display: inline-flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            min-width: 52px;
        }
        .szkol-step-circle {
            width: 42px;
            height: 42px;
            border-radius: 50%;
            border: 2px solid #c9d4e4;
            background: #eef3fa;
            color: #6f7f95;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-weight: 700;
        }
        .szkol-step.is-done .szkol-step-circle {
            background: #2e9b53;
            border-color: #2e9b53;
            color: #fff;
        }
        .szkol-step.is-open .szkol-step-circle {
            background: #ffffff;
            border-color: #9fb3cc;
            color: #45658a;
        }
        .szkol-step.is-locked .szkol-step-circle {
            background: #eef3fa;
            border-color: #c9d4e4;
            color: #7f8da3;
        }
        .szkol-step-line {
            width: 42px;
            height: 3px;
            background: #d4deec;
            border-radius: 2px;
        }
        .szkol-step-line.is-done {
            background: #88c39c;
        }
        .szkol-step-label {
            margin-top: .25rem;
            font-size: .72rem;
            color: #6a7688;
        }
    </style>
@endonce

@once
    @push('scripts')
        <script>
            function openTrainingPreparationWizard(overlayId) {
                var modal = document.getElementById(overlayId || 'trainingPreparationWizardOverlay');
                if (!modal) {
                    return;
                }
                modal.classList.add('is-visible');
                modal.setAttribute('aria-hidden', 'false');
                document.body.classList.add('modal-open');
            }

            function closeTrainingPreparationWizard(overlayId) {
                var modal = document.getElementById(overlayId || 'trainingPreparationWizardOverlay');
                if (!modal) {
                    return;
                }
                modal.classList.remove('is-visible');
                modal.setAttribute('aria-hidden', 'true');

                if (document.querySelectorAll('.training-preparation-overlay.is-visible').length === 0) {
                    document.body.classList.remove('modal-open');
                }
            }

            document.addEventListener('keydown', function (event) {
                if (event.key !== 'Escape') {
                    return;
                }
                var opened = document.querySelectorAll('.training-preparation-overlay.is-visible');
                if (opened.length === 0) {
                    return;
                }
                opened.forEach(function (modal) {
                    modal.classList.remove('is-visible');
                    modal.setAttribute('aria-hidden', 'true');
                });
                document.body.classList.remove('modal-open');
            });
        </script>
    @endpush
@endonce