/* Один вид для всех чатов с агентами: «Проверка» в профиле сотрудника, разговор
   с ревьюером и лента агента загрузки, агент CRM. Разговоры с клиентами живут
   по своим правилам (шкала времени слева) — здесь их нет.

   Ход — подряд идущее от одного автора. Человек — пузырь справа, агент — текст
   слева. Под ходом агента — время слева, при наведении к нему добавляются
   «копировать», «нравится», «не нравится». Под пузырём человека по умолчанию
   пусто, при наведении — время и «копировать». Время точное: под репликой —
   часы и минуты («13:02»), день — в разделителе, полная дата — в подсказке. */

.ac { display: flex; flex-direction: column; }
.ac-day { display: flex; align-items: center; gap: 12px; margin: 4px 0 18px; font-size: 12px; color: var(--muted); }
.ac-day::before, .ac-day::after { content: ""; height: 1px; flex: 1; background: var(--border-soft); }

.ac-turn { margin: 0 0 14px; min-width: 0; }
.ac-turn.me { display: flex; flex-direction: column; align-items: flex-end; }
.ac-parts { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ac-turn.me .ac-parts { align-items: flex-end; width: 100%; }
.ac-bubble { max-width: 78%; padding: 9px 14px; border-radius: 16px 16px 5px 16px; background: var(--surface-2); color: var(--ink);
             font: 400 15px/1.55 var(--sans); white-space: pre-wrap; text-align: left; }
.ac-text { font: 400 15px/1.62 var(--sans); color: var(--ink); max-width: 70ch; }
.ac-text p { margin: 0 0 8px; } .ac-text p:last-child { margin: 0; }
.ac-final { padding: 12px 14px; border-radius: var(--r-md); background: var(--ok-bg); font: 400 15px/1.55 var(--sans); max-width: 70ch; }
.ac-final p { margin: 0 0 8px; } .ac-final p:last-child { margin: 0; }
.ac-rich { max-width: 70ch; }

/* ── подпись под ходом ── */
.ac-foot { display: flex; align-items: center; gap: 2px; margin-top: 4px; min-height: 26px; font-size: 12px; color: var(--muted); }
.ac-time { padding: 0 6px 0 0; font-variant-numeric: tabular-nums; white-space: nowrap; cursor: default; }
.ac-btn { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 7px; color: var(--muted);
          opacity: 0; transition: opacity .12s ease, background .12s ease; }
.ac-btn:hover { background: var(--surface-2); color: var(--ink); }
.ac-btn:focus-visible { opacity: 1; }
.ac-btn[aria-pressed="true"] { opacity: 1; color: var(--accent); }
.ac-btn.copied { opacity: 1; color: var(--ok); }
.ac-turn:hover .ac-btn, .ac-turn:focus-within .ac-btn { opacity: 1; }
/* у человека подпись целиком появляется при наведении, справа */
.ac-turn.me .ac-foot { justify-content: flex-end; opacity: 0; transition: opacity .12s ease; }
.ac-turn.me .ac-time { padding: 0 2px 0 6px; }
.ac-turn.me:hover .ac-foot, .ac-turn.me:focus-within .ac-foot { opacity: 1; }
@media (hover: none) { .ac-btn, .ac-turn.me .ac-foot { opacity: 1; } }

/* ── отзыв об ответе: модалка поверх чата (рамка, шапка и подвал — .modal из base.css) ── */
.ac-fb-modal .modal-box { max-width: 480px; }
.ac-fb-rate { display: flex; gap: 4px; margin-bottom: 10px; }
.ac-fb-rate .ac-btn { opacity: 1; width: 30px; height: 30px; }
.ac-fb-modal textarea { display: block; width: 100%; min-height: 96px; resize: vertical; padding: 8px 10px;
                        border: 1px solid var(--border); border-radius: var(--r-md); background: var(--raise);
                        color: var(--ink); font: 400 14px/1.45 var(--sans); }
.ac-fb-modal textarea:focus { outline: 0; border-color: var(--accent); }
.ac-fb-err { font-size: 12px; color: var(--fail); }

/* ── вызовы тулов: пачка (последний и «×N», раскрывается) и строки-действия ── */
.ac-act { display: grid; grid-template-columns: 14px minmax(0, 1fr); gap: 8px; align-items: start; font-size: 13px; line-height: 1.45; color: var(--ink-2); }
.ac-act .ic { margin-top: 2px; color: var(--muted); }
.ac-act .t { font-weight: 500; }
.ac-act > span { min-width: 0; }
.ac-act.tone-edit .ic, .ac-act.tone-edit .t { color: var(--accent); }
.ac-act.tone-ok .ic, .ac-act.tone-ok .t { color: var(--ok); }
.ac-act.tone-wait .ic, .ac-act.tone-wait .t { color: var(--wait); }
.ac-act.tone-muted .ic, .ac-act.tone-muted .t { color: var(--muted); }
.ac-act.failed .ic, .ac-act.failed .t { color: var(--fail); }
.ac-act.live .ic { color: var(--accent); animation: ac-pulse 1.1s ease-in-out infinite; }
.ac-x { margin-left: 4px; color: var(--fail); font-size: 12px; font-weight: 700; }
.ac-pack { max-width: 60ch; }
.ac-packbtn { display: flex; align-items: center; gap: 8px; width: 100%; padding: 0; text-align: left; }
.ac-packbtn .ac-act { flex: 0 1 auto; min-width: 0; }
.ac-packbtn .ac-act .t { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ac-n { flex: none; font-size: 12.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.ac-more { flex: none; color: var(--muted); font-size: 15px; line-height: 1; transition: transform .12s ease; }
.ac-packbtn:hover .ac-more { color: var(--ink); }
.ac-packbtn[aria-expanded="true"] .ac-more { transform: rotate(90deg); }
.ac-packbtn .ac-open { display: none; }
.ac-packbtn[aria-expanded="true"] .ac-open { display: flex; }
.ac-packbtn[aria-expanded="true"] .ac-closed { display: none; }
.ac-packbtn .ac-open, .ac-packbtn .ac-closed { align-items: center; gap: 8px; min-width: 0; }
.ac-closed { display: flex; }
.ac-rest { display: grid; gap: 6px; margin-top: 6px; }
.ac-rest[hidden] { display: none; }
.ac-single { max-width: 76ch; }
.ac-single .ac-act .t { font-weight: 600; }

/* ── живое: «думаю», «печатает», задание и конец работы ── */
.ac-thinking { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--muted); }
.ac-dots { display: inline-flex; gap: 4px; }
.ac-dots i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; animation: ac-dot 1.05s infinite; }
.ac-dots i:nth-child(2) { animation-delay: .16s; } .ac-dots i:nth-child(3) { animation-delay: .32s; }
.ac-caret { display: inline-block; width: 7px; height: 15px; margin-left: 2px; vertical-align: -2px; background: var(--accent); animation: ac-blink 1s steps(1) infinite; }
.ac-task { margin: 0 0 16px; padding: 10px 12px; border-radius: var(--r-md); background: var(--surface); border: 1px solid var(--border-soft); font-size: 13.5px; }
.ac-task .lab { display: block; margin-bottom: 3px; font-size: 12px; font-weight: 600; color: var(--muted); }
.ac-end { display: flex; align-items: center; gap: 10px; margin: 4px 0 14px; font-size: 12px; color: var(--muted); }
.ac-end::after { content: ""; flex: 1; height: 1px; background: var(--border-soft); }
@keyframes ac-pulse { 0%, 100% { opacity: 1 } 50% { opacity: .35 } }
@keyframes ac-dot { 0%, 55%, 100% { opacity: .25 } 25% { opacity: 1 } }
@keyframes ac-blink { 50% { opacity: 0 } }
@media (prefers-reduced-motion: reduce) { .ac-dots i, .ac-act.live .ic, .ac-caret { animation: none; } }