/* ============================================================
   Assistente Digital 24/7 — widget de chat (projeto IASAE / PRR)
   Requer js/chatbot.js (injeta o HTML do widget na página).
   ============================================================ */
:root { --af-azul:#034AA6; --af-azul2:#2d7be8; --af-cinza:#f2f5fa; }

/* botão flutuante */
#af-fab { position:fixed; right:22px; bottom:22px; width:60px; height:60px;
  border-radius:50%; background:var(--af-azul); color:#fff; border:none;
  box-shadow:0 6px 18px rgba(3,74,166,.45); cursor:pointer; z-index:9990;
  display:flex; align-items:center; justify-content:center; transition:transform .15s; }
#af-fab:hover { transform:scale(1.07); }
#af-fab svg { width:28px; height:28px; }

/* popup / teaser */
#af-teaser { position:fixed; right:22px; bottom:96px; max-width:290px;
  background:#fff; border:1px solid #e3e9f2; border-radius:14px 14px 2px 14px;
  box-shadow:0 10px 30px rgba(0,0,0,.18); padding:14px 16px; z-index:9990;
  font-size:.9rem; line-height:1.5; display:none; }
#af-teaser.show { display:block; animation:af-pop .25s ease-out; }
#af-teaser b { color:var(--af-azul); }
#af-teaser .af-teaser-x { position:absolute; top:4px; right:8px; border:none;
  background:none; font-size:1rem; color:#767676; cursor:pointer; }
#af-teaser .af-teaser-cta { margin-top:8px; display:inline-block;
  background:var(--af-azul); color:#fff; border:none; border-radius:20px;
  padding:6px 14px; font-size:.85rem; cursor:pointer; }
@keyframes af-pop { from { opacity:0; transform:translateY(8px);} to { opacity:1; transform:none;} }

/* janela de chat */
#af-chat { position:fixed; right:22px; bottom:96px; width:370px; max-width:calc(100vw - 30px);
  height:560px; max-height:calc(100vh - 130px); background:#fff; border-radius:16px;
  box-shadow:0 12px 40px rgba(0,0,0,.25); z-index:9991; display:none;
  flex-direction:column; overflow:hidden; font-family:"Open Sans", Roboto, Arial, sans-serif; }
#af-chat.open { display:flex; animation:af-pop .2s ease-out; }

#af-chat .af-head { background:var(--af-azul); color:#fff; padding:12px 16px; display:flex; gap:12px; align-items:center; }
#af-chat .af-avatar { width:38px; height:38px; border-radius:50%; background:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.2rem; flex:none; }
#af-chat .af-avatar img { width:28px; height:28px; object-fit:contain; display:block; }
#af-chat .af-head h2 { font-size:.98rem; margin:0; color:#fff; }
#af-chat .af-head p { font-size:.72rem; margin:2px 0 0; opacity:.85; }
#af-chat .af-close { margin-left:auto; background:none; border:none; color:#fff;
  font-size:1.25rem; cursor:pointer; line-height:1; }

#af-chat .af-msgs { flex:1; overflow-y:auto; padding:14px; background:var(--af-cinza); }
#af-chat .af-msg { max-width:85%; padding:9px 13px; border-radius:14px; margin-bottom:8px;
  font-size:.88rem; line-height:1.5; white-space:pre-line; }
#af-chat .af-msg.bot { background:#fff; border:1px solid #e3e9f2; border-bottom-left-radius:3px; }
#af-chat .af-msg.user { background:var(--af-azul); color:#fff; margin-left:auto; border-bottom-right-radius:3px; }
#af-chat .af-msg a { color:var(--af-azul); }

#af-chat .af-chips { display:flex; flex-wrap:wrap; gap:6px; margin:4px 0 10px; }
#af-chat .af-chip { background:#fff; border:1px solid var(--af-azul); color:var(--af-azul);
  border-radius:16px; padding:5px 12px; font-size:.8rem; cursor:pointer; }
#af-chat .af-chip:hover { background:var(--af-azul); color:#fff; }

#af-chat .af-inputbar { display:flex; border-top:1px solid #e6e6e6; background:#fff; }
#af-chat .af-inputbar input { flex:1; border:none; padding:12px 14px; font-size:.9rem; outline:none; }
#af-chat .af-inputbar button { border:none; background:none; color:var(--af-azul);
  font-size:1.2rem; padding:0 16px; cursor:pointer; }

#af-chat .af-foot { font-size:.62rem; color:#6a7482; text-align:center; padding:5px 10px 7px; background:#fff; line-height:1.45; }
#af-chat .af-foot a { color:#6a7482; }

@media (max-width:480px) {
  #af-chat { right:8px; bottom:84px; }
}