{% extends "base.html" %}

{% block content %}
<div class="page-header">
    <h2 class="page-title">Aide</h2>
</div>

<div class="card mb-4">
    <div class="card-header">
        <h3 class="card-title">Demarrage rapide</h3>
    </div>
    <ol style="padding-left:1.5rem; line-height:2">
        <li>Configurez votre cle API dans <strong>Connexions</strong></li>
        <li>Creez ou ajoutez un agent depuis la <strong>Bibliotheque</strong></li>
        <li>Assignez un raccourci clavier dans <strong>Raccourcis</strong></li>
        <li>Utilisez le raccourci pour activer l'agent</li>
    </ol>
</div>

<div class="card mb-4">
    <div class="card-header">
        <h3 class="card-title">Types d'agents</h3>
    </div>
    <div class="table-container">
        <table>
            <thead>
                <tr>
                    <th>Type</th>
                    <th>Description</th>
                    <th>Exemple</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td><span class="badge badge-muted">Simple</span></td>
                    <td>Traitement de texte sans outils externes</td>
                    <td>Transcription, traduction, reformulation</td>
                </tr>
                <tr>
                    <td><span class="badge badge-primary">Connecte</span></td>
                    <td>Utilise des MCPs (outils externes)</td>
                    <td>Recherche web, emails, calendrier</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

<div class="card mb-4">
    <div class="card-header">
        <h3 class="card-title">Raccourcis par defaut</h3>
    </div>
    <div class="table-container">
        <table>
            <thead>
                <tr>
                    <th>Action</th>
                    <th>Raccourci</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Arreter l'enregistrement</td>
                    <td><span class="badge badge-muted">Double Echap</span></td>
                </tr>
                <tr>
                    <td>Pause/Reprendre</td>
                    <td><span class="badge badge-muted">Header > Pause</span></td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

<div class="card">
    <div class="card-header">
        <h3 class="card-title">Support</h3>
    </div>
    <p class="text-muted">
        Pour signaler un bug ou demander une fonctionnalite, contactez le support.
    </p>
</div>
{% endblock %}