    <div class="container mt-5">
        <h1 class="mb-4">Chat Statistics</h1>

        <div class="card mb-3">
            <div class="card-body">
                <h5 class="card-title">Total Chats</h5>
                <p class="card-text">{{ stats.total_chats }}</p>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-body">
                <h5 class="card-title">Average LLM Answer Length</h5>
                <p class="card-text">{{ stats.average_llm_answer_length }}</p>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-body">
                <h5 class="card-title">Model Frequencies</h5>
                <ul class="list-group list-group-flush">
                    {% for model, count in stats.models_frequency.items() %}
                        <li class="list-group-item d-flex justify-content-between align-items-center">
                            {{ model }}
                            <span class="badge bg-primary rounded-pill">{{ count }}</span>
                        </li>
                    {% endfor %}
                </ul>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-body">
                <h5 class="card-title">Platform Frequencies</h5>
                <ul class="list-group list-group-flush">
                    {% for platform, count in stats.platforms_frequency.items() %}
                        <li class="list-group-item d-flex justify-content-between align-items-center">
                            {{ platform }}
                            <span class="badge bg-primary rounded-pill">{{ count }}</span>
                        </li>
                    {% endfor %}
                </ul>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-body">
                <h5 class="card-title">Provider Frequencies</h5>
                <ul class="list-group list-group-flush">
                    {% for provider, count in stats.providers_frequency.items() %}
                        <li class="list-group-item d-flex justify-content-between align-items-center">
                            {{ provider }}
                            <span class="badge bg-primary rounded-pill">{{ count }}</span>
                        </li>
                    {% endfor %}
                </ul>
            </div>
        </div>
    </div>
