/* ---- Chatbot widget ---- */
#chatbot-widget{--cb-accent:#2563eb;--cb-accent-2:#1d4ed8;--cb-rgb:37,99,235}

/* Üzən düymə (bubble) */
#chatbot-bubble{position:fixed;right:20px;bottom:20px;width:56px;height:56px;border:none;border-radius:50%;
  background:var(--cb-accent);color:#fff;cursor:pointer;box-shadow:0 4px 14px rgba(var(--cb-rgb),.4);z-index:9998;
  display:flex;align-items:center;justify-content:center;
  transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease,background .2s ease}
#chatbot-bubble:hover{transform:scale(1.08);box-shadow:0 6px 20px rgba(var(--cb-rgb),.5)}
#chatbot-bubble:active{transform:scale(.94)}

/* İkonaların keçidi (chat <-> close) */
#chatbot-bubble .cb-ico{position:absolute;width:24px;height:24px;object-fit:contain;
  transition:opacity .25s ease,transform .3s cubic-bezier(.34,1.56,.64,1)}
#chatbot-bubble .cb-ico-close{width:20px;height:20px}
.cb-ico-close{opacity:0;transform:rotate(-90deg) scale(.5)}
#chatbot-widget.cb-open .cb-ico-open{opacity:0;transform:rotate(90deg) scale(.5)}
#chatbot-widget.cb-open .cb-ico-close{opacity:1;transform:rotate(0) scale(1)}

/* Panel */
#chatbot-panel{position:fixed;right:20px;bottom:88px;width:340px;max-width:calc(100vw - 40px);
  height:460px;max-height:calc(100vh - 120px);background:#fff;border-radius:16px;
  box-shadow:0 12px 40px rgba(0,0,0,.22);display:flex;flex-direction:column;overflow:hidden;z-index:9999;
  transform-origin:bottom right;opacity:0;transform:translateY(16px) scale(.9);pointer-events:none;
  transition:opacity .28s ease,transform .32s cubic-bezier(.34,1.4,.5,1)}
#chatbot-widget.cb-open #chatbot-panel{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}

#chatbot-head{background:linear-gradient(135deg,var(--cb-accent),var(--cb-accent-2));color:#fff;
  padding:14px 16px;display:flex;justify-content:space-between;align-items:center;font-weight:600}
#chatbot-head button{background:none;border:none;color:#fff;cursor:pointer;line-height:1;
  width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  transition:background .2s ease,transform .2s ease}
#chatbot-head button img{width:14px;height:14px;display:block;object-fit:contain}
#chatbot-head button:hover{background:rgba(255,255,255,.2);transform:rotate(90deg)}

#chatbot-messages{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px;font-size:14px;
  scroll-behavior:smooth}

/* Mesajlar — daxil olarkən yumşaq animasiya */
.cb-msg{padding:9px 13px;border-radius:14px;max-width:80%;line-height:1.45;white-space:pre-wrap;
  animation:cb-msg-in .3s cubic-bezier(.34,1.4,.5,1) both}
.cb-user{align-self:flex-end;background:var(--cb-accent);color:#fff;border-bottom-right-radius:5px}
.cb-bot{align-self:flex-start;background:#f1f5f9;color:#0f172a;border-bottom-left-radius:5px}
@keyframes cb-msg-in{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}

/* Düşünmə göstəricisi — animasiyalı nöqtələr */
.cb-typing{display:flex;align-items:center;gap:5px;padding:12px 14px!important}
.cb-typing .cb-dot{width:7px;height:7px;border-radius:50%;background:#94a3b8;display:inline-block;
  animation:cb-bounce 1.4s infinite ease-in-out both}
.cb-typing .cb-dot:nth-child(1){animation-delay:-.32s}
.cb-typing .cb-dot:nth-child(2){animation-delay:-.16s}
@keyframes cb-bounce{0%,80%,100%{transform:scale(.5);opacity:.5}40%{transform:scale(1);opacity:1}}

.cb-escalate{align-self:flex-start;margin-top:2px;background:#f59e0b;color:#fff;border:none;padding:8px 12px;
  border-radius:8px;cursor:pointer;font-size:13px;animation:cb-msg-in .3s cubic-bezier(.34,1.4,.5,1) both;
  transition:transform .15s ease,box-shadow .2s ease;display:inline-flex;align-items:center;gap:6px}
.cb-escalate-ico{width:16px;height:16px;flex:none}
.cb-escalate:hover{transform:translateY(-1px);box-shadow:0 4px 10px rgba(245,158,11,.4)}

#chatbot-form{display:flex;border-top:1px solid #e2e8f0}
#chatbot-input{flex:1;border:none;padding:13px 14px;font-size:14px;outline:none;background:transparent}
#chatbot-form button{border:none;background:var(--cb-accent);color:#fff;padding:0 18px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background .2s ease,transform .15s ease}
#chatbot-form button img{width:20px;height:20px;display:block;object-fit:contain}
#chatbot-form button:hover{background:var(--cb-accent-2)}
#chatbot-form button:active{transform:scale(.9)}

/* Hərəkət azaldılması seçimi olan istifadəçilər üçün */
@media (prefers-reduced-motion:reduce){
  #chatbot-panel,#chatbot-bubble,.cb-ico,.cb-msg,.cb-escalate{transition-duration:.01ms!important;animation-duration:.01ms!important}
}