{{-- Una funcionalidad, en la lista de su versión.

     Lo propio de este tipo son **las dos imágenes**: cabecera y miniatura. Se enseña si
     faltan, porque una funcionalidad sin ellas se sirve igual y en el Moodle del cliente
     se ve incompleta —sin que nada falle aquí—. --}}
<div class="flex min-w-0 items-start gap-3">
    {{-- La miniatura de verdad, no un icono: es lo que el usuario del Moodle va a ver. --}}
    @if ($elemento->thumbnail_image)
        <img src="{{ \Illuminate\Support\Facades\Storage::url($elemento->thumbnail_image) }}"
             alt=""
             class="h-10 w-10 flex-none rounded-lg object-cover"
             style="border:1px solid var(--border-subtle);">
    @else
        <span class="flex h-10 w-10 flex-none items-center justify-center rounded-lg"
              style="background:var(--surface-sunken); color:var(--text-subtle);">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="9" cy="9" r="2"/><path d="m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21"/></svg>
        </span>
    @endif

    <div class="min-w-0">
        <div class="truncate font-semibold" style="color:var(--text-strong);">{{ $elemento->title }}</div>

        @if ($elemento->description)
            <div class="truncate text-[12px]" style="color:var(--text-muted);">{{ $elemento->description }}</div>
        @endif

        {{-- Lo que falta, dicho solo cuando falta. --}}
        @php
            $faltan = collect([
                $elemento->header_image ? null : 'la imagen de cabecera',
                $elemento->thumbnail_image ? null : 'la miniatura',
                trim(strip_tags((string) $elemento->content_html)) === '' ? 'el contenido' : null,
            ])->filter();
        @endphp
        @if ($faltan->isNotEmpty())
            <div class="mt-0.5 text-[11.5px]" style="color:var(--warning-500);">
                Le falta {{ $faltan->implode(' y ') }}
            </div>
        @endif
    </div>
</div>