v2026.5.19 — Drag-and-drop des popups épinglés

viewer.css

@@ -2590,46 +2590,39 @@ header.topbar::before {
 
 /* ==========================================================================
    v2026.5.17 : mode Minimisé (popup flottant compact, juste la ref)
-   v2026.5.18 : fix affichage — on masque TOUT sauf la ref et la topbar
+   v2026.5.19 : refonte — élément .pinned-popup-minref créé à la volée
    ========================================================================== */
 .pinned-popup.pinned-popup-minimized {
   min-width: 180px !important;
   max-width: 260px !important;
   width: auto !important;
   height: auto !important;
-  padding-top: 28px !important;
-  padding-bottom: 8px !important;
+  min-height: 60px !important;
+  padding: 28px 10px 10px 10px !important;
   overflow: hidden;
+  background: var(--bg-elevated) !important;
+  border: 1px solid var(--border) !important;
 }
-/* Masquer tous les descendants sauf ceux qu'on veut voir */
-.pinned-popup.pinned-popup-minimized * {
+/* Masquer tous les enfants directs du popup minimisé */
+.pinned-popup.pinned-popup-minimized > *:not(.pinned-popup-topbar):not(.pinned-popup-dragbar):not(.pinned-popup-minref) {
   display: none !important;
 }
-/* Réafficher la topbar et ses boutons */
-.pinned-popup.pinned-popup-minimized .pinned-popup-topbar,
-.pinned-popup.pinned-popup-minimized .pinned-popup-topbar * {
-  display: flex !important;
-}
-/* Réafficher la dragbar */
-.pinned-popup.pinned-popup-minimized .pinned-popup-dragbar {
-  display: block !important;
-}
-/* Réafficher la ref (peut être dans une row imbriquée) */
-.pinned-popup.pinned-popup-minimized .iv-ref-header {
-  display: block !important;
-  text-align: center !important;
-  padding: 6px 12px !important;
-  grid-column: unset !important;
-  font-size: 14px !important;
-  font-weight: 700 !important;
-  color: var(--text) !important;
+/* L'élément ref dédié, centré et gros */
+.pinned-popup-minref {
+  display: block;
+  text-align: center;
+  padding: 6px 8px;
+  font-family: var(--mono, monospace);
+  font-size: 14px;
+  font-weight: 700;
+  color: var(--text);
   cursor: pointer;
+  user-select: none;
+  border-radius: 4px;
+  transition: background 0.12s;
 }
-/* Et si la ref est dans une row grid, reshowrow pour qu'elle s'affiche */
-.pinned-popup.pinned-popup-minimized .intervention-v2,
-.pinned-popup.pinned-popup-minimized .tt-ref-cell {
-  display: block !important;
-  grid-template: none !important;
+.pinned-popup-minref:hover {
+  background: var(--bg-muted);
 }
 
 /* ==========================================================================
@@ -2790,3 +2783,54 @@ header.topbar::before {
   background: var(--bg-muted);
   color: var(--text);
 }
+
+/* ==========================================================================
+   v2026.5.19 : nouveaux éléments
+   ========================================================================== */
+
+/* Bouton Actualiser (↻) dans la topbar du popup épinglé — animation spin */
+.pinned-popup-refresh {
+  font-size: 14px;
+  line-height: 1;
+}
+.pinned-popup-refresh.spinning {
+  animation: pinned-popup-refresh-spin 0.6s linear infinite;
+  pointer-events: none;
+}
+@keyframes pinned-popup-refresh-spin {
+  from { transform: rotate(0deg); }
+  to { transform: rotate(360deg); }
+}
+
+/* Pendant le drag d'un popup, ignorer les hover sur les cartes pour ne pas
+   ouvrir des tooltips parasites */
+body.popup-dragging .intervention-v2,
+body.popup-dragging .card {
+  pointer-events: none;
+}
+/* Mais garder les popups épinglés cliquables */
+body.popup-dragging .pinned-popup {
+  pointer-events: auto;
+}
+
+/* Pastille dock à 2 lignes : ref (gras) + date (petit) */
+.pinned-popup-dock-pill {
+  flex-direction: column !important;
+  align-items: center !important;
+  padding: 4px 14px !important;
+  line-height: 1.1;
+  gap: 1px !important;
+}
+.pinned-popup-dock-pill-ref {
+  display: block;
+  font-size: 13px;
+  font-weight: 700;
+  font-family: var(--mono, monospace);
+}
+.pinned-popup-dock-pill-date {
+  display: block;
+  font-size: 10px;
+  font-weight: 500;
+  opacity: 0.85;
+  font-family: var(--mono, monospace);
+}