/* Chatbot Biodent — UI. Paleta: teal/azul clínico + acento menta. */
:root{
  --bd-c1:#bf953f; --bd-c2:#aa771c; --bd-acc:#fcf6ba;
  --bd-ink:#1c1710; --bd-mut:#8a8270; --bd-bg:#faf6ec; --bd-bot:#ffffff; --bd-usr:#8b6914;
  --bd-shadow:0 18px 50px -12px rgba(120,90,20,.45);
}
.bd-chat{position:fixed;right:22px;bottom:22px;z-index:99999;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.bd-chat *{box-sizing:border-box}

/* Botón flotante */
.bd-chat-toggle{position:relative;width:62px;height:62px;border:0;border-radius:50%;cursor:pointer;
  background:linear-gradient(135deg,var(--bd-c1),var(--bd-c2));color:#fff;box-shadow:var(--bd-shadow);
  display:grid;place-items:center;transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s}
.bd-chat-toggle::after{content:"";position:absolute;inset:0;border-radius:50%;
  box-shadow:0 0 0 0 rgba(16,179,176,.55);animation:bd-pulse 2.4s infinite}
@keyframes bd-pulse{70%{box-shadow:0 0 0 16px rgba(16,179,176,0)}100%{box-shadow:0 0 0 0 rgba(16,179,176,0)}}
.bd-chat-toggle:hover{transform:scale(1.06)}
.bd-chat-toggle .bd-ic-close{display:none}
.bd-chat.open .bd-chat-toggle .bd-ic-chat{display:none}
.bd-chat.open .bd-chat-toggle .bd-ic-close{display:block}
.bd-chat.open .bd-chat-toggle::after{animation:none}
.bd-chat-badge{position:absolute;top:-2px;right:-2px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;
  background:#ff5d6c;color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;border:2px solid #fff}
.bd-chat.open .bd-chat-badge,.bd-chat.seen .bd-chat-badge{display:none}

/* Panel */
.bd-chat-panel{position:absolute;right:0;bottom:78px;width:380px;max-width:calc(100vw - 32px);
  height:560px;max-height:calc(100vh - 120px);background:var(--bd-bg);border-radius:20px;overflow:hidden;
  display:flex;flex-direction:column;box-shadow:var(--bd-shadow);
  opacity:0;transform:translateY(16px) scale(.96);pointer-events:none;transform-origin:bottom right;
  transition:opacity .26s ease,transform .26s cubic-bezier(.34,1.4,.64,1)}
.bd-chat.open .bd-chat-panel{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}

.bd-chat-head{display:flex;align-items:center;gap:11px;padding:14px 16px;color:#fff;
  background:linear-gradient(135deg,var(--bd-c1),var(--bd-c2))}
.bd-chat-avatar{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.18);
  display:grid;place-items:center;font-weight:800;font-size:19px;letter-spacing:.5px}
.bd-chat-id{display:flex;flex-direction:column;line-height:1.2;flex:1}
.bd-chat-id strong{font-size:15px}
.bd-chat-status{font-size:12px;opacity:.92;display:flex;align-items:center;gap:6px}
.bd-chat-status i{width:8px;height:8px;border-radius:50%;background:var(--bd-acc);box-shadow:0 0 0 0 var(--bd-acc);animation:bd-blink 2s infinite}
@keyframes bd-blink{0%,100%{opacity:1}50%{opacity:.4}}
.bd-chat-min{margin-left:auto;background:transparent;border:0;color:#fff;cursor:pointer;opacity:.85;padding:4px}
.bd-chat-min:hover{opacity:1}

/* Log */
.bd-chat-log{flex:1;overflow-y:auto;padding:16px 14px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.bd-chat-log::-webkit-scrollbar{width:7px}
.bd-chat-log::-webkit-scrollbar-thumb{background:#cfe6e6;border-radius:4px}
.bd-msg{max-width:84%;padding:10px 13px;border-radius:15px;font-size:14px;line-height:1.45;
  white-space:pre-wrap;word-wrap:break-word;animation:bd-in .3s ease both}
@keyframes bd-in{from{opacity:0;transform:translateY(8px)}}
.bd-msg.bot{align-self:flex-start;background:var(--bd-bot);color:var(--bd-ink);
  border:1px solid #e3f0f0;border-bottom-left-radius:5px;box-shadow:0 2px 8px rgba(10,127,134,.06)}
.bd-msg.user{align-self:flex-end;background:var(--bd-usr);color:#fff;border-bottom-right-radius:5px}
.bd-msg a{color:inherit;text-decoration:underline}
.bd-typing{align-self:flex-start;display:flex;gap:4px;padding:13px 15px;background:var(--bd-bot);
  border:1px solid #e3f0f0;border-radius:15px;border-bottom-left-radius:5px}
.bd-typing span{width:7px;height:7px;border-radius:50%;background:var(--bd-mut);animation:bd-bounce 1.2s infinite}
.bd-typing span:nth-child(2){animation-delay:.15s}.bd-typing span:nth-child(3){animation-delay:.3s}
@keyframes bd-bounce{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-5px);opacity:1}}

/* Chips de sugerencia */
.bd-chat-chips{display:flex;flex-wrap:wrap;gap:7px;padding:0 14px 8px}
.bd-chip{border:1px solid var(--bd-c2);color:var(--bd-c1);background:#fff;border-radius:16px;
  padding:7px 12px;font-size:12.5px;cursor:pointer;transition:.18s}
.bd-chip:hover{background:var(--bd-c1);color:#fff}

/* Form */
.bd-chat-form{display:flex;gap:8px;padding:10px 12px;background:#fff;border-top:1px solid #e6f1f1}
.bd-chat-input{flex:1;border:1px solid #d4e6e6;border-radius:22px;padding:11px 15px;font-size:14px;outline:none;transition:.18s}
.bd-chat-input:focus{border-color:var(--bd-c2);box-shadow:0 0 0 3px rgba(16,179,176,.15)}
.bd-chat-send{width:44px;height:44px;border:0;border-radius:50%;cursor:pointer;flex:none;
  background:linear-gradient(135deg,var(--bd-c1),var(--bd-c2));color:#fff;display:grid;place-items:center;transition:.18s}
.bd-chat-send:hover{transform:rotate(8deg) scale(1.05)}
.bd-chat-foot{text-align:center;font-size:11px;color:var(--bd-mut);padding:0 0 9px;background:#fff}

/* Lluvia de dientes dentro del chat */
.bd-teeth{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:50;border-radius:20px}
.bd-tooth{position:absolute;top:-50px;will-change:transform,opacity;opacity:0;
  filter:drop-shadow(0 4px 7px rgba(120,90,20,.3));
  animation:bd-tfall var(--d,2.2s) cubic-bezier(.45,.05,.55,.95) forwards}
@keyframes bd-tfall{
  0%{transform:translateY(-50px) rotate(0) scale(.7);opacity:0}
  12%{opacity:1}70%{opacity:1}
  100%{transform:translateY(620px) rotate(var(--r,420deg)) scale(1);opacity:0;filter:blur(4px)}
}

@media (max-width:480px){
  .bd-chat{right:14px;bottom:14px}
  .bd-chat-panel{width:calc(100vw - 24px);height:calc(100vh - 96px);bottom:74px}
}