/* ╔═══════════════════════════════════════════════════════════════════════════╗
 * ║  ⛔  LOCKED STABLE MODULE — ne pas modifier sans test_dragdrop          ║
 * ║      + test_sanitize + test_icon_engine_lock + validation utilisateur.  ║
 * ║      Voir app/static/home-icons/LOCKED_BEHAVIOR.md                      ║
 * ╚═══════════════════════════════════════════════════════════════════════════╝
 *
 * icon-engine.css — dimensions/layout des widgets de la home Réseau Actif
 * ────────────────────────────────────────────────────────────────────────────
 *
 * INVARIANTS
 *   - NE JAMAIS modifier les dimensions (.w-icon, .w-group, etc.) dans
 *     home_shell_preview.html ; ce fichier en est la source de vérité.
 *   - .widget-grid: 4 colonnes, gap 0.6rem, padding 0.75rem. Toute
 *     modification doit être répercutée dans icon-engine.js _gridMetrics()
 *     (qui les LIT depuis le DOM, donc en principe c'est automatique).
 *   - Les rangées ont une hauteur MIN de 72px mais peuvent grandir (carte
 *     220px). Le moteur (icon-engine.js) gère cela via elementFromPoint.
 * ──────────────────────────────────────────────────────────────────────────── */

/* ── Grille principale ─────────────────────────────────────────────────── */
.widget-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: minmax(72px, auto);
  gap: 0.6rem;
  padding: 0.75rem;
}

/* ── Tailles canoniques (NE PAS surcharger inline) ─────────────────────── */
.w-icon   { grid-column: span 1; min-height: 72px; }
.w-small  { grid-column: span 2; min-height: 100px; }
.w-medium { grid-column: span 4; min-height: 100px; }
.w-large  { grid-column: span 4; min-height: 220px; }
.w-wide   { grid-column: span 4; min-height: 160px; }
.w-group  { grid-column: span 1; min-height: 72px; transition: all 0.2s; }

/* État "expanded" = uniquement span 2x2. Les start col/row sont gérés en
   inline par expandGroup() pour préserver la position d'origine. */
.w-group.expanded {
  min-height: 156px;
  box-shadow: 0 12px 32px rgba(22,58,90,0.28) !important;
  z-index: 50;
  position: relative;
  transform: scale(1.04);
}