Biblioteca H.A.P.S.

#chatbot-container { position: fixed; bottom: 20px; right: 20px; font-family: Arial, sans-serif; z-index: 9999; } #chatbot-toggle { background: #004a8f; color: white; border: none; border-radius: 50%; width: 50px; height: 50px; font-size: 24px; cursor: pointer; } #chatbot-box { width: 300px; background: white; border: 1px solid #ccc; border-radius: 10px; box-shadow: 0 2px 10px rgba(0,0,0,0.2); overflow: hidden; display: flex; flex-direction: column; } .hidden { display: none; } #chatbot-header { background: #004a8f; color: white; padding: 10px; text-align: center; font-weight: bold; } #chatbot-messages { height: 250px; padding: 10px; overflow-y: auto; font-size: 14px; } #chatbot-input { border: none; border-top: 1px solid #ccc; padding: 10px; width: 100%; box-sizing: border-box; } .msg-user { text-align: right; background: #e0f0ff; margin: 5px; padding: 5px 8px; border-radius: 8px; } .msg-bot { text-align: left; background: #f1f1f1; margin: 5px; padding: 5px 8px; border-radius: 8px; } document.addEventListener("DOMContentLoaded", function() { const toggle = document.getElementById("chatbot-toggle"); const box = document.getElementById("chatbot-box"); const messages = document.getElementById("chatbot-messages"); const input = document.getElementById("chatbot-input"); const respuestas = { "hola": "¡Hola! ¿Cómo estás? Soy el asistente virtual del sitio.", "tramite": "Podés consultar los trámites disponibles en la sección 'Gestiones' del menú principal.", "horario": "Nuestro horario de atención es de lunes a viernes de 8 a 16 hs.", "contacto": "Podés escribirnos a contacto@gobierno.gov.ar o llamar al 0800-123-456.", "default": "Perdón, no entendí tu consulta. Probá con palabras como 'tramite', 'horario' o 'contacto'." }; toggle.addEventListener("click", () => box.classList.toggle("hidden")); input.addEventListener("keypress", function(e) { if (e.key === "Enter" && input.value.trim() !== "") { const pregunta = input.value.toLowerCase(); mostrarMensaje("usuario", pregunta); input.value = ""; let respuesta = respuestas["default"]; for (const clave in respuestas) { if (pregunta.includes(clave)) { respuesta = respuestas[clave]; break; } } setTimeout(() => mostrarMensaje("bot", respuesta), 500); } }); function mostrarMensaje(remitente, texto) { const msg = document.createElement("div"); msg.className = remitente === "usuario" ? "msg-user" : "msg-bot"; msg.textContent = texto; messages.appendChild(msg); messages.scrollTop = messages.scrollHeight; } });