<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Web Sentinel - Rapport</title>
    <style>
        body { font-family: Arial, sans-serif; margin: 20px; }
        .header { color: #2563eb; font-size: 24px; margin-bottom: 20px; }
        .finding { margin: 10px 0; padding: 10px; border-left: 4px solid #ccc; }
        .critical { border-color: #dc2626; background: #fef2f2; }
        .high { border-color: #ea580c; background: #fff7ed; }
        .medium { border-color: #d97706; background: #fffbeb; }
        .low { border-color: #059669; background: #f0fdf4; }
        .info { border-color: #0284c7; background: #f0f9ff; }
    </style>
</head>
<body>
    <div class="header">🛡️ Web Sentinel - Rapport de Sécurité</div>
    <p><strong>Domaine:</strong> {{ domain }}</p>
    <p><strong>Date:</strong> {{ scan_date }}</p>
    
    <h2>Résultats</h2>
    {% for finding in findings %}
    <div class="finding {{ finding.severity }}">
        <h3>{{ finding.title }}</h3>
        <p><strong>Module:</strong> {{ finding.check }}</p>
        <p><strong>Sévérité:</strong> {{ finding.severity }}</p>
        <p><strong>Description:</strong> {{ finding.description }}</p>
        <p><strong>Recommandation:</strong> {{ finding.remediation }}</p>
    </div>
    {% endfor %}
</body>
</html>