/* Blue Sky AI Chatbot v2 – chat-widget.css */
*,*::before,*::after{box-sizing:border-box;}

#bsm-root{font-family:'Segoe UI',system-ui,sans-serif;}

/* ── Toggle Button ── */
#bsm-toggle{
  position:fixed;bottom:24px;z-index:999999;
  width:64px;height:64px;border-radius:50%;
  background:var(--bsm-color,#0e4fa8);
  border:none;cursor:pointer;
  box-shadow:0 4px 24px rgba(14,79,168,.45);
  display:flex;align-items:center;justify-content:center;
  transition:transform .2s,box-shadow .2s;padding:0;
}
#bsm-toggle.bsm-right{right:24px;}
#bsm-toggle.bsm-left{left:24px;}
#bsm-toggle:hover{transform:scale(1.09);box-shadow:0 8px 32px rgba(14,79,168,.5);}
#bsm-toggle svg{width:28px;height:28px;fill:#fff;transition:transform .3s;}
#bsm-toggle.bsm-open-state svg.ico-chat{display:none;}
#bsm-toggle svg.ico-close{display:none;}
#bsm-toggle.bsm-open-state svg.ico-close{display:block;}
#bsm-badge{
  position:absolute;top:-3px;right:-3px;
  background:#e53935;color:#fff;font-size:11px;font-weight:700;
  width:22px;height:22px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:2px solid #fff;animation:bsmPulse 2s infinite;
}
@keyframes bsmPulse{0%,100%{box-shadow:0 0 0 0 rgba(229,57,53,.4);}70%{box-shadow:0 0 0 8px rgba(229,57,53,0);}}

/* ── Chat Window ── */
#bsm-window{
  position:fixed;bottom:104px;z-index:999998;
  width:380px;max-height:600px;border-radius:20px;overflow:hidden;
  background:#fff;display:flex;flex-direction:column;
  box-shadow:0 20px 60px rgba(0,0,0,.2);
  transform:scale(.88) translateY(20px);opacity:0;pointer-events:none;
  transition:transform .28s cubic-bezier(.34,1.56,.64,1),opacity .22s;
}
#bsm-window.bsm-right{right:24px;transform-origin:bottom right;}
#bsm-window.bsm-left{left:24px;transform-origin:bottom left;}
#bsm-window.bsm-open{transform:scale(1) translateY(0);opacity:1;pointer-events:all;}

/* Header */
.bsm-hdr{
  background:var(--bsm-color,#0e4fa8);
  padding:14px 16px;display:flex;align-items:center;gap:11px;flex-shrink:0;
}
.bsm-hdr-av{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.bsm-hdr-av svg{width:22px;height:22px;fill:#fff;}
.bsm-hdr-info{flex:1;}
.bsm-hdr-info strong{color:#fff;font-size:15px;display:block;}
.bsm-hdr-info span{color:rgba(255,255,255,.8);font-size:11.5px;display:flex;align-items:center;gap:5px;}
.bsm-online-dot{width:7px;height:7px;border-radius:50%;background:#4caf50;animation:bsmBlink 2s infinite;}
@keyframes bsmBlink{0%,100%{opacity:1;}50%{opacity:.5;}}
.bsm-hdr-close{background:rgba(255,255,255,.15);border:none;border-radius:50%;width:32px;height:32px;cursor:pointer;color:#fff;font-size:17px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s;}
.bsm-hdr-close:hover{background:rgba(255,255,255,.3);}
.bsm-hdr-whatsapp{background:rgba(255,255,255,.15);border:none;border-radius:8px;padding:5px 10px;cursor:pointer;color:#fff;font-size:11.5px;display:flex;align-items:center;gap:4px;text-decoration:none;transition:background .15s;flex-shrink:0;}
.bsm-hdr-whatsapp:hover{background:rgba(255,255,255,.28);}

/* Messages */
#bsm-msgs{flex:1;overflow-y:auto;padding:14px 13px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth;background:#f5f8fd;}
#bsm-msgs::-webkit-scrollbar{width:4px;}
#bsm-msgs::-webkit-scrollbar-thumb{background:#c8d8ed;border-radius:4px;}

.bsm-msg{display:flex;gap:8px;max-width:94%;animation:bsmUp .22s ease;}
@keyframes bsmUp{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
.bsm-msg.bsm-me{align-self:flex-end;flex-direction:row-reverse;}
.bsm-av{width:30px;height:30px;border-radius:50%;flex-shrink:0;margin-top:2px;display:flex;align-items:center;justify-content:center;}
.bsm-av.bot{background:var(--bsm-color,#0e4fa8);}
.bsm-av.bot svg{width:15px;height:15px;fill:#fff;}
.bsm-av.me{background:#dde8f7;font-size:12px;color:var(--bsm-color,#0e4fa8);font-weight:700;}
.bsm-bub{padding:10px 13px;border-radius:16px;font-size:13.5px;line-height:1.6;word-break:break-word;max-width:100%;}
.bsm-msg.bot .bsm-bub{background:#fff;color:#1a1a2e;border-bottom-left-radius:4px;box-shadow:0 1px 4px rgba(0,0,0,.08);}
.bsm-msg.bsm-me .bsm-bub{background:var(--bsm-color,#0e4fa8);color:#fff;border-bottom-right-radius:4px;}
.bsm-bub img.bsm-attach{max-width:220px;border-radius:10px;margin-top:8px;display:block;border:1px solid rgba(0,0,0,.08);cursor:pointer;}
.bsm-msg.bsm-me .bsm-bub img.bsm-attach{border-color:rgba(255,255,255,.25);}
.bsm-bub img.bsm-auto-img{max-width:100%;border-radius:10px;margin-top:8px;display:block;}

/* Typing */
.bsm-typing{display:flex;gap:5px;align-items:center;padding:2px 0;}
.bsm-typing span{width:7px;height:7px;background:var(--bsm-color,#0e4fa8);border-radius:50%;animation:bsmBounce 1.2s infinite;opacity:.7;}
.bsm-typing span:nth-child(2){animation-delay:.2s;}
.bsm-typing span:nth-child(3){animation-delay:.4s;}
@keyframes bsmBounce{0%,60%,100%{transform:translateY(0);}30%{transform:translateY(-6px);}}

/* Quick Replies */
#bsm-quick{padding:0 13px 10px;display:flex;flex-wrap:wrap;gap:6px;background:#f5f8fd;flex-shrink:0;}
.bsm-qr{
  background:#fff;border:1.5px solid #c8dcf5;color:var(--bsm-color,#0e4fa8);
  border-radius:20px;padding:6px 13px;font-size:12px;cursor:pointer;
  transition:background .15s,transform .1s,box-shadow .1s;white-space:nowrap;
  font-family:'Segoe UI',sans-serif;
}
.bsm-qr:hover{background:#e8f0fd;transform:translateY(-1px);box-shadow:0 2px 8px rgba(14,79,168,.12);}

/* Input */
.bsm-input-area{display:flex;flex-direction:column;border-top:1px solid #e8eef5;flex-shrink:0;background:#fff;}
.bsm-attach-preview{padding:8px 13px 0;display:none;}
.bsm-attach-preview.show{display:flex;align-items:center;gap:8px;}
.bsm-attach-thumb{width:52px;height:52px;object-fit:cover;border-radius:8px;border:1px solid #e0e8f0;}
.bsm-attach-remove{background:#f44336;border:none;color:#fff;width:20px;height:20px;border-radius:50%;cursor:pointer;font-size:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.bsm-input-row{display:flex;gap:8px;padding:10px 13px;}
#bsm-input{
  flex:1;border:1.5px solid #d0dcea;border-radius:22px;
  padding:9px 14px;font-size:13.5px;outline:none;resize:none;
  font-family:'Segoe UI',sans-serif;transition:border-color .15s;
  max-height:80px;overflow-y:auto;
}
#bsm-input:focus{border-color:var(--bsm-color,#0e4fa8);}
.bsm-file-btn{
  width:38px;height:38px;border-radius:50%;border:1.5px solid #d0dcea;
  background:#f5f8fd;cursor:pointer;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:border-color .15s,background .15s;font-size:16px;
}
.bsm-file-btn:hover{border-color:var(--bsm-color,#0e4fa8);background:#e8f0fd;}
#bsm-file-input{display:none;}
#bsm-send{
  width:38px;height:38px;border-radius:50%;border:none;
  background:var(--bsm-color,#0e4fa8);cursor:pointer;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  transition:transform .15s,opacity .15s;
}
#bsm-send:hover{transform:scale(1.09);}
#bsm-send:disabled{opacity:.4;cursor:not-allowed;transform:none;}
#bsm-send svg{width:17px;height:17px;fill:#fff;}

/* Footer */
.bsm-foot{text-align:center;font-size:10.5px;color:#b0b8c8;padding:5px 0 10px;flex-shrink:0;background:#fff;}
.bsm-foot a{color:var(--bsm-color,#0e4fa8);text-decoration:none;}

/* Image lightbox */
#bsm-lightbox{
  position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:9999999;
  display:none;align-items:center;justify-content:center;cursor:zoom-out;
}
#bsm-lightbox.show{display:flex;}
#bsm-lightbox img{max-width:92vw;max-height:88vh;border-radius:12px;box-shadow:0 8px 48px rgba(0,0,0,.5);}

/* Mobile */
@media(max-width:420px){
  #bsm-window{width:calc(100vw - 16px);right:8px;left:8px;bottom:88px;border-radius:16px;}
  #bsm-window.bsm-right{right:8px;}
  #bsm-window.bsm-left{left:8px;}
}
