Floating Virtual Assistant - Copy this Html, Tailwind Component to your project

Quiero-un-chatbot-flotante-que-esté-visible-en-todas-las-páginas-de-mi-web.-Aquí-están-los-detalles:-Diseño:-El-chatbot-debe-estar-flotando-en-la-esquina-inferior-derecha-de-la-pantalla,-siempre-visible.-Dimensiones-iniciales:-300px-de-ancho-por-400px-de-alto.-Diseño-moderno-con-colores-atractivos,-bordes-redondeados,-y-sombra-suave.-En-la-parte-superior,-debe-tener-un-encabezado-con-el-texto-"Asistente-Virtual".-El-área-principal-debe-mostrar-mensajes-del-usuario-y-del-chatbot,-con-desplazamiento-cuando-haya-muchos-mensajes.-Debajo,-un-cuadro-de-texto-para-que-el-usuario-escriba-su-mensaje-y-un-botón-para-enviarlo.-Lógica-Básica:-Cuando-el-usuario-escriba-"hola",-el-chatbot-debe-responder-"¡Hola!-¿En-qué-puedo-ayudarte?".-Si-el-usuario-menciona-"reserva",-debe-responder-"¿Quieres-reservar-una-cita?-Dime-tu-nombre-y-número.".-Si-el-mensaje-no-coincide-con-las-palabras-clave,-responde-"Lo-siento,-no-entendí-eso.".-Función-Flotante:-El-chatbot-debe-mantenerse-fijo-en-la-esquina-inferior-derecha-usando-position:-fixed-y-con-z-index-alto-para-estar-sobre-otros-elementos.-Código-en-HTML+CSS+JavaScript:-Todo-el-código-debe-estar-integrado-en-un-archivo-sencillo-(sin-dependencias-externas-como-frameworks-o-librerías).-Usar-JavaScript-puro-para-la-lógica.-Extras:-El-diseño-debe-ser-responsivo-para-que-funcione-bien-en-pantallas-pequeñas-(usar-media-queries).-Si-es-posible,-generar-un-archivo-completo-listo-para-copiar-y-pegar-en-mi-web."**