<li class="list-group-item d-flex gap-3 align-items-start" data-question_pk="{{ casedetail.case.pk }}">

    <div class="flex-fill">
        <div class="d-flex justify-content-between align-items-start">
            <div>
                <a class="h6 mb-0 text-decoration-none case-link"
                   href="{% url 'atlas:collection_case_view' pk=collection.pk case_number=forloop.counter0 %}"
                   data-case-base-href="{% url 'atlas:collection_case_view' pk=collection.pk case_number=0 %}">
                    {{ casedetail.case.title }}
                </a>
                <div class="small text-muted"><span class="case-number">Case {{ forloop.counter }}</span> &mdash; <span class="text-truncate">{{ casedetail.case.description|default_if_none:""|truncatechars:80 }}</span></div>
            </div>
        </div>

        <div class="mt-2 small text-muted">
            {% if casedetail.case.series.count == 0 %}
                <span class="text-warning">This case has no series / stacks attached</span>
            {% else %}
                {{ casedetail.case.series.count }} series
            {% endif %}
            {% if casedetail.question_schema %}
                &nbsp;•&nbsp;<span class="text-success">Questions defined</span>
            {% endif %}
        </div>
    </div>

    <div class="d-flex align-items-center ms-3">
        {% include 'atlas/partials/casedetails_management_links.html' %}
    </div>

</li>
