/* ============================================================================
   РАЗДЕЛ «ОБРАЩЕНИЯ»: лента событий, сводка карточки, подсказки формы.
   Значений здесь нет — только токены из motorplace-tokens.css.
   ============================================================================ */

/* ---------------------------------------------------------------- Лента событий */
.mp-feed__empty { margin: 0; color: var(--mp-text-faint); font-size: var(--mp-size-body); }
.mp-feed__chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.mp-feed__chip {
  height: var(--mp-chip); padding: 0 10px; border-radius: var(--mp-radius-pill);
  border: 1px solid var(--mp-line); background: var(--mp-surface);
  color: var(--mp-text-soft); font: 600 var(--mp-size-caption)/1 var(--mp-font-ui); cursor: pointer;
}
.mp-feed__chip.is-on { background: var(--mp-graphite-800); border-color: var(--mp-graphite-800); color: var(--mp-white); }
.mp-feed__list { margin: 0; padding: 0; list-style: none; }
.mp-feed__item {
  display: grid; grid-template-columns: 108px minmax(0, 1fr) auto; gap: 12px; align-items: baseline;
  padding: 8px 0; border-top: 1px solid var(--mp-line-soft);
}
.mp-feed__item:first-child { border-top: 0; }
.mp-feed__kind {
  justify-self: start; padding: 2px 8px; border-radius: var(--mp-radius-pill);
  background: var(--mp-st-n-bg); color: var(--mp-st-n-ink);
  font: 700 var(--mp-size-caption)/1.5 var(--mp-font-ui);
}
.mp-feed__item--call .mp-feed__kind { background: var(--mp-st-i-bg); color: var(--mp-st-i-ink); }
.mp-feed__item--pass .mp-feed__kind,
.mp-feed__item--stage .mp-feed__kind { background: var(--mp-st-w-bg); color: var(--mp-st-w-ink); }
.mp-feed__item--lead .mp-feed__kind { background: var(--mp-st-o-bg); color: var(--mp-st-o-ink); }
.mp-feed__title { font-weight: 600; color: var(--mp-text); }
.mp-feed__body { margin-top: 2px; color: var(--mp-text-soft); white-space: pre-line; }
.mp-feed__meta { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; color: var(--mp-text-mute); font-size: var(--mp-size-caption); white-space: nowrap; }

/* ---------------------------------------------------------------- Шапка карточки:
   номер шильдой, статус, метка проверки (ТЗ на дизайн 5.3). */
.mp-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: var(--mp-text-mute); font-size: var(--mp-size-body); }
.mp-head__plate {
  padding: 2px 8px; border: 1px solid var(--mp-line-strong); border-radius: var(--mp-radius-sm);
  font: 600 var(--mp-size-body)/1.4 var(--mp-font-mono); color: var(--mp-text); background: var(--mp-surface);
}
.mp-head__sep { color: var(--mp-text-faint); }

/* ---------------------------------------------------------------- Текст обращения как пришёл */


/* ---------------------------------------------------------------- Список дублей в боковой колонке */
.mp-dups { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 6px; }
.mp-dups a { font-family: var(--mp-font-mono); color: var(--mp-text); text-decoration: underline; text-underline-offset: 2px; }

/* ---------------------------------------------------------------- Оглавление формы:
   секции с отметкой заполненности (ТЗ на дизайн 5.4). */
.mp-toc { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; }
.mp-toc a { display: flex; justify-content: space-between; gap: 8px; color: var(--mp-text-soft); text-decoration: none; font-size: var(--mp-size-body); }
.mp-toc a:hover { color: var(--mp-text); }
.mp-toc__mark { color: var(--mp-text-faint); font-size: var(--mp-size-caption); }
.mp-toc__mark.is-filled { color: var(--mp-st-o-ink); }

/* Число дублей в реестре — ссылка на группу, а не голая цифра. */
.mp-dup-count { font-family: var(--mp-font-mono); }
.mp-dup-count {
  margin-inline-start: 6px; padding: 1px 6px; border-radius: var(--mp-radius-pill);
  background: var(--mp-st-w-bg); color: var(--mp-st-w-ink); font-size: var(--mp-size-caption); font-weight: 700;
}

/* Счётчики «отсеяно проверкой» (дубли, тестовые, некорректные) — приглушённой
   группой, отдельно от основных (ТЗ на дизайн 5.1). */
.fi-tabs-item.mp-tab-muted:not(.fi-active) { opacity: .72; }
.fi-tabs-item.mp-tab-muted:first-of-type,
.fi-tabs-item:not(.mp-tab-muted) + .fi-tabs-item.mp-tab-muted { margin-inline-start: 14px; border-inline-start: 1px solid var(--mp-line); padding-inline-start: 14px; }