Release v1.6.0 - Audit System Cross-Tenant Viewing

Features:
- ✅ Cross-tenant audit log viewing for ADMIN/SUPPORT_MANAGER
- ✅ New 'all_tenants' parameter in audit endpoints
- ✅ Frontend toggle to view all clients' logs
- ✅ Multi-tenant stats support in /audit/stats
- ✅ Fixed timezone issue with date filters (UTC consistency)
- ✅ Fixed date_to filter overlap causing duplicate records

Changes:
- backend/app/api/v1/endpoints/audit.py:
  * Added tenant_id and all_tenants query parameters
  * Permission checks for cross-tenant viewing
  * Dynamic tenant filtering based on user role
  * Fixed date_to filter (removed +1 day overlap)
  * Updated all stats queries for multi-tenant support

- frontend-internal/src/routes/audit/+page.svelte:
  * Import auth store for role detection
  * Added 'Ver todos los clientes' toggle for admins
  * Pass all_tenants parameter to API calls
  * UI badge indicating multi-tenant mode

- Version bump: 1.5.1.2 → 1.6.0 across all packages

backend/app/api/schemas/audit.py

@@ -0,0 +1,110 @@
+"""
+Audit Schemas - ServiceManagerWeb
+
+Schemas Pydantic para endpoints de auditoría
+"""
+
+from pydantic import BaseModel, Field, UUID4
+from typing import Optional, Dict, Any
+from datetime import datetime
+
+
+class AuditLogBase(BaseModel):
+    """Schema base para audit logs."""
+    action: str = Field(..., description="Acci├│n realizada (ej: ticket.create)")
+    resource_type: str = Field(..., description="Tipo de recurso (ticket, user, etc.)")
+    resource_id: Optional[UUID4] = Field(None, description="ID del recurso afectado")
+    extra_metadata: Optional[Dict[str, Any]] = Field(None, description="Metadata adicional", alias="metadata")
+
+
+class AuditLogResponse(AuditLogBase):
+    """
+    Schema de respuesta para audit logs.
+    
+    Incluye toda la informaci├│n del log con datos del usuario.
+    """
+    id: UUID4
+    tenant_id: UUID4
+    user_id: Optional[UUID4]
+    
+    # Informaci├│n del usuario (si existe)
+    user_email: Optional[str] = None
+    user_name: Optional[str] = None
+    user_role: Optional[str] = None
+    
+    # Contexto de la acci├│n
+    ip_address: Optional[str]
+    user_agent: Optional[str]
+    correlation_id: Optional[UUID4]
+    
+    # Cambios realizados
+    old_values: Optional[Dict[str, Any]]
+    new_values: Optional[Dict[str, Any]]
+    
+    # Timestamp
+    created_at: datetime
+    
+    # Display friendly
+    action_display: str = Field(description="Acci├│n en formato amigable")
+    
+    class Config:
+        from_attributes = True
+
+
+class AuditLogFilters(BaseModel):
+    """
+    Filtros para consulta de audit logs.
+    
+    Permite filtrar por m├║ltiples criterios.
+    """
+    # Paginaci├│n
+    page: int = Field(default=1, ge=1, description="Número de página")
+    per_page: int = Field(default=50, ge=1, le=100, description="Elementos por página")
+    
+    # Filtros
+    user_id: Optional[UUID4] = Field(None, description="Filtrar por usuario")
+    action: Optional[str] = Field(None, description="Filtrar por acción específica")
+    resource_type: Optional[str] = Field(None, description="Filtrar por tipo de recurso")
+    resource_id: Optional[UUID4] = Field(None, description="Filtrar por ID de recurso")
+    
+    # Rango de fechas
+    date_from: Optional[datetime] = Field(None, description="Fecha inicio (ISO 8601)")
+    date_to: Optional[datetime] = Field(None, description="Fecha fin (ISO 8601)")
+    
+    # B├║squeda
+    search: Optional[str] = Field(None, description="B├║squeda en acciones o recursos")
+
+
+class AuditLogStats(BaseModel):
+    """
+    Estadísticas de auditoría.
+    
+    Resumen de actividad del sistema.
+    """
+    total_actions: int = Field(description="Total de acciones registradas")
+    actions_today: int = Field(description="Acciones en las ├║ltimas 24 horas")
+    actions_this_week: int = Field(description="Acciones en los últimos 7 días")
+    critical_actions_today: int = Field(description="Acciones críticas hoy (delete, cambios sensibles)")
+    
+    # Top acciones
+    top_actions: Dict[str, int] = Field(description="Acciones más frecuentes")
+    
+    # Top usuarios
+    top_users: Dict[str, int] = Field(description="Usuarios más activos")
+    
+    # Actividad por tipo de recurso
+    by_resource_type: Dict[str, int] = Field(description="Acciones por tipo de recurso")
+
+
+class AuditLogListResponse(BaseModel):
+    """
+    Respuesta paginada de audit logs.
+    """
+    logs: list[AuditLogResponse]
+    total: int = Field(description="Total de registros")
+    page: int = Field(description="Página actual")
+    per_page: int = Field(description="Registros por página")
+    total_pages: int = Field(description="Total de páginas")
+    
+    class Config:
+        from_attributes = True

backend/app/api/v1/endpoints/audit.py

@@ -0,0 +1,392 @@
+"""
+Audit Endpoints - ServiceManagerWeb
+
+Endpoints para consulta de logs de auditoría.
+Solo accesible por roles: ADMIN, SUPPORT_MANAGER, AUDITOR
+"""
+
+from fastapi import APIRouter, Depends, HTTPException, status, Query
+from sqlalchemy.ext.asyncio import AsyncSession
+from sqlalchemy import select, func, and_, or_, desc
+from sqlalchemy.orm import selectinload
+from typing import Optional, List
+from datetime import datetime, timedelta
+import uuid
+import structlog
+
+from app.core.database import get_db
+from app.api.deps import get_current_user, get_current_tenant
+from app.models.user import User, UserRole
+from app.models.tenant import Tenant
+from app.models.audit import AuditLog
+from app.api.schemas.audit import (
+    AuditLogResponse,
+    AuditLogListResponse,
+    AuditLogFilters,
+    AuditLogStats
+)
+
+router = APIRouter()
+logger = structlog.get_logger(__name__)
+
+
+def require_auditor_role(current_user: User = Depends(get_current_user)) -> User:
+    """
+    Dependency que verifica que el usuario tenga rol de auditor.
+    
+    Solo ADMIN, SUPPORT_MANAGER y AUDITOR pueden ver logs de auditoría.
+    """
+    allowed_roles = [UserRole.ADMIN, UserRole.SUPPORT_MANAGER, UserRole.AUDITOR]
+    
+    if current_user.role not in allowed_roles:
+        raise HTTPException(
+            status_code=status.HTTP_403_FORBIDDEN,
+            detail="Solo usuarios con rol ADMIN, SUPPORT_MANAGER o AUDITOR pueden acceder a logs de auditoría"
+        )
+    
+    return current_user
+
+
+@router.get("/", response_model=AuditLogListResponse)
+async def get_audit_logs(
+    # Paginaci├│n
+    page: int = Query(default=1, ge=1, description="Número de página"),
+    per_page: int = Query(default=50, ge=1, le=100, description="Registros por página"),
+    
+    # Filtros
+    user_id: Optional[uuid.UUID] = Query(None, description="Filtrar por usuario"),
+    action: Optional[str] = Query(None, description="Filtrar por acci├│n"),
+    resource_type: Optional[str] = Query(None, description="Filtrar por tipo de recurso"),
+    resource_id: Optional[uuid.UUID] = Query(None, description="Filtrar por ID de recurso"),
+    date_from: Optional[datetime] = Query(None, description="Fecha desde"),
+    date_to: Optional[datetime] = Query(None, description="Fecha hasta"),
+    search: Optional[str] = Query(None, description="B├║squeda en acci├│n o email"),
+        # Multi-tenant filters (solo ADMIN/SUPPORT_MANAGER)
+    tenant_id: Optional[uuid.UUID] = Query(None, description="Ver logs de un tenant específico"),
+    all_tenants: bool = Query(False, description="Ver logs de todos los tenants"),
+        # Dependencies
+    current_user: User = Depends(require_auditor_role),
+    current_tenant: Tenant = Depends(get_current_tenant),
+    db: AsyncSession = Depends(get_db)
+):
+    """
+    Obtener logs de auditoría con filtros y paginación.
+    
+    **Permisos**: ADMIN, SUPPORT_MANAGER, AUDITOR
+    
+    **Filtros disponibles**:
+    - `user_id`: Acciones de un usuario específico
+    - `action`: Tipo de acci├│n (ej: "ticket.create")
+    - `resource_type`: Tipo de recurso (ej: "ticket")
+    - `resource_id`: ID de recurso específico
+    - `date_from`, `date_to`: Rango de fechas
+    - `search`: B├║squeda en acciones
+    
+    **Retorna**: Lista paginada de audit logs
+    """
+    logger.info(
+        "Fetching audit logs",
+        user_id=str(current_user.id),
+        tenant_id=str(current_tenant.id),
+        filters={
+            "user_id": str(user_id) if user_id else None,
+            "action": action,
+            "resource_type": resource_type,
+            "page": page,
+            "tenant_filter": str(tenant_id) if tenant_id else None,
+            "all_tenants": all_tenants
+        }
+    )
+    
+    # Determinar el filtro de tenant
+    # Solo ADMIN y SUPPORT_MANAGER pueden ver otros tenants o todos los tenants
+    can_see_all_tenants = current_user.role in [UserRole.ADMIN, UserRole.SUPPORT_MANAGER]
+    
+    # Query base con filtro de tenant dinámico
+    query = select(AuditLog).options(selectinload(AuditLog.user))
+    
+    if all_tenants and can_see_all_tenants:
+        # Ver todos los tenants (no agregar filtro de tenant)
+        pass
+    elif tenant_id and can_see_all_tenants:
+        # Ver un tenant específico
+        query = query.where(AuditLog.tenant_id == tenant_id)
+    else:
+        # Ver solo el tenant actual (comportamiento default)
+        query = query.where(AuditLog.tenant_id == current_tenant.id)
+    
+    # Aplicar filtros
+    if user_id:
+        query = query.where(AuditLog.user_id == user_id)
+    
+    if action:
+        query = query.where(AuditLog.action == action)
+    
+    if resource_type:
+        query = query.where(AuditLog.resource_type == resource_type)
+    
+    if resource_id:
+        query = query.where(AuditLog.resource_id == resource_id)
+    
+    if date_from:
+        query = query.where(AuditLog.created_at >= date_from)
+    
+    if date_to:
+        # El frontend ya envía el timestamp correcto
+        query = query.where(AuditLog.created_at < date_to)
+    
+    if search:
+        # B├║squeda en action
+        search_filter = AuditLog.action.ilike(f"%{search}%")
+        query = query.where(search_filter)
+    
+    # Ordenar por fecha descendente (más recientes primero)
+    query = query.order_by(desc(AuditLog.created_at))
+    
+    # Contar total antes de paginar
+    count_query = select(func.count()).select_from(query.subquery())
+    total_result = await db.execute(count_query)
+    total = total_result.scalar() or 0
+    
+    # Aplicar paginaci├│n
+    offset = (page - 1) * per_page
+    query = query.offset(offset).limit(per_page)
+    
+    # Ejecutar query
+    result = await db.execute(query)
+    logs = result.scalars().all()
+    
+    # Calcular total de páginas
+    total_pages = (total + per_page - 1) // per_page
+    
+    # Convertir a response schema (agregar info del usuario)
+    logs_response = []
+    for log in logs:
+        log_dict = {
+            "id": log.id,
+            "tenant_id": log.tenant_id,
+            "user_id": log.user_id,
+            "action": log.action,
+            "resource_type": log.resource_type,
+            "resource_id": log.resource_id,
+            "ip_address": str(log.ip_address) if log.ip_address else None,
+            "user_agent": log.user_agent,
+            "correlation_id": log.correlation_id,
+            "old_values": log.old_values,
+            "new_values": log.new_values,
+            "metadata": log.extra_metadata,
+            "created_at": log.created_at,
+            "action_display": log.action_display,
+            "user_email": None,
+            "user_name": None
+        }
+        
+        # Agregar info del usuario si existe
+        if log.user:
+            log_dict["user_email"] = log.user.email
+            log_dict["user_name"] = log.user.full_name
+            log_dict["user_role"] = log.user.role.value if hasattr(log.user.role, 'value') else str(log.user.role)
+        
+        logs_response.append(AuditLogResponse(**log_dict))
+    
+    return AuditLogListResponse(
+        logs=logs_response,
+        total=total,
+        page=page,
+        per_page=per_page,
+        total_pages=total_pages
+    )
+
+
+@router.get("/stats", response_model=AuditLogStats)
+async def get_audit_stats(
+    all_tenants: bool = Query(False, description="Ver stats de todos los tenants"),
+    current_user: User = Depends(require_auditor_role),
+    current_tenant: Tenant = Depends(get_current_tenant),
+    db: AsyncSession = Depends(get_db)
+):
+    """
+    Obtener estadísticas de auditoría del tenant (o todos los tenants si es ADMIN).
+    
+    **Permisos**: ADMIN, SUPPORT_MANAGER, AUDITOR
+    
+    **Retorna**: Estadísticas de actividad
+    """
+    can_see_all_tenants = current_user.role in [UserRole.ADMIN, UserRole.SUPPORT_MANAGER]
+    
+    logger.info(
+        "Fetching audit stats",
+        user_id=str(current_user.id),
+        tenant_id=str(current_tenant.id),
+        all_tenants=all_tenants,
+        can_see_all=can_see_all_tenants
+    )
+    
+    now = datetime.utcnow()
+    
+    # Determinar si aplicar filtro de tenant
+    apply_tenant_filter = not (all_tenants and can_see_all_tenants)
+    
+    # Total de acciones
+    total_query = select(func.count()).select_from(AuditLog)
+    if apply_tenant_filter:
+        total_query = total_query.where(AuditLog.tenant_id == current_tenant.id)
+    total_result = await db.execute(total_query)
+    total_actions = total_result.scalar() or 0
+    
+    # Acciones hoy (├║ltimas 24 horas)
+    today_start = now - timedelta(days=1)
+    today_query = select(func.count()).select_from(AuditLog).where(
+        AuditLog.created_at >= today_start
+    )
+    if apply_tenant_filter:
+        today_query = today_query.where(AuditLog.tenant_id == current_tenant.id)
+    today_result = await db.execute(today_query)
+    actions_today = today_result.scalar() or 0
+    
+    # Acciones esta semana (últimos 7 días)
+    week_start = now - timedelta(days=7)
+    week_query = select(func.count()).select_from(AuditLog).where(
+        AuditLog.created_at >= week_start
+    )
+    if apply_tenant_filter:
+        week_query = week_query.where(AuditLog.tenant_id == current_tenant.id)
+    week_result = await db.execute(week_query)
+    actions_this_week = week_result.scalar() or 0
+    
+    # Top 5 acciones más frecuentes
+    top_actions_query = select(
+        AuditLog.action,
+        func.count(AuditLog.id).label('count')
+    )
+    if apply_tenant_filter:
+        top_actions_query = top_actions_query.where(AuditLog.tenant_id == current_tenant.id)
+    top_actions_query = top_actions_query.group_by(
+        AuditLog.action
+    ).order_by(
+        desc('count')
+    ).limit(5)
+    
+    top_actions_result = await db.execute(top_actions_query)
+    top_actions = {row.action: row.count for row in top_actions_result}
+    
+    # Acciones por tipo de recurso
+    by_resource_query = select(
+        AuditLog.resource_type,
+        func.count(AuditLog.id).label('count')
+    )
+    if apply_tenant_filter:
+        by_resource_query = by_resource_query.where(AuditLog.tenant_id == current_tenant.id)
+    by_resource_query = by_resource_query.group_by(
+        AuditLog.resource_type
+    ).order_by(
+        desc('count')
+    )
+    
+    by_resource_result = await db.execute(by_resource_query)
+    by_resource_type = {row.resource_type: row.count for row in by_resource_result}
+    
+    # Top usuarios (con join a users para obtener nombres)
+    top_users_query = select(
+        User.email,
+        func.count(AuditLog.id).label('count')
+    ).join(
+        User, AuditLog.user_id == User.id
+    )
+    if apply_tenant_filter:
+        top_users_query = top_users_query.where(AuditLog.tenant_id == current_tenant.id)
+    top_users_query = top_users_query.group_by(
+        User.email
+    ).order_by(
+        desc('count')
+    ).limit(5)
+    
+    top_users_result = await db.execute(top_users_query)
+    top_users = {row.email: row.count for row in top_users_result}
+    
+    # Acciones críticas hoy (delete, update sensibles, etc.)
+    critical_conditions = [
+        AuditLog.created_at >= today_start,
+        or_(
+            AuditLog.action.like('%.delete'),
+            AuditLog.action.like('user.update'),
+            AuditLog.action.like('%.assign'),
+            AuditLog.action.in_(['user.login_failed', 'user.logout'])
+        )
+    ]
+    if apply_tenant_filter:
+        critical_conditions.append(AuditLog.tenant_id == current_tenant.id)
+    
+    critical_actions_query = select(func.count()).select_from(AuditLog).where(
+        and_(*critical_conditions)
+    )
+    critical_result = await db.execute(critical_actions_query)
+    critical_actions_today = critical_result.scalar() or 0
+    
+    return AuditLogStats(
+        total_actions=total_actions,
+        actions_today=actions_today,
+        actions_this_week=actions_this_week,
+        critical_actions_today=critical_actions_today,
+        top_actions=top_actions,
+        top_users=top_users,
+        by_resource_type=by_resource_type
+    )
+
+
+@router.get("/{log_id}", response_model=AuditLogResponse)
+async def get_audit_log_detail(
+    log_id: uuid.UUID,
+    current_user: User = Depends(require_auditor_role),
+    current_tenant: Tenant = Depends(get_current_tenant),
+    db: AsyncSession = Depends(get_db)
+):
+    """
+    Obtener detalle de un audit log específico.
+    
+    **Permisos**: ADMIN, SUPPORT_MANAGER, AUDITOR
+    
+    **Retorna**: Detalle completo del audit log
+    """
+    # Buscar el log
+    query = select(AuditLog).where(
+        and_(
+            AuditLog.id == log_id,
+            AuditLog.tenant_id == current_tenant.id
+        )
+    )
+    
+    result = await db.execute(query)
+    log = result.scalar_one_or_none()
+    
+    if not log:
+        raise HTTPException(
+            status_code=status.HTTP_404_NOT_FOUND,
+            detail=f"Audit log {log_id} no encontrado"
+        )
+    
+    # Convertir a response
+    log_dict = {
+        "id": log.id,
+        "tenant_id": log.tenant_id,
+        "user_id": log.user_id,
+        "action": log.action,
+        "resource_type": log.resource_type,
+        "resource_id": log.resource_id,
+        "ip_address": str(log.ip_address) if log.ip_address else None,
+        "user_agent": log.user_agent,
+        "correlation_id": log.correlation_id,
+        "old_values": log.old_values,
+        "new_values": log.new_values,
+        "metadata": log.extra_metadata,
+        "created_at": log.created_at,
+        "action_display": log.action_display,
+        "user_email": None,
+        "user_name": None
+    }
+    
+    if log.user:
+        log_dict["user_email"] = log.user.email
+        log_dict["user_name"] = log.user.full_name
+    
+    return AuditLogResponse(**log_dict)

backend/app/api/v1/endpoints/auth.py

@@ -18,6 +18,7 @@ from app.core.security import security
 from app.core.config import get_settings
 from app.models.user import User
 from app.models.tenant import Tenant
+from app.services.audit_service import AuditService
 
 router = APIRouter()
 logger = structlog.get_logger(__name__)
@@ -99,6 +100,23 @@ async def login(
             "Login failed - invalid credentials",
             email=login_data.email
         )
+        
+        # Registrar intento fallido en auditoría (si el usuario existe)
+        if user:
+            try:
+                await AuditService.log(
+                    db=db,
+                    tenant_id=user.tenant_id,
+                    user_id=None,  # Login fallido = sin user_id
+                    action="user.login_failed",
+                    resource_type="user",
+                    resource_id=user.id,
+                    metadata={"email": login_data.email, "reason": "invalid_password"}
+                )
+                await db.commit()
+            except Exception as e:
+                logger.warning("Failed to log audit entry", error=str(e))
+        
         raise HTTPException(
             status_code=status.HTTP_401_UNAUTHORIZED,
             detail="Credenciales inválidas"
@@ -126,6 +144,21 @@ async def login(
     access_token = security.create_access_token(token_data)
     refresh_token = security.create_refresh_token(token_data)
     
+    # Registrar login exitoso en auditoría
+    try:
+        await AuditService.log(
+            db=db,
+            tenant_id=user.tenant_id,
+            user_id=user.id,
+            action="user.login",
+            resource_type="user",
+            resource_id=user.id,
+            metadata={"email": user.email, "success": True}
+        )
+        await db.commit()
+    except Exception as e:
+        logger.warning("Failed to log audit entry", error=str(e))
+    
     logger.info(
         "Login successful",
         email=login_data.email,
@@ -227,6 +260,25 @@ async def logout(
     
     # TODO: Revoke refresh token in database
     
+    # Registrar logout en auditoría
+    try:
+        import uuid
+        user_id = uuid.UUID(payload["sub"])
+        tenant_id = uuid.UUID(payload["tenant_id"])
+        
+        await AuditService.log(
+            db=db,
+            tenant_id=tenant_id,
+            user_id=user_id,
+            action="user.logout",
+            resource_type="user",
+            resource_id=user_id,
+            metadata={"email": payload.get("email")}
+        )
+        await db.commit()
+    except Exception as e:
+        logger.warning("Failed to log audit entry", error=str(e))
+    
     logger.info("Logout successful", user_id=payload["sub"])
     
     return {"message": "Successfully logged out"}

backend/app/api/v1/endpoints/tickets.py

@@ -21,6 +21,7 @@ from app.models.comment import TicketComment
 from app.models.attachment import TicketAttachment
 from app.api.schemas.attachment import AttachmentResponse
 from app.core.file_handler import file_handler
+from app.services.audit_service import AuditService
 import uuid
 
 router = APIRouter()
@@ -143,6 +144,27 @@ async def create_ticket(
             await db.commit()
             await db.refresh(db_ticket)
             
+            # Registrar creación en auditoría
+            try:
+                await AuditService.log(
+                    db=db,
+                    tenant_id=current_user.tenant_id,
+                    user_id=current_user.id,
+                    action="ticket.create",
+                    resource_type="ticket",
+                    resource_id=db_ticket.id,
+                    new_values={
+                        "ticket_number": db_ticket.ticket_number,
+                        "subject": db_ticket.subject,
+                        "priority": db_ticket.priority.value,
+                        "status": db_ticket.status.value
+                    }
+                )
+                await db.commit()
+            except Exception as e:
+                # No fallar si falla el audit log
+                pass
+            
             # ✅ Éxito - retornar ticket creado
             return {
                 "id": str(db_ticket.id),
@@ -240,7 +262,7 @@ async def get_tickets(
             "status": t.status.value,
             "priority": t.priority.value,
             "category_id": str(t.category_id) if t.category_id else None,
-            "affected_system_id": str(t.affected_system_id) if t.affected_system_id else None,  # ✅ CORREGIDO
+            "affected_system_id": str(t.affected_system_id) if t.affected_system_id else None,
             "created_by": str(t.created_by),
             "assigned_to": str(t.assigned_to) if t.assigned_to else None,
             "created_at": t.created_at,
@@ -501,6 +523,15 @@ async def update_ticket(
             detail=f"Ticket {ticket_id} not found"
         )
     
+    # Guardar valores anteriores para audit
+    old_values = {
+        "subject": db_ticket.subject,
+        "description": db_ticket.description,
+        "status": db_ticket.status.value,
+        "priority": db_ticket.priority.value,
+        "assigned_to": str(db_ticket.assigned_to) if db_ticket.assigned_to else None
+    }
+    
     try:
         update_data = ticket_update.dict(exclude_unset=True)
         
@@ -519,6 +550,34 @@ async def update_ticket(
         await db.commit()
         await db.refresh(db_ticket)
         
+        # Registrar actualización en auditoría
+        try:
+            new_values = {
+                "subject": db_ticket.subject,
+                "description": db_ticket.description,
+                "status": db_ticket.status.value,
+                "priority": db_ticket.priority.value,
+                "assigned_to": str(db_ticket.assigned_to) if db_ticket.assigned_to else None
+            }
+            
+            # Si cambió assigned_to, registrar como acción de asignación
+            action = "ticket.assign" if old_values["assigned_to"] != new_values["assigned_to"] else "ticket.update"
+            
+            await AuditService.log(
+                db=db,
+                tenant_id=current_user.tenant_id,
+                user_id=current_user.id,
+                action=action,
+                resource_type="ticket",
+                resource_id=db_ticket.id,
+                old_values=old_values,
+                new_values=new_values
+            )
+            await db.commit()
+        except Exception as e:
+            # No fallar si falla el audit log
+            pass
+        
         # ✅ CORREGIDO: Usar affected_system_id
         return {
             "id": str(db_ticket.id),
@@ -787,9 +846,33 @@ async def delete_ticket(
             detail=f"Ticket {ticket_id} not found"
         )
     
+    # Guardar datos del ticket antes de eliminar para audit
+    old_values = {
+        "ticket_number": db_ticket.ticket_number,
+        "subject": db_ticket.subject,
+        "status": db_ticket.status.value,
+        "priority": db_ticket.priority.value
+    }
+    
     await db.delete(db_ticket)
     await db.commit()
     
+    # Registrar eliminación en auditoría
+    try:
+        await AuditService.log(
+            db=db,
+            tenant_id=current_user.tenant_id,
+            user_id=current_user.id,
+            action="ticket.delete",
+            resource_type="ticket",
+            resource_id=ticket_uuid,
+            old_values=old_values
+        )
+        await db.commit()
+    except Exception as e:
+        # No fallar si falla el audit log
+        pass
+    
     return {"message": "Ticket deleted successfully"}
 
 # ===================================

backend/app/api/v1/endpoints/users.py

@@ -9,6 +9,7 @@ import uuid
 from app.core.database import get_db
 from app.core.security import security
 from app.models.user import User, UserRole
+from app.services.audit_service import AuditService
 from app.api import deps 
 
 router = APIRouter()
@@ -147,6 +148,28 @@ async def create_user(
     db.add(db_user)
     await db.commit()
     await db.refresh(db_user)
+    
+    # Registrar creación en auditoría
+    try:
+        await AuditService.log(
+            db=db,
+            tenant_id=current_user.tenant_id,
+            user_id=current_user.id,
+            action="user.create",
+            resource_type="user",
+            resource_id=db_user.id,
+            new_values=AuditService.sanitize_values({
+                "email": db_user.email,
+                "first_name": db_user.first_name,
+                "last_name": db_user.last_name,
+                "role": db_user.role.value
+            })
+        )
+        await db.commit()
+    except Exception as e:
+        # No fallar si falla el audit log
+        pass
+    
     return db_user
 
 
@@ -214,6 +237,15 @@ async def update_user(
             detail="User not found"
         )
     
+    # Guardar valores anteriores para audit
+    old_values = {
+        "email": db_user.email,
+        "first_name": db_user.first_name,
+        "last_name": db_user.last_name,
+        "role": db_user.role.value,
+        "is_active": db_user.is_active
+    }
+    
     # Verificar email único si se está cambiando
     update_data = user_update.model_dump(exclude_unset=True)
     if "email" in update_data and update_data["email"] != db_user.email:
@@ -239,6 +271,32 @@ async def update_user(
     
     await db.commit()
     await db.refresh(db_user)
+    
+    # Registrar actualización en auditoría
+    try:
+        new_values = {
+            "email": db_user.email,
+            "first_name": db_user.first_name,
+            "last_name": db_user.last_name,
+            "role": db_user.role.value,
+            "is_active": db_user.is_active
+        }
+        
+        await AuditService.log(
+            db=db,
+            tenant_id=current_user.tenant_id,
+            user_id=current_user.id,
+            action="user.update",
+            resource_type="user",
+            resource_id=db_user.id,
+            old_values=AuditService.sanitize_values(old_values),
+            new_values=AuditService.sanitize_values(new_values)
+        )
+        await db.commit()
+    except Exception as e:
+        # No fallar si falla el audit log
+        pass
+    
     return db_user
 
 
@@ -306,6 +364,28 @@ async def delete_user(
     # Soft delete
     db_user.is_active = False
     await db.commit()
+    
+    # Registrar eliminación en auditoría
+    try:
+        await AuditService.log(
+            db=db,
+            tenant_id=current_user.tenant_id,
+            user_id=current_user.id,
+            action="user.delete",
+            resource_type="user",
+            resource_id=db_user.id,
+            old_values={
+                "email": db_user.email,
+                "role": db_user.role.value,
+                "was_active": True
+            },
+            metadata={"action_type": "soft_delete"}
+        )
+        await db.commit()
+    except Exception as e:
+        # No fallar si falla el audit log
+        pass
+    
     return None
 
 

backend/app/api/v1/router.py

@@ -6,7 +6,7 @@ Router principal para la API v1
 
 from fastapi import APIRouter
 
-from app.api.v1.endpoints import auth, health, tenants, users, systems, categories, tickets, client_profile
+from app.api.v1.endpoints import auth, health, tenants, users, systems, categories, tickets, client_profile, audit
 
 api_router = APIRouter()
 
@@ -60,3 +60,10 @@ api_router.include_router(
     prefix="/client-profile",
     tags=["client-profile"]
 )
+
+# Audit routes
+api_router.include_router(
+    audit.router,
+    prefix="/audit",
+    tags=["audit"]
+)

backend/app/main.py

@@ -23,6 +23,8 @@ from app.models.user import User
 from app.models.ticket import Ticket
 from app.models.comment import TicketComment
 from app.models.attachment import TicketAttachment
+from app.models.audit import AuditLog
+from app.models.refresh_token import RefreshToken
 
 from app.core.logging import setup_logging
 from app.api.v1.router import api_router

backend/app/models/__init__.py

@@ -8,6 +8,8 @@ from .system import System
 from .category import Category
 from .client_profile import ClientProfile
 from .attachment import TicketAttachment
+from .audit import AuditLog
+from .refresh_token import RefreshToken
 
 __all__ = [
     "User",
@@ -17,5 +19,7 @@ __all__ = [
     "System",
     "Category",
     "ClientProfile",
-    "TicketAttachment"
+    "TicketAttachment",
+    "AuditLog",
+    "RefreshToken"
 ]

backend/app/models/audit.py

@@ -0,0 +1,148 @@
+"""
+Audit Log Model - ServiceManagerWeb
+
+Modelo para bitácora de auditoría y compliance.
+Registra todas las acciones importantes del sistema.
+"""
+
+from sqlalchemy import String, Text, DateTime, ForeignKey, Index
+from sqlalchemy.orm import Mapped, mapped_column, relationship
+from sqlalchemy.dialects.postgresql import UUID, INET, JSONB
+from typing import Optional, Dict, Any, TYPE_CHECKING
+import uuid
+from datetime import datetime
+
+from app.core.database import Base
+
+if TYPE_CHECKING:
+    from app.models.tenant import Tenant
+    from app.models.user import User
+
+
+class AuditLog(Base):
+    """
+    Bitácora de auditoría para tracking completo de acciones.
+    
+    Registra:
+    - Qui├®n hizo la acci├│n (user_id)
+    - Qu├® hizo (action)
+    - Sobre qu├® recurso (resource_type + resource_id)
+    - Cuándo lo hizo (created_at)
+    - Desde d├│nde (ip_address, user_agent)
+    - Qu├® cambi├│ (old_values, new_values)
+    """
+    
+    __tablename__ = "audit_logs"
+    
+    # Multi-tenancy
+    tenant_id: Mapped[uuid.UUID] = mapped_column(
+        UUID(as_uuid=True),
+        ForeignKey("tenants.id", ondelete="CASCADE"),
+        nullable=False,
+        index=True
+    )
+    
+    # Usuario que ejecut├│ la acci├│n (NULL = acci├│n del sistema)
+    user_id: Mapped[Optional[uuid.UUID]] = mapped_column(
+        UUID(as_uuid=True),
+        ForeignKey("users.id", ondelete="SET NULL"),
+        nullable=True,
+        index=True
+    )
+    
+    # Acci├│n realizada (ej: "user.login", "ticket.create", "ticket.assign")
+    action: Mapped[str] = mapped_column(
+        String(100),
+        nullable=False,
+        index=True
+    )
+    
+    # Tipo de recurso afectado (user, ticket, comment, category, etc.)
+    resource_type: Mapped[str] = mapped_column(
+        String(50),
+        nullable=False,
+        index=True
+    )
+    
+    # ID del recurso afectado
+    resource_id: Mapped[Optional[uuid.UUID]] = mapped_column(
+        UUID(as_uuid=True),
+        nullable=True
+    )
+    
+    # Contexto de la request
+    ip_address: Mapped[Optional[str]] = mapped_column(INET, nullable=True)
+    user_agent: Mapped[Optional[str]] = mapped_column(Text, nullable=True)
+    
+    # Correlation ID para rastrear requests relacionadas
+    correlation_id: Mapped[Optional[uuid.UUID]] = mapped_column(
+        UUID(as_uuid=True),
+        nullable=True,
+        index=True
+    )
+    
+    # Valores antes del cambio (JSON)
+    old_values: Mapped[Optional[Dict[str, Any]]] = mapped_column(
+        JSONB,
+        nullable=True
+    )
+    
+    # Valores despu├®s del cambio (JSON)
+    new_values: Mapped[Optional[Dict[str, Any]]] = mapped_column(
+        JSONB,
+        nullable=True
+    )
+    
+    # Metadata adicional (cualquier info relevante)
+    # Nota: 'metadata' está reservado en SQLAlchemy, usamos 'extra_metadata'
+    extra_metadata: Mapped[Optional[Dict[str, Any]]] = mapped_column(
+        'metadata',  # Nombre real de la columna en BD
+        JSONB,
+        nullable=True
+    )
+    
+    # Timestamp
+    created_at: Mapped[datetime] = mapped_column(
+        DateTime(timezone=True),
+        default=datetime.utcnow,
+        nullable=False,
+        index=True
+    )
+    
+    # Relaciones
+    tenant: Mapped["Tenant"] = relationship("Tenant", foreign_keys=[tenant_id])
+    user: Mapped[Optional["User"]] = relationship("User", foreign_keys=[user_id])
+    
+    # Índices compuestos para queries comunes
+    __table_args__ = (
+        Index('idx_audit_logs_tenant_action', 'tenant_id', 'action'),
+        Index('idx_audit_logs_resource', 'resource_type', 'resource_id'),
+        Index('idx_audit_logs_user_created', 'user_id', 'created_at'),
+    )
+    
+    # Configuraci├│n del mapper: excluir updated_at porque audit logs son inmutables
+    __mapper_args__ = {
+        "exclude_properties": ["updated_at"]
+    }
+    
+    def __repr__(self) -> str:
+        return f"<AuditLog(action='{self.action}', resource='{self.resource_type}:{self.resource_id}')>"
+    
+    @property
+    def action_display(self) -> str:
+        """Formato amigable de la acci├│n."""
+        parts = self.action.split('.')
+        if len(parts) == 2:
+            resource, verb = parts
+            verb_map = {
+                'create': 'cre├│',
+                'update': 'actualiz├│',
+                'delete': 'elimin├│',
+                'login': 'inici├│ sesi├│n',
+                'logout': 'cerr├│ sesi├│n',
+                'assign': 'asign├│',
+                'close': 'cerr├│',
+                'reopen': 'reabri├│'
+            }
+            return f"{verb_map.get(verb, verb)} {resource}"
+        return self.action

backend/app/models/refresh_token.py

@@ -0,0 +1,171 @@
+"""
+Refresh Token Model - ServiceManagerWeb
+
+Modelo para persistencia de refresh tokens con revocaci├│n y tracking.
+"""
+
+from sqlalchemy import String, Boolean, DateTime, ForeignKey, Index, Integer
+from sqlalchemy.orm import Mapped, mapped_column, relationship
+from sqlalchemy.dialects.postgresql import UUID
+from typing import Optional, TYPE_CHECKING
+import uuid
+from datetime import datetime
+
+from app.core.database import Base
+
+if TYPE_CHECKING:
+    from app.models.user import User
+
+
+class RefreshToken(Base):
+    """
+    Refresh Token persistente para gesti├│n de sesiones.
+    
+    Almacena refresh tokens con informaci├│n de dispositivo y permite
+    revocaci├│n para mejorar la seguridad.
+    
+    Características:
+    - Token hasheado (no se guarda en texto plano)
+    - Device fingerprinting
+    - Revocaci├│n individual con tracking
+    - Auto-expiraci├│n
+    - Tracking de IP y uso
+    """
+    
+    __tablename__ = "refresh_tokens"
+    
+    # User relationship
+    user_id: Mapped[uuid.UUID] = mapped_column(
+        UUID(as_uuid=True),
+        ForeignKey("users.id", ondelete="CASCADE"),
+        nullable=False,
+        index=True
+    )
+    
+    # Token JWT (almacenado directamente - firmado y verificable)
+    # VARCHAR(500) para acomodar JWTs con payload extenso
+    token: Mapped[str] = mapped_column(
+        String(500),
+        nullable=False,
+        unique=True
+    )
+    
+    # Device information
+    device_id: Mapped[Optional[str]] = mapped_column(
+        String(100),
+        nullable=True
+    )
+    
+    device_name: Mapped[Optional[str]] = mapped_column(
+        String(200),
+        nullable=True
+    )
+    
+    user_agent: Mapped[Optional[str]] = mapped_column(
+        String(500),
+        nullable=True
+    )
+    
+    # IP address del cliente (varchar(45) para IPv6)
+    ip_address: Mapped[Optional[str]] = mapped_column(
+        String(45),
+        nullable=True
+    )
+    
+    # Expiraci├│n del token
+    expires_at: Mapped[datetime] = mapped_column(
+        DateTime(timezone=True),
+        nullable=False,
+        index=True
+    )
+    
+    # Estado de revocaci├│n
+    revoked: Mapped[bool] = mapped_column(
+        Boolean,
+        default=False,
+        nullable=False
+    )
+    
+    revoked_at: Mapped[Optional[datetime]] = mapped_column(
+        DateTime(timezone=True),
+        nullable=True
+    )
+    
+    revoked_by: Mapped[Optional[uuid.UUID]] = mapped_column(
+        UUID(as_uuid=True),
+        ForeignKey("users.id", ondelete="SET NULL"),
+        nullable=True
+    )
+    
+    # Tracking de uso
+    last_used_at: Mapped[Optional[datetime]] = mapped_column(
+        DateTime(timezone=True),
+        nullable=True
+    )
+    
+    usage_count: Mapped[int] = mapped_column(
+        Integer,
+        default=0,
+        nullable=False
+    )
+    
+    # Timestamps
+    created_at: Mapped[datetime] = mapped_column(
+        DateTime(timezone=True),
+        default=datetime.utcnow,
+        nullable=False,
+        server_default="NOW()"
+    )
+    
+    updated_at: Mapped[datetime] = mapped_column(
+        DateTime(timezone=True),
+        default=datetime.utcnow,
+        onupdate=datetime.utcnow,
+        nullable=False,
+        server_default="NOW()"
+    )
+    
+    # Relaci├│n con usuario
+    user: Mapped["User"] = relationship("User", foreign_keys=[user_id], back_populates="refresh_tokens")
+    revoker: Mapped[Optional["User"]] = relationship("User", foreign_keys=[revoked_by])
+    
+    # Índices compuestos
+    __table_args__ = (
+        Index('idx_refresh_tokens_user_expires', 'user_id', 'expires_at'),
+    )
+    
+    def __repr__(self) -> str:
+        return f"<RefreshToken(user_id='{self.user_id}', revoked={self.revoked}, expires={self.expires_at})>"
+    
+    @property
+    def is_valid(self) -> bool:
+        """
+        Verificar si el token es válido.
+        
+        Un token es válido si:
+        - No está revocado
+        - No ha expirado
+        """
+        return not self.revoked and self.expires_at > datetime.utcnow()
+    
+    @property
+    def is_expired(self) -> bool:
+        """Verificar si el token ha expirado."""
+        return datetime.utcnow() >= self.expires_at
+    
+    def revoke(self, revoked_by: Optional[uuid.UUID] = None) -> None:
+        """
+        Marcar el token como revocado.
+        
+        Args:
+            revoked_by: ID del usuario que revoc├│ el token
+        """
+        self.revoked = True
+        self.revoked_at = datetime.utcnow()
+        if revoked_by:
+            self.revoked_by = revoked_by
+    
+    def track_usage(self) -> None:
+        """Registrar uso del token."""
+        self.last_used_at = datetime.utcnow()
+        self.usage_count += 1

backend/app/models/user.py

@@ -78,6 +78,12 @@ class User(Base):
         back_populates="assigned_to_user", 
         foreign_keys="Ticket.assigned_to"
     )
+    refresh_tokens: Mapped[List["RefreshToken"]] = relationship(
+        "RefreshToken",
+        back_populates="user",
+        foreign_keys="RefreshToken.user_id",
+        cascade="all, delete-orphan"
+    )
     
     # Unique constraint por tenant
     __table_args__ = (

backend/app/services/audit_service.py

@@ -0,0 +1,311 @@
+"""
+Audit Service - ServiceManagerWeb
+
+Funciones helper para facilitar el registro de auditoría.
+Simplifica el proceso de logging en toda la aplicaci├│n.
+"""
+
+from typing import Optional, Dict, Any
+from sqlalchemy.ext.asyncio import AsyncSession
+from fastapi import Request
+import uuid
+import structlog
+
+from app.models.audit import AuditLog
+from app.models.user import User
+
+logger = structlog.get_logger(__name__)
+
+
+class AuditService:
+    """
+    Servicio centralizado para registro de auditoría.
+    
+    Uso básico:
+        await AuditService.log(
+            db=db,
+            tenant_id=tenant.id,
+            user_id=current_user.id,
+            action="ticket.create",
+            resource_type="ticket",
+            resource_id=new_ticket.id,
+            new_values={"subject": "...", "status": "NEW"}
+        )
+    """
+    
+    @staticmethod
+    async def log(
+        db: AsyncSession,
+        tenant_id: uuid.UUID,
+        action: str,
+        resource_type: str,
+        resource_id: Optional[uuid.UUID] = None,
+        user_id: Optional[uuid.UUID] = None,
+        old_values: Optional[Dict[str, Any]] = None,
+        new_values: Optional[Dict[str, Any]] = None,
+        metadata: Optional[Dict[str, Any]] = None,
+        request: Optional[Request] = None
+    ) -> AuditLog:
+        """
+        Registra una acción en la bitácora de auditoría.
+        
+        Args:
+            db: Sesi├│n de base de datos
+            tenant_id: ID del tenant
+            action: Acci├│n realizada (formato: "recurso.verbo")
+                   Ejemplos: "user.login", "ticket.create", "ticket.assign"
+            resource_type: Tipo de recurso ("user", "ticket", "comment", etc.)
+            resource_id: ID del recurso afectado (opcional)
+            user_id: ID del usuario que ejecut├│ la acci├│n (opcional = sistema)
+            old_values: Valores antes del cambio (opcional)
+            new_values: Valores despu├®s del cambio (opcional)
+            metadata: Informaci├│n adicional (opcional)
+            request: Request de FastAPI para extraer IP y user agent (opcional)
+            
+        Returns:
+            AuditLog creado
+        """
+        # Extraer información del request si está disponible
+        ip_address = None
+        user_agent = None
+        correlation_id = None
+        
+        if request:
+            # IP del cliente
+            if request.client:
+                ip_address = request.client.host
+            
+            # User agent
+            user_agent = request.headers.get("user-agent")
+            
+            # Correlation ID (si existe en el request state)
+            correlation_id = getattr(request.state, "correlation_id", None)
+        
+        # Crear registro de auditoría
+        audit_log = AuditLog(
+            tenant_id=tenant_id,
+            user_id=user_id,
+            action=action,
+            resource_type=resource_type,
+            resource_id=resource_id,
+            ip_address=ip_address,
+            user_agent=user_agent,
+            correlation_id=correlation_id,
+            old_values=old_values,
+            new_values=new_values,
+            extra_metadata=metadata  # Mapeo metadata -> extra_metadata
+        )
+        
+        db.add(audit_log)
+        await db.flush()  # No commit, se hará con la transacción principal
+        
+        # Log estructurado para debugging
+        logger.info(
+            "Audit log created",
+            action=action,
+            resource_type=resource_type,
+            resource_id=str(resource_id) if resource_id else None,
+            user_id=str(user_id) if user_id else "system",
+            tenant_id=str(tenant_id)
+        )
+        
+        return audit_log
+    
+    @staticmethod
+    async def log_login(
+        db: AsyncSession,
+        user: User,
+        request: Request,
+        success: bool = True
+    ) -> AuditLog:
+        """
+        Registra un intento de login.
+        
+        Args:
+            db: Sesi├│n de base de datos
+            user: Usuario que intent├│ loguearse
+            request: Request de FastAPI
+            success: Si el login fue exitoso
+            
+        Returns:
+            AuditLog creado
+        """
+        return await AuditService.log(
+            db=db,
+            tenant_id=user.tenant_id,
+            user_id=user.id if success else None,
+            action="user.login" if success else "user.login_failed",
+            resource_type="user",
+            resource_id=user.id,
+            metadata={
+                "success": success,
+                "email": user.email
+            },
+            request=request
+        )
+    
+    @staticmethod
+    async def log_logout(
+        db: AsyncSession,
+        user: User,
+        request: Request
+    ) -> AuditLog:
+        """
+        Registra un logout.
+        
+        Args:
+            db: Sesi├│n de base de datos
+            user: Usuario que cerr├│ sesi├│n
+            request: Request de FastAPI
+            
+        Returns:
+            AuditLog creado
+        """
+        return await AuditService.log(
+            db=db,
+            tenant_id=user.tenant_id,
+            user_id=user.id,
+            action="user.logout",
+            resource_type="user",
+            resource_id=user.id,
+            request=request
+        )
+    
+    @staticmethod
+    async def log_create(
+        db: AsyncSession,
+        tenant_id: uuid.UUID,
+        user_id: uuid.UUID,
+        resource_type: str,
+        resource_id: uuid.UUID,
+        new_values: Dict[str, Any],
+        request: Optional[Request] = None
+    ) -> AuditLog:
+        """
+        Registra la creaci├│n de un recurso.
+        
+        Args:
+            db: Sesi├│n de base de datos
+            tenant_id: ID del tenant
+            user_id: ID del usuario que cre├│ el recurso
+            resource_type: Tipo de recurso ("ticket", "user", etc.)
+            resource_id: ID del recurso creado
+            new_values: Valores del nuevo recurso
+            request: Request de FastAPI (opcional)
+            
+        Returns:
+            AuditLog creado
+        """
+        return await AuditService.log(
+            db=db,
+            tenant_id=tenant_id,
+            user_id=user_id,
+            action=f"{resource_type}.create",
+            resource_type=resource_type,
+            resource_id=resource_id,
+            new_values=new_values,
+            request=request
+        )
+    
+    @staticmethod
+    async def log_update(
+        db: AsyncSession,
+        tenant_id: uuid.UUID,
+        user_id: uuid.UUID,
+        resource_type: str,
+        resource_id: uuid.UUID,
+        old_values: Dict[str, Any],
+        new_values: Dict[str, Any],
+        request: Optional[Request] = None
+    ) -> AuditLog:
+        """
+        Registra la actualizaci├│n de un recurso.
+        
+        Args:
+            db: Sesi├│n de base de datos
+            tenant_id: ID del tenant
+            user_id: ID del usuario que actualiz├│
+            resource_type: Tipo de recurso
+            resource_id: ID del recurso
+            old_values: Valores anteriores
+            new_values: Valores nuevos
+            request: Request de FastAPI (opcional)
+            
+        Returns:
+            AuditLog creado
+        """
+        return await AuditService.log(
+            db=db,
+            tenant_id=tenant_id,
+            user_id=user_id,
+            action=f"{resource_type}.update",
+            resource_type=resource_type,
+            resource_id=resource_id,
+            old_values=old_values,
+            new_values=new_values,
+            request=request
+        )
+    
+    @staticmethod
+    async def log_delete(
+        db: AsyncSession,
+        tenant_id: uuid.UUID,
+        user_id: uuid.UUID,
+        resource_type: str,
+        resource_id: uuid.UUID,
+        old_values: Dict[str, Any],
+        request: Optional[Request] = None
+    ) -> AuditLog:
+        """
+        Registra la eliminaci├│n de un recurso.
+        
+        Args:
+            db: Sesi├│n de base de datos
+            tenant_id: ID del tenant
+            user_id: ID del usuario que elimin├│
+            resource_type: Tipo de recurso
+            resource_id: ID del recurso eliminado
+            old_values: Valores del recurso antes de eliminar
+            request: Request de FastAPI (opcional)
+            
+        Returns:
+            AuditLog creado
+        """
+        return await AuditService.log(
+            db=db,
+            tenant_id=tenant_id,
+            user_id=user_id,
+            action=f"{resource_type}.delete",
+            resource_type=resource_type,
+            resource_id=resource_id,
+            old_values=old_values,
+            request=request
+        )
+    
+    @staticmethod
+    def sanitize_values(values: Dict[str, Any]) -> Dict[str, Any]:
+        """
+        Sanitiza valores sensibles antes de guardarlos en audit log.
+        
+        Remueve campos como passwords, tokens, etc.
+        
+        Args:
+            values: Diccionario de valores
+            
+        Returns:
+            Diccionario sanitizado
+        """
+        sensitive_fields = {
+            'password',
+            'password_hash',
+            'totp_secret',
+            'backup_codes',
+            'token',
+            'access_token',
+            'refresh_token'
+        }
+        
+        return {
+            key: '***REDACTED***' if key in sensitive_fields else value
+            for key, value in values.items()
+        }

backend/app/services/token_service.py

@@ -0,0 +1,270 @@
+"""
+Token Service - ServiceManagerWeb
+
+Servicio para gesti├│n de refresh tokens persistentes.
+"""
+
+from sqlalchemy.ext.asyncio import AsyncSession
+from sqlalchemy import select, delete
+from datetime import datetime, timedelta
+from typing import Optional
+import uuid
+import structlog
+
+from app.models.refresh_token import RefreshToken
+from app.models.user import User
+from app.core.config import get_settings
+
+logger = structlog.get_logger(__name__)
+settings = get_settings()
+
+
+class TokenService:
+    """
+    Servicio para gesti├│n de refresh tokens.
+    
+    Proporciona m├®todos para crear, validar, revocar y limpiar
+    refresh tokens persistentes.
+    
+    NOTA: Los tokens se almacenan directamente en BD (no hash)
+    ya que los JWTs son firmados y verificables.
+    """
+    
+    @staticmethod
+    async def create_refresh_token(
+        db: AsyncSession,
+        user: User,
+        refresh_token: str,
+        device_id: Optional[str] = None,
+        device_name: Optional[str] = None,
+        user_agent: Optional[str] = None,
+        ip_address: Optional[str] = None
+    ) -> RefreshToken:
+        """
+        Crear y persistir un refresh token.
+        
+        Args:
+            db: Sesi├│n de base de datos
+            user: Usuario propietario del token
+            refresh_token: Token JWT generado (se almacena directamente)
+            device_id: ID ├║nico del dispositivo (UUID generado por cliente)
+            device_name: Nombre del dispositivo (ej: "Chrome en Windows")
+            user_agent: User agent completo del navegador
+            ip_address: IP del cliente
+            
+        Returns:
+            RefreshToken creado
+        """
+        # Calcular expiraci├│n
+        expires_at = datetime.utcnow() + timedelta(
+            days=settings.REFRESH_TOKEN_EXPIRE_DAYS
+        )
+        
+        # Crear registro - almacena JWT directamente (columna UNIQUE)
+        db_token = RefreshToken(
+            user_id=user.id,
+            token=refresh_token,  # JWT almacenado directamente
+            device_id=device_id,
+            device_name=device_name,
+            user_agent=user_agent,
+            ip_address=ip_address,
+            expires_at=expires_at,
+            revoked=False,
+            usage_count=0
+        )
+        
+        db.add(db_token)
+        await db.flush()
+        
+        logger.info(
+            "Refresh token created",
+            user_id=str(user.id),
+            token_id=str(db_token.id),
+            device_name=device_name,
+            expires_at=expires_at.isoformat()
+        )
+        
+        return db_token
+    
+    @staticmethod
+    async def verify_refresh_token(
+        db: AsyncSession,
+        refresh_token: str
+    ) -> Optional[RefreshToken]:
+        """
+        Verificar que el refresh token exista y sea válido.
+        
+        Busca el JWT directamente en la BD y verifica su estado.
+        
+        Args:
+            db: Sesi├│n de base de datos
+            refresh_token: Token JWT a verificar
+            
+        Returns:
+            RefreshToken si es válido, None si no existe o está revocado/expirado
+        """
+        # Buscar token directamente en BD (sin hash)
+        query = select(RefreshToken).where(
+            RefreshToken.token == refresh_token
+        )
+        result = await db.execute(query)
+        db_token = result.scalar_one_or_none()
+        
+        if not db_token:
+            logger.warning("Refresh token not found in database")
+            return None
+        
+        # Verificar si es válido (usa property is_valid del modelo)
+        if not db_token.is_valid:
+            logger.warning(
+                "Invalid refresh token",
+                token_id=str(db_token.id),
+                revoked=db_token.revoked,
+                expired=db_token.is_expired
+            )
+            return None
+        
+        # Actualizar estadísticas de uso
+        db_token.track_usage()
+        await db.flush()
+        
+        logger.info(
+            "Refresh token verified and usage tracked",
+            token_id=str(db_token.id),
+            usage_count=db_token.usage_count
+        )
+        return db_token
+    
+    @staticmethod
+    async def revoke_token(
+        db: AsyncSession,
+        refresh_token: str,
+        revoked_by_user_id: Optional[uuid.UUID] = None
+    ) -> bool:
+        """
+        Revocar un refresh token específico.
+        
+        Args:
+            db: Sesi├│n de base de datos
+            refresh_token: Token JWT a revocar
+            revoked_by_user_id: ID del usuario que revoca (para auditoría)
+            
+        Returns:
+            True si se revoc├│, False si no se encontr├│
+        """
+        # Buscar token directamente (sin hash)
+        query = select(RefreshToken).where(
+            RefreshToken.token == refresh_token
+        )
+        result = await db.execute(query)
+        db_token = result.scalar_one_or_none()
+        
+        if not db_token:
+            logger.warning("Refresh token not found for revocation")
+            return False
+        
+        # Revocar usando m├®todo del modelo
+        db_token.revoke(revoked_by=revoked_by_user_id)
+        await db.flush()
+        
+        logger.info(
+            "Refresh token revoked",
+            token_id=str(db_token.id),
+            revoked_by=str(revoked_by_user_id) if revoked_by_user_id else None
+        )
+        return True
+    
+    @staticmethod
+    async def revoke_all_user_tokens(
+        db: AsyncSession,
+        user_id: uuid.UUID,
+        revoked_by_user_id: Optional[uuid.UUID] = None
+    ) -> int:
+        """
+        Revocar todos los tokens activos de un usuario.
+        
+        Útil para logout en todos los dispositivos.
+        
+        Args:
+            db: Sesi├│n de base de datos
+            user_id: ID del usuario
+            revoked_by_user_id: ID del usuario que ejecuta la revocación (para auditoría)
+            
+        Returns:
+            N├║mero de tokens revocados
+        """
+        # Buscar todos los tokens activos del usuario
+        query = select(RefreshToken).where(
+            RefreshToken.user_id == user_id,
+            RefreshToken.revoked == False
+        )
+        result = await db.execute(query)
+        tokens = result.scalars().all()
+        
+        count = 0
+        for token in tokens:
+            token.revoke(revoked_by=revoked_by_user_id)
+            count += 1
+        
+        await db.flush()
+        
+        logger.info(
+            "All user tokens revoked",
+            user_id=str(user_id),
+            count=count,
+            revoked_by=str(revoked_by_user_id) if revoked_by_user_id else None
+        )
+        return count
+    
+    @staticmethod
+    async def cleanup_expired_tokens(
+        db: AsyncSession
+    ) -> int:
+        """
+        Eliminar tokens expirados de la base de datos.
+        
+        Tarea de mantenimiento para limpiar tokens antiguos.
+        
+        Args:
+            db: Sesi├│n de base de datos
+            
+        Returns:
+            N├║mero de tokens eliminados
+        """
+        # Eliminar tokens expirados hace más de 7 días
+        cutoff_date = datetime.utcnow() - timedelta(days=7)
+        
+        query = delete(RefreshToken).where(
+            RefreshToken.expires_at < cutoff_date
+        )
+        result = await db.execute(query)
+        await db.flush()
+        
+        deleted_count = result.rowcount
+        
+        logger.info("Expired tokens cleaned up", count=deleted_count)
+        return deleted_count
+    
+    @staticmethod
+    async def get_user_tokens(
+        db: AsyncSession,
+        user_id: uuid.UUID
+    ) -> list[RefreshToken]:
+        """
+        Obtener todos los tokens activos de un usuario.
+        
+        Args:
+            db: Sesi├│n de base de datos
+            user_id: ID del usuario
+            
+        Returns:
+            Lista de RefreshTokens activos
+        """
+        query = select(RefreshToken).where(
+            RefreshToken.user_id == user_id,
+            RefreshToken.revoked == False,
+            RefreshToken.expires_at > datetime.utcnow()
+        ).order_by(RefreshToken.created_at.desc())
+        
+        result = await db.execute(query)
+        return list(result.scalars().all())

backend/create_test_user.py

@@ -0,0 +1,67 @@
+"""
+Script para crear/actualizar usuario de prueba con contraseña conocida
+"""
+import asyncio
+from sqlalchemy import select, update
+from app.core.database import AsyncSessionLocal
+from app.core.security import security
+from app.models.user import User, UserRole
+from app.models.tenant import Tenant
+import uuid
+
+async def create_test_user():
+    async with AsyncSessionLocal() as db:
+        # Buscar tenant
+        tenant_query = select(Tenant).where(Tenant.slug.like('%aduanasoft%')).limit(1)
+        result = await db.execute(tenant_query)
+        tenant = result.scalar_one_or_none()
+        
+        if not tenant:
+            print("❌ No se encontró tenant")
+            return
+        
+        print(f"✅ Tenant encontrado: {tenant.name} ({tenant.slug})")
+        
+        # Buscar o crear usuario admin
+        user_query = select(User).where(
+            User.email == "admin@aduanasoft.com",
+            User.tenant_id == tenant.id
+        )
+        result = await db.execute(user_query)
+        user = result.scalar_one_or_none()
+        
+        # Hash de la contraseña "admin123"
+        password_hash = security.hash_password("admin123")
+        
+        if user:
+            # Actualizar contraseña
+            user.password_hash = password_hash
+            user.is_active = True
+            user.email_verified = True
+            await db.commit()
+            print(f"✅ Usuario actualizado: {user.email}")
+        else:
+            # Crear usuario nuevo
+            user = User(
+                id=uuid.uuid4(),
+                tenant_id=tenant.id,
+                email="admin@aduanasoft.com",
+                first_name="Admin",
+                last_name="Sistema",
+                password_hash=password_hash,
+                role=UserRole.ADMIN,
+                is_active=True,
+                email_verified=True
+            )
+            db.add(user)
+            await db.commit()
+            print(f"✅ Usuario creado: {user.email}")
+        
+        print(f"\n📋 Credenciales de prueba:")
+        print(f"   Email: admin@aduanasoft.com")
+        print(f"   Password: admin123")
+        print(f"   Tenant: {tenant.slug}")
+        print(f"   Role: ADMIN")
+
+if __name__ == "__main__":
+    asyncio.run(create_test_user())

backend/migrations/versions/a1b2c3d4e5f6_add_audit_logs_table.py

@@ -0,0 +1,81 @@
+"""add_audit_logs_table
+
+Revision ID: a1b2c3d4e5f6
+Revises: 13362e8c493a
+Create Date: 2026-02-12 10:00:00.000000
+
+Registra el modelo AuditLog en Alembic.
+La tabla audit_logs ya existe en schema.sql, esta migraci├│n solo
+la registra en el control de versiones de Alembic.
+"""
+from alembic import op
+import sqlalchemy as sa
+from sqlalchemy.dialects import postgresql
+
+# revision identifiers, used by Alembic.
+revision = 'a1b2c3d4e5f6'
+down_revision = '13362e8c493a'
+branch_labels = None
+depends_on = None
+
+
+def upgrade():
+    """
+    Verificar que audit_logs existe y registrarla en Alembic.
+    
+    La tabla fue creada por schema.sql, esta migraci├│n solo verifica
+    que exista y está disponible para usar.
+    """
+    from sqlalchemy import inspect
+    
+    bind = op.get_bind()
+    inspector = inspect(bind)
+    tables = inspector.get_table_names()
+    
+    if 'audit_logs' in tables:
+        print(" Tabla audit_logs encontrada (creada por schema.sql)")
+        print(" Modelo AuditLog registrado en Alembic")
+        
+        # Verificar que tenga los índices necesarios
+        existing_indexes = [idx['name'] for idx in inspector.get_indexes('audit_logs')]
+        missing_indexes = []
+        
+        required_indexes = [
+            'idx_audit_logs_tenant_id',
+            'idx_audit_logs_user_id',
+            'idx_audit_logs_action',
+            'idx_audit_logs_correlation_id',
+            'idx_audit_logs_created_at'
+        ]
+        
+        for idx in required_indexes:
+            if idx not in existing_indexes:
+                missing_indexes.append(idx)
+        
+        if missing_indexes:
+            print(f"ÔÜá´©Å  ├ìndices faltantes: {', '.join(missing_indexes)}")
+            print("   (Esto es normal si usaste schema.sql completo)")
+        else:
+            print("Ô£à Todos los ├¡ndices necesarios est├ín presentes")
+        
+    else:
+        print("ÔÜá´©Å  La tabla audit_logs NO existe")
+        print("   Ejecuta: docker-compose exec -T postgres psql -U postgres -d servicemanager < db/schema.sql")
+        print("   O crea la tabla manualmente desde schema.sql")
+        
+        # No crear la tabla aquí - debe venir de schema.sql para mantener consistencia
+        raise Exception(
+            "La tabla audit_logs no existe. "
+            "Por favor ejecuta el schema.sql completo primero."
+        )
+
+
+def downgrade():
+    """
+    No eliminar la tabla - fue creada por schema.sql.
+    
+    Solo des-registrar de Alembic.
+    """
+    print("Ôä╣´©Å  Tabla audit_logs NO ser├í eliminada (creada por schema.sql)")
+    print(" Modelo AuditLog des-registrado de Alembic")
+

backend/pyproject.toml

@@ -6,7 +6,7 @@ build-backend = "setuptools.build_meta"
 
 [project]
 name = "servicemanager-backend"
-version = "1.5.1"
+version = "1.6.0"
 description = "ServiceManagerWeb Backend - Mesa de Ayuda B2B"
 authors = [
     {name = "Aduanasoft", email = "dev@aduanasoft.com"}

db/schema.sql

@@ -369,10 +369,14 @@ CREATE TABLE audit_logs (
 CREATE INDEX idx_audit_logs_tenant_id ON audit_logs(tenant_id);
 CREATE INDEX idx_audit_logs_user_id ON audit_logs(user_id);
 CREATE INDEX idx_audit_logs_action ON audit_logs(action);
-CREATE INDEX idx_audit_logs_resource ON audit_logs(resource_type, resource_id);
 CREATE INDEX idx_audit_logs_correlation_id ON audit_logs(correlation_id);
 CREATE INDEX idx_audit_logs_created_at ON audit_logs(created_at);
 
+-- Índices compuestos para queries comunes de auditoría
+CREATE INDEX idx_audit_logs_tenant_action ON audit_logs(tenant_id, action);
+CREATE INDEX idx_audit_logs_resource ON audit_logs(resource_type, resource_id);
+CREATE INDEX idx_audit_logs_user_created ON audit_logs(user_id, created_at);
+
 -- ===================================
 -- FUNCIONES Y TRIGGERS
 -- ===================================

frontend-client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@servicemanager/client-frontend",
-  "version": "1.5.1",
+  "version": "1.6.0",
   "private": true,
   "type": "module",
   "scripts": {

frontend-internal/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@servicemanager/internal-frontend",
-  "version": "1.5.1",
+  "version": "1.6.0",
   "private": true,
   "type": "module",
   "scripts": {

frontend-internal/src/lib/components/Modal.svelte

@@ -1,8 +1,9 @@
 <script>
-  import { createEventDispatcher, onMount, onDestroy } from 'svelte';
+  import { createEventDispatcher } from 'svelte';
   
   export let open = false;
   export let title = '';
+  export let size = 'lg'; // sm, md, lg, xl, 2xl
   
   const dispatch = createEventDispatcher();
   
@@ -15,6 +16,20 @@
       close();
     }
   }
+  
+  function handleBackdropClick(e) {
+    if (e.target === e.currentTarget) {
+      close();
+    }
+  }
+  
+  const sizeClasses = {
+    sm: 'sm:max-w-sm',
+    md: 'sm:max-w-md',
+    lg: 'sm:max-w-lg',
+    xl: 'sm:max-w-xl',
+    '2xl': 'sm:max-w-2xl'
+  };
 </script>
 
 <svelte:window on:keydown={handleKeydown}/>
@@ -23,21 +38,45 @@
   <div class="fixed inset-0 z-50 overflow-y-auto" aria-labelledby="modal-title" role="dialog" aria-modal="true">
     <div class="flex items-end justify-center min-h-screen px-4 pt-4 pb-20 text-center sm:block sm:p-0">
       
-      <div class="fixed inset-0 transition-opacity bg-gray-500 bg-opacity-75" aria-hidden="true" on:click={close}></div>
+      <!-- Backdrop -->
+      <div 
+        class="fixed inset-0 transition-opacity bg-gray-500 bg-opacity-75" 
+        aria-hidden="true" 
+        on:click={handleBackdropClick}
+      ></div>
 
+      <!-- Center trick -->
       <span class="hidden sm:inline-block sm:align-middle sm:h-screen" aria-hidden="true">&#8203;</span>
 
-      <div class="inline-block px-4 pt-5 pb-4 overflow-hidden text-left align-bottom transition-all transform bg-white rounded-lg shadow-xl sm:my-8 sm:align-middle sm:max-w-lg sm:w-full sm:p-6">
-        <div class="sm:flex sm:items-start">
-          <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left w-full">
-            <h3 class="text-lg leading-6 font-medium text-gray-900" id="modal-title">
-              {title}
-            </h3>
-            <div class="mt-2 text-sm text-gray-500">
-              <slot />
-            </div>
-          </div>
+      <!-- Modal panel -->
+      <div class="inline-block w-full align-bottom bg-white rounded-lg shadow-xl transform transition-all sm:my-8 sm:align-middle {sizeClasses[size]} sm:w-full">
+        <!-- Header -->
+        <div class="px-6 py-4 border-b border-gray-200 flex items-center justify-between">
+          <h3 class="text-lg font-semibold text-gray-900" id="modal-title">
+            {title}
+          </h3>
+          <button 
+            type="button"
+            on:click={close}
+            class="text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-primary-500 rounded-lg p-1"
+          >
+            <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+        
+        <!-- Body -->
+        <div class="px-6 py-4 max-h-[70vh] overflow-y-auto">
+          <slot />
+        </div>
+        
+        <!-- Footer (optional) -->
+        {#if $$slots.footer}
+          <div class="px-6 py-4 bg-gray-50 border-t border-gray-200 rounded-b-lg">
+            <slot name="footer" />
+          </div>
+        {/if}
       </div>
     </div>
   </div>

frontend-internal/src/routes/audit/+page.svelte

@@ -0,0 +1,979 @@
+<script lang="ts">
+  import { onMount } from 'svelte';
+  import { api } from '$lib/utils/api';
+  import { toast } from '$lib/stores/toast';
+  import { auth } from '$lib/stores/auth';
+  import Modal from '$lib/components/Modal.svelte';
+
+  // Estado de carga y datos
+  let logs = [];
+  let stats = null;
+  let users = [];
+  let isLoading = false;
+  let selectedLog = null;
+  let showDetailModal = false;
+
+  // Paginación
+  let currentPage = 1;
+  let totalPages = 1;
+  let totalLogs = 0;
+  const perPage = 20;
+
+  // Filtros básicos
+  let filterUserId = '';
+  let filterAction = '';
+  let filterResourceType = '';
+  let searchText = '';
+  
+  // Filtro multi-tenant (solo para ADMIN/SUPPORT_MANAGER)
+  let allTenants = false;
+  
+  // Filtro de período
+  let periodFilter: 'today' | 'yesterday' | 'last7days' | 'last30days' | 'custom' = 'today';
+  let customDateFrom = '';
+  let customDateTo = '';
+  
+  // Control de visibilidad de filtros avanzados
+  let showAdvancedFilters = false;
+
+  // Usuario actual
+  $: currentUser = $auth.user;
+  $: canSeeAllTenants = currentUser && (currentUser.role === 'ADMIN' || currentUser.role === 'SUPPORT_MANAGER');
+
+  // Contador de filtros activos (excluyendo el período que es por defecto)
+  $: activeFiltersCount = [filterUserId, filterAction, filterResourceType, searchText].filter(f => f && f.trim()).length;
+
+  // Tipos de acciones y recursos (extraídos de los logs)
+  let availableActions = new Set<string>();
+  let availableResourceTypes = new Set<string>();
+
+  /**
+   * Obtener fechas según el período seleccionado
+   */
+  function getDateRangeForPeriod(): { from: string; to: string } {
+    // Trabajar en UTC para evitar problemas de zona horaria
+    const now = new Date();
+    
+    let from: Date;
+    let to: Date;
+    
+    switch (periodFilter) {
+      case 'today':
+        // Hoy desde las 00:00:00 hasta ahora en UTC
+        from = new Date(Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate(), 0, 0, 0));
+        to = new Date(); // Ahora en UTC
+        break;
+      case 'yesterday':
+        // Ayer completo en UTC
+        from = new Date(Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate() - 1, 0, 0, 0));
+        to = new Date(Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate(), 0, 0, 0));
+        break;
+      case 'last7days':
+        // Últimos 7 días en UTC
+        from = new Date(Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate() - 7, 0, 0, 0));
+        to = new Date();
+        break;
+      case 'last30days':
+        // Últimos 30 días en UTC
+        from = new Date(Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate() - 30, 0, 0, 0));
+        to = new Date();
+        break;
+      case 'custom':
+        // Para fechas custom, parsear como UTC
+        if (!customDateFrom || !customDateTo) {
+          return { from: '', to: '' };
+        }
+        const fromParts = customDateFrom.split('-').map(Number);
+        const toParts = customDateTo.split('-').map(Number);
+        from = new Date(Date.UTC(fromParts[0], fromParts[1] - 1, fromParts[2], 0, 0, 0));
+        to = new Date(Date.UTC(toParts[0], toParts[1] - 1, toParts[2], 23, 59, 59));
+        return {
+          from: from.toISOString(),
+          to: to.toISOString()
+        };
+      default:
+        from = new Date(Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), now.getUTCDate(), 0, 0, 0));
+        to = new Date();
+    }
+    
+    return {
+      from: from.toISOString(),
+      to: to.toISOString()
+    };
+  }
+
+  /**
+   * Cambiar período y actualizar datos
+   */
+  function changePeriod(period: typeof periodFilter) {
+    periodFilter = period;
+    currentPage = 1;
+    loadLogs();
+  }
+
+  /**
+   * Cargar estadísticas de auditoría
+   */
+  async function loadStats() {
+    try {
+      const params: any = {};
+      if (allTenants && canSeeAllTenants) {
+        params.all_tenants = true;
+      }
+      stats = await api.get('/audit/stats', params);
+    } catch (e) {
+      console.error('Error cargando estadísticas:', e);
+    }
+  }
+
+  /**
+   * Cargar logs de auditoría con filtros
+   */
+  async function loadLogs() {
+    isLoading = true;
+    try {
+      const params: any = {
+        page: currentPage,
+        per_page: perPage
+      };
+
+      // Aplicar rango de fechas según período
+      const dateRange = getDateRangeForPeriod();
+      if (dateRange.from) params.date_from = dateRange.from;
+      if (dateRange.to) params.date_to = dateRange.to;
+
+      // Aplicar filtros adicionales
+      if (filterUserId) params.user_id = filterUserId;
+      if (filterAction) params.action = filterAction;
+      if (filterResourceType) params.resource_type = filterResourceType;
+      if (searchText) params.search = searchText;
+      
+      // Aplicar filtro multi-tenant si el usuario tiene permiso
+      if (allTenants && canSeeAllTenants) {
+        params.all_tenants = true;
+      }
+
+      const response = await api.get('/audit/', params);
+      
+      logs = response.logs;
+      totalLogs = response.total;
+      totalPages = response.total_pages;
+      currentPage = response.page;
+
+      // Extraer acciones y tipos de recursos únicos para los selectores
+      logs.forEach((log: any) => {
+        availableActions.add(log.action);
+        availableResourceTypes.add(log.resource_type);
+      });
+
+      // Convertir Sets a Arrays para bind:value
+      availableActions = new Set(availableActions);
+      availableResourceTypes = new Set(availableResourceTypes);
+    } catch (e) {
+      toast.error('Error cargando logs: ' + (e.message || 'Error desconocido'));
+    } finally {
+      isLoading = false;
+    }
+  }
+
+  /**
+   * Cargar usuarios para el filtro
+   */
+  async function loadUsers() {
+    try {
+      users = await api.get('/users/');
+    } catch (e) {
+      console.error('Error cargando usuarios:', e);
+      users = [];
+    }
+  }
+
+  /**
+   * Aplicar filtros y recargar desde página 1
+   */
+  function applyFilters() {
+    currentPage = 1;
+    loadLogs();
+  }
+
+  /**
+   * Limpiar todos los filtros (excepto el período)
+   */
+  function clearFilters() {
+    filterUserId = '';
+    filterAction = '';
+    filterResourceType = '';
+    searchText = '';
+    currentPage = 1;
+    loadLogs();
+  }
+
+  /**
+   * Filtrar por acciones críticas (vulnerabilidad)
+   */
+  function filterCriticalActions() {
+    // Limpiar otros filtros
+    filterUserId = '';
+    filterResourceType = '';
+    
+    // Buscar acciones críticas: delete, update sensibles, etc.
+    searchText = 'delete';
+    
+    // Cambiar a hoy para ver las del día
+    periodFilter = 'today';
+    
+    // Expandir filtros avanzados para que el usuario vea lo aplicado
+    showAdvancedFilters = true;
+    
+    currentPage = 1;
+    loadLogs();
+  }
+
+  /**
+   * Cambiar página
+   */
+  function goToPage(page: number) {
+    if (page >= 1 && page <= totalPages) {
+      currentPage = page;
+      loadLogs();
+    }
+  }
+
+  /**
+   * Ver detalle de un log
+   */
+  function viewDetail(log: any) {
+    selectedLog = log;
+    showDetailModal = true;
+  }
+
+  /**
+   * Formatear fecha de manera amigable
+   */
+  function formatDate(dateString: string): string {
+    const date = new Date(dateString);
+    return date.toLocaleString('es-MX', {
+      year: 'numeric',
+      month: 'short',
+      day: 'numeric',
+      hour: '2-digit',
+      minute: '2-digit'
+    });
+  }
+
+  /**
+   * Formatear fecha corta (solo hora para hoy)
+   */
+  function formatDateShort(dateString: string): string {
+    const date = new Date(dateString);
+    const today = new Date();
+    const isToday = date.toDateString() === today.toDateString();
+    
+    if (isToday) {
+      return date.toLocaleTimeString('es-MX', {
+        hour: '2-digit',
+        minute: '2-digit'
+      });
+    }
+    
+    return date.toLocaleDateString('es-MX', {
+      month: 'short',
+      day: 'numeric',
+      hour: '2-digit',
+      minute: '2-digit'
+    });
+  }
+
+  /**
+   * Obtener color de badge según tipo de acción
+   */
+  function getActionColor(action: string): string {
+    if (action.includes('login')) return 'bg-green-100 text-green-800';
+    if (action.includes('logout')) return 'bg-gray-100 text-gray-800';
+    if (action.includes('create')) return 'bg-blue-100 text-blue-800';
+    if (action.includes('update')) return 'bg-yellow-100 text-yellow-800';
+    if (action.includes('delete')) return 'bg-red-100 text-red-800';
+    if (action.includes('assign')) return 'bg-purple-100 text-purple-800';
+    return 'bg-gray-100 text-gray-800';
+  }
+
+  /**
+   * Formatear acción de forma legible
+   */
+  function formatActionText(action: string): string {
+    const parts = action.split('.');
+    if (parts.length !== 2) return action;
+
+    const [resource, verb] = parts;
+    
+    const verbMap: Record<string, string> = {
+      'login': 'Inicio de sesión',
+      'logout': 'Cierre de sesión',
+      'create': 'Creó',
+      'update': 'Actualizó',
+      'delete': 'Eliminó',
+      'assign': 'Asignó',
+      'close': 'Cerró',
+      'reopen': 'Reabrió'
+    };
+
+    const verbText = verbMap[verb] || verb;
+    return `${verbText} ${resource}`;
+  }
+
+  /**
+   * Obtener texto del rol
+   */
+  function getRoleText(role: string): string {
+    const roleMap: Record<string, string> = {
+      'ADMIN': 'Administrador',
+      'SUPPORT_MANAGER': 'Gerente',
+      'AGENT': 'Agente',
+      'AUDITOR': 'Auditor',
+      'CLIENT_ADMIN': 'Admin Cliente',
+      'CLIENT_USER': 'Usuario'
+    };
+    return roleMap[role] || role;
+  }
+
+  /**
+   * Inicializar datos
+   */
+  onMount(() => {
+    loadStats();
+    loadUsers();
+    loadLogs();
+  });
+</script>
+
+<div class="px-4 sm:px-6 lg:px-8 py-8">
+  <!-- Header -->
+  <div class="sm:flex sm:items-center sm:justify-between mb-6">
+    <div>
+      <h1 class="text-2xl font-semibold text-gray-900">Auditoría del Sistema</h1>
+      <p class="mt-1 text-sm text-gray-600">
+        Registro de actividades • 
+        <span class="font-medium text-primary-600">
+          {periodFilter === 'today' ? 'Hoy' :
+           periodFilter === 'yesterday' ? 'Ayer' :
+           periodFilter === 'last7days' ? 'Últimos 7 días' :
+           periodFilter === 'last30days' ? 'Últimos 30 días' :
+           'Período personalizado'}
+        </span>
+      </p>
+    </div>
+  </div>
+
+  <!-- Selector de Período -->
+  <div class="bg-white shadow rounded-lg p-4 mb-6">
+    <div class="flex flex-wrap gap-2">
+      <button
+        on:click={() => changePeriod('today')}
+        class="px-4 py-2 rounded-lg text-sm font-medium transition-colors {periodFilter === 'today' ? 'bg-primary-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'}"
+      >
+        Hoy
+      </button>
+      <button
+        on:click={() => changePeriod('yesterday')}
+        class="px-4 py-2 rounded-lg text-sm font-medium transition-colors {periodFilter === 'yesterday' ? 'bg-primary-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'}"
+      >
+        Ayer
+      </button>
+      <button
+        on:click={() => changePeriod('last7days')}
+        class="px-4 py-2 rounded-lg text-sm font-medium transition-colors {periodFilter === 'last7days' ? 'bg-primary-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'}"
+      >
+        Últimos 7 días
+      </button>
+      <button
+        on:click={() => changePeriod('last30days')}
+        class="px-4 py-2 rounded-lg text-sm font-medium transition-colors {periodFilter === 'last30days' ? 'bg-primary-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'}"
+      >
+        Últimos 30 días
+      </button>
+      <button
+        on:click={() => changePeriod('custom')}
+        class="px-4 py-2 rounded-lg text-sm font-medium transition-colors {periodFilter === 'custom' ? 'bg-primary-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'}"
+      >
+        <svg class="w-4 h-4 inline-block mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" />
+        </svg>
+        Personalizado
+      </button>
+    </div>
+
+    <!-- Rango de fechas personalizado -->
+    {#if periodFilter === 'custom'}
+      <div class="mt-4 grid grid-cols-1 md:grid-cols-2 gap-4 pt-4 border-t">
+        <div>
+          <label for="custom-date-from" class="block text-sm font-medium text-gray-700 mb-1">Desde</label>
+          <input
+            type="date"
+            id="custom-date-from"
+            bind:value={customDateFrom}
+            on:change={applyFilters}
+            class="block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring-primary-500 sm:text-sm"
+          />
+        </div>
+        <div>
+          <label for="custom-date-to" class="block text-sm font-medium text-gray-700 mb-1">Hasta</label>
+          <input
+            type="date"
+            id="custom-date-to"
+            bind:value={customDateTo}
+            on:change={applyFilters}
+            class="block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring-primary-500 sm:text-sm"
+          />
+        </div>
+      </div>
+    {/if}
+  </div>
+
+  <!-- Filtro Multi-Tenant (solo para ADMIN/SUPPORT_MANAGER) -->
+  {#if canSeeAllTenants}
+    <div class="bg-white shadow rounded-lg p-4 mb-6">
+      <div class="flex items-center justify-between">
+        <div class="flex items-center">
+          <label for="all-tenants-toggle" class="flex items-center cursor-pointer">
+            <input
+              type="checkbox"
+              id="all-tenants-toggle"
+              bind:checked={allTenants}
+              on:change={() => { 
+                currentPage = 1;
+                loadLogs(); 
+                loadStats();
+              }}
+              class="rounded border-gray-300 text-primary-600 shadow-sm focus:border-primary-500 focus:ring-primary-500 h-4 w-4 mr-3"
+            />
+            <div>
+              <span class="text-sm font-medium text-gray-900">Ver todos los clientes</span>
+              <p class="text-xs text-gray-500">Mostrar registros de auditoría de todas las organizaciones</p>
+            </div>
+         </label>
+        </div>
+        {#if allTenants}
+          <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-purple-100 text-purple-800">
+            <svg class="w-3 h-3 mr-1" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M10 2a8 8 0 100 16 8 8 0 000-16zM9 9a1 1 0 012 0v4a1 1 0 11-2 0V9zm1-5a1 1 0 100 2 1 1 0 000-2z" />
+            </svg>
+            Multi-tenant activo
+          </span>
+        {/if}
+      </div>
+    </div>
+  {/if}
+
+  <!-- Estadísticas Rápidas -->
+  {#if stats}
+    <div class="grid grid-cols-2 md:grid-cols-4 gap-4 mb-6">
+      <div class="bg-white rounded-lg shadow p-4">
+        <div class="text-sm text-gray-500">Total</div>
+        <div class="text-2xl font-bold text-gray-900">{stats.total_actions.toLocaleString()}</div>
+      </div>
+      <div class="bg-white rounded-lg shadow p-4">
+        <div class="text-sm text-gray-500">Hoy</div>
+        <div class="text-2xl font-bold text-primary-600">{stats.actions_today}</div>
+      </div>
+      <div class="bg-white rounded-lg shadow p-4">
+        <div class="text-sm text-gray-500">Esta Semana</div>
+        <div class="text-2xl font-bold text-green-600">{stats.actions_this_week}</div>
+      </div>
+      <div class="bg-white rounded-lg shadow p-4 hover:shadow-md transition-shadow">
+        <div class="flex items-center gap-2 mb-1">
+          <svg class="w-4 h-4 text-amber-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
+          </svg>
+          <div class="text-sm text-gray-500">Vulnerabilidad</div>
+        </div>
+        <div class="flex items-center justify-between">
+          <div class="text-2xl font-bold {stats.critical_actions_today > 10 ? 'text-red-600' : stats.critical_actions_today > 5 ? 'text-amber-600' : 'text-green-600'}">
+            {stats.critical_actions_today}
+          </div>
+          <button 
+            type="button"
+            class="text-xs text-primary-600 hover:text-primary-700 font-medium flex items-center gap-1 px-2 py-1 rounded hover:bg-primary-50 transition-colors"
+            on:click={() => filterCriticalActions()}
+            title="Filtrar acciones críticas"
+          >
+            Ver
+            <svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
+            </svg>
+          </button>
+        </div>
+        <div class="text-xs text-gray-500 mt-1">Acciones críticas hoy</div>
+      </div>
+    </div>
+  {/if}
+
+  <!-- Filtros Avanzados (Colapsables) -->
+  <div class="bg-white shadow rounded-lg mb-6">
+    <button
+      on:click={() => showAdvancedFilters = !showAdvancedFilters}
+      class="w-full px-4 py-3 flex items-center justify-between text-left hover:bg-gray-50 rounded-lg transition-colors"
+    >
+      <div class="flex items-center gap-2">
+        <svg class="w-5 h-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 4a1 1 0 011-1h16a1 1 0 011 1v2.586a1 1 0 01-.293.707l-6.414 6.414a1 1 0 00-.293.707V17l-4 4v-6.586a1 1 0 00-.293-.707L3.293 7.293A1 1 0 013 6.586V4z" />
+        </svg>
+        <span class="text-sm font-medium text-gray-900">Filtros Avanzados</span>
+        {#if activeFiltersCount > 0}
+          <span class="px-2 py-0.5 rounded-full bg-primary-100 text-primary-700 text-xs font-medium">
+            {activeFiltersCount}
+          </span>
+        {/if}
+      </div>
+      <svg class="w-5 h-5 text-gray-400 transition-transform {showAdvancedFilters ? 'rotate-180' : ''}" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
+      </svg>
+    </button>
+
+    {#if showAdvancedFilters}
+      <div class="px-4 pb-4 border-t">
+        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 mt-4">
+          <!-- Búsqueda de texto -->
+          <div>
+            <label for="search" class="block text-sm font-medium text-gray-700 mb-1">Buscar</label>
+            <input
+              type="text"
+              id="search"
+              bind:value={searchText}
+              on:input={applyFilters}
+              placeholder="Buscar en acciones..."
+              class="block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring-primary-500 sm:text-sm"
+            />
+          </div>
+
+          <!-- Filtro por usuario -->
+          <div>
+            <label for="user" class="block text-sm font-medium text-gray-700 mb-1">Usuario</label>
+            <select
+              id="user"
+              bind:value={filterUserId}
+              on:change={applyFilters}
+              class="block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring-primary-500 sm:text-sm"
+            >
+              <option value="">Todos</option>
+              {#each users as user}
+                <option value={user.id}>{user.first_name} {user.last_name}</option>
+              {/each}
+            </select>
+          </div>
+
+          <!-- Filtro por acción -->
+          <div>
+            <label for="action" class="block text-sm font-medium text-gray-700 mb-1">Acción</label>
+            <select
+              id="action"
+              bind:value={filterAction}
+              on:change={applyFilters}
+              class="block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring-primary-500 sm:text-sm"
+            >
+              <option value="">Todas</option>
+              {#each Array.from(availableActions).sort() as action}
+                <option value={action}>{formatActionText(action)}</option>
+              {/each}
+            </select>
+          </div>
+
+          <!-- Filtro por tipo de recurso -->
+          <div>
+            <label for="resource-type" class="block text-sm font-medium text-gray-700 mb-1">Tipo de Recurso</label>
+            <select
+              id="resource-type"
+              bind:value={filterResourceType}
+              on:change={applyFilters}
+              class="block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring-primary-500 sm:text-sm"
+            >
+              <option value="">Todos</option>
+              {#each Array.from(availableResourceTypes).sort() as resourceType}
+                <option value={resourceType}>{resourceType}</option>
+              {/each}
+            </select>
+          </div>
+        </div>
+
+        {#if activeFiltersCount > 0}
+          <div class="mt-4 flex justify-end">
+            <button
+              on:click={clearFilters}
+              class="text-sm text-primary-600 hover:text-primary-700 font-medium"
+            >
+              Limpiar filtros
+            </button>
+          </div>
+        {/if}
+      </div>
+    {/if}
+  </div>
+
+  <!-- Tabla de Logs -->
+  <div class="bg-white shadow rounded-lg overflow-hidden flex flex-col" style="max-height: calc(100vh - 500px); min-height: 400px;">
+    <div class="px-4 py-3 border-b border-gray-200 bg-gray-50 flex-shrink-0">
+      <div class="flex items-center justify-between">
+        <h3 class="text-sm font-medium text-gray-900">
+          Registros de Auditoría
+        </h3>
+        <span class="text-sm text-gray-500">{totalLogs} registros</span>
+      </div>
+    </div>
+
+    {#if isLoading}
+      <div class="flex items-center justify-center flex-1">
+        <div class="text-center">
+          <div class="animate-spin rounded-full h-12 w-12 border-b-2 border-primary-600 mx-auto"></div>
+          <p class="mt-2 text-sm text-gray-500">Cargando registros...</p>
+        </div>
+      </div>
+    {:else if logs.length === 0}
+      <div class="flex items-center justify-center flex-1">
+        <div class="text-center py-12">
+          <svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4" />
+          </svg>
+          <h3 class="mt-2 text-sm font-medium text-gray-900">No hay registros</h3>
+          <p class="mt-1 text-sm text-gray-500">
+            {periodFilter === 'today' ? 'No hay actividad registrada hoy.' : 'No se encontraron registros para el período seleccionado.'}
+          </p>
+        </div>
+      </div>
+    {:else}
+      <!-- Contenedor con scroll -->
+      <div class="overflow-y-auto flex-1">
+        <!-- Vista Desktop (Tabla) -->
+        <div class="hidden lg:block">
+          <table class="min-w-full divide-y divide-gray-200">
+            <thead class="bg-gray-50 sticky top-0 z-10">
+              <tr>
+                <th scope="col" class="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider w-24">
+                  Hora
+                </th>
+                <th scope="col" class="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                  Usuario
+                </th>
+                <th scope="col" class="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                  Acción
+                </th>
+                <th scope="col" class="px-3 py-2 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                  Recurso
+                </th>
+                <th scope="col" class="relative px-3 py-2 w-20">
+                  <span class="sr-only">Acciones</span>
+                </th>
+              </tr>
+            </thead>
+            <tbody class="bg-white divide-y divide-gray-200">
+              {#each logs as log (log.id)}
+                <tr class="hover:bg-gray-50 transition-colors">
+                  <td class="px-3 py-2 whitespace-nowrap text-sm text-gray-900">
+                    {formatDateShort(log.created_at)}
+                  </td>
+                  <td class="px-3 py-2 text-sm">
+                    {#if log.user_email}
+                      <div class="flex items-center gap-2">
+                        <div class="flex-shrink-0 w-8 h-8 bg-primary-100 rounded-full flex items-center justify-center">
+                          <span class="text-xs font-medium text-primary-700">
+                            {(log.user_name || '?').charAt(0).toUpperCase()}
+                          </span>
+                        </div>
+                        <div class="min-w-0 flex-1">
+                          <div class="font-medium text-gray-900 truncate">{log.user_name || 'N/A'}</div>
+                          <div class="text-xs text-gray-500">{getRoleText(log.user_role)}</div>
+                        </div>
+                      </div>
+                    {:else}
+                      <span class="text-gray-500 italic text-sm">Sistema</span>
+                    {/if}
+                  </td>
+                  <td class="px-3 py-2 whitespace-nowrap">
+                    <span class="px-2 py-1 text-xs font-medium rounded-full {getActionColor(log.action)}">
+                      {formatActionText(log.action)}
+                    </span>
+                  </td>
+                  <td class="px-3 py-2 text-sm">
+                    <div class="font-medium text-gray-900">{log.resource_type}</div>
+                    {#if log.ip_address}
+                      <div class="text-xs text-gray-500">{log.ip_address}</div>
+                    {/if}
+                  </td>
+                  <td class="px-3 py-2 whitespace-nowrap text-right text-sm">
+                    <button
+                      type="button"
+                      on:click={() => viewDetail(log)}
+                      class="text-primary-600 hover:text-primary-900 font-medium transition-colors"
+                    >
+                      Ver
+                    </button>
+                  </td>
+                </tr>
+              {/each}
+            </tbody>
+          </table>
+        </div>
+
+        <!-- Vista Mobile/Tablet (Tarjetas) -->
+        <div class="lg:hidden divide-y divide-gray-200">
+          {#each logs as log (log.id)}
+            <div 
+              class="p-4 hover:bg-gray-50 transition-colors"
+            >
+              <div class="flex items-start justify-between gap-3">
+                <div class="flex items-start gap-3 flex-1 min-w-0">
+                  <!-- Avatar -->
+                  {#if log.user_email}
+                    <div class="flex-shrink-0 w-10 h-10 bg-primary-100 rounded-full flex items-center justify-center">
+                      <span class="text-sm font-medium text-primary-700">
+                        {(log.user_name || '?').charAt(0).toUpperCase()}
+                      </span>
+                    </div>
+                  {:else}
+                    <div class="flex-shrink-0 w-10 h-10 bg-gray-100 rounded-full flex items-center justify-center">
+                      <svg class="w-5 h-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 002-2V7a2 2 0 00-2-2H7a2 2 0 00-2 2v10a2 2 0 002 2zM9 9h6v6H9V9z" />
+                      </svg>
+                    </div>
+                  {/if}
+                  
+                  <!-- Contenido -->
+                  <div class="flex-1 min-w-0">
+                    <div class="flex items-center gap-2 mb-1">
+                      <span class="text-xs text-gray-500">{formatDateShort(log.created_at)}</span>
+                      <span class="px-2 py-0.5 text-xs font-medium rounded-full {getActionColor(log.action)}">
+                        {formatActionText(log.action)}
+                      </span>
+                    </div>
+                    <div class="font-medium text-gray-900 text-sm mb-1">
+                      {log.user_name || 'Sistema'}
+                      <span class="text-xs text-gray-500 font-normal ml-1">• {getRoleText(log.user_role)}</span>
+                    </div>
+                    <div class="text-sm text-gray-600">
+                      {log.resource_type}
+                      {#if log.ip_address}
+                        <span class="text-xs text-gray-400 ml-1">• {log.ip_address}</span>
+                      {/if}
+                    </div>
+                  </div>
+                </div>
+                
+                <!-- Botón Ver -->
+                <button
+                  type="button"
+                  on:click={() => viewDetail(log)}
+                  class="flex-shrink-0 text-primary-600 hover:text-primary-900 transition-colors p-1"
+                  title="Ver detalles"
+                >
+                  <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
+                  </svg>
+                </button>
+              </div>
+            </div>
+          {/each}
+        </div>
+      </div>
+
+      <!-- Paginación (Sticky al fondo) -->
+      {#if totalPages > 1}
+        <div class="bg-white border-t border-gray-200 px-4 py-2 flex-shrink-0 sticky bottom-0">
+          <!-- Mobile -->
+          <div class="flex items-center justify-between sm:hidden">
+            <button
+              on:click={() => goToPage(currentPage - 1)}
+              disabled={currentPage === 1}
+              class="relative inline-flex items-center px-3 py-1.5 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed"
+            >
+              Anterior
+            </button>
+            <span class="text-sm text-gray-700">
+              Página <span class="font-medium">{currentPage}</span> de <span class="font-medium">{totalPages}</span>
+            </span>
+            <button
+              on:click={() => goToPage(currentPage + 1)}
+              disabled={currentPage === totalPages}
+              class="relative inline-flex items-center px-3 py-1.5 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed"
+            >
+              Siguiente
+            </button>
+          </div>
+          
+          <!-- Desktop -->
+          <div class="hidden sm:flex sm:items-center sm:justify-between">
+            <div class="text-sm text-gray-700">
+              <span class="font-medium">{(currentPage - 1) * perPage + 1}</span>
+              -
+              <span class="font-medium">{Math.min(currentPage * perPage, totalLogs)}</span>
+              de
+              <span class="font-medium">{totalLogs}</span>
+            </div>
+            <div>
+              <nav class="relative z-0 inline-flex rounded-md shadow-sm -space-x-px" aria-label="Pagination">
+                <!-- Botón Primera página -->
+                {#if currentPage > 3}
+                  <button
+                    on:click={() => goToPage(1)}
+                    class="relative inline-flex items-center px-2 py-1.5 rounded-l-md border border-gray-300 bg-white text-xs font-medium text-gray-500 hover:bg-gray-50"
+                  >
+                    <svg class="h-4 w-4" fill="currentColor" viewBox="0 0 20 20">
+                      <path fill-rule="evenodd" d="M15.707 15.707a1 1 0 01-1.414 0l-5-5a1 1 0 010-1.414l5-5a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 010 1.414zm-6 0a1 1 0 01-1.414 0l-5-5a1 1 0 010-1.414l5-5a1 1 0 011.414 1.414L5.414 10l4.293 4.293a1 1 0 010 1.414z" clip-rule="evenodd" />
+                    </svg>
+                  </button>
+                {/if}
+                
+                <!-- Botón Anterior -->
+                <button
+                  on:click={() => goToPage(currentPage - 1)}
+                  disabled={currentPage === 1}
+                  class="relative inline-flex items-center px-2 py-1.5 {currentPage <= 3 ? 'rounded-l-md' : ''} border border-gray-300 bg-white text-xs font-medium text-gray-500 hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed"
+                >
+                  <svg class="h-4 w-4" fill="currentColor" viewBox="0 0 20 20">
+                    <path fill-rule="evenodd" d="M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z" clip-rule="evenodd" />
+                  </svg>
+                </button>
+                
+                <!-- Números de página -->
+                {#each Array.from({length: Math.min(5, totalPages)}, (_, i) => i + Math.max(1, Math.min(currentPage - 2, totalPages - 4))) as page}
+                  <button
+                    on:click={() => goToPage(page)}
+                    class="relative inline-flex items-center px-3 py-1.5 border text-xs font-medium transition-colors {page === currentPage ? 'z-10 bg-primary-600 border-primary-600 text-white' : 'bg-white border-gray-300 text-gray-700 hover:bg-gray-50'}"
+                  >
+                    {page}
+                  </button>
+                {/each}
+
+                <!-- Botón Siguiente -->
+                <button
+                  on:click={() => goToPage(currentPage + 1)}
+                  disabled={currentPage === totalPages}
+                  class="relative inline-flex items-center px-2 py-1.5 {currentPage >= totalPages - 2 ? 'rounded-r-md' : ''} border border-gray-300 bg-white text-xs font-medium text-gray-500 hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed"
+                >
+                  <svg class="h-4 w-4" fill="currentColor" viewBox="0 0 20 20">
+                    <path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd" />
+                  </svg>
+                </button>
+                
+                <!-- Botón Última página -->
+                {#if currentPage < totalPages - 2}
+                  <button
+                    on:click={() => goToPage(totalPages)}
+                    class="relative inline-flex items-center px-2 py-1.5 rounded-r-md border border-gray-300 bg-white text-xs font-medium text-gray-500 hover:bg-gray-50"
+                  >
+                    <svg class="h-4 w-4" fill="currentColor" viewBox="0 0 20 20">
+                      <path fill-rule="evenodd" d="M10.293 15.707a1 1 0 010-1.414L14.586 10l-4.293-4.293a1 1 0 111.414-1.414l5 5a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0z" clip-rule="evenodd" />
+                      <path fill-rule="evenodd" d="M4.293 15.707a1 1 0 010-1.414L8.586 10 4.293 5.707a1 1 0 011.414-1.414l5 5a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0z" clip-rule="evenodd" />
+                    </svg>
+                  </button>
+                {/if}
+              </nav>
+            </div>
+          </div>
+        </div>
+      {/if}
+    {/if}
+  </div>
+</div>
+
+<!-- Modal de Detalle -->
+{#if showDetailModal && selectedLog}
+  <Modal open={showDetailModal} size="2xl" title="Detalle del Registro de Auditoría" on:close={() => showDetailModal = false}>
+    <div class="space-y-4">
+      <!-- Información General -->
+      <div>
+        <h4 class="text-sm font-medium text-gray-900 mb-2">Información General</h4>
+        <dl class="grid grid-cols-2 gap-3 text-sm">
+          <div>
+            <dt class="font-medium text-gray-500">Fecha y Hora:</dt>
+            <dd class="text-gray-900">{formatDate(selectedLog.created_at)}</dd>
+          </div>
+          <div>
+            <dt class="font-medium text-gray-500">Usuario:</dt>
+            <dd class="text-gray-900">{selectedLog.user_name || 'Sistema'}</dd>
+          </div>
+          <div>
+            <dt class="font-medium text-gray-500">Email:</dt>
+            <dd class="text-gray-900">{selectedLog.user_email || 'N/A'}</dd>
+          </div>
+          {#if selectedLog.user_role}
+            <div>
+              <dt class="font-medium text-gray-500">Rol:</dt>
+              <dd class="text-gray-900">{getRoleText(selectedLog.user_role)}</dd>
+            </div>
+          {/if}
+          <div>
+            <dt class="font-medium text-gray-500">IP:</dt>
+            <dd class="text-gray-900 font-mono text-xs">{selectedLog.ip_address || 'N/A'}</dd>
+          </div>
+          <div>
+            <dt class="font-medium text-gray-500">Correlation ID:</dt>
+            <dd class="text-gray-900 font-mono text-xs truncate">{selectedLog.correlation_id || 'N/A'}</dd>
+          </div>
+        </dl>
+      </div>
+
+      <!-- Acción -->
+      <div>
+        <h4 class="text-sm font-medium text-gray-900 mb-2">Acción</h4>
+        <div class="bg-gray-50 rounded-lg p-3">
+          <span class="px-2 py-1 text-xs font-semibold rounded-full {getActionColor(selectedLog.action)}">
+            {selectedLog.action}
+          </span>
+          <p class="mt-2 text-sm text-gray-700">{formatActionText(selectedLog.action)}</p>
+        </div>
+      </div>
+
+      <!-- Recurso -->
+      <div>
+        <h4 class="text-sm font-medium text-gray-900 mb-2">Recurso Afectado</h4>
+        <div class="bg-gray-50 rounded-lg p-3 text-sm">
+          <div><span class="font-medium">Tipo:</span> {selectedLog.resource_type}</div>
+          {#if selectedLog.resource_id}
+            <div class="mt-1"><span class="font-medium">ID:</span> <code class="text-xs">{selectedLog.resource_id}</code></div>
+          {/if}
+        </div>
+      </div>
+
+      <!-- User Agent -->
+      {#if selectedLog.user_agent}
+        <div>
+          <h4 class="text-sm font-medium text-gray-900 mb-2">Navegador / Dispositivo</h4>
+          <div class="bg-gray-50 rounded-lg p-3 text-xs font-mono text-gray-600 break-all">
+            {selectedLog.user_agent}
+          </div>
+        </div>
+      {/if}
+
+      <!-- Valores Anteriores -->
+      {#if selectedLog.old_values && Object.keys(selectedLog.old_values).length > 0}
+        <div>
+          <h4 class="text-sm font-medium text-gray-900 mb-2">Valores Anteriores</h4>
+          <pre class="bg-gray-50 rounded-lg p-3 text-xs font-mono text-gray-600 overflow-auto max-h-40">{JSON.stringify(selectedLog.old_values, null, 2)}</pre>
+        </div>
+      {/if}
+
+      <!-- Valores Nuevos -->
+      {#if selectedLog.new_values && Object.keys(selectedLog.new_values).length > 0}
+        <div>
+          <h4 class="text-sm font-medium text-gray-900 mb-2">Valores Nuevos</h4>
+          <pre class="bg-gray-50 rounded-lg p-3 text-xs font-mono text-gray-600 overflow-auto max-h-40">{JSON.stringify(selectedLog.new_values, null, 2)}</pre>
+        </div>
+      {/if}
+
+      <!-- Metadata -->
+      {#if selectedLog.metadata && Object.keys(selectedLog.metadata).length > 0}
+        <div>
+          <h4 class="text-sm font-medium text-gray-900 mb-2">Información Adicional</h4>
+          <pre class="bg-gray-50 rounded-lg p-3 text-xs font-mono text-gray-600 overflow-auto max-h-40">{JSON.stringify(selectedLog.metadata, null, 2)}</pre>
+        </div>
+      {/if}
+    </div>
+
+    <div slot="footer" class="flex justify-end">
+      <button
+        on:click={() => showDetailModal = false}
+        class="px-4 py-2 bg-white border border-gray-300 rounded-md text-sm font-medium text-gray-700 hover:bg-gray-50"
+      >
+        Cerrar
+      </button>
+    </div>
+  </Modal>
+{/if}