/* Подсказка слэш-команд в композере: появляется, когда поле начинается
   с "/". Отдельный файл: messages.css перерос лимит 600 строк, поэтому
   новые блоки живут рядом со своим скриптом (slash.js).

   Внешне - тот же список, что у упоминаний (одна привычка, один вид),
   но строка шире: команда и её пояснение стоят рядом. Ширина по
   содержимому, а не 320px от упоминаний: пояснение "/me проверил
   сборку" в узкую колонку не влезало. Позиция - absolute внутри
   .composer-main (position: relative задан в messages.css), поэтому
   список привязан к полю и не улетает при прокрутке ленты. */
.slash-hints {
  position: absolute;
  bottom: calc(100% + var(--s1));
  left: 0;
  z-index: 20;
  display: flex;
  flex-direction: column;
  min-width: 260px;
  max-width: min(420px, 90vw);
  padding: var(--s1);
  border: 1px solid var(--border);
  border-radius: var(--radius-panel);
  background: var(--bg);
  box-shadow: var(--shadow-popup);
}

.slash-hint {
  display: flex;
  align-items: baseline;
  gap: var(--s2);
  padding: var(--s1) var(--s2);
  border: 0;
  border-radius: var(--radius-chip);
  background: none;
  text-align: left;
  font-size: var(--fs-meta);
  line-height: var(--lh-meta);
  color: var(--text);
  cursor: pointer;
}

/* Выбор с клавиатуры и наведение: как у упоминаний */
.slash-hint.is-active,
.slash-hint:hover { background: var(--surface-hover); }

/* Команда моноширинным: это то, что человек набирает буквально */
.slash-hint-code {
  flex-shrink: 0;
  font-family: var(--font-mono);
  font-weight: 600;
}

.slash-hint-text {
  color: var(--text-faint);
  font-size: var(--fs-label);
}