{% extends "base.html" %}
{% block title %}My Conversations{% endblock %}

{% block content %}
<div class="row justify-content-center">
  <div class="col-lg-8">
    <div class="d-flex justify-content-between align-items-center mb-3">
      <h4 class="mb-0"><i class="bi bi-clock-history me-2 text-primary"></i>My Support Conversations</h4>
      <a href="{{ url_for('support.chat') }}" class="btn btn-primary btn-sm">
        <i class="bi bi-chat-dots me-1"></i>Back to Chat
      </a>
    </div>

    <div class="card shadow-sm">
      <div class="card-body p-0">
        {% if sessions %}
        <div class="list-group list-group-flush">
          {% for s in sessions %}
          <a href="{{ url_for('support.conversation_detail', session_id=s.id) }}"
             class="list-group-item list-group-item-action">
            <div class="d-flex justify-content-between align-items-start">
              <div class="me-3 text-truncate">
                <div class="fw-semibold text-truncate">{{ s.preview[:100] }}{% if s.preview|length > 100 %}…{% endif %}</div>
                <small class="text-muted">{{ s.message_count }} message{{ 's' if s.message_count != 1 }}</small>
              </div>
              <small class="text-muted text-nowrap">{{ s.updated_at.strftime('%b %d, %Y %I:%M %p') }}</small>
            </div>
          </a>
          {% endfor %}
        </div>
        {% else %}
        <div class="p-4 text-muted text-center">
          You have no saved conversations yet.
          <a href="{{ url_for('support.chat') }}">Start a chat</a>.
        </div>
        {% endif %}
      </div>
    </div>
  </div>
</div>
{% endblock %}