{#
    Activity timeline partial for deal view.
    Expected variables:
      - timeline: array of timeline items
#}
<div class="dv-card" id="dvCardActivity">
    <div class="dv-card-header" onclick="DealView.toggleCard('dvCardActivity')">
        <h3>Activity <span class="dv-count">({{ timeline|length }})</span> <span class="dv-chevron"><svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor"><path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708l-3 3a.5.5 0 0 1-.708 0l-3-3a.5.5 0 0 1 0-.708z"/></svg></span></h3>
    </div>
    <div class="dv-card-body">
        {% if timeline is empty %}
            <p style="color:var(--text-secondary);margin:0;">No activity yet.</p>
        {% else %}
            <ul class="dv-activity-list" id="dvActivityList">
                {% for item in timeline %}
                    {% set timelineLabel = item.label %}
                    {% if item.type == 'audit' %}
                        {% set timelineLabel = item.label|replace({'deal.': '', 'dealflow.': '', '_': ' ', '.': ' '})|title %}
                    {% endif %}
                    <li class="dv-activity-item" {% if loop.index > 3 %}style="display:none;" data-activity-hidden{% endif %}>
                        <div class="dv-activity-desc">
                            <span class="dv-action">{{ timelineLabel }}</span>
                            {% if item.body %}
                                <span class="dv-transition">{{ item.body }}</span>
                            {% endif %}
                        </div>
                        <span class="dv-activity-time">{{ item.timestamp.format('M j, Y H:i') }}</span>
                    </li>
                {% endfor %}
            </ul>
            {% if timeline|length > 3 %}
                <button class="dv-show-all-link" id="dvShowAllActivity">Show all ({{ timeline|length }})</button>
            {% endif %}
        {% endif %}
    </div>
</div>
