{# Contenu de la documentation Lucy Assist - 100% autonome, sans Font Awesome #}

<div class="prose prose-sm max-w-none">
    <h3 class="text-lg font-bold mb-4">
        📖 Guide Lucy
    </h3>

    <div class="collapse collapse-arrow bg-base-200 mb-2">
        <input type="checkbox" checked />
        <div class="collapse-title font-medium">
            🧭 Aide contextuelle
        </div>
        <div class="collapse-content text-sm">
            <p>Lucy détecte automatiquement la page où vous vous trouvez pour vous proposer une aide ciblée.</p>
        </div>
    </div>

    <div class="collapse collapse-arrow bg-base-200 mb-2">
        <input type="checkbox" />
        <div class="collapse-title font-medium">
            🔍 Recherche intelligente
        </div>
        <div class="collapse-content text-sm">
            <p>Trouvez rapidement n'importe quel élément en posant simplement la question.</p>
            <p class="mt-2"><strong>Exemple :</strong> "Trouve-moi le client Dupont"</p>
        </div>
    </div>

    <div class="collapse collapse-arrow bg-base-200 mb-2">
        <input type="checkbox" />
        <div class="collapse-title font-medium">
            ➕ Création assistée
        </div>
        <div class="collapse-content text-sm">
            <p>Créez de nouveaux éléments en discutant avec Lucy qui vous guide étape par étape.</p>
            <p class="mt-2"><strong>Exemple :</strong> "Crée un nouveau membre nommé Jean Martin"</p>
        </div>
    </div>

    <div class="collapse collapse-arrow bg-base-200 mb-2">
        <input type="checkbox" />
        <div class="collapse-title font-medium">
            🐛 Analyse de bugs
        </div>
        <div class="collapse-content text-sm">
            <p>Signalez un problème et Lucy analysera pour détecter d'éventuels bugs.</p>
            <p class="mt-2"><strong>Exemple :</strong> "Je n'arrive pas à enregistrer le formulaire, j'ai une erreur"</p>
        </div>
    </div>

    <div class="collapse collapse-arrow bg-base-200 mb-2">
        <input type="checkbox" />
        <div class="collapse-title font-medium">
            ⌨️ Raccourcis clavier
        </div>
        <div class="collapse-content text-sm">
            <ul class="list-none space-y-2">
                <li>
                    <kbd class="kbd kbd-sm">Ctrl + K</kbd>
                    <span class="ml-2">Ouvrir Lucy</span>
                </li>
                <li>
                    <kbd class="kbd kbd-sm">Echap</kbd>
                    <span class="ml-2">Fermer Lucy</span>
                </li>
                <li>
                    <kbd class="kbd kbd-sm">Entrée</kbd>
                    <span class="ml-2">Envoyer le message</span>
                </li>
            </ul>
        </div>
    </div>

    <div class="divider"></div>

    <h4 class="font-bold mb-2">
        Tarification
    </h4>

    <div class="stats stats-vertical shadow w-full bg-base-200">
        <div class="stat">
            <div class="stat-title">Prix par million de tokens</div>
            <div class="stat-value text-primary">50 EUR</div>
        </div>
        <div class="stat">
            <div class="stat-title">Tokens moyens par conversation</div>
            <div class="stat-value text-secondary">2 000</div>
        </div>
        <div class="stat">
            <div class="stat-title">Conversations pour 50 EUR</div>
            <div class="stat-value text-accent">~500</div>
            <div class="stat-desc">Estimation basée sur l'usage moyen</div>
        </div>
    </div>

    <div class="alert alert-info mt-4 text-xs">
        ℹ️ <span>Le nombre de tokens utilisés dépend de la complexité de vos questions et des réponses générées.</span>
    </div>
</div>