/* De_AIjk v2 — gedeelde chatbot-widget (zelf-injecterend via js/chatbot.js) */
.dai-chat-toggle{
  position:fixed; bottom:24px; right:24px; z-index:1000;
  width:62px; height:62px; border:none; border-radius:50%; cursor:pointer;
  background:linear-gradient(120deg,#50c848,#2f9e8f 48%,#5a2d9b);
  color:#fff; font-size:1.5rem; display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 26px rgba(90,45,155,.45); transition:transform .25s ease;
}
.dai-chat-toggle:hover{ transform:scale(1.06); }
.dai-chat-toggle:focus-visible{ outline:3px solid #8b5fc9; outline-offset:3px; }

.dai-chat-panel{
  position:fixed; bottom:100px; right:24px; z-index:1001;
  width:min(380px,calc(100vw - 32px)); height:min(560px,calc(100vh - 140px));
  background:#fff; border-radius:18px; overflow:hidden;
  display:flex; flex-direction:column;
  box-shadow:0 24px 60px rgba(20,10,40,.28); border:1px solid #e9e5f0;
  opacity:0; transform:translateY(16px) scale(.98); pointer-events:none;
  /* visibility:hidden haalt het gesloten paneel uit de tabvolgorde en uit de
     toegankelijkheidsboom; de 0s-transitie met .25s vertraging laat de
     bestaande fade-out gewoon aflopen voordat het paneel echt verdwijnt. */
  visibility:hidden;
  transition:opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
}
.dai-chat-panel.open{
  opacity:1; transform:none; pointer-events:auto; visibility:visible;
  transition:opacity .25s ease, transform .25s ease, visibility 0s linear 0s;
}
@media (prefers-reduced-motion: reduce){
  .dai-chat-panel{ transition:none; }
  .dai-chat-panel.open{ transition:none; }
}

.dai-chat-head{
  background:linear-gradient(150deg,#1e1433,#160f24); color:#fff;
  padding:16px 18px; display:flex; align-items:center; gap:12px;
}
.dai-chat-head .avatar{ width:38px;height:38px;border-radius:50%;
  background:linear-gradient(120deg,#50c848,#5a2d9b); display:flex;align-items:center;justify-content:center; }
.dai-chat-head h3{ font-family:'Bricolage Grotesque',Inter,sans-serif; font-size:1rem; margin:0; line-height:1.1; }
.dai-chat-head .status{ font-size:.72rem; opacity:.8; display:flex; align-items:center; gap:6px; }
/* Neutraal (grijs) zolang er niets over de lijn is geweest; amber = bezig. */
.dai-chat-head .dot{ width:8px;height:8px;border-radius:50%; background:#b9b2c6; flex:none; }
.dai-chat-head .dot.busy{ background:#f7b955; animation:daiPulse 1.1s ease-in-out infinite; }
.dai-chat-head .dot.ok{ background:#50c848; } .dai-chat-head .dot.err{ background:#e05050; }
@keyframes daiPulse{ 0%,100%{opacity:1} 50%{opacity:.35} }
@media (prefers-reduced-motion: reduce){ .dai-chat-head .dot.busy{ animation:none } }
.dai-chat-head .spacer{ margin-left:auto; }
.dai-chat-head button{ background:rgba(255,255,255,.12); border:none; color:#fff; cursor:pointer;
  border-radius:8px; padding:6px 10px; font-size:.78rem; }
.dai-chat-head button:hover{ background:rgba(255,255,255,.22); }
.dai-chat-head button:focus-visible,
.dai-chat-foot button:focus-visible{ outline:3px solid #8b5fc9; outline-offset:2px; }

.dai-chat-body{ flex:1; overflow-y:auto; padding:16px; background:#faf9fc; display:flex; flex-direction:column; gap:10px; }
.dai-msg{ max-width:82%; padding:10px 14px; border-radius:14px; font-size:.9rem; line-height:1.5; }
.dai-msg.bot{ background:#fff; border:1px solid #e9e5f0; align-self:flex-start; border-bottom-left-radius:4px; }
.dai-msg.user{ background:linear-gradient(135deg,#5a2d9b,#3f1f70); color:#fff; align-self:flex-end; border-bottom-right-radius:4px; }
.dai-msg a{ color:inherit; text-decoration:underline; }
.dai-typing{ align-self:flex-start; color:#6b6478; font-size:.85rem; padding:6px 4px; }

.dai-chat-foot{ display:flex; gap:8px; padding:12px; border-top:1px solid #e9e5f0; background:#fff; }
.dai-chat-foot input{ flex:1; border:1px solid #e9e5f0; border-radius:999px; padding:10px 14px; font:inherit; font-size:.9rem; }
.dai-chat-foot input:focus{ outline:none; border-color:#5a2d9b; box-shadow:0 0 0 3px rgba(90,45,155,.12); }
.dai-chat-foot button{ width:42px;height:42px;border:none;border-radius:50%; cursor:pointer; color:#fff;
  background:linear-gradient(135deg,#5a2d9b,#3f1f70); font-size:1rem; }
.dai-chat-foot button:disabled{ opacity:.5; cursor:not-allowed; }