diff --git a/test.html b/test.html
index a948f56..e3090ef 100644
--- a/test.html
+++ b/test.html
@@ -9,8 +9,8 @@
         .status-ok { color: #4ade80; font-weight: bold; }
         .status-err { color: #f87171; font-weight: bold; }
         .card { background: #444; padding: 20px; margin-bottom: 20px; border-radius: 8px; }
-        input, select { padding: 10px; border-radius: 5px; border: none; margin: 5px 0; width: 100%; }
-        button { padding: 10px 20px; background: #1976d2; color: white; border: none; border-radius: 5px; cursor: pointer; }
+        input, select { padding: 10px; border-radius: 5px; border: none; margin: 5px 0; width: 100%; box-sizing: border-box; }
+        button { padding: 10px 20px; background: #1976d2; color: white; border: none; border-radius: 5px; cursor: pointer; margin-top: 10px; }
     </style>
 </head>
 <body>
@@ -21,7 +21,8 @@
 
     <div class="card">
         <h3>Modifier le produit</h3>
-        <input type="text" id="prod-name" placeholder="Nom du produit" value="Jus Ananas">
+        <input type="text" id="prod-id" placeholder="ID du produit (ex: 123)">
+        <input type="text" id="prod-name" placeholder="Nom du produit">
         <select id="category-selector">
             <option value="">-- Choisir une catégorie --</option>
         </select>
@@ -30,7 +31,7 @@
 
     <h1>Table des Catégories</h1>
     <table id="cat-table" style="width:100%; border-collapse: collapse;">
-        <thead><tr style="background:#444;"><th>Clé</th><th>Libellé</th></tr></thead>
+        <thead><tr style="background:#444;"><th style="padding:10px;">Clé</th><th style="padding:10px;">Libellé</th></tr></thead>
         <tbody></tbody>
     </table>
 
@@ -38,6 +39,7 @@
         const statusText = document.getElementById('status-text');
         const debugPanel = document.getElementById('debug-panel');
 
+        // Chargement des catégories
         fetch('translations/fr.json')
             .then(res => res.json())
             .then(data => {
@@ -51,9 +53,7 @@
                     statusText.className = "status-ok";
 
                     Object.entries(catData).forEach(([key, val]) => {
-                        // Remplir tableau
                         tbody.innerHTML += `<tr><td style="border:1px solid #555; padding:8px;">${key}</td><td style="border:1px solid #555; padding:8px;">${val}</td></tr>`;
-                        // Remplir select
                         const opt = document.createElement('option');
                         opt.value = key;
                         opt.textContent = val;
@@ -66,14 +66,21 @@
                 debugPanel.style.borderLeftColor = "#f87171";
             });
 
+        // Fonction d'enregistrement
         function saveProduct() {
+            const idEl = document.getElementById('prod-id');
+            const nameEl = document.getElementById('prod-name');
+            const catEl = document.getElementById('category-selector');
+
+            if (!idEl.value) return alert("Veuillez entrer un ID de produit.");
+
             const data = {
-                id: document.getElementById('prod-id').value, // Ajoute un champ pour l'ID
-                name: document.getElementById('prod-name').value,
-                category: document.getElementById('category-selector').value
+                id: idEl.value,
+                name: nameEl.value,
+                category: catEl.value
             };
             
-            // Remplace 'update_product' par l'action trouvée dans ton onglet Réseau
+            // Remplace 'product_edit' par l'action confirmée dans ton onglet Réseau
             fetch('api/index.php?action=product_edit', {
                 method: 'POST',
                 headers: { 'Content-Type': 'application/json' },
@@ -81,8 +88,8 @@
             })
             .then(r => r.json())
             .then(res => {
-                console.log("Réponse :", res);
-                alert("Action effectuée avec succès !");
+                console.log("Réponse API :", res);
+                alert("Action effectuée. Voir la console pour les détails.");
             })
             .catch(e => alert("Erreur : " + e));
         }
