/* © 2026 VEYRO (ИП Макаров И. В.). appagent — проприетарная программа. Использование — по лицензионному договору https://appagent.ru/legal/offer/. Копирование и распространение без разрешения запрещены. */
/* «Назад» (js/ui/back.js): ссылка «← Родитель» над заголовком и крошки при цепочке длиннее двух уровней.
   Ширина по содержимому (inline-flex, не на всю строку); значения только из tokens.css; касание не меньше 2,75 rem на узком и сенсорном экране. */

.ui-back-nav { display: block; width: fit-content; max-width: 100%; justify-self: start; align-self: flex-start; margin: 0 0 var(--space-2); }
.ui-back {
  display: inline-flex; align-items: center; gap: var(--space-2); max-width: 100%; min-height: var(--space-8);
  border-radius: var(--radius-xs); color: var(--color-ink2); text-decoration: none; overflow-wrap: anywhere;
  font: var(--weight-regular) var(--text-caption-size)/var(--text-caption-line) var(--font-sans);
}
.ui-back:hover { color: var(--color-ink); }
.ui-back:focus-visible, .ui-back__crumb:focus-visible { outline: var(--size-focus-width) solid var(--color-focus); outline-offset: var(--size-focus-offset); }
.ui-back .ic { flex: none; width: var(--size-icon); height: var(--size-icon); }

/* Крошки: «Дашборд / Очередь / Задача»; последняя — текущий экран, не ссылка */
.ui-back__trail {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--space-2); margin: 0; padding: 0; list-style-type: none;
  font: var(--weight-regular) var(--text-caption-size)/var(--text-caption-line) var(--font-sans);
}
.ui-back__trail > li { display: inline-flex; align-items: center; gap: var(--space-2); min-width: 0; }
.ui-back__trail > li + li::before { content: "/" / ""; color: var(--color-ink3); }
.ui-back__crumb { display: inline-flex; align-items: center; min-height: var(--space-8); border-radius: var(--radius-xs); color: var(--color-ink2); text-decoration: none; overflow-wrap: anywhere; }
a.ui-back__crumb:hover { color: var(--color-ink); }
.ui-back__cur { display: inline-flex; align-items: center; min-height: var(--space-8); color: var(--color-ink); overflow-wrap: anywhere; }

@media (max-width: 40rem), (pointer: coarse) {
  .ui-back, .ui-back__crumb, .ui-back__cur { min-height: var(--size-touch-min); }
}