/* Zwevende hulpassistent */
.tp-chat-knop{position:fixed;right:18px;bottom:18px;z-index:9998;width:62px;height:62px;
  border:1px solid #e6dff5;border-radius:50%;background:#fff;cursor:pointer;
  box-shadow:0 12px 30px rgba(45,12,90,.28);display:flex;align-items:center;justify-content:center;
  transition:transform .18s ease,box-shadow .18s ease}
.tp-chat-knop:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(45,12,90,.45)}
.tp-chat-knop svg{width:38px;height:38px}
.tp-chat-knop .tp-stip{position:absolute;top:4px;right:4px;width:12px;height:12px;border-radius:50%;
  background:#34d399;border:2px solid #fff}
.tp-chat-knop[hidden]{display:none}

.tp-chat{position:fixed;right:18px;bottom:18px;z-index:9999;width:min(380px,calc(100vw - 24px));
  height:min(560px,calc(100vh - 90px));background:#fff;border-radius:22px;overflow:hidden;
  display:flex;flex-direction:column;box-shadow:0 24px 60px rgba(30,10,60,.3);
  border:1px solid #e6dff5}
.tp-chat[hidden]{display:none}
.tp-chat-kop{background:linear-gradient(135deg,#2c1250,#6d2ce0);color:#fff;padding:16px 18px;
  display:flex;align-items:center;gap:12px}
.tp-chat-kop .tp-avatar{width:42px;height:42px;border-radius:12px;background:#fff;
  display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.tp-chat-kop .tp-avatar img{display:block}
.tp-chat-kop svg{width:22px;height:22px}
.tp-chat-kop strong{display:block;font-size:1rem;line-height:1.2}
.tp-chat-kop small{opacity:.8;font-size:.8rem}
.tp-chat-sluit{margin-left:auto;background:none;border:0;color:#fff;font-size:26px;line-height:1;
  cursor:pointer;opacity:.85;padding:0 4px}

.tp-chat-berichten{flex:1;overflow-y:auto;padding:18px;background:#faf8ff;display:flex;
  flex-direction:column;gap:12px}
.tp-bericht{max-width:85%;padding:12px 15px;border-radius:16px;line-height:1.55;font-size:.94rem;
  white-space:pre-wrap;overflow-wrap:break-word}
.tp-bericht.bot{background:#fff;border:1px solid #ece5f8;border-bottom-left-radius:5px;
  align-self:flex-start;color:#28203a}
.tp-bericht.ik{background:#6d2ce0;color:#fff;border-bottom-right-radius:5px;align-self:flex-end}
.tp-bericht.fout{background:#fdeaea;border-color:#f3d2d2;color:#8b1f1f}
.tp-typt{align-self:flex-start;display:flex;gap:5px;padding:14px 16px;background:#fff;
  border:1px solid #ece5f8;border-radius:16px;border-bottom-left-radius:5px}
.tp-typt span{width:7px;height:7px;border-radius:50%;background:#b9a8dd;animation:tp-stuiter 1.2s infinite}
.tp-typt span:nth-child(2){animation-delay:.15s}
.tp-typt span:nth-child(3){animation-delay:.3s}
@keyframes tp-stuiter{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}

.tp-suggesties{display:flex;gap:8px;flex-wrap:wrap;padding:0 18px 12px;background:#faf8ff}
.tp-suggesties button{background:#fff;border:1px solid #ddd0f5;color:#5b3d86;border-radius:999px;
  padding:8px 14px;font-size:.84rem;cursor:pointer}
.tp-suggesties button:hover{background:#f3edfd}

.tp-chat-invoer{display:flex;gap:8px;padding:12px;border-top:1px solid #eee7f8;background:#fff}
.tp-chat-invoer textarea{flex:1;border:1px solid #ddd5ec;border-radius:14px;padding:11px 13px;
  font-family:inherit;font-size:.94rem;resize:none;max-height:110px;line-height:1.5}
.tp-chat-invoer textarea:focus{outline:2px solid #c9b2f5;outline-offset:0}
.tp-chat-invoer button{border:0;border-radius:14px;background:#6d2ce0;color:#fff;width:46px;
  cursor:pointer;display:flex;align-items:center;justify-content:center}
.tp-chat-invoer button:disabled{opacity:.45;cursor:default}
.tp-chat-invoer svg{width:20px;height:20px}
.tp-chat-voet{padding:0 14px 10px;background:#fff;color:#8a81a0;font-size:.72rem;text-align:center}

@media(max-width:520px){
  .tp-chat{right:0;bottom:0;width:100vw;height:100dvh;border-radius:0;border:0}
  .tp-chat-knop{right:14px;bottom:14px}
}
