@model FamilyBudget.Models.Utilisateur

@{
    ViewData["Title"] = "Delete Utilisateur";
}

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Supprimer Utilisateur</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet">
    <style>
        .btn-danger:hover {
            background-color: #c82333;
        }
    </style>
</head>
<body>
    <div class="container mt-5">
        <div class="card shadow-lg p-4">
            <h2 class="text-danger"><i class="bi bi-trash"></i> Supprimer l'utilisateur</h2>
            <div class="alert alert-warning mt-3">
                <i class="bi bi-exclamation-triangle-fill"></i> Êtes-vous sûr de vouloir supprimer cet utilisateur ? Cette action est <strong>irréversible</strong>.
            </div>
            <hr />
            <h4>Détails de l'utilisateur</h4>
            <dl class="row">
                <dt class="col-sm-3">@Html.DisplayNameFor(model => model.Nom)</dt>
                <dd class="col-sm-9">@Html.DisplayFor(model => model.Nom)</dd>
                <dt class="col-sm-3">@Html.DisplayNameFor(model => model.Email)</dt>
                <dd class="col-sm-9">@Html.DisplayFor(model => model.Email)</dd>
            </dl>

            <!-- Boutons d'action -->
            <div class="d-flex gap-2">
                <button type="button" class="btn btn-danger btn-lg" data-bs-toggle="modal" data-bs-target="#confirmDeleteModal">
                    <i class="bi bi-trash"></i> Supprimer
                </button>
                <a asp-action="Index" class="btn btn-secondary btn-lg"><i class="bi bi-arrow-left"></i> Retour</a>
            </div>
        </div>
    </div>

    <!-- Modal de confirmation -->
    <div class="modal fade" id="confirmDeleteModal" tabindex="-1" aria-labelledby="confirmDeleteModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title text-danger" id="confirmDeleteModalLabel">
                        <i class="bi bi-exclamation-triangle-fill"></i> Confirmation de suppression
                    </h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    Êtes-vous sûr de vouloir supprimer <strong>@Model.Nom</strong> ? Cette action est irréversible.
                </div>
                <div class="modal-footer">
                    <form asp-action="Delete">
                        <input type="hidden" asp-for="IdUtilisateur" />
                        <button type="submit" class="btn btn-danger"><i class="bi bi-trash"></i> Confirmer</button>
                    </form>
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>
                </div>
            </div>
        </div>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
