/* Чат-консультант: единый виджет для трёх бэкендов (assistant|n8n|openai).
   Палитра завязана на --main-color сайта с запасным значением. */
:root{ --chat-accent:var(--main-color,#1d5287); }
.chat-btn{
	position:fixed; left:22px; bottom:22px; z-index:9998;   /* слева — чтобы не перекрывать стрелку «наверх» (#back_top справа) */
	width:58px; height:58px; padding:0; border:0; border-radius:50%; cursor:pointer; box-sizing:border-box;
	background:var(--chat-accent); color:#fff;
	box-shadow:0 6px 20px rgba(16,24,40,.28);
	display:flex; align-items:center; justify-content:center;
	transition:transform .15s ease, box-shadow .15s ease;
}
.chat-btn svg{ width:28px; height:28px; }   /* фикс размера иконки поверх темы сайта */
.chat-btn:hover{ transform:translateY(-2px); box-shadow:0 10px 26px rgba(16,24,40,.34); }
.chat-btn svg{ display:block; }
.chat-badge{
	position:absolute; top:-2px; right:-2px; min-width:20px; height:20px; border-radius:10px;
	background:#e03e3e; color:#fff; font:700 12px/20px Arial,sans-serif; text-align:center; padding:0 5px;
}
.chat-popup{
	position:fixed; left:22px; bottom:92px; z-index:9999;
	width:380px; max-width:calc(100vw - 24px); height:560px; max-height:calc(100vh - 120px);
	background:#fff; border-radius:16px; overflow:hidden;
	box-shadow:0 18px 50px rgba(16,24,40,.30), 0 2px 8px rgba(16,24,40,.12);
	display:flex; flex-direction:column;
	font:14px/1.45 -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif; color:#1a232d;
}
.chat-popup.hidden{ display:none; }
.chat-header{
	display:flex; align-items:center; gap:10px; padding:12px 14px;
	background:var(--chat-accent); color:#fff; flex:0 0 auto;
}
.chat-avatar{
	width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.16);
	display:flex; align-items:center; justify-content:center; flex:0 0 auto;
}
.chat-title{ flex:1; min-width:0; }
.chat-name{ font-weight:700; font-size:15px; }
.chat-status{ font-size:12px; opacity:.85; display:flex; align-items:center; gap:5px; }
.chat-dot{ width:7px; height:7px; border-radius:50%; background:#4ade80; display:inline-block; }
.chat-hbtn{
	background:transparent; border:0; color:#fff; opacity:.75; cursor:pointer; padding:6px; border-radius:8px;
	display:flex; align-items:center; height:auto; box-sizing:border-box;   /* height:auto — гасим глобальную button{height:44px} темы */
}
.chat-hbtn:hover{ opacity:1; background:rgba(255,255,255,.14); }
.chat-content{
	flex:1; overflow-y:auto; overflow-x:hidden; padding:14px; background:#f5f7fa;
	display:flex; flex-direction:column; gap:2px;
}
.chat-msg{ display:flex; flex-direction:column; max-width:84%; margin:4px 0; }
.chat-msg.user{ align-self:flex-end; align-items:flex-end; }
.chat-msg.bot{ align-self:flex-start; align-items:flex-start; }
.chat-bubble{
	padding:9px 13px; border-radius:14px; white-space:pre-wrap;
	/* длинные ссылки рвём по символам: иначе пузырь распирает окно и появляется горизонтальная прокрутка */
	word-wrap:break-word; overflow-wrap:anywhere; word-break:break-word; max-width:100%; min-width:0;
}
.chat-msg.user .chat-bubble{ background:var(--chat-accent); color:#fff; border-bottom-right-radius:4px; }
.chat-msg.bot .chat-bubble{ background:#fff; border:1px solid #e4e8ee; border-bottom-left-radius:4px; }
.chat-msg.error .chat-bubble{ background:#fdecec; border-color:#f5c2c2; color:#8a2424; font-style:italic; }
.chat-bubble a{ color:inherit; text-decoration:underline; word-break:break-word; overflow-wrap:anywhere; }
.chat-msg.bot .chat-bubble a{ color:var(--chat-accent); }
.chat-time{ font-size:10px; color:#93a0af; margin:3px 4px 0; }
.chat-typing .chat-bubble{ display:flex; gap:4px; align-items:center; }
.chat-typing .t-dot{
	width:7px; height:7px; border-radius:50%; background:#b9c3cf; animation:chatBlink 1.2s infinite both;
}
.chat-typing .t-dot:nth-child(2){ animation-delay:.2s; }
.chat-typing .t-dot:nth-child(3){ animation-delay:.4s; }
@keyframes chatBlink{ 0%,80%,100%{opacity:.3} 40%{opacity:1} }
/* карточки товаров (собирает код из данных инструментов) */
.chat-products{
	display:flex; gap:8px; overflow-x:auto; padding:6px 2px 2px; max-width:100%;
}
.chat-product{
	flex:0 0 128px; width:128px; background:#fff; border:1px solid #e4e8ee; border-radius:10px;
	padding:8px; text-decoration:none; color:#1a232d; font-size:12px; line-height:1.3;
}
.chat-product:hover{ border-color:var(--chat-accent); }
.chat-product img{ display:block; width:100%; height:86px; object-fit:contain; margin-bottom:6px; }
.chat-product .p-name{ display:block; margin-bottom:4px; min-height:26px; overflow:hidden; }
.chat-product .p-price{ display:block; font-weight:700; color:var(--chat-accent); }
.chat-footer{
	display:flex; align-items:flex-end; gap:8px; padding:10px 12px; background:#fff;
	border-top:1px solid #e4e8ee; flex:0 0 auto;
}
.chat-footer textarea{
	flex:1; resize:none; border:1px solid #d7dde5; border-radius:12px; padding:9px 12px;
	font:inherit; height:auto; min-height:42px; max-height:110px; box-sizing:border-box; outline:none; background:#f9fafb;
	/* height:auto + box-sizing — перебиваем глобальные input/textarea{height:44px} темы, поле не распухает */
}
.chat-footer textarea:focus{ border-color:var(--chat-accent); background:#fff; }
.send-btn{
	width:40px; height:40px; padding:0; border:0; border-radius:50%; cursor:pointer; flex:0 0 auto; box-sizing:border-box;
	background:var(--chat-accent); color:#fff; display:flex; align-items:center; justify-content:center;
	/* padding:0/border:0 — глобальная button{padding:0 22px;border:1px} темы иначе прятала иконку */
}
.send-btn svg{ width:20px; height:20px; }
.send-btn:disabled{ opacity:.5; cursor:default; }
@media (max-width:480px){
	.chat-popup{ left:0; right:0; bottom:0; width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; border-radius:0; }
	.chat-btn{ left:14px; bottom:14px; }
}