diff --git a/Front-End/src/components/Structure/Files/FileUploadDocuSeal.js b/Front-End/src/components/Structure/Files/FileUploadDocuSeal.js
index 15d98e2..9213df6 100644
--- a/Front-End/src/components/Structure/Files/FileUploadDocuSeal.js
+++ b/Front-End/src/components/Structure/Files/FileUploadDocuSeal.js
@@ -69,7 +69,6 @@ export default function FileUploadDocuSeal({
   };
 
   const handleLoad = (detail) => {
-    const templateId = detail?.id;
     logger.debug('loading template id : ', detail);
     setTemplateMaster(detail);
   };
@@ -138,39 +137,62 @@ export default function FileUploadDocuSeal({
   };
 
   return (
-    <div className="h-full flex flex-col mt-4 space-y-4">
-      <div className="grid grid-cols-10 gap-4 items-start">
-        <div className="col-span-2">
+    <div className="h-full flex flex-col mt-4 space-y-6">
+      {/* Contenu principal */}
+      <div className="grid grid-cols-10 gap-6 items-start">
+        {/* Sélection des groupes */}
+        <div className="col-span-2 bg-white p-4 rounded-lg shadow-md border border-gray-200">
+          <h3 className="text-lg font-medium text-gray-800 mb-4">
+            Dossiers d'inscription
+          </h3>
           <MultiSelect
             name="groups"
-            label="Sélection de groupes de fichiers"
+            label="Sélection de dossier(s) d'inscription"
             options={groups}
             selectedOptions={selectedGroups}
             onChange={handleGroupChange}
             errorMsg={null}
           />
         </div>
-        <div className="col-span-8">
-          {token && (
-            <DocusealBuilder
-              token={token}
-              headers={{
-                Authorization: `Bearer ${token}`,
-              }}
-              withSendButton={false}
-              withSaveButton={false}
-              withSignYourselfButton={false}
-              autosave={false}
-              language={'fr'}
-              onLoad={handleLoad}
-              onUpload={handleUpload}
-              onChange={handleChange}
-              onSave={handleSubmit}
-              className="h-full overflow-auto" // Ajouter overflow-auto pour permettre le défilement
-              style={{ maxHeight: '70vh' }} // Limiter la hauteur maximale du composant
-              // Il faut auter l'host correspondant (une fois passé en HTTPS)
-              //host="docuseal:3001"
-            />
+
+        {/* Zone de configuration des documents */}
+        <div className="col-span-8 bg-white p-6 rounded-lg shadow-md border border-gray-200">
+          {selectedGroups.length === 0 ? (
+            <div className="flex flex-col items-center justify-center h-full text-center space-y-4">
+              {/* Icône circulaire modernisée */}
+              <div className="bg-emerald-100 p-6 rounded-full flex items-center justify-center shadow-md">
+                <div className="w-12 h-12 bg-emerald-200 rounded-full flex items-center justify-center">
+                  <span className="text-emerald-600 font-bold text-2xl">+</span>
+                </div>
+              </div>
+
+              {/* Message d'information */}
+              <p className="text-gray-600 text-sm font-medium">
+                Veuillez sélectionner au moins un groupe pour continuer.
+              </p>
+            </div>
+          ) : (
+            token && (
+              <div className="h-full overflow-auto">
+                <DocusealBuilder
+                  token={token}
+                  headers={{
+                    Authorization: `Bearer ${token}`,
+                  }}
+                  withSendButton={false}
+                  withSignYourselfButton={false}
+                  autosave={false}
+                  withDocumentsList={false}
+                  language={'fr'}
+                  onLoad={handleLoad}
+                  onUpload={handleUpload}
+                  onChange={handleChange}
+                  onSave={handleSubmit}
+                  className="h-full overflow-auto"
+                  style={{ maxHeight: '65vh' }}
+                />
+              </div>
+            )
           )}
         </div>
       </div>