/* ========== Чат с офисом (pages-chat.js): список бесед слева, лента справа; на телефоне список сворачивается в верхнюю панель ========== */
.nav a .nav-badge{display:inline-grid;place-items:center;min-width:18px;height:18px;border-radius:999px;background:var(--bad);color:#fff;font-size:11px;font-weight:700;margin-left:6px;padding:0 5px;vertical-align:middle;line-height:1}
.menu-list a .nav-badge{display:inline-grid;place-items:center;min-width:18px;height:18px;border-radius:999px;background:var(--bad);color:#fff;font-size:11px;font-weight:700;margin-left:8px;padding:0 5px}
.nav-badge[hidden]{display:none!important}

.chat-page{margin-bottom:-44px}
.chat-root{display:grid;grid-template-columns:320px minmax(0,1fr);height:calc(100dvh - 100px);min-height:460px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);overflow:hidden;position:relative}
.chat-side{display:flex;flex-direction:column;min-width:0;min-height:0;border-right:1px solid var(--line);background:var(--card)}
.chat-side-head{padding:14px 14px 10px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:10px} .chat-side-head h2{font-size:18px}
.chat-search{padding:9px 12px;border-radius:12px}
.chat-groups{overflow-y:auto;flex:1;min-height:0;padding:6px 8px 12px;scrollbar-width:thin}
.chat-group{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:12px 8px 4px}
.chat-row{display:flex;gap:10px;align-items:center;padding:8px;border-radius:12px;cursor:pointer;min-width:0;border:0;background:transparent;width:100%;text-align:left;font:inherit;color:inherit}
.chat-row:hover{background:var(--line)} .chat-row.active{background:var(--accent-soft)} .chat-row.active .chat-row-name{color:var(--accent)}
.chat-row-name{display:block;font-weight:600;font-size:14px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-row-sub{display:block;font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-row.ghost{opacity:.72} .chat-row.ghost .chat-av{background:var(--line);color:var(--muted)}
.chat-unread{min-width:20px;height:20px;border-radius:999px;background:var(--accent);color:#fff;font-size:11.5px;font-weight:700;display:grid;place-items:center;padding:0 6px;flex:none}
.chat-av{width:36px;height:36px;border-radius:50%;background:var(--accent-soft);color:var(--accent-ink);display:grid;place-items:center;font-weight:700;font-size:13px;flex:none}
.chat-av.me{background:var(--ink);color:var(--bg)} .chat-av.sm{width:30px;height:30px;font-size:12px}

.chat-main{display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--bg)}
.chat-head{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--card);min-height:58px}
.chat-head .chat-title{font-weight:700;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .chat-head .chat-sub{font-size:12.5px;color:var(--muted)}
.chat-list{flex:1;min-height:0;overflow-y:auto;padding:16px 16px 8px;display:flex;flex-direction:column;gap:12px;scrollbar-width:thin}
.chat-msg{display:flex;gap:10px;max-width:min(760px,92%)} .chat-msg.me{align-self:flex-end;flex-direction:row-reverse}
.chat-body{min-width:0;display:flex;flex-direction:column;gap:4px} .chat-msg.me .chat-body{align-items:flex-end}
.chat-meta{font-size:12px;color:var(--muted);display:flex;align-items:center;flex-wrap:wrap;gap:0 2px} .chat-meta b{color:var(--ink)} .chat-time{color:var(--faint)}
.chat-bubble{background:var(--card);border:1px solid var(--line);border-radius:16px;border-top-left-radius:6px;padding:10px 14px;font-size:14.5px;line-height:1.5;overflow-wrap:anywhere;max-width:100%}
.chat-msg.me .chat-bubble{background:var(--accent);color:#fff;border-color:var(--accent);border-top-left-radius:16px;border-top-right-radius:6px}
.chat-msg.me .chat-bubble a{color:#fff;text-decoration:underline} .chat-msg.me .chat-bubble code{background:rgba(255,255,255,.18);color:#fff}
.chat-bubble .md p{margin:4px 0} .chat-bubble .md>:first-child{margin-top:0} .chat-bubble .md>:last-child{margin-bottom:0} .chat-bubble .md ul,.chat-bubble .md ol{margin:4px 0}
.chat-sys{align-self:center;text-align:center;max-width:720px;font-size:12.5px;color:var(--muted);background:var(--card);border:1px dashed var(--line-strong);border-radius:12px;padding:8px 12px;display:flex;flex-direction:column;gap:4px;align-items:center}
.chat-sys details{text-align:left;width:100%} .chat-sys summary{cursor:pointer;text-align:center} .chat-sys-pre{white-space:pre-wrap;font:12px/1.45 var(--font);margin:6px 0 0;max-height:220px;overflow:auto;color:var(--ink-2)}
.chat-proposal{margin-top:10px;border:1px solid var(--line-strong);border-radius:12px;padding:10px 12px;background:var(--bg);display:flex;flex-direction:column;gap:6px;color:var(--ink)}
.chat-proposal-head{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--accent);flex-wrap:wrap} .chat-proposal-head svg{width:16px;height:16px}
.chat-proposal-title{font-weight:700;font-size:15px} .chat-proposal-text{white-space:pre-wrap;color:var(--ink-2);max-height:200px;overflow:auto}
.chat-typing{padding:4px 16px 8px;font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:8px;background:var(--bg)} .chat-typing svg{width:16px;height:16px}
.chat-typing[hidden],.chat-root [hidden]{display:none!important}
.chat-side-close{display:none}
.chat-dots{display:inline-flex;gap:3px} .chat-dots i{width:5px;height:5px;border-radius:50%;background:var(--muted);animation:chat-dot 1.2s infinite} .chat-dots i:nth-child(2){animation-delay:.2s} .chat-dots i:nth-child(3){animation-delay:.4s}
@keyframes chat-dot{0%,80%,100%{opacity:.25}40%{opacity:1}}
.chat-compose{display:flex;gap:8px;align-items:flex-end;padding:10px 14px 6px;border-top:1px solid var(--line);background:var(--card)}
.chat-input{flex:1;min-height:44px;max-height:180px;resize:none;padding:11px 13px;border:1px solid var(--line-strong);border-radius:14px;background:var(--bg);outline:none;font:inherit;line-height:1.4;color:var(--ink)}
.chat-input:focus{border-color:var(--accent-2);box-shadow:0 0 0 3px var(--accent-soft)}
.chat-send{width:44px;height:44px;padding:0;justify-content:center;border-radius:14px;flex:none} .chat-send svg{width:20px;height:20px}
.chat-hint{padding:0 14px 10px;background:var(--card)}
.chat-empty{flex:1;display:grid;place-items:center;color:var(--muted);padding:30px;text-align:center;max-width:520px;align-self:center}
.chat-more{align-self:center}
.chat-list-toggle{display:none}

/* блок «Обсуждение» в карточке задачи */
.chat-card{padding:0;overflow:hidden} .chat-card .card-title{padding:14px 18px 0;margin-bottom:0}
.chat-card .chat-main{height:480px;border-top:1px solid var(--line);margin-top:12px} .chat-card .chat-head{min-height:50px;padding:8px 12px}
:root:not([data-theme="dark"]) .chat-main{background:#FFFFFF} :root:not([data-theme="dark"]) .chat-bubble,:root:not([data-theme="dark"]) .chat-sys{background:#F5F6FA}
:root:not([data-theme="dark"]) .chat-msg.me .chat-bubble{background:var(--accent)} :root:not([data-theme="dark"]) .chat-proposal{background:#FFFFFF} :root:not([data-theme="dark"]) .chat-input{background:#FFFFFF}

/* телефон: список бесед сворачивается в верхнюю панель (кнопка «Беседы»), лента на весь экран */
@media (max-width:760px){
  .chat-root{grid-template-columns:minmax(0,1fr);height:calc(100dvh - 82px);min-height:0;border-radius:12px}
  .chat-side{display:none;position:absolute;inset:0;z-index:6;border-right:0}
  .chat-root.list-open .chat-side{display:flex}
  .chat-root.list-open .chat-main{visibility:hidden}
  .chat-list-toggle{display:inline-flex;flex:none;padding:6px 8px} .chat-side-close{display:grid;width:36px;height:36px}
  .chat-head{padding:8px 10px;gap:8px} .chat-head .btn.ghost:not(.chat-list-toggle){display:none}
  .chat-msg{max-width:100%} .chat-list{padding:12px 10px 6px;gap:10px} .chat-bubble{font-size:14px;padding:9px 12px}
  .chat-compose{padding:8px 10px 4px} .chat-hint{padding:0 10px 8px}
  .chat-card .chat-main{height:70dvh}
}

/* беседа поручения на весь экран: слой поверх страницы, как в мессенджере (шапка «Свернуть» · лента · поле ввода внизу) */
.chat-list{overscroll-behavior:contain}
.chat-card-actions{gap:8px;flex-wrap:nowrap;min-width:0} .chat-card-actions .tiny{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.chat-expand{flex:none;gap:6px} .chat-expand svg{width:16px;height:16px}
.chat-full-bar{display:none}
.chat-full-ph{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 18px;border-top:1px solid var(--line);margin-top:12px}
html.chat-full-open,html.chat-full-open body{overflow:hidden}
.chat-full-layer{position:fixed;left:0;right:0;top:0;height:100dvh;z-index:40;background:var(--card);display:flex;justify-content:center;overscroll-behavior:contain}
.chat-full-layer>.chat-main{width:100%;max-width:980px;height:100%;min-height:0;margin:0;border:0;border-left:1px solid var(--line);border-right:1px solid var(--line);border-radius:0}
.chat-full-layer .chat-full-bar{display:flex;align-items:center;gap:10px;flex:none;padding:8px 12px;padding-top:max(8px,env(safe-area-inset-top));border-bottom:1px solid var(--line);background:var(--card);touch-action:none}
.chat-full-close{flex:none;gap:4px;font-weight:600} .chat-full-close svg{width:18px;height:18px}
.chat-full-title{flex:1;min-width:0;font-weight:700;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-full-layer .chat-head{display:none}
.chat-full-layer .chat-list{flex:1;min-height:0}
.chat-full-layer .chat-compose{padding-bottom:max(8px,env(safe-area-inset-bottom))}
@media (max-width:760px){
  .chat-card-actions>.tiny{display:none} .chat-card-actions{flex:none}
  .ws-chat>.card-title{flex-wrap:nowrap} .ws-chat>.card-title h2{font-size:17px;min-width:0;line-height:1.25} .chat-expand{padding:6px 8px;font-size:13.5px}
  .chat-full-layer>.chat-main{border:0}
  .chat-full-layer .chat-hint{display:none}
  .chat-full-layer .chat-compose{flex-wrap:nowrap;align-items:flex-end;gap:6px}
  .chat-full-layer .chat-compose .chat-input{flex:1 1 auto;order:0;min-width:0}
  .chat-full-layer .chat-to .chat-to-label{max-width:64px}
  .chat-input[readonly]{cursor:pointer}
}
