@php
    use App\Models\Evidencia;

    $baseParams = array_filter([
        'grado_id' => $grado->id,
        'curso_id' => $curso->id,
    ]);

    $openNodes = collect(['grado', 'curso', 'temas'])
        ->when($expandEnunciadoId, fn ($c) => $c->push('en-'.$expandEnunciadoId))
        ->when($expandEvidenciaId, function ($c) use ($expandEvidenciaId, $enunciados) {
            $c->push('ev-'.$expandEvidenciaId);
            $enId = $enunciados->flatMap->evidencias->firstWhere('id', $expandEvidenciaId)?->enunciado_id
                ?? Evidencia::query()->whereKey($expandEvidenciaId)->value('enunciado_id');
            if ($enId) {
                $c->push('en-'.$enId);
            }
        })
        ->when($expandTemas || $newTema || $editTema, fn ($c) => $c->push('temas'))
        ->when($editEnunciado, fn ($c) => $c->push('en-'.$editEnunciado->id))
        ->when($editEvidencia, fn ($c) => $c->push('en-'.$editEvidencia->enunciado_id, 'ev-'.$editEvidencia->id))
        ->when($newEvidenciaEnunciadoId, fn ($c) => $c->push('en-'.$newEvidenciaEnunciadoId))
        ->when($newEnunciado || $editEnunciado, fn ($c) => $c->push('grado', 'curso'))
        ->when($linkTemasEvidenciaId, function ($c) use ($linkTemasEvidenciaId, $enunciados) {
            $c->push('ev-'.$linkTemasEvidenciaId);
            $enId = $enunciados->flatMap->evidencias->firstWhere('id', $linkTemasEvidenciaId)?->enunciado_id
                ?? Evidencia::query()->whereKey($linkTemasEvidenciaId)->value('enunciado_id');
            if ($enId) {
                $c->push('en-'.$enId);
            }
        })
        ->unique()
        ->values()
        ->all();

    $showEnunciadoForm = $newEnunciado || $editEnunciado;
@endphp

<div
    class="eva-cur-nested"
    x-data="{
        open: @js($openNodes),
        search: '',
        allIds: @js($allTreeNodeIds),
        toggle(id) {
            if (this.open.includes(id)) {
                this.open = this.open.filter(item => item !== id);
            } else {
                this.open.push(id);
            }
        },
        isOpen(id) {
            return this.open.includes(id);
        },
        expandAll() {
            this.open = [...this.allIds];
        },
        collapseAll() {
            this.open = ['grado'];
        },
        matches(text) {
            const q = this.search.trim().toLowerCase();
            if (!q) return true;
            return (text || '').toLowerCase().includes(q);
        },
        branchVisible(bundleText, ownText) {
            const q = this.search.trim().toLowerCase();
            if (!q) return true;
            return (bundleText || '').toLowerCase().includes(q) || (ownText || '').toLowerCase().includes(q);
        }
    }"
>
    <div class="eva-cur-nested-toolbar">
        <div class="eva-cur-nested-stats">
            <span>{{ $enunciados->count() }} enunciados</span>
            <span>{{ $evidencias->count() }} evidencias</span>
            <span>{{ $temas->count() }} temas</span>
        </div>
        <div class="eva-cur-nested-actions">
            <input type="search" x-model="search" placeholder="Buscar…" class="eva-cur-nested-search" aria-label="Buscar">
            <button type="button" class="mdl-btn" @click="expandAll()">Expandir todo</button>
            <button type="button" class="mdl-btn" @click="collapseAll()">Colapsar</button>
        </div>
    </div>

    {{-- Grado --}}
    <details class="eva-cur-drop eva-cur-drop--grado" :open="isOpen('grado')">
        <summary class="eva-cur-drop-summary" @click.prevent="toggle('grado')">
            <span class="eva-cur-drop-marker" aria-hidden="true"></span>
            <span class="eva-cur-drop-label">Grado</span>
            <span class="eva-cur-drop-text"><strong>{{ $grado->nombre }}</strong></span>
        </summary>

        <div class="eva-cur-drop-children">
            {{-- Curso --}}
            <details class="eva-cur-drop eva-cur-drop--curso" :open="isOpen('curso')">
                <summary class="eva-cur-drop-summary" @click.prevent="toggle('curso')">
                    <span class="eva-cur-drop-marker" aria-hidden="true"></span>
                    <span class="eva-cur-drop-label">Curso</span>
                    <span class="eva-cur-drop-text"><strong>{{ $curso->nombre }}</strong></span>
                </summary>

                <div class="eva-cur-drop-children">
                    @if($showEnunciadoForm)
                        @include('configuracion.partials.enunciado-form-inline')
                    @else
                        <p class="eva-cur-drop-add">
                            <a href="{{ route('configuracion.curso', array_merge($baseParams, ['new_enunciado' => 1])) }}">+ Nuevo enunciado</a>
                        </p>
                    @endif

                    @forelse($enunciados as $enunciado)
                        @php
                            $enKey = 'en-'.$enunciado->id;
                            $enSearch = strtolower($enunciado->etiquetaCorta(200));
                            $enSearchBundle = $enSearch.' '.strtolower($enunciado->evidencias->map(fn ($ev) => $ev->etiquetaCorta(200).' '.$ev->temas->pluck('nombre')->join(' '))->join(' '));
                            $showEvidenciaForm = ($newEvidenciaEnunciadoId === $enunciado->id)
                                || ($editEvidencia && (int) $editEvidencia->enunciado_id === (int) $enunciado->id);
                            $enHighlighted = ($highlightKey ?? '') === $enKey;
                        @endphp

                        <details
                            class="eva-cur-drop eva-cur-drop--enunciado {{ $enHighlighted ? 'eva-cur-drop--highlight' : '' }}"
                            :open="isOpen(@js($enKey))"
                            x-show="branchVisible(@js(trim($enSearchBundle)), @js($enSearch))"
                        >
                            <summary class="eva-cur-drop-summary" @click.prevent="toggle(@js($enKey))">
                                <span class="eva-cur-drop-marker" aria-hidden="true"></span>
                                <span class="eva-cur-drop-label">Enunciado</span>
                                <span class="eva-cur-drop-text">
                                    <x-cur-tree-label :html="$enunciado->nombre" />
                                </span>
                                <span class="eva-cur-drop-meta">{{ $enunciado->evidencias->count() }} ev.</span>
                                <span class="eva-cur-drop-actions" @click.stop>
                                    <x-row-actions align="left">
                                        <a href="{{ route('configuracion.curso', array_merge($baseParams, ['edit_enunciado' => $enunciado->id, 'expand_enunciado' => $enunciado->id])) }}">Editar</a>
                                        <a href="{{ route('configuracion.curso', array_merge($baseParams, ['new_evidencia_enunciado' => $enunciado->id, 'expand_enunciado' => $enunciado->id])) }}">+ Evidencia</a>
                                        <form method="POST" action="{{ route('configuracion.enunciados.destroy', $enunciado) }}" onsubmit="return confirm('¿Eliminar enunciado?')">
                                            @csrf @method('DELETE')
                                            <button type="submit" class="eva-row-actions-danger">Eliminar</button>
                                        </form>
                                    </x-row-actions>
                                </span>
                            </summary>

                            <div class="eva-cur-drop-children">
                                @foreach($enunciado->evidencias as $evidencia)
                                    @php
                                        $evKey = 'ev-'.$evidencia->id;
                                        $evSearch = strtolower($evidencia->etiquetaCorta(200));
                                        $evSearchBundle = $evSearch.' '.strtolower($evidencia->temas->pluck('nombre')->join(' '));
                                        $evHighlighted = ($highlightKey ?? '') === $evKey;
                                        $showLinkForm = ($linkTemasEvidenciaId === $evidencia->id);
                                    @endphp

                                    <details
                                        class="eva-cur-drop eva-cur-drop--evidencia {{ $evHighlighted ? 'eva-cur-drop--highlight' : '' }}"
                                        :open="isOpen(@js($evKey))"
                                        x-show="branchVisible(@js(trim($evSearchBundle)), @js($evSearch))"
                                    >
                                        <summary class="eva-cur-drop-summary" @click.prevent="toggle(@js($evKey))">
                                            <span class="eva-cur-drop-marker" aria-hidden="true"></span>
                                            <span class="eva-cur-drop-label">Evidencia</span>
                                            <span class="eva-cur-drop-text">
                                                <x-cur-tree-label :html="$evidencia->nombre" />
                                            </span>
                                            <span class="eva-cur-drop-meta">{{ $evidencia->temas->count() }} tem.</span>
                                            <span class="eva-cur-drop-actions" @click.stop>
                                                <x-row-actions align="left">
                                                    <a href="{{ route('configuracion.curso', array_merge($baseParams, ['edit_evidencia' => $evidencia->id, 'expand_enunciado' => $enunciado->id, 'expand_evidencia' => $evidencia->id])) }}">Editar</a>
                                                    <a href="{{ route('configuracion.curso', array_merge($baseParams, ['link_temas_evidencia' => $evidencia->id, 'expand_enunciado' => $enunciado->id, 'expand_evidencia' => $evidencia->id])) }}">Vincular temas</a>
                                                    <form method="POST" action="{{ route('configuracion.evidencias.destroy', $evidencia) }}" onsubmit="return confirm('¿Eliminar evidencia?')">
                                                        @csrf @method('DELETE')
                                                        <button type="submit" class="eva-row-actions-danger">Eliminar</button>
                                                    </form>
                                                </x-row-actions>
                                            </span>
                                        </summary>

                                        <div class="eva-cur-drop-children eva-cur-drop-children--leaf">
                                            @if($evidencia->temas->isEmpty() && ! $showLinkForm)
                                                <p class="eva-cur-drop-empty">Sin temas vinculados.</p>
                                            @endif

                                            @foreach($evidencia->temas as $tema)
                                                <div class="eva-cur-drop-leaf {{ ($highlightKey ?? '') === 'tema-'.$tema->id ? 'eva-cur-drop--highlight' : '' }}">
                                                    <span class="eva-cur-drop-label eva-cur-drop-label--tema">Tema</span>
                                                    <span class="eva-cur-drop-text">
                                                        <strong>{{ $tema->nombre }}</strong>
                                                        @if($tema->descripcion)
                                                            <span class="eva-cur-drop-desc">{{ $tema->descripcion }}</span>
                                                        @endif
                                                    </span>
                                                </div>
                                            @endforeach

                                            @if($showLinkForm)
                                                @include('configuracion.partials.evidencia-temas-form', [
                                                    'evidencia' => $evidencia,
                                                    'enunciado' => $enunciado,
                                                ])
                                            @endif
                                        </div>
                                    </details>
                                @endforeach

                                @if($showEvidenciaForm)
                                    @include('configuracion.partials.evidencia-form-inline', ['enunciado' => $enunciado])
                                @elseif($enunciado->evidencias->isEmpty())
                                    <p class="eva-cur-drop-empty">Sin evidencias.</p>
                                @endif

                                @unless($showEvidenciaForm)
                                    <p class="eva-cur-drop-add">
                                        <a href="{{ route('configuracion.curso', array_merge($baseParams, ['new_evidencia_enunciado' => $enunciado->id, 'expand_enunciado' => $enunciado->id])) }}">+ Nueva evidencia</a>
                                    </p>
                                @endunless
                            </div>
                        </details>
                    @empty
                        @unless($showEnunciadoForm)
                            <p class="eva-cur-drop-empty eva-cur-drop-empty--block">Aún no hay enunciados en este curso.</p>
                        @endunless
                    @endforelse

                    {{-- Temas generales --}}
                    <details class="eva-cur-drop eva-cur-drop--temas" :open="isOpen('temas')">
                        <summary class="eva-cur-drop-summary" @click.prevent="toggle('temas')">
                            <span class="eva-cur-drop-marker" aria-hidden="true"></span>
                            <span class="eva-cur-drop-label">Temas generales</span>
                            <span class="eva-cur-drop-text">Catálogo de temas del curso</span>
                            <span class="eva-cur-drop-meta">{{ $temas->count() }}</span>
                        </summary>

                        <div class="eva-cur-drop-children eva-cur-drop-children--leaf">
                            <p class="eva-cur-drop-hint">Crea los temas aquí. Luego vincúlalos a cada evidencia desde «Vincular temas».</p>

                            @if($newTema || $editTema)
                                @include('configuracion.partials.tema-form-inline', ['formSuffix' => 'general'])
                            @else
                                <p class="eva-cur-drop-add">
                                    <a href="{{ route('configuracion.curso', array_merge($baseParams, ['new_tema' => 1, 'expand_temas' => 1])) }}">+ Nuevo tema</a>
                                </p>
                            @endif

                            @forelse($temas as $tema)
                                <div class="eva-cur-drop-leaf {{ ($highlightKey ?? '') === 'tema-'.$tema->id ? 'eva-cur-drop--highlight' : '' }}">
                                    <span class="eva-cur-drop-label eva-cur-drop-label--tema">Tema</span>
                                    <span class="eva-cur-drop-text">
                                        <strong>{{ $tema->nombre }}</strong>
                                        @if($tema->descripcion)
                                            <span class="eva-cur-drop-desc">{{ $tema->descripcion }}</span>
                                        @endif
                                    </span>
                                    <span class="eva-cur-drop-actions" @click.stop>
                                        <x-row-actions align="left">
                                            <a href="{{ route('configuracion.curso', array_merge($baseParams, ['edit_tema' => $tema->id, 'expand_temas' => 1])) }}">Editar</a>
                                            <form method="POST" action="{{ route('configuracion.temas.destroy', $tema) }}" onsubmit="return confirm('¿Eliminar tema? Se quitará de las evidencias vinculadas.')">
                                                @csrf @method('DELETE')
                                                <button type="submit" class="eva-row-actions-danger">Eliminar</button>
                                            </form>
                                        </x-row-actions>
                                    </span>
                                </div>
                            @empty
                                <p class="eva-cur-drop-empty">No hay temas creados todavía.</p>
                            @endforelse
                        </div>
                    </details>
                </div>
            </details>
        </div>
    </details>
</div>

@if($highlightKey ?? false)
    @push('scripts')
    <script>
        document.addEventListener('DOMContentLoaded', () => {
            const node = document.querySelector('.eva-cur-drop--highlight');
            if (node) {
                node.scrollIntoView({ behavior: 'smooth', block: 'center' });
            }
        });
    </script>
    @endpush
@endif