/* Чат-виджет СИНТРОПИК. Палитра и шрифты — те же CSS-переменные,
   что задаёт index.html (:root): --ink, --indigo, --signal, --paper, --fog, --line. */

/* кнопка-пузырь */
.chat-bubble{
  position:fixed;
  right:calc(18px + env(safe-area-inset-right,0px));
  bottom:calc(18px + env(safe-area-inset-bottom,0px));
  z-index:80; /* ниже cookie-баннера (90): согласие всегда кликабельно */
  width:60px;height:60px;border:0;border-radius:50%;
  background:linear-gradient(135deg,#3B2FE6,#18E58C);
  color:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 12px 30px -8px rgba(59,47,230,.55);
  transition:transform .18s ease,box-shadow .18s ease;
}
.chat-bubble:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 16px 36px -8px rgba(59,47,230,.6)}
.chat-bubble:focus-visible{outline:3px solid var(--signal,#18E58C);outline-offset:2px}
.chat-bubble svg{width:28px;height:28px}
.chat-bubble[hidden]{display:none}

/* панель */
.chat-panel{
  position:fixed;
  right:calc(18px + env(safe-area-inset-right,0px));
  bottom:calc(18px + env(safe-area-inset-bottom,0px));
  z-index:85; /* ниже cookie-баннера (90): согласие кликабельно и при открытой панели */
  width:380px;height:560px;max-height:calc(100vh - 36px);max-width:calc(100vw - 36px);
  display:flex;flex-direction:column;
  background:var(--paper,#F5F7FC);
  border:1px solid var(--line,#E7E9F2);border-radius:18px;overflow:hidden;
  box-shadow:0 30px 70px -20px rgba(11,15,30,.5);
  font-family:'Manrope',system-ui,sans-serif;color:var(--ink,#0B0F1E);
}
.chat-panel[hidden]{display:none}

/* шапка */
.chat-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px 16px;background:var(--ink,#0B0F1E);color:#fff;flex:0 0 auto;
}
.chat-title b{font-family:'Unbounded',sans-serif;font-weight:700;font-size:14px;letter-spacing:.02em;display:block}
.chat-title small{display:flex;align-items:center;gap:6px;color:var(--fog,#8B93A7);font-size:12px;margin-top:3px}
.chat-dot{width:7px;height:7px;border-radius:50%;background:var(--signal,#18E58C);flex:0 0 auto}
.chat-close{
  width:34px;height:34px;flex:0 0 auto;border:0;border-radius:9px;cursor:pointer;
  background:rgba(255,255,255,.1);color:#fff;
  display:flex;align-items:center;justify-content:center;transition:.15s;
}
.chat-close:hover{background:rgba(255,255,255,.22)}
.chat-close svg{width:16px;height:16px}

/* лента */
.chat-feed{
  flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;
  padding:16px;display:flex;flex-direction:column;gap:10px;
}
.chat-msg{
  max-width:86%;padding:10px 14px;border-radius:14px;
  font-size:14.5px;line-height:1.5;overflow-wrap:break-word;word-break:break-word;
}
.chat-msg p{margin:0 0 8px}
.chat-msg p:last-child{margin-bottom:0}
.chat-msg ul{margin:0 0 8px;padding-left:18px}
.chat-msg ul:last-child{margin-bottom:0}
.chat-msg a{color:var(--indigo,#3B2FE6);text-decoration:underline}
.chat-msg.user{align-self:flex-end;background:var(--indigo,#3B2FE6);color:#fff;border-bottom-right-radius:4px}
.chat-msg.assistant{align-self:flex-start;background:#fff;border:1px solid var(--line,#E7E9F2);border-bottom-left-radius:4px}
.chat-msg.note{align-self:center;max-width:94%;background:#EEF0FB;color:#3b4256;font-size:13.5px;text-align:center}
.chat-msg.assistant:empty:after{content:"…";color:var(--fog,#8B93A7)}

/* CTA «Оставить заявку» */
.chat-cta{padding:0 16px 12px;display:flex;justify-content:center;flex:0 0 auto}
.chat-cta[hidden]{display:none}
.chat-cta a{
  display:inline-flex;align-items:center;justify-content:center;
  font-weight:700;font-size:14px;padding:10px 18px;border-radius:11px;
  background:var(--indigo,#3B2FE6);color:#fff;text-decoration:none;transition:.15s;
}
.chat-cta a:hover{background:var(--indigo-d,#2a20c4)}

/* ввод */
.chat-input{
  display:flex;align-items:flex-end;gap:8px;
  padding:12px calc(12px + env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) 12px;
  border-top:1px solid var(--line,#E7E9F2);background:#fff;flex:0 0 auto;
}
.chat-input textarea{
  flex:1;resize:none;min-height:44px;max-height:120px;
  border:1.5px solid var(--line,#E7E9F2);border-radius:11px;padding:11px 13px;
  font-family:inherit;font-size:15px;line-height:1.4;color:var(--ink,#0B0F1E);
  background:#fbfbfe;transition:.15s;
}
.chat-input textarea:focus{outline:none;border-color:var(--indigo,#3B2FE6);background:#fff;box-shadow:0 0 0 4px rgba(59,47,230,.10)}
.chat-input textarea:disabled{opacity:.55}
.chat-send{
  width:44px;height:44px;flex:0 0 auto;border:0;border-radius:11px;cursor:pointer;
  background:var(--indigo,#3B2FE6);color:#fff;
  display:flex;align-items:center;justify-content:center;transition:.15s;
}
.chat-send:hover:not(:disabled){background:var(--indigo-d,#2a20c4)}
.chat-send:disabled{opacity:.45;cursor:default}
.chat-send svg{width:20px;height:20px}
.chat-stop{
  height:44px;flex:0 0 auto;border:1.5px solid var(--line,#E7E9F2);border-radius:11px;cursor:pointer;
  background:#fff;color:var(--ink,#0B0F1E);font-family:inherit;font-weight:700;font-size:13.5px;padding:0 14px;transition:.15s;
}
.chat-stop:hover{border-color:var(--indigo,#3B2FE6);color:var(--indigo,#3B2FE6)}
.chat-stop[hidden]{display:none}

/* подсветка формы заявки после клика по CTA из чата */
#leadform.leadform-flash{box-shadow:0 0 0 4px rgba(24,229,140,.6);transition:box-shadow .4s ease}

/* мобильная шторка */
@media(max-width:680px){
  .chat-panel{
    inset:0;width:100%;max-width:none;border-radius:0;border:0;
    height:100vh;height:100dvh;max-height:none; /* JS уточняет по visualViewport */
  }
  .chat-input textarea{font-size:16px} /* <16px заставляет iOS Safari зумить страницу при фокусе */
  html.chat-open,html.chat-open body{overflow:hidden} /* у страницы не появляется скролл под шторкой */
}

/* супербольшой экран: чат — док-панель справа (не оверлей), контент сдвигается влево */
@media(min-width:1600px){
  body{transition:padding-right .22s ease}
  html.chat-docked .chat-panel{
    top:0;right:0;bottom:0;height:100vh;max-height:none;
    width:min(440px,30vw);max-width:none;
    border-radius:0;border:0;border-left:1px solid var(--line,#E7E9F2);
    box-shadow:-24px 0 60px -34px rgba(11,15,30,.4);
  }
  html.chat-docked body{padding-right:min(440px,30vw)} /* место под панель, ничего не перекрыто */
}
