iatoolkit 0.8.1__py3-none-any.whl → 0.63.4__py3-none-any.whl

iatoolkit/static/styles/chat_modal.css

@@ -1,11 +1,5 @@
-/* ######################################################### */
 /* Estilos generales para modales */
-/* ######################################################### */
 
-/* Separación del icono y el título del modal */
-.icon-spaced {
-    margin-right: 10px;
-}
 
 /* Título del modal */
 .modal-title{
@@ -13,12 +7,6 @@
     font-weight: bold;
 }
 
-/* Texto del modal */
-.text-muted{
-    font-size:16px;
-    text-align: justify;
-}
-
 /* Estilos del header del modal*/
 .modal-header {
     display: flex;
@@ -32,6 +20,7 @@
     margin: 0;
     padding: 0;
     flex: 1;
+    color: inherit;
 }
 
 /* Estilos del botón de cerrar del modal*/
@@ -41,55 +30,78 @@
     margin-left: auto;
 }
 
-/* ######################################################### */
-/* Modal de historial */
-/* ######################################################### */
+/* Estilos del header del modal con branding */
+.modal-header.branded {
+    background-color: var(--brand-modal-header-bg);
+    color: var(--brand-modal-header-text);
+    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+}
+.modal-header.branded .btn-close {
+    filter: invert(1) grayscale(100%) brightness(200%); /* Hace el botón de cerrar visible en fondos oscuros */
+}
+
+/* Estilos para botones con branding */
+.btn-branded-primary {
+    background-color: var(--brand-primary-color);
+    border-color: var(--brand-primary-color);
+    color: var(--brand-text-on-primary);
+}
+.btn-branded-primary:hover {
+    background-color: var(--brand-text-on-primary);
+    color: var(--brand-primary-color);
+    border-color: var(--brand-primary-color);
+}
+
+.btn-branded-secondary {
+    background-color: var(--brand-secondary-color);
+    border-color: var(--brand-secondary-color);
+    color: var(--brand-text-on-secondary);
+}
+.btn-branded-secondary:hover {
+    background-color: var(--brand-text-on-secondary);
+    color: var(--brand-secondary-color);
+    border-color: var(--brand-secondary-color);
+}
 
-/* Estilos cabeceras de tablas */
-.thead-dark th{
+/* Modal de historial */
+.thead-branded th {
+    background-color: #e9ecef; /* Un gris claro estándar de Bootstrap */
+    color: #212529; /* El color de texto oscuro por defecto */
     font-size: 16px;
     font-weight: bold;
 }
 
-/* Control de ancho de columnas en la tabla del historial */
-#history-content .table td:nth-child(1) {
-    width: 5%; /* Columna del número */
+/* Evita el salto de línea en la celda de la fecha */
+#historyModal .date-cell {
+    white-space: nowrap;
 }
 
-#history-content .table td:nth-child(2) {
-    width: 23%; /* Columna de la fecha */
+.col-min,
+.col-icon {
+  width: 1%;
+  white-space: nowrap;
 }
 
-#history-content .table td:nth-child(3) {
-    width: auto; /* Columna de la consulta - ocupa el resto */
+/* Estilo para el icono de copiar/editar en cada fila */
+#historyModal .copy-query-icon {
+    color: var(--brand-secondary-color, #6c757d); /* Usa el color secundario de la marca */
+    text-decoration: none;
+    opacity: 0.6;
+    transition: opacity 0.2s ease-in-out;
 }
 
-/* ######################################################### */
-/* Modal de feedback */
-/* ######################################################### */
-
-/* Contenedor de calificación del modal de feedback */
-.rating-container {
-    text-align: center;
-    margin: 10px 0 0 0;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    gap: 5px;
-    width: 100%;
+#historyModal .copy-query-icon:hover {
+    opacity: 1; /* El icono se vuelve completamente opaco al pasar el ratón */
+    cursor: pointer; /* Asegura que el cursor cambie a una mano */
 }
 
-/* Contenedor de estrellas del modal de feedback */
-.rating-stars-container{
-    text-align: center;
-    margin: 2px 0 0 0;
+/* Modal de feedback */
+.rating-stars {
     display: flex;
-    flex-direction: row;
     justify-content: center;
-    align-items: center;
-    gap: 10px;
-    width: 100%;
+    gap: 5px;
+    margin-bottom: 15px;
+    padding-top: 5px;
 }
 
 /* Estilos de las estrellas del modal de feedback */
@@ -101,16 +113,35 @@
     margin: 0 2px;
 }
 
-/* Estilos de las estrellas del modal de feedback al pasar el mouse */
+.star::before {
+    content: '★';
+}
+
 .star:hover,
 .star.active,
 .star.hover-active {
     color: #ffc107;
 }
 
-/* ######################################################### */
+.icon-spaced {
+    margin-right: 10px;
+}
+
+.text-muted{
+    font-size:16px;
+    text-align: justify;
+}
+
+.feedback-text{
+    font-size: 16px;
+}
+
 /* Modal de listado de archivos */
-/* ######################################################### */
+/* Estilos del nombre del archivo del modal de archivos y ordenar icono */
+.file-name-modal {
+    flex: 1;
+    margin-right: 10px;
+}
 
 /* Para el icono de eliminar del modal */
 .remove-file-btn i {
@@ -124,13 +155,21 @@
     align-items: center;
 }
 
-/* Estilos del nombre del archivo del modal de archivos y ordenar icono */
-.file-name-modal {
-    flex: 1;
-    margin-right: 10px;
-}
-
 /* Estilos del botón de eliminar del modal de archivos y ordenar icono */
 .remove-file-btn {
     flex-shrink: 0;
-}
+}
+
+/* Estilos para alertas informativas personalizadas */
+.alert-branded-info {
+    background-color: var(--brand-info-bg);
+    color: var(--brand-info-text);
+    border-color: var(--brand-info-border);
+}
+.alert-branded-info strong,
+.alert-branded-info .alert-link {
+    color: inherit;
+}
+.alert-branded-info .bi { /* Asegura que los iconos también tomen el color */
+    color: inherit;
+}

iatoolkit/static/styles/landing_page.css

@@ -0,0 +1,182 @@
+/* static/styles/landing_page.css */
+
+/* --- Variables y Estilos Globales --- */
+:root {
+    --website-primary-color: #4A55A2;
+    --website-primary-color-dark: #3A448A;
+    --website-gradient-start: #4A55A2;
+    --website-gradient-end: #7895CB;
+    --website-dark-text: #212529;
+    --website-light-bg: #f8f9fa;
+    --website-muted-text: #6c757d;
+}
+
+body {
+    background-color: #fff;
+    color: var(--website-dark-text);
+    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+}
+
+/* --- Encabezado Propio (sin usar .navbar) --- */
+.website-header {
+    margin-top: 1rem;
+    padding: 1rem 1.5rem; /* Padding vertical y horizontal */
+    border-radius: 0.5rem;
+    display: flex;
+    align-items: center;
+
+    /* Estilos de color (se mantienen) */
+    background-color: var(--website-primary-color);
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
+}
+
+.website-brand {
+    font-weight: 700;
+    font-size: 1.75rem;
+     color: #ffffff;
+}
+
+/* --- Sección Principal (Hero) --- */
+.hero-section {
+    padding: 2rem 0 1rem; /* Ajustado: 5rem arriba, 0 a los lados, 2.5rem abajo */
+}
+
+.hero-title {
+    font-size: 3rem;
+    font-weight: 800;
+    line-height: 1.2;
+    margin-bottom: 1.5rem;
+}
+.gradient-text {
+    background: linear-gradient(90deg, var(--website-gradient-start), var(--website-gradient-end));
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+    text-fill-color: transparent;
+}
+.hero-bullets {
+    list-style: none;
+    padding-left: 0;
+    font-size: 1.1rem;
+}
+.hero-bullets li {
+    display: flex;
+    align-items: center;
+    gap: 0.75rem;
+    margin-bottom: 1rem;
+    color: var(--website-muted-text);
+}
+.hero-bullets .bi {
+    color: var(--website-primary-color);
+    font-size: 1.5rem;
+}
+
+/* --- Botón de Llamada a la Acción (CTA) --- */
+.hero-section .btn-primary {
+    background-color: var(--website-primary-color);
+    border-color: var(--website-primary-color);
+    transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
+}
+.hero-section .btn-primary:hover {
+    background-color: var(--website-primary-color-dark);
+    border-color: var(--website-primary-color-dark);
+}
+
+.bg-light h3 {
+    color: var(--website-primary-color);
+}
+
+.features-section {
+    padding: 5rem 0;
+    background-color: var(--website-light-bg);
+}
+.feature-item {
+    background-color: #fff;
+    padding: 2rem;
+    border-radius: 0.75rem;
+    border: 1px solid #e9ecef;
+    height: 100%;
+    transition: all 0.3s ease;
+}
+.feature-item:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 8px 25px rgba(0,0,0,0.08);
+}
+.feature-icon {
+    font-size: 2.5rem;
+    margin-bottom: 1rem;
+    color: var(--website-primary-color);
+}
+.feature-item h3 {
+    font-weight: 600;
+    margin-bottom: 0.5rem;
+}
+.feature-item p {
+    color: var(--website-muted-text);
+}
+
+/* Estilo especial para la caja de Open Source */
+.opensource-box {
+    background: var(--website-dark-text);
+    color: #fff;
+    padding: 2rem;
+    border-radius: 0.75rem;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    border: 1px solid transparent;
+    transition: all 0.3s ease;
+}
+.opensource-box:hover {
+     transform: translateY(-5px);
+     box-shadow: 0 8px 25px rgba(0,0,0,0.15);
+}
+.opensource-icon .bi-github {
+    font-size: 2.5rem;
+    margin-bottom: 1rem;
+}
+.opensource-box h3 {
+    font-weight: 600;
+}
+.opensource-box p {
+    color: #ced4da;
+    margin-bottom: 1.5rem;
+}
+
+/* --- Sección del Autor --- */
+.author-section {
+    background-color: #fff;
+}
+.author-card {
+    background-color: var(--website-light-bg);
+    border-radius: 0.75rem;
+    border: 1px solid #e9ecef;
+}
+.author-card h5 {
+    color: var(--website-primary-color);
+    font-weight: 600;
+}
+.author-bio {
+    color: var(--website-muted-text);
+    line-height: 1.6;
+}
+.author-linkedin {
+    text-decoration: none;
+    color: #0077b5;
+    font-weight: 500;
+    transition: opacity 0.2s;
+}
+.author-linkedin:hover {
+    opacity: 0.8;
+}
+
+/* --- Footer --- */
+.landing-footer {
+    background-color: var(--website-light-bg);
+    color: var(--website-muted-text);
+    padding: 2rem 0;
+    text-align: center;
+    margin-top: 4rem;
+    border-top: 1px solid #e9ecef;
+}

iatoolkit/static/styles/onboarding.css

@@ -0,0 +1,169 @@
+/* static/css/onboarding.css */
+
+/* Fuente base para ambos contextos */
+.ob-root {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
+}
+
+/* Tarjeta */
+.ob-card {
+  background-color: #fff;
+  border-radius: 12px;
+  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
+  padding: 30px;
+  width: 90%;
+  max-width: 450px;
+  text-align: center;
+  transition: opacity 0.3s ease-in-out;
+  margin: 0 auto;
+}
+
+/* Contenido de tarjeta */
+.ob-icon {
+  font-size: 40px;
+  color: var(--brand-primary-color, #FF5100);
+  margin-bottom: 15px;
+}
+.ob-title {
+  font-size: 1.25rem;
+  color: #333;
+  margin-bottom: 10px;
+}
+.ob-text {
+  font-size: 0.95rem;
+  color: #666;
+  line-height: 1.5;
+  min-height: 60px;
+}
+
+/* Navegación */
+.ob-nav {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-top: 20px;
+}
+.ob-btn {
+  background-color: var(--brand-secondary-color, #06326B);
+  border: none;
+  color: var(--brand-text-on-secondary, #FFFFFF);
+  border-radius: 50%;
+  width: 40px;
+  height: 40px;
+  cursor: pointer;
+  transition: opacity 0.2s;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+.ob-btn:hover { opacity: 0.85; }
+
+/* Dots */
+.ob-dots {
+  display: flex;
+  gap: 8px;
+}
+.ob-dots > div {
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  background-color: #ddd;
+  transition: background-color 0.3s;
+}
+.ob-dots > div.active {
+  background-color: var(--brand-primary-color, #FF5100);
+}
+
+/* Encabezado reutilizable (si se usa) */
+.ob-brand-header {
+  font-size: 2rem;
+  font-weight: 700;
+  margin-bottom: 24px;
+  color: var(--brand-secondary-color, #06326B);
+  text-align: center;
+}
+.ob-brand-header .brand-name {
+  color: var(--brand-primary-color, #FF5100);
+}
+
+/* Utilidades */
+.ob-fade {
+  transition: opacity 0.5s ease-in-out;
+}
+
+/* Responsivo */
+@media (max-width: 420px) {
+  .ob-card { padding: 24px; }
+  .ob-icon { font-size: 34px; }
+}
+
+/* Overlay a pantalla completa */
+.onboarding-shell-root {
+  position: relative;
+  height: calc(100vh - 0px);
+}
+
+/* Centrado vertical y horizontal del contenido del loader */
+#loader-wrapper {
+  position: absolute; inset: 0;
+  background-color: #f4f7f6;
+  z-index: 1000;
+  display: flex; align-items: center; justify-content: center;
+  padding: 20px; box-sizing: border-box;
+  transition: opacity 0.5s ease-in-out;
+}
+
+/* Pila vertical: header + tarjeta + banda de carga */
+.ob-stack {
+  width: 100%;
+  max-width: 520px; /* ligeramente más que la tarjeta para respiración */
+  display: flex;
+  flex-direction: column;
+  align-items: stretch; /* la tarjeta ocupa el ancho */
+  gap: 16px;
+}
+
+/* Header de marca consistente */
+.ob-brand-header {
+  font-size: 2rem;
+  font-weight: 700;
+  margin: 0;
+  color: var(--brand-secondary-color, #06326B);
+  text-align: center;
+}
+.ob-brand-header .brand-name {
+  color: var(--brand-primary-color, #FF5100);
+}
+
+/* Banda de estado integrada visualmente con la tarjeta */
+.ob-loading-band {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 12px;
+  padding: 12px 14px;
+  background: #ffffff;
+  border-radius: 12px;
+  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
+}
+
+/* Spinner */
+.spinner {
+  width: 28px; height: 28px;
+  border: 4px solid rgba(0,0,0,0.1);
+  border-top-color: var(--brand-primary-color, #FF5100);
+  border-radius: 50%;
+  animation: spin 1s linear infinite;
+}
+@keyframes spin { to { transform: rotate(360deg); } }
+
+#loading-status p {
+  font-size: 0.95rem;
+  font-weight: 500;
+  color: #555;
+  margin: 0;
+}
+
+/* Iframe contenedor */
+#content-container { width: 100%; height: 100%; }
+#content-container iframe { width: 100%; height: 100%; border: none; }

iatoolkit/system_prompts/query_main.prompt

@@ -1,24 +1,15 @@
 Eres un asistente que responde preguntas o ejecuta tareas según el contexto de la empresa.
 
 ### **Nombre de la empresa**
-## Nombre: {{company.name}}
+## Nombre: {{company}}, tambien se conoce como {{ company_short_name }}
 
 ### ** Información del usuario que esta consultando este chat**
-Contexto del usuario:
+- Identificador unico de usuario: {{ user_identifier }}
 - Nombre: {{ user_fullname }}
 - Email: {{ user_email }}
 - Tipo de usuario: {% if user_is_local %}Interno{% else %}Externo{% endif %}
-- Empresa: {{ company_name }}
+- Rol de usuario: {{ user_rol }}
 
-{% if user_name %}
-El usuario que consulta se identifica con la variable `user_name` y tiene el
-siguiente valor: {{ user_name }}.
-
-Este usuario tiene el rol: {{ user_rol }} en el producto {{ user_product }}.
-
-{% else %}
-El usuario que consulta se identifica como: {{ user_id }}
-{% endif %}
 
 ## Servicios de datos (function calls) disponibles en {{company.name}}:
 {% for service in service_list %}

iatoolkit/templates/_company_header.html

@@ -0,0 +1,20 @@
+{# El div principal ahora es un contenedor y tiene los estilos y clases de alineación #}
+<div class="custom-company-header container d-flex justify-content-between align-items-center">
+
+    {% if company_short_name and branding %}
+    <a href="{{ url_for('home', company_short_name=company_short_name) }}"
+       class="brand-name"
+       style="{{ branding.primary_text_style }}">
+        {{ branding.name }} IA
+    </a>
+    {% else %}
+        <span class="brand-name">
+             IAToolkit
+        </span>
+    {% endif %}
+
+    {# Texto "Powered by" con enlace a iatoolkit.com #}
+    <span class="powered-by">
+        Powered by <a href="{{ url_for('index') }}" rel="noopener noreferrer" class="iatoolkit-link">IAToolkit</a>
+    </span>
+</div>

iatoolkit/templates/_login_widget.html

@@ -0,0 +1,40 @@
+<div class="branded-form-container">
+    <!-- 1. Encabezado de Marketing -->
+    <div class="text-center mb-4">
+        <p class="text-muted widget-intro-text">
+            Ingresa tus credenciales o registrate para acceder a la plataforma de {{ branding.name }}.
+        </p>
+    </div>
+
+    <!-- 2. Formulario de Inicio de Sesión -->
+    <form id="login-form"
+          action="{{ url_for('login', company_short_name=company_short_name) }}"
+          method="post">
+      <div class="mb-3">
+        <label for="email" class="form-label d-block">Correo Electrónico</label>
+        <input type="email" id="email" name="email" class="form-control"
+               required value="{{ form_data.email if form_data is defined else '' }}">
+      </div>
+      <div class="mb-3">
+        <label for="password" class="form-label d-block">Contraseña</label>
+        <input type="password" id="password" name="password"
+               class="form-control" required>
+      </div>
+      <button type="submit" class="btn btn-branded-primary w-100 fw-bold py-2">
+          Iniciar Sesión
+      </button>
+    </form>
+
+    <!-- 3. Nueva Sección de Registro más Atractiva -->
+    <div class="mt-4 pt-3 text-center" style="border-top: 1px solid #e0e0e0;">
+        <span class="text-muted small">¿Eres nuevo aquí?</span>
+        <a href="{{ url_for('signup', company_short_name=company_short_name) }}" id="signup-link" class="fw-bold ms-1 text-decoration-none" style="color: var(--brand-primary-color);">Crea una cuenta gratis</a>
+    </div>
+
+    <!-- 4. Enlace de Recuperación de Contraseña (más sutil) -->
+    <div class="text-center mt-2">
+      <a href="{{ url_for('forgot_password', company_short_name=company_short_name) }}" class="text-decoration-none text-muted" style="font-size: 0.8rem;">
+        ¿Olvidaste tu contraseña?
+      </a>
+    </div>
+</div>

iatoolkit/templates/base.html

@@ -9,15 +9,20 @@
     <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/filepond/dist/filepond.min.css">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css">
-    <link rel="stylesheet" href="{{ url_for('static', filename='styles/chat_iatoolkit.css') }}">
-    <link rel="stylesheet" href="{{ url_for('static', filename='styles/chat_modal.css') }}">
-    <link rel="stylesheet" href="{{ url_for('static', filename='styles/llm_output.css') }}">
+    <link rel="stylesheet" href="{{ url_for('static', filename='styles/chat_iatoolkit.css', _external=True) }}">
+    <link rel="stylesheet" href="{{ url_for('static', filename='styles/onboarding.css', _external=True) }}">
+    <link rel="stylesheet" href="{{ url_for('static', filename='styles/chat_modal.css',  _external=True) }}">
+    <link rel="stylesheet" href="{{ url_for('static', filename='styles/llm_output.css', _external=True) }}">
+
+    {% block styles %}{% endblock %}
 </head>
 <body class="d-flex flex-column p-3" style="min-height: 100vh;">
+
     <main class="d-flex flex-column flex-grow-1">
         {% block content %}{% endblock %}
     </main>
 
+
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js"></script>
     <script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/filepond/dist/filepond.min.js"></script>