/* © 2026 VEYRO (ИП Макаров И. В.). appagent — проприетарная программа. Использование — по лицензионному договору https://appagent.ru/legal/offer/. Копирование и распространение без разрешения запрещены. */
/* Стили экранов: T-05 (переписка проекта). Файл подключён в index.html после screens.css; значения — только из tokens.css.
   Каркас окна (.chat, .thread, .msg, .composer) задаёт screens.css, раскладку окна по высоте — shell.css; здесь — то, что нужно вкладке «Чат»:
   текст сообщений, пустая переписка, карточка плана, поле ввода. Светлая и тёмная темы — от токенов цвета. */

.chat { max-width: calc(var(--layout-narrow) + var(--space-16)); }
.thread { min-width: 0; }
.thread__msgs { display: grid; align-content: start; gap: var(--space-5); min-width: 0; }
.thread__plan { display: grid; margin-top: var(--space-5); min-width: 0; }
.thread__plan:empty { display: none; }
.thread .msg { min-width: 0; }
.msg__t { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font: var(--text-ui-weight) var(--text-body-size)/var(--text-body-line) var(--font-sans); }
.msg__h { margin: 0; }
.msg--day { margin: 0; }
.chat__empty { justify-items: start; align-self: start; }
.msg--card { justify-self: stretch; width: 100%; padding: 0; background: none; border: 0; }

/* ---------- Карточка плана ---------- */
.plan {
  display: grid; gap: var(--space-3); padding: var(--space-4) var(--space-5);
  background: var(--color-panel); border: 1px solid var(--color-line); border-radius: var(--radius-lg);
  box-shadow: inset 0.1875rem 0 0 var(--color-acc);
}
.plan > * { margin: 0; min-width: 0; }
.plan__kicker { color: var(--color-ink2); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.plan .h3 { overflow-wrap: anywhere; }
.plan__body { color: var(--color-ink2); font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); overflow-wrap: anywhere; }
.plan__step { display: grid; gap: var(--space-3); }
.plan__confirm, .plan__reject { display: grid; gap: var(--space-3); }
.plan__acts { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.plan__acts .btn { white-space: normal; text-align: center; }
.plan__warn { margin: 0; color: var(--color-ink); font: var(--text-ui-strong-weight) var(--text-ui-strong-size)/var(--text-ui-strong-line) var(--font-sans); }
.plan__l { font: var(--text-ui-strong-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); color: var(--color-ink); }
.plan__reject textarea {
  width: 100%; min-height: calc(var(--size-control) * 1.5); padding: var(--space-3);
  background: var(--color-bg2); color: var(--color-ink); border: 1px solid var(--color-line2); border-radius: var(--radius-md);
  resize: vertical; line-height: var(--text-ui-line);
}
.plan__reject textarea:focus-visible { border-color: var(--color-ink3); }
.plan__sent { color: var(--color-ok-text); font: var(--text-ui-strong-weight) var(--text-ui-strong-size)/var(--text-ui-strong-line) var(--font-sans); }
.plan__status { color: var(--color-ink2); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); overflow-wrap: anywhere; }
.plan__status:empty { display: none; }
.plan__status[data-tone="err"] { color: var(--color-danger-text); }
.msg--card[aria-busy="true"] .plan { opacity: .85; }

/* ---------- Поле ввода ---------- */
.composer textarea { field-sizing: content; max-height: 10rem; overflow-y: auto; color: var(--color-ink); }
.composer textarea::placeholder { color: var(--color-ink3); opacity: 1; }
.composer__bar { align-items: center; }
.composer__start {
  display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--size-touch-min); padding-right: var(--space-2);
  color: var(--color-ink2); cursor: pointer; font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans);
}
.composer__start input { flex: none; width: var(--size-icon); height: var(--size-icon); margin: 0; accent-color: var(--color-acc); cursor: pointer; }
.composer__hint { margin: 0; color: var(--color-ink3); font: var(--text-caption-weight) var(--text-label-size)/var(--text-caption-line) var(--font-sans); }
.composer__msg { margin: 0; color: var(--color-ink2); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); overflow-wrap: anywhere; }
.composer__msg:empty { display: none; }
.composer__msg[data-tone="err"] { color: var(--color-danger-text); }

/* Телефон: переписка листается вместе со страницей, поле ввода закреплено над нижней панелью. */
@media not all and (min-width: 45.0625rem) {
  .composer {
    position: sticky; bottom: calc(var(--layout-tabbar) + env(safe-area-inset-bottom)); z-index: var(--z-sticky);
    padding: var(--space-3) 0; background: var(--color-bg); border-top: 1px solid var(--color-line);
  }
  .plan { padding: var(--space-4); }
  .plan__acts .btn { flex: 1 1 auto; }
  .msg--me { max-width: 92%; }
}

/* ---------- Карточки ленты: вопрос лида и прогон (стекло макета C2: плитка kit, скругление --tile-radius) ---------- */
.cc { display: grid; gap: var(--space-3); padding: var(--space-5); min-width: 0; color: var(--color-ink); }
.cc > * { margin: 0; min-width: 0; }
.cc [hidden] { display: none; }
.cc__top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--space-1) var(--space-3); }
.cc__kicker { margin: 0; color: var(--color-ink2); font: var(--text-label-weight) var(--text-caption-size)/var(--text-caption-line) var(--text-label-family); overflow-wrap: anywhere; }
.cc__time { color: var(--color-ink3); font: var(--text-caption-weight) var(--text-label-size)/1 var(--font-sans); font-variant-numeric: tabular-nums; }
.cc__text { white-space: pre-wrap; overflow-wrap: anywhere; font: var(--text-body-weight) var(--text-body-size)/var(--text-body-line) var(--font-sans); }
.cc__actions { display: grid; gap: var(--space-3); }
.cc__opts { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.cc__opt { white-space: normal; text-align: center; max-width: 100%; }
.cc__actions > .btn { justify-self: start; }
.cc__form { display: grid; gap: var(--space-2); padding: var(--space-3); }
.cc__label { color: var(--color-ink2); font: var(--text-label-weight) var(--text-caption-size)/var(--text-caption-line) var(--text-label-family); }
.cc__area {
  width: 100%; min-height: calc(var(--size-control) * 1.5); padding: var(--space-3); resize: vertical;
  background: var(--color-bg2); color: var(--color-ink); border: 1px solid var(--color-line2); border-radius: var(--radius-md);
  font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans);
}
.cc__area:focus-visible { border-color: var(--color-ink3); }
.cc__area:disabled { background: var(--color-panel2); color: var(--color-ink2); }
.cc__acts { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.cc__done, .cc__state { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.cc__status { color: var(--color-ink2); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); overflow-wrap: anywhere; }
.cc__status:empty { display: none; }
.cc__status[data-tone="err"] { color: var(--color-danger-text); }
.cc[aria-busy="true"] { opacity: .85; }
.cc--question { box-shadow: var(--surface-shadow), inset 0.1875rem 0 0 var(--color-acc); }
.cc--run[data-state="stopped"] { box-shadow: var(--surface-shadow), inset 0.1875rem 0 0 var(--color-danger); }
.cc__progress { display: grid; gap: var(--space-1); }
.cc__bar {
  appearance: none; -webkit-appearance: none; width: 100%; height: var(--space-2); border: 0; border-radius: var(--radius-pill);
  background: var(--color-panel2); overflow: hidden; color: var(--color-acc);
}
.cc__bar::-webkit-progress-bar { background: var(--color-panel2); }
.cc__bar::-webkit-progress-value { background: var(--color-acc); border-radius: var(--radius-pill); }
.cc__bar::-moz-progress-bar { background: var(--color-acc); border-radius: var(--radius-pill); }
.cc__count { color: var(--color-ink2); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); font-variant-numeric: tabular-nums; }
.cc__link {
  display: inline-flex; align-items: center; justify-self: start; min-height: var(--size-touch-min);
  color: var(--color-acc-text); text-underline-offset: .2em;
}
.cc__link:hover { text-decoration: none; }
.msg__state { margin: 0; color: var(--color-ink2); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); overflow-wrap: anywhere; }
.msg__state--err { color: var(--color-danger-text); }
.msg--pending { opacity: .85; }

/* Главная телефона: блок «Идёт работа» и подпись вопроса лида в списке решений. */
.ph-runs { display: grid; gap: var(--tile-gap); list-style-type: none; margin: 0; padding: 0; }
.ph-card__kicker { color: var(--color-ink2); font: var(--text-label-weight) var(--text-caption-size)/var(--text-caption-line) var(--text-label-family); }
.ph-card__q { color: var(--color-ink); overflow-wrap: anywhere; white-space: pre-line; font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); }

@media not all and (min-width: 45.0625rem) {
  .cc { padding: var(--space-4); }
  .cc__opts .btn, .cc__acts .btn { flex: 1 1 auto; }
}
@media (prefers-reduced-motion: reduce) {
  .cc, .cc .btn { transition: none; }
}