{% extends "base.html" %}
{% set active = "speakers" %}
{% block title %}Speakers — Communication DNA{% endblock %}
{% block content %}
<h2 class="text-2xl font-bold mb-6">Speakers</h2>
{% if speakers %}
<div class="grid sm:grid-cols-2 lg:grid-cols-3 gap-4">
    {% for s in speakers %}
    <a href="/speaker/{{ s.id }}" class="card hover:border-gray-500 transition-colors">
        <div class="flex items-start justify-between mb-2">
            <h3 class="text-lg font-semibold">{{ s.name }}</h3>
            <span class="text-xl">{{ sentiment_emoji(s.sentiment_avg) }}</span>
        </div>
        <div class="flex flex-wrap gap-1 mb-3">
            {% for tag in s.tags %}
            <span class="tag-pill {{ tag_colors.get(tag, 'bg-gray-600') }}">{{ tag }}</span>
            {% endfor %}
        </div>
        <div class="text-sm text-gray-400">
            {{ s.t_count }} transcription{{ 's' if s.t_count != 1 }} · {{ "{:,}".format(s.total_words) }} words
        </div>
    </a>
    {% endfor %}
</div>
{% else %}
<p class="text-gray-500">No speakers found.</p>
{% endif %}
{% endblock %}