/* Чат-консультант: единый виджет для трёх бэкендов (assistant|n8n|openai).
   Палитра завязана на --main-color сайта с запасным значением.
   kedr812: фирменный зелёный #80bb25; иконка садовника и всплывающие подсказки —
   перенесены со старого виджета livepersona (см. хвост файла). */
:root{ --chat-accent:var(--main-color,#80bb25); }
.chat-btn{
	position:fixed; left:20px; bottom:100px; z-index:9998;
	width:58px; height:58px; border-radius:50%; border:none; cursor:pointer;
	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: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:20px; bottom:170px; 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; overflow:hidden;
}
.chat-avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.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:none; color:#fff; opacity:.75; cursor:pointer; padding:6px; border-radius:8px;
	display:flex; align-items:center;
}
.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; max-height:110px; outline:none; background:#f9fafb;
}
.chat-footer textarea:focus{ border-color:var(--chat-accent); background:#fff; }
.send-btn{
	width:40px; height:40px; border:none; border-radius:50%; cursor:pointer; flex:0 0 auto;
	background:var(--chat-accent); color:#fff; display:flex; align-items:center; justify-content:center;
}
.send-btn:disabled{ opacity:.5; cursor:default; }
@media (max-width:480px){
	.chat-popup{ left:0; right:auto; bottom:0; width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; border-radius:0; }
	.chat-btn{ left:14px; bottom:80px; }
}

/* --- kedr812: иконка садовника вместо стандартного значка + всплывающие подсказки --------
   Перенесено со старого виджета (assets/less/custom.less, #lp-open-chat): кнопка слева
   и приподнята над низом экрана, подсказки всплывают справа от неё. */
.chat-btn{
	/* иконка 60×60 нарисована кругом под всю кнопку — заполняем ею фон целиком */
	background:var(--chat-accent) url("../images/icon_chat.png") no-repeat center center;
	background-size:cover;
}
.chat-btn > svg{ display:none; }
@keyframes chat-shake{
	0%{ transform:translate(0,0); }
	25%{ transform:translate(-2px,2px); }
	50%{ transform:translate(2px,-2px); }
	75%{ transform:translate(-2px,2px); }
	100%{ transform:translate(0,0); }
}
.chat-btn.consultant-shake{ animation:chat-shake .3s ease-in-out 2; }
.consultant-message{
	position:fixed;
	bottom:105px;
	left:92px;
	background:#fff;
	padding:10px 15px;
	border-radius:10px;
	box-shadow:0 5px 20px rgba(0,0,0,.15);
	opacity:0;
	transform:translateY(20px);
	transition:.3s;
	z-index:9997;
	max-width:230px;
	font:13px/1.4 -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
	color:#1a232d;
}
.consultant-message.show{ opacity:1; transform:translateY(0); }
@media (max-width:600px){
	.consultant-message{ max-width:60vw; left:86px; }
}
