> ## Documentation Index
> Fetch the complete documentation index at: https://docs.jelou.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Introducción

> Implementa cobros dentro de tus flujos conversacionales usando proveedores externos conectados a Brain Studio.

Pagos en Brain Studio te permite **iniciar, ejecutar y confirmar cobros** dentro de una conversación (por ejemplo en WhatsApp), y continuar el flujo en función del **resultado real de la transacción**.

La plataforma permite implementar distintas [experiencias de pago](/guides/integraciones/pagos/experiencias/tipos-de-experiencia), según el proveedor y el medio de pago utilizado:

* **WebView embebido en WhatsApp**, donde el cliente completa el checkout dentro de la conversación.
* **Experiencia nativa en chat**, cuando el medio de pago lo permite.
* **Flujos conversacionales para wallets o transferencias**, cuando la confirmación ocurre fuera del checkout tradicional.

<Info>
  Jelou no custodia fondos. Cada usuario implementador utiliza su propia cuenta y credenciales del proveedor de pago correspondiente.
</Info>

***

## Cómo funciona

Un pago en Brain Studio siempre involucra tres roles claramente separados:

* 🧠 **Brain Studio** → Construye la solicitud y expone el estado
* 💳 **Proveedor de pago** → Ejecuta la transacción y liquida fondos
* 🎯 **Tu implementación** → Decide la siguiente acción según el estado recibido

### Responsabilidades de cada parte

<Tabs>
  <Tab title="Brain Studio">
    * Construye la solicitud (monto, moneda, metadata).
    * Dispara la operación hacia el proveedor.
    * Recibe el estado y lo expone como resultado.
    * No autoriza ni liquida pagos.
  </Tab>

  <Tab title="Proveedor">
    * Ejecuta checkout o autorización según el medio de pago.
    * Aplica validaciones y reglas antifraude.
    * Determina el estado final.
    * Liquida los fondos en la cuenta del comercio.
  </Tab>
</Tabs>

### Estados que debes manejar

El proveedor siempre retornará un **estado de transacción**.\
Tu implementación debe manejarlo explícitamente.

<Accordion title="Aprobado">
  El pago fue confirmado correctamente.

  Tu flujo normalmente debería:

  * Continuar el proceso principal.
  * Confirmar al usuario.
  * Registrar el evento (si aplica).
</Accordion>

<Accordion title="Rechazado">
  La operación fue denegada o falló.

  Tu flujo debería:

  * Informar el error.
  * Permitir reintento o método alternativo.
  * Registrar el motivo si el proveedor lo expone.
</Accordion>

<Accordion title="Pendiente (cuando aplica)">
  El pago aún no tiene confirmación final\
  (común en efectivo o transferencias).

  Tu flujo debería:

  * Definir una estrategia de seguimiento.
  * Consultar estado posteriormente (polling o webhook).
  * Evitar continuar como si estuviera aprobado.
</Accordion>

<Info>
  Modela el nodo de pago como una transición determinística:\
  <code>solicitud → ejecución externa → estado → siguiente acción</code>.
</Info>

***

## Modelo de integración (BYOK)

Las integraciones de pago del Marketplace funcionan, en su mayoría, con **BYOK (Bring Your Own Keys)**:

* Conectas el proveedor con **tus credenciales** (API keys, Access Token u OAuth).
* El pago se procesa y liquida en la **cuenta del comercio** dentro del proveedor.
* Brain Studio **orquesta** el flujo y trabaja con el **estado retornado**.

<Tip>
  BYOK = tú traes la cuenta y llaves del proveedor. Brain Studio no reemplaza al proveedor: lo integra.
</Tip>

***

## Antes de implementar

<Tabs>
  <Tab title="Cobertura y método">
    Define el alcance de tu caso:

    * **País(es)** donde vas a operar.
    * **Medios de pago** requeridos (tarjetas, transferencias, efectivo, métodos locales).
    * Si el comercio ya usa un proveedor específico, parte por ese proveedor.
  </Tab>

  <Tab title="Experiencia">
    La experiencia depende del proveedor y del tipo de integración disponible:

    * **WebView embebido en WhatsApp**
    * **Experiencia nativa en chat** (WhatsApp Flows, cuando aplica)
    * **Flujos conversacionales** para wallets/transferencias (cuando la confirmación ocurre fuera del checkout)

    <Card title="Ver experiencias de pago" icon={<span style={{ fontSize: '1.15rem', lineHeight: 1 }}>🧩</span>} href="/guides/integraciones/pagos/experiencias/tipos-de-experiencia">
      Límites, diferencias y cuándo usar cada una.
    </Card>
  </Tab>

  <Tab title="Requisitos técnicos">
    Checklist mínimo:

    * **Cuenta activa** en el proveedor elegido.
    * **Credenciales** listas (API keys / Access Token / OAuth).
    * **WhatsApp Business verificado** si usarás:
      * WebView embebido
      * Experiencia nativa con WhatsApp Flows

    <Warning>
      Si la cuenta de WhatsApp Business no está verificada, el WebView puede abrirse en navegador externo y la experiencia nativa puede no estar disponible.
    </Warning>
  </Tab>
</Tabs>

***

## Flujo típico de implementación

<Steps>
  <Step title="Elegir proveedor y experiencia">
    Define país(es), medio(s) de pago y la experiencia (WebView / nativa / conversacional).
  </Step>

  <Step title="Obtener credenciales">
    Genera credenciales en el panel del proveedor (test y/o producción según tu caso).
  </Step>

  <Step title="Instalar desde Marketplace (BYOK)">
    Instala la integración e ingresa credenciales. El proveedor queda disponible como tool en Brain.
  </Step>

  <Step title="Usar en Brain y manejar estados">
    Implementa el pago en tu flujo y maneja explícitamente **Aprobado / Rechazado / Pendiente (cuando aplique)**.
  </Step>
</Steps>

<Tip>
  La práctica recomendada es tratar el pago como una “decisión por estado”: el proveedor devuelve un estado y tu flujo continúa en la rama correcta.
</Tip>

***

## Próximos pasos

<CardGroup cols={3}>
  <Card title="Tutorial: Implementando tu primer cobro desde WhatsApp" href="/guides/integraciones/pagos/implementando-tu-primer-cobro" icon="rocket">
    Tutorial paso a paso: desde credenciales hasta tu primer cobro en producción.
  </Card>

  <Card title="Experiencias de pago" href="/guides/integraciones/pagos/experiencias/tipos-de-experiencia" icon="puzzle">
    Cuándo usar WebView embebido, experiencia nativa en chat o flujos conversacionales.
  </Card>

  <Card title="Proveedores disponibles" href="/guides/integraciones/pagos/proveedores" icon="credit-card">
    Proveedores por país, alcance de integración y guías específicas.
  </Card>
</CardGroup>
