/* Чат-консультант: единый виджет для трёх бэкендов (assistant|n8n|openai).
   Палитра завязана на --main-color сайта с запасным значением.
   С 02.10.2026 — кнопка «В корзину» на карточках, полоса корзины и форма заказа «в 1 клик». */
: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); }
/* С 02.10.2026 карточка — блок: ссылка на товар + кнопка «В корзину»; под названием — два признака */
.chat-product{ display:flex; flex-direction:column; }
.chat-product .p-link{ display:block; flex:1; color:inherit; text-decoration:none; }
.chat-product .p-attr{ display:block; color:#6b7785; font-size:11px; margin-bottom:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-product .p-cart{
	display:flex; align-items:center; justify-content:center; gap:4px;
	margin:6px 0 0; width:100%; height:auto; padding:6px 4px; box-sizing:border-box; cursor:pointer;
	border:1px solid var(--chat-accent); border-radius:8px; background:#fff; color:var(--chat-accent);
	font-family:inherit; font-weight:700; font-size:11px; line-height:1.2; text-transform:none; text-decoration:none; text-align:center;
	/* height:auto/margin/text-transform — гасим глобальные button{…} темы */
}
.chat-product .p-cart:hover{ background:var(--chat-accent); color:#fff; }
.chat-product .p-cart:disabled{ cursor:default; }
.chat-product .p-cart.done,.chat-product .p-cart.done:hover{ background:#fff; color:#1f8a4c; border-color:#1f8a4c; }
.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; }
/* ── Полоса корзины и заказ «в 1 клик» в окне чата (02.10.2026) ─────────────────────────────────
   У полей и кнопок темы бывают глобальные высота, отступы и рамки — поэтому height/padding/border/margin
   заданы явно (как и у .chat-hbtn/.send-btn выше). */
.chat-cartbar{
	display:flex; align-items:center; gap:8px; padding:8px 12px; flex:0 0 auto;
	background:#f1f5fb; border-top:1px solid #e4e8ee; font-size:12px; color:#1a232d;
}
.chat-cartbar[hidden]{ display:none; }
.chat-cartbar-info{ flex:1; min-width:0; display:flex; align-items:center; gap:6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.chat-cartbar-info svg{ flex:0 0 auto; color:var(--chat-accent); }
.chat-cartbar-btn{
	flex:0 0 auto; height:auto; margin:0; padding:7px 12px; border:0; border-radius:8px; cursor:pointer; box-sizing:border-box;
	background:var(--chat-accent); color:#fff; font-family:inherit; font-weight:700; font-size:12px; line-height:1.2; text-transform:none;
}
.chat-cartbar-btn:disabled{ opacity:.6; cursor:default; }
.chat-msg.chat-checkout-wrap{ max-width:100%; width:100%; align-self:stretch; }
.chat-checkout{
	background:#fff; border:1px solid #e4e8ee; border-radius:12px; padding:12px; display:flex; flex-direction:column; gap:7px; margin:0;
}
.chat-checkout .cc-title{ font-weight:700; font-size:14px; }
.chat-checkout .cc-items{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; font-size:12px; }
.chat-checkout .cc-items li{ display:flex; gap:6px; align-items:baseline; margin:0; padding:0; }
.chat-checkout .cc-items li::before{ display:none; }
.chat-checkout .cc-items a{ flex:1; min-width:0; color:#1a232d; text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chat-checkout .cc-items a:hover{ color:var(--chat-accent); }
.chat-checkout .cc-q{ color:#6b7785; white-space:nowrap; }
.chat-checkout .cc-items b{ white-space:nowrap; }
.chat-checkout .cc-total{ font-weight:700; text-align:right; padding-top:4px; border-top:1px dashed #e4e8ee; }
.chat-checkout input[type=text],.chat-checkout input[type=tel],.chat-checkout input[type=email],.chat-checkout textarea{
	width:100%; height:auto; min-height:36px; margin:0; padding:8px 10px; box-sizing:border-box;
	border:1px solid #d7dde5; border-radius:8px; background:#f9fafb; font:inherit; color:#1a232d; box-shadow:none; outline:none;
}
.chat-checkout textarea{ resize:vertical; min-height:52px; }
.chat-checkout input:focus,.chat-checkout textarea:focus{ border-color:var(--chat-accent); background:#fff; }
.chat-checkout input.cc-bad,.chat-checkout textarea.cc-bad{ border-color:#e03e3e; background:#fff7f7; }
.chat-checkout .cc-consent{ display:block; font-size:11px; line-height:1.4; color:#6b7785; font-weight:normal; margin:0; }
.chat-checkout .cc-consent a{ color:var(--chat-accent); }
.chat-checkout .cc-consent input{ width:auto; height:auto; margin:0 4px 0 0; vertical-align:-2px; }
.chat-checkout .cc-err{ background:#fdecec; border:1px solid #f5c2c2; color:#8a2424; border-radius:8px; padding:7px 10px; font-size:12px; }
.chat-checkout .cc-err[hidden]{ display:none; }
.chat-checkout .cc-actions{ display:flex; gap:8px; align-items:center; }
.chat-checkout .cc-submit{
	flex:1; height:auto; margin:0; padding:10px 12px; border:0; border-radius:10px; cursor:pointer; box-sizing:border-box;
	background:var(--chat-accent); color:#fff; font-family:inherit; font-weight:700; font-size:13px; line-height:1.2; text-transform:none;
}
.chat-checkout .cc-submit:disabled{ opacity:.6; cursor:default; }
.chat-checkout .cc-cancel{
	height:auto; margin:0; padding:10px 12px; border:1px solid #d7dde5; border-radius:10px; background:#fff; color:#4a5563;
	cursor:pointer; font-family:inherit; font-size:12px; line-height:1.2; text-transform:none; box-sizing:border-box;
}
.chat-checkout .cc-note{ font-size:11px; line-height:1.4; color:#6b7785; }
@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; }
}
