/* Виджет-секретарь Котовой А.А. - вид Онлайн-чата (Открытые линии Битрикс). Самодостаточный. */
/* Палитра сайта: бордо var(--ka-accent), тёмная var(--ka-accent-d), латунь var(--ka-brass), фон var(--ka-bg). */
#ka-widget{position:fixed;right:22px;bottom:22px;z-index:99999;font-family:'Manrope',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;--ka-accent:#7C2233;--ka-accent-d:#651B29;--ka-brass:#A98544;--ka-bg:#FBF9F5;--ka-surface:#F4F1EA}

/* --- пузырь-триггер --- */
.ka-bubble{display:flex;align-items:center;gap:9px;background:var(--ka-accent);color:#fff;border:none;border-radius:999px;padding:14px 22px;font-size:15px;font-weight:600;cursor:pointer;box-shadow:0 8px 24px rgba(101,27,41,.32);min-height:52px;animation:kaBubbleIn .5s cubic-bezier(.22,1,.36,1) both;transition:transform .18s ease,background-color .2s,box-shadow .2s}
.ka-bubble:hover{background:var(--ka-accent-d);box-shadow:0 12px 30px rgba(101,27,41,.4);transform:translateY(-2px)}
.ka-bubble:active{transform:translateY(0)}
.ka-bubble .ka-ic{width:22px;height:22px;flex:none}
.ka-bubble span{white-space:nowrap}
.ka-bubble .ka-dot{position:absolute;top:8px;right:10px;width:9px;height:9px;border-radius:50%;background:#3ec46d;box-shadow:0 0 0 0 rgba(62,196,109,.6);animation:kaLive 2s infinite}
@keyframes kaBubbleIn{0%{opacity:0;transform:translateY(16px) scale(.9)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes kaLive{0%{box-shadow:0 0 0 0 rgba(62,196,109,.55)}70%{box-shadow:0 0 0 7px rgba(62,196,109,0)}100%{box-shadow:0 0 0 0 rgba(62,196,109,0)}}

/* --- окно --- */
.ka-win{position:fixed;right:22px;bottom:22px;width:376px;max-width:calc(100vw - 28px);height:560px;max-height:calc(100vh - 44px);background:var(--ka-bg);border-radius:18px;box-shadow:0 24px 60px rgba(30,20,15,.34),0 2px 8px rgba(0,0,0,.08);display:none;flex-direction:column;overflow:hidden;transform-origin:bottom right}
.ka-win.on{display:flex;animation:kaWinIn .34s cubic-bezier(.22,1,.36,1) both}
.ka-win.off{animation:kaWinOut .2s ease-in both}
@keyframes kaWinIn{0%{opacity:0;transform:translateY(24px) scale(.94)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes kaWinOut{0%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(16px) scale(.96)}}

/* --- шапка (как оператор открытой линии) --- */
.ka-head{background:linear-gradient(135deg,var(--ka-accent),var(--ka-accent-d));color:#fff;padding:13px 16px;display:flex;align-items:center;gap:11px}
.ka-ava{width:40px;height:40px;border-radius:50%;flex:none;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.2)}
.ka-ava svg{width:24px;height:24px}
.ka-head .ka-hb{flex:1;min-width:0}
.ka-head b{font-size:14.5px;font-weight:700;display:block;line-height:1.2}
.ka-head small{display:flex;align-items:center;gap:5px;font-size:11.5px;opacity:.85;font-weight:400;margin-top:2px}
.ka-head small::before{content:"";width:7px;height:7px;border-radius:50%;background:#3ec46d;flex:none}
.ka-x{cursor:pointer;font-size:24px;line-height:1;opacity:.85;padding:2px 4px;border-radius:8px;transition:opacity .15s,background .15s}
.ka-x:hover{opacity:1;background:rgba(255,255,255,.14)}

/* --- лента сообщений --- */
.ka-msgs{flex:1;overflow-y:auto;padding:16px 14px;display:flex;flex-direction:column;gap:9px;background:var(--ka-surface);scroll-behavior:smooth}
.ka-msgs::-webkit-scrollbar{width:7px}.ka-msgs::-webkit-scrollbar-thumb{background:#D8D2C6;border-radius:4px}
.ka-m{max-width:85%;padding:10px 13px;border-radius:15px;font-size:14px;line-height:1.5;animation:kaMsgIn .28s cubic-bezier(.22,1,.36,1) both;word-wrap:break-word}
.ka-m.bot{align-self:flex-start;background:#fff;border:1px solid #E7E1D6;color:#2b2721;border-bottom-left-radius:5px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.ka-m.user{align-self:flex-end;background:var(--ka-accent);color:#fff;border-bottom-right-radius:5px}
.ka-m a{color:var(--ka-accent);font-weight:600}
.ka-m.user a{color:#fff;text-decoration:underline}
@keyframes kaMsgIn{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}
.ka-typ{display:inline-flex;gap:4px;padding:3px 2px}
.ka-typ i{width:7px;height:7px;border-radius:50%;background:#b9b1a2;display:inline-block;animation:kaBounce 1.3s infinite}
.ka-typ i:nth-child(2){animation-delay:.18s}.ka-typ i:nth-child(3){animation-delay:.36s}
@keyframes kaBounce{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}

/* --- форма-заявка прямо в чате (Открытые линии: CRM-форма) --- */
.ka-form{align-self:stretch;background:#fff;border:1px solid #E7E1D6;border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:9px;animation:kaMsgIn .3s both;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.ka-form .ka-ft{font-size:13.5px;font-weight:700;color:#2b2721}
.ka-form .ka-fs{font-size:12px;color:#8a8375;margin-top:-4px}
.ka-form input,.ka-form textarea{border:1px solid #D8D2C6;border-radius:10px;padding:10px 12px;font-size:14px;font-family:inherit;outline:none;color:#2b2721;background:#FBFAF7;transition:border-color .15s,box-shadow .15s}
.ka-form input:focus,.ka-form textarea:focus{border-color:var(--ka-accent);box-shadow:0 0 0 3px rgba(124,34,51,.1)}
.ka-form textarea{resize:vertical;min-height:60px;max-height:140px}
.ka-form .ka-consent{display:flex;gap:8px;align-items:flex-start;font-size:11.5px;color:#6e675b;line-height:1.4;cursor:pointer}
.ka-form .ka-consent input{width:16px;height:16px;flex:none;margin-top:1px;accent-color:var(--ka-accent)}
.ka-form .ka-consent a{color:var(--ka-accent)}
.ka-form .ka-submit{background:var(--ka-accent);color:#fff;border:none;border-radius:10px;padding:12px;font-size:14px;font-weight:700;cursor:pointer;transition:background .18s,opacity .18s}
.ka-form .ka-submit:hover{background:var(--ka-accent-d)}
.ka-form .ka-submit:disabled{opacity:.55;cursor:default}
.ka-form .ka-err{font-size:12px;color:#c02626;display:none}
.ka-ok{align-self:stretch;background:#edf7ee;border:1px solid #cfe9d3;border-radius:14px;padding:14px 16px;font-size:13.5px;color:#256b32;display:flex;gap:9px;align-items:center;animation:kaMsgIn .3s both}
.ka-ok svg{width:22px;height:22px;flex:none}

/* --- поле ввода --- */
.ka-in{display:flex;gap:8px;padding:11px;border-top:1px solid #E7E1D6;background:var(--ka-bg);align-items:flex-end}
.ka-in textarea{flex:1;resize:none;border:1px solid #D8D2C6;border-radius:12px;padding:11px 13px;font-size:14px;font-family:inherit;max-height:120px;outline:none;color:#2b2721;background:#fff;transition:border-color .15s,box-shadow .15s}
.ka-in textarea:focus{border-color:var(--ka-accent);box-shadow:0 0 0 3px rgba(124,34,51,.1)}
.ka-mic,.ka-send{flex:0 0 46px;width:46px;height:46px;min-width:46px;border:none;border-radius:12px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .18s,transform .12s}
.ka-mic{background:#F1E9DA;color:var(--ka-accent)}.ka-mic:hover{background:#e8dcc6}
.ka-mic.rec{background:#ffdede;color:#d33;animation:kaPulse 1.1s infinite}
.ka-mic svg,.ka-send svg{width:20px;height:20px}
.ka-send{background:var(--ka-accent);color:#fff}.ka-send:hover{background:var(--ka-accent-d)}.ka-send:active{transform:scale(.92)}
.ka-cta{margin:2px 11px 0;padding:9px;background:#fff;border:1px solid var(--ka-accent);color:var(--ka-accent);border-radius:10px;font-size:13px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:7px;transition:background .15s,color .15s}
.ka-cta svg{width:17px;height:17px;flex:none}
.ka-cta:hover{background:var(--ka-accent);color:#fff}
.ka-note{font-size:10.5px;color:#9a9384;text-align:center;padding:6px 12px 8px;background:var(--ka-bg)}
@keyframes kaPulse{50%{opacity:.45}}

@media(max-width:640px){
  #ka-widget{right:16px;bottom:16px}
  .ka-win{right:0;bottom:0;width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;border-radius:0}
  .ka-bubble{padding:13px 20px}
}