/* Menu d'autocomplétion des commandes « /topic » (app-command.js).
   Le positionnement du parent vit ICI : app.css est figé au plafond du
   cliquet statique, aucune règle ne peut s'y ajouter. */
#composer {
  position: relative;
}
#command-menu {
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: min(680px, calc(100% - 2.5rem));
  margin-bottom: 0.35rem;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: var(--shadow);
  overflow: hidden;
  z-index: 30;
}
#command-list {
  max-height: 40vh;
  overflow-y: auto;
}
.command-row {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  padding: 0.45rem 0.85rem;
  cursor: pointer;
  /* 44px : cible tactile minimale (ergonomie smartphone, v1.49+). */
  min-height: 44px;
  justify-content: center;
}
.command-row.selected,
.command-row:hover {
  background: var(--accent-soft);
}
.command-topic {
  font-weight: 600;
  font-family: var(--mono, monospace);
  font-size: 0.9rem;
}
.command-desc {
  color: var(--muted);
  font-size: 0.8rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#command-hint {
  padding: 0.4rem 0.85rem;
  border-top: 1px solid var(--border);
  color: var(--muted);
  font-size: 0.75rem;
  font-family: var(--mono, monospace);
  word-break: break-word;
}
