/* ---- TOGGLE BUTTON ---- */
#cb-btn{
  position:fixed;bottom:28px;right:28px;z-index:8000;
  width:58px;height:58px;border-radius:50%;
  background:var(--lime);border:none;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 32px rgba(200,241,53,.35);
  transition:all .3s var(--ease);
  cursor:none !important;
}
#cb-btn:hover{transform:scale(1.1);box-shadow:0 12px 40px rgba(200,241,53,.5);}
#cb-btn svg{width:26px;height:26px;transition:all .3s var(--ease);}
#cb-btn .ico-chat{display:block;}
#cb-btn .ico-close{display:none;}
#cb-btn.open .ico-chat{display:none;}
#cb-btn.open .ico-close{display:block;}

/* pulse ring */
#cb-btn::before{
  content:'';position:absolute;inset:-6px;border-radius:50%;
  border:2px solid rgba(200,241,53,.3);
  animation:cbPulse 2.4s ease-in-out infinite;
}
@keyframes cbPulse{0%,100%{transform:scale(1);opacity:.6;}50%{transform:scale(1.18);opacity:0;}}

/* notification dot */
#cb-notif{
  position:absolute;top:4px;right:4px;
  width:12px;height:12px;background:#ff4757;border-radius:50%;
  border:2px solid var(--black);
  animation:notifPop .4s var(--ease) forwards;
}
@keyframes notifPop{from{transform:scale(0);}to{transform:scale(1);}}

/* ---- CHAT WINDOW ---- */
#cb-win{
  position:fixed;bottom:100px;right:28px;z-index:7999;
  width:380px;height:560px;
  background:var(--gray);border:1px solid rgba(200,241,53,.15);
  border-radius:4px;
  display:flex;flex-direction:column;
  box-shadow:0 32px 80px rgba(0,0,0,.6);
  transform:translateY(20px) scale(.96);opacity:0;
  pointer-events:none;
  transition:all .35s var(--ease);
  overflow:hidden;
}
#cb-win.open{transform:translateY(0) scale(1);opacity:1;pointer-events:all;}

/* top accent bar */
#cb-win::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--lime),rgba(200,241,53,.2));
}

/* ---- HEADER ---- */
#cb-head{
  padding:18px 20px 16px;
  border-bottom:1px solid var(--border);
  display:flex;align-items:center;gap:12px;
  flex-shrink:0;
}
#cb-avatar{
  width:38px;height:38px;border-radius:50%;
  background:rgba(200,241,53,.1);border:1.5px solid rgba(200,241,53,.3);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
#cb-avatar svg{width:18px;height:18px;fill:var(--lime);}
#cb-head-text{}
#cb-head-name{font-family:var(--ff-d);font-size:1rem;letter-spacing:.06em;line-height:1;}
#cb-head-status{display:flex;align-items:center;gap:5px;margin-top:3px;}
#cb-status-dot{width:6px;height:6px;background:#39d98a;border-radius:50%;box-shadow:0 0 6px rgba(57,217,138,.7);}
#cb-status-txt{font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gray3);}
#cb-head-close{margin-left:auto;background:none;border:none;color:var(--gray3);font-size:1.2rem;line-height:1;padding:4px;transition:color .2s;cursor:none !important;}
#cb-head-close:hover{color:var(--cream);}

/* ---- MESSAGES ---- */
#cb-msgs{
  flex:1;overflow-y:auto;padding:20px 16px;
  display:flex;flex-direction:column;gap:14px;
  scroll-behavior:smooth;
}
#cb-msgs::-webkit-scrollbar{width:3px;}
#cb-msgs::-webkit-scrollbar-thumb{background:rgba(200,241,53,.2);border-radius:2px;}

.cb-msg{display:flex;gap:8px;align-items:flex-end;max-width:88%;}
.cb-msg.bot{align-self:flex-start;}
.cb-msg.user{align-self:flex-end;flex-direction:row-reverse;}

.cb-bubble{
  padding:11px 15px;font-size:.84rem;line-height:1.65;
  border-radius:2px;
}
.cb-msg.bot .cb-bubble{
  background:var(--gray2);border:1px solid var(--border);
  color:var(--cream);border-bottom-left-radius:0;
}
.cb-msg.user .cb-bubble{
  background:var(--lime);color:var(--black);font-weight:500;
  border-bottom-right-radius:0;
}

.cb-msg-av{
  width:26px;height:26px;border-radius:50%;flex-shrink:0;
  background:rgba(200,241,53,.1);border:1px solid rgba(200,241,53,.2);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--ff-d);font-size:.7rem;color:var(--lime);
}

/* typing indicator */
.cb-typing{display:flex;gap:5px;align-items:center;padding:12px 15px;}
.cb-typing span{width:7px;height:7px;background:var(--gray3);border-radius:50%;animation:cbDot 1.2s infinite;}
.cb-typing span:nth-child(2){animation-delay:.2s;}
.cb-typing span:nth-child(3){animation-delay:.4s;}
@keyframes cbDot{0%,60%,100%{transform:translateY(0);opacity:.4;}30%{transform:translateY(-5px);opacity:1;}}

/* quick replies */
#cb-quick{
  display:flex;flex-wrap:wrap;gap:7px;
  padding:0 16px 12px;flex-shrink:0;
}
.cb-qr{
  font-size:.72rem;letter-spacing:.06em;
  padding:6px 13px;background:transparent;
  border:1px solid rgba(200,241,53,.25);color:var(--lime);
  transition:all .2s;cursor:none !important;border-radius:2px;
  white-space:nowrap;
}
.cb-qr:hover{background:rgba(200,241,53,.08);border-color:var(--lime);}

/* ---- INPUT ---- */
#cb-input-wrap{
  padding:14px 16px;border-top:1px solid var(--border);
  display:flex;gap:8px;align-items:flex-end;flex-shrink:0;
  background:var(--gray2);
}
#cb-input{
  flex:1;background:var(--black);border:1px solid var(--border);
  padding:10px 14px;color:var(--cream);font-family:var(--ff-b);
  font-size:.85rem;outline:none;resize:none;
  max-height:90px;line-height:1.55;border-radius:2px;
  transition:border-color .2s;
  cursor:none !important;
}
#cb-input:focus{border-color:rgba(200,241,53,.4);}
#cb-input::placeholder{color:var(--gray4);}
#cb-send{
  width:38px;height:38px;flex-shrink:0;
  background:var(--lime);border:none;border-radius:2px;
  display:flex;align-items:center;justify-content:center;
  transition:all .25s;cursor:none !important;
}
#cb-send:hover{background:var(--lime-dark);transform:translateY(-2px);}
#cb-send:disabled{background:var(--gray4);transform:none;}
#cb-send svg{width:16px;height:16px;fill:var(--black);}

/* ---- POWERED BY ---- */
#cb-foot{
  text-align:center;padding:8px 16px;
  font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--gray4);border-top:1px solid var(--border);flex-shrink:0;
}
#cb-foot span{color:var(--lime);}

@media(max-width:480px){
  #cb-win{width:calc(100vw - 24px);right:12px;bottom:88px;height:70vh;}
  #cb-btn{bottom:18px;right:18px;}
}