/* Меню дела по правой кнопке (`taskMenu.js`).

   Своим листом, а не строками в `app.css`: общий лист правят в несколько рук,
   а здесь только то, чего нет у обычного пункта `popover`, — подсказка справа
   и стрелка подменю. Сам пункт, его подсветка, опасный цвет и разделитель
   берутся из `.popover__item` как есть: меню дела обязано выглядеть как любое
   другое меню Флоу. */

.task-menu__item { min-width: 232px; }
.task-menu__label { flex: 0 1 auto; white-space: nowrap; }

/* Подсказка — текущее значение пункта: срок, исполнитель, приоритет. Видно,
   что поменяется, ещё до того как открыто второе меню. */
.task-menu__hint {
  margin-left: auto; padding-left: 12px;
  max-width: 128px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 12px; color: var(--text-faint);
}
.popover__item.is-current .task-menu__hint { color: var(--text-faint); font-weight: 400; }

/* Стрелка подменю — уголком из рамки: в наборе значков стрелки вправо нет,
   а заводить значок ради шести пикселей незачем. */
.task-menu__sub::after {
  content: ''; flex: none;
  width: 6px; height: 6px; margin-left: 8px; margin-right: 2px;
  border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor;
  transform: rotate(45deg); opacity: .45;
}
.task-menu__sub:not(:has(.task-menu__hint))::after { margin-left: auto; }

/* «Загружаю…» у уведомления, пока дочитывается дело. */
.task-menu__wait { padding: 8px 10px; }

/* На телефоне меню открывается под пальцем: подсказке места меньше. */
@media (max-width: 820px) {
  .task-menu__item { min-width: 0; }
  .task-menu__hint { max-width: 96px; }
}