Audit complet de mise en forme — Image (2e élément du tableau)

Implémente toutes les options manquantes identifiées pour l'élément
Image : dimensionnement/ratio/object-fit, filtres CSS, upload de
fichier (en plus de l'URL), lien/plein écran au clic, chargement
différé, légende, et tous les attributs de boîte partagés déjà créés
pour Titre/Paragraphe (padding/margin/fond/bordure/ombre/opacité/
position du bloc).

Système de pages : un support peut désormais avoir 0 page (un nouveau
support démarre vide), suppression de toutes les pages en un clic, et
la pagination automatique insère intelligemment la nouvelle page juste
après celle qui déborde plutôt qu'en toute fin de liste.

Bugs réels trouvés et corrigés en cours de route : le style de bloc
(dont align-self) ciblait l'élément interne au lieu de son enveloppe
(légende/lien) ; une image à sa taille native pouvait déclencher une
pagination infinie ; upload/mise à jour d'attribut ne déclenchaient
jamais le contrôle de débordement.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

static/document/document-editor.css

@@ -604,8 +604,24 @@ body.objectEditBody > main.content {
   font-weight: 600;
 }
 
+/* max-height : filet de sécurité pour une hauteur explicite (ou
+   l'absence de hauteur, image affichée à sa taille native) qui
+   dépasserait déraisonnablement une page (bug réel constaté le
+   26/09/2026 : "quand j'ajoute une image ça crée des pages à
+   l'infini") — le cadre FIXE par défaut (hauteur + object-fit:cover)
+   vit désormais dans les attributs par défaut d'un nouvel élément image
+   (voir element_kind_labels.element_default_attributes, retour
+   utilisateur : "ce cadre ne devrait pas changer de taille en fonction
+   de la taille de l'image mais être fixe"), pas ici en CSS : "Taille
+   réelle" (object_fit vide) doit rester un choix explicite possible
+   dans le panneau Propriétés, qu'un défaut CSS aveugle sur TOUTE image
+   casserait silencieusement (aucune façon de distinguer en CSS "jamais
+   réglé" de "réglé sur Taille réelle", les deux valant la chaîne vide).
+   Un réglage explicite de hauteur maximale prime toujours sur ce filet
+   (spécificité inline > feuille externe). */
 img.docImage {
   max-width: 100%;
+  max-height: calc(var(--doc-page-width, 960px) * 210 / 297 - 96px);
   border-radius: 10px;
   display: block;
 }
@@ -1427,7 +1443,8 @@ img.docImage {
    23/09/2026 : "le bouton pour ajouter une page dois être en haut
    toujours visible") — flex-shrink:0 pour ne jamais être compressé par
    .docPageManagerList, seule cette dernière défile. */
-.docPageManagerAdd {
+.docPageManagerAdd,
+.docPageManagerDeleteAll {
   flex-shrink: 0;
 }
 
@@ -1799,6 +1816,18 @@ img.docImage {
   padding: 30px 10px;
 }
 
+/* État "aucune page" du canevas (retour utilisateur du 26/09/2026 :
+   l'éditeur peut s'ouvrir sans page active) — occupe toute la hauteur
+   disponible de .docPageContent (flex column, voir plus haut) pour
+   centrer le message quel que soit vertical_align. */
+.docEmptyPageState {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 15px;
+}
+
 /* ===== BOTTOM NAV (mobile) ===== */
 .docBottomNav {
   display: none;
@@ -2563,3 +2592,54 @@ img.docImage {
   background: var(--doc-bg-2);
   cursor: pointer;
 }
+
+/* ---- Image : légende, lien, plein écran (voir document_engine/
+   rendering/render_document_element.py::_render_image et
+   static/document/js/document-editor.js::forgeDocOpenImageLightbox). ---- */
+.docImageFigure {
+  margin: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.docImageCaption {
+  font-size: 12.5px;
+  color: var(--doc-muted);
+  text-align: center;
+}
+
+.docImageLink {
+  display: block;
+}
+
+.docImageLightboxTrigger {
+  display: block;
+}
+
+.docEditor3.docEditor3--preview .docImageLightboxTrigger {
+  cursor: zoom-in;
+}
+
+.docImageLightboxOverlay {
+  display: none;
+  position: fixed;
+  inset: 0;
+  z-index: 300;
+  background: rgb(11 14 20 / 90%);
+  align-items: center;
+  justify-content: center;
+  padding: 40px;
+  cursor: zoom-out;
+}
+
+.docImageLightboxOverlay.is-open {
+  display: flex;
+}
+
+.docImageLightboxImg {
+  max-width: 100%;
+  max-height: 100%;
+  border-radius: 8px;
+  box-shadow: 0 20px 60px -20px rgb(0 0 0 / 60%);
+}