<?php ob_start(); ?>

<div class="max-w-2xl mx-auto">
    <div class="mb-6">
        <a href="<?= BASE_URL ?>/admin/ia" class="inline-flex items-center text-slate-600 hover:text-cyan-600 transition">
            <i class="fas fa-arrow-left mr-2"></i>Retour à la configuration IA
        </a>
    </div>

    <div class="bg-white rounded-2xl border border-slate-200 overflow-hidden">
        <div class="p-6 border-b border-slate-100 bg-gradient-to-r from-slate-50 to-white">
            <div class="flex items-center">
                <div class="w-12 h-12 bg-gradient-to-br from-purple-500 to-pink-500 rounded-xl flex items-center justify-center mr-4">
                    <i class="fas fa-plus text-white text-xl"></i>
                </div>
                <div>
                    <h2 class="text-xl font-bold text-slate-800">Nouvelle FAQ</h2>
                    <p class="text-sm text-slate-500">Ajoutez une question/réponse à la base de connaissances de l'IA</p>
                </div>
            </div>
        </div>

        <form action="<?= BASE_URL ?>/admin/ia/faq" method="POST" class="p-6">
            <input type="hidden" name="csrf_token" value="<?= $csrf_token ?>">

            <div class="space-y-6">
                <div>
                    <label class="block text-sm font-medium text-slate-700 mb-2">
                        <i class="fas fa-question-circle text-cyan-500 mr-1"></i>Question
                    </label>
                    <input type="text" name="question" required
                           class="w-full px-4 py-3 border border-slate-200 rounded-xl focus:ring-2 focus:ring-cyan-500 focus:border-transparent"
                           placeholder="Ex: Comment puis-je suivre ma commande ?">
                    <p class="text-xs text-slate-500 mt-1">La question que les clients pourraient poser</p>
                </div>

                <div>
                    <label class="block text-sm font-medium text-slate-700 mb-2">
                        <i class="fas fa-reply text-emerald-500 mr-1"></i>Réponse
                    </label>
                    <textarea name="reponse" rows="5" required
                              class="w-full px-4 py-3 border border-slate-200 rounded-xl focus:ring-2 focus:ring-cyan-500 focus:border-transparent"
                              placeholder="Écrivez la réponse détaillée que l'IA doit donner..."></textarea>
                    <p class="text-xs text-slate-500 mt-1">Soyez précis et complet dans votre réponse</p>
                </div>

                <div>
                    <label class="block text-sm font-medium text-slate-700 mb-2">Catégorie</label>
                    <input type="text" name="categorie" value="Général"
                           class="w-full px-4 py-3 border border-slate-200 rounded-xl focus:ring-2 focus:ring-cyan-500 focus:border-transparent"
                           placeholder="Ex: Livraison, Paiement, Compte...">
                </div>

                <div class="flex items-center p-4 bg-slate-50 rounded-xl">
                    <input type="checkbox" name="is_active" id="is_active" value="1" checked
                           class="w-5 h-5 text-cyan-600 rounded focus:ring-cyan-500">
                    <label for="is_active" class="ml-3">
                        <span class="font-medium text-slate-700">Activer cette FAQ</span>
                        <p class="text-sm text-slate-500">L'IA utilisera cette information pour répondre aux clients</p>
                    </label>
                </div>
            </div>

            <div class="flex items-center justify-end space-x-4 mt-8 pt-6 border-t border-slate-100">
                <a href="<?= BASE_URL ?>/admin/ia" class="px-6 py-3 border border-slate-200 rounded-xl text-slate-600 hover:bg-slate-50 transition">
                    Annuler
                </a>
                <button type="submit" class="px-6 py-3 bg-gradient-to-r from-cyan-500 to-emerald-500 hover:from-cyan-600 hover:to-emerald-600 text-white rounded-xl font-medium transition">
                    <i class="fas fa-save mr-2"></i>Enregistrer la FAQ
                </button>
            </div>
        </form>
    </div>
</div>

<?php 
$content = ob_get_clean();
$title = 'Nouvelle FAQ - ' . APP_NAME;
$pageTitle = 'Ajouter une FAQ';
include VIEWS_PATH . '/layouts/main.php';
?>
