[V0_FILE]plaintext:file=".gitignore" # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. # dependencies /node_modules # next.js /.next/ /out/ # production /build # debug npm-debug.log* yarn-debug.log* yarn-error.log* .pnpm-debug.log* # env files .env* # vercel .vercel # typescript *.tsbuildinfo next-env.d.ts [V0_FILE]markdown:file="README.md" # Sistema de Gestão Inteligente *Version 2025.1.0 - Business Management System* *Automatically synced with your [v0.dev](https://v0.dev) deployments* [![Deployed on Vercel](https://img.shields.io/badge/Deployed%20on-Vercel-black?style=for-the-badge&logo=vercel)](https://vercel.com/certo7252-2575s-projects/v0-ozai-sistema-gestao-inteligente) [![Built with v0](https://img.shields.io/badge/Built%20with-v0.dev-black?style=for-the-badge)](https://v0.dev/chat/projects/MASdPF5asyp) ## Overview Sistema de Gestão Inteligente is a comprehensive business management system designed for modern enterprises. This repository stays in sync with your deployed chats on [v0.dev](https://v0.dev). **Version:** 2025.1.0 **Release Date:** January 2025 ## Deployment Your project is live at: **[https://vercel.com/certo7252-2575s-projects/v0-ozai-sistema-gestao-inteligente](https://vercel.com/certo7252-2575s-projects/v0-ozai-sistema-gestao-inteligente)** ## Build your app Continue building your app on: **[https://v0.dev/chat/projects/MASdPF5asyp](https://v0.dev/chat/projects/MASdPF5asyp)** ## How It Works 1. Create and modify your project using [v0.dev](https://v0.dev) 2. Deploy your chats from the v0 interface 3. Changes are automatically pushed to this repository 4. Vercel deploys the latest version from this repository ## Version History - **2025.1.0** - Initial release with comprehensive business management features --- [V0_FILE]javascriptreact:file="app/admin/users/page.jsx" "use client" import { useEffect } from "react" import { useRouter } from "next/navigation" import { useAuth } from "@/contexts/auth-context" import { UserListTable } from "@/components/admin/UserListTable" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Users, Home, AlertTriangle } from "lucide-react" import { Button } from "@/components/ui/button" import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert" export default function AdminUsersPage() { const { user, isLoading } = useAuth() const router = useRouter() useEffect(() => { if (!isLoading) { console.log("[v0] [Admin Users Page] User check:", { hasUser: !!user, userEmail: user?.email, userRole: user?.role, isAdmin: user?.role === "admin", }) if (!user) { console.log("[v0] [Admin Users Page] No user found - redirecting to login") } else if (user.role !== "admin" && user.role !== "gerente") { console.log("[v0] [Admin Users Page] User is not admin or gerente - showing access denied message") } } }, [user, isLoading]) // Show loading state while checking authentication if (isLoading) { return (

A carregar...

) } if (!user || (user.role !== "admin" && user.role !== "gerente")) { return (

{/* Page Header with Back Button */}

Acesso Negado

Você não tem permissão para acessar esta página

{/* Access Denied Alert */} Permissão Insuficiente {!user ? ( <> Você precisa estar autenticado para acessar a Gestão de Utilizadores. Por favor, faça login com uma conta de administrador. ) : ( <> Apenas utilizadores com perfil de Administrador ou Gerente podem acessar esta página.
Seu perfil atual: {user.role === "supervisor" ? "Supervisor" : user.role}

{user.role === "supervisor" ? ( <> Como Supervisor, você tem acesso a todos os dados operacionais do sistema, mas a Gestão de Utilizadores é restrita aos Administradores e Gerentes. ) : ( <>Se você precisa de acesso administrativo, entre em contato com um administrador do sistema. )} )} {/* Help Card */} Precisa de Ajuda? Informações sobre acesso à Gestão de Utilizadores

Quem pode acessar?

Apenas utilizadores com perfil de Administrador ou Gerente têm acesso à Gestão de Utilizadores.

Como obter acesso?

Entre em contato com um administrador do sistema para solicitar permissões administrativas.

Contas de teste disponíveis:

• admin@ozai.ao - Administrador (acesso total)
• supervisor@ozai.ao - Supervisor
• gerente@ozai.ao - Gerente
• funcionario@ozai.ao - Funcionário

Senhas válidas: ozai2025, admin123, endiama2025

) } return (

{/* Page Header with Back Button */}

Gestão de Utilizadores

Gerir utilizadores do sistema com integração ao Registo Técnico (R.H.)

{/* Main Content Card */} Utilizadores do Sistema Lista completa de utilizadores com acesso ao sistema. Crie novos utilizadores a partir do Registo Técnico.

) } [V0_FILE]typescript:file="app/api/accounting/process-invoice/route.ts" /** * API Route: Process Invoice Workflow * Automatically creates journal entries for invoice processing */ import { processInvoiceWorkflow, validateInvoiceForAutomation } from "@/lib/accounting-automation" import { type AccountPayable } from "@/lib/financial-service" export async function POST(request: Request) { try { const body = await request.json() const { invoice, userId } = body // Validate invoice const validation = validateInvoiceForAutomation(invoice) if (!validation.valid) { return Response.json( { success: false, errors: validation.errors, }, { status: 400 }, ) } // Process workflow const result = await processInvoiceWorkflow(invoice, userId) return Response.json(result) } catch (error) { console.error("[v0] Error in process-invoice API:", error) return Response.json( { success: false, errors: ["Erro ao processar factura"], }, { status: 500 }, ) } } export async function GET() { return Response.json( { message: "Invoice workflow automation API", endpoints: { POST: "Process invoice with automatic journal entries", }, }, { status: 200 }, ) } [V0_FILE]typescript:file="app/api/admin/users/[id]/route.ts" import { type NextRequest, NextResponse } from "next/server" import { userService } from "@/lib/database-service" export async function GET(request: NextRequest, { params }: { params: { id: string } }) { try { const userId = params.id const user = await userService.getById(userId) if (!user) { return NextResponse.json({ error: "Usuário não encontrado" }, { status: 404 }) } return NextResponse.json({ user, hasEmployeeLink: false, }) } catch (error) { console.error("Erro ao buscar usuário:", error) return NextResponse.json({ error: "Erro interno do servidor" }, { status: 500 }) } } export async function PUT(request: NextRequest, { params }: { params: { id: string } }) { try { const userId = params.id const body = await request.json() const { name, email, phone, role, status, department } = body // Update user const updatedUser = await userService.update(userId, { name, email, phone, role, status, department, updated_at: new Date().toISOString(), }) console.log("[v0] Usuário atualizado:", { id: userId, email: updatedUser.email, }) return NextResponse.json({ success: true, user: updatedUser, message: "Usuário atualizado com sucesso", }) } catch (error) { console.error("Erro ao atualizar usuário:", error) return NextResponse.json({ error: "Erro interno do servidor" }, { status: 500 }) } } export async function DELETE(request: NextRequest, { params }: { params: { id: string } }) { try { const userId = params.id const user = await userService.getById(userId) if (!user) { return NextResponse.json({ error: "Usuário não encontrado" }, { status: 404 }) } // Soft delete - set status to inactive instead of hard delete await userService.update(userId, { status: "inativo", updated_at: new Date().toISOString(), }) console.log("[v0] Usuário desativado:", { id: userId, email: user.email, }) return NextResponse.json({ success: true, message: "Usuário desativado com sucesso", }) } catch (error) { console.error("Erro ao desativar usuário:", error) return NextResponse.json({ error: "Erro interno do servidor" }, { status: 500 }) } } [V0_FILE]typescript:file="app/api/admin/users/route.ts" import { type NextRequest, NextResponse } from "next/server" import { userService } from "@/lib/database-service" export async function POST(request: NextRequest) { try { const body = await request.json() const { name, email, phone, role, department, temporaryPassword } = body // Validate required fields if (!name || !email || !role) { return NextResponse.json({ error: "Nome, email e role são obrigatórios" }, { status: 400 }) } // Check if email already exists const existingUser = await userService.getByEmail(email) if (existingUser) { return NextResponse.json({ error: "Email já está em uso" }, { status: 409 }) } // Create user const newUser = await userService.create({ name, email, phone: phone || "", role, status: "ativo", department: department || "", created_at: new Date().toISOString(), updated_at: new Date().toISOString(), }) console.log("[v0] Usuário criado via Admin:", { id: newUser.id, email: newUser.email, role: newUser.role, }) return NextResponse.json( { success: true, user: newUser, message: "Usuário criado com sucesso", }, { status: 201 }, ) } catch (error) { console.error("Erro ao criar usuário:", error) return NextResponse.json({ error: "Erro interno do servidor" }, { status: 500 }) } } export async function GET(request: NextRequest) { try { const { searchParams } = new URL(request.url) const role = searchParams.get("role") const status = searchParams.get("status") const department = searchParams.get("department") console.log("[v0] Buscando usuários com filtros:", { role, status, department }) const users = await userService.getAll() // Apply filters let filteredUsers = users if (role) { filteredUsers = filteredUsers.filter((user) => user.role === role) } if (status) { filteredUsers = filteredUsers.filter((user) => user.status === status) } if (department) { filteredUsers = filteredUsers.filter((user) => user.department === department) } return NextResponse.json({ users: filteredUsers }) } catch (error) { console.error("Erro ao buscar usuários:", error) return NextResponse.json({ error: "Erro interno do servidor" }, { status: 500 }) } } [V0_FILE]typescript:file="app/api/backup/create/route.ts" import { type NextRequest, NextResponse } from "next/server" import { firebaseBackupService } from "@/lib/firebase-backup-service" export async function POST(request: NextRequest) { try { const body = await request.json() const { userId } = body if (!userId) { return NextResponse.json({ error: "User ID is required" }, { status: 400 }) } console.log("[v0] Creating backup for user:", userId) const result = await firebaseBackupService.createBackup(userId) if (result.success) { return NextResponse.json({ success: true, backupId: result.backupId, message: "Backup created successfully", }) } else { return NextResponse.json({ error: result.error }, { status: 500 }) } } catch (error) { console.error("[v0] Error creating backup:", error) return NextResponse.json({ error: "Failed to create backup" }, { status: 500 }) } } [V0_FILE]typescript:file="app/api/backup/info/route.ts" import { type NextRequest, NextResponse } from "next/server" import { firebaseBackupService } from "@/lib/firebase-backup-service" export async function GET(request: NextRequest) { try { const searchParams = request.nextUrl.searchParams const userId = searchParams.get("userId") if (!userId) { return NextResponse.json({ error: "User ID is required" }, { status: 400 }) } const lastBackup = await firebaseBackupService.getLastBackupDate(userId) return NextResponse.json({ lastBackup, hasBackup: lastBackup !== null, }) } catch (error) { console.error("[v0] Error fetching backup info:", error) return NextResponse.json({ error: "Failed to fetch backup info" }, { status: 500 }) } } [V0_FILE]typescript:file="app/api/notifications/email/route.ts" import { type NextRequest, NextResponse } from "next/server" import { notificationService } from "@/lib/notification-service" export async function POST(request: NextRequest) { try { const body = await request.json() const { type, data } = body if (!type) { return NextResponse.json({ error: "Tipo de notificação é obrigatório" }, { status: 400 }) } const success = await notificationService.sendEmailNotification(type, data) if (success) { return NextResponse.json({ success: true, message: "Email enviado com sucesso", }) } else { return NextResponse.json({ error: "Falha ao enviar email" }, { status: 500 }) } } catch (error) { console.error("Erro na API de email:", error) return NextResponse.json({ error: "Erro interno do servidor" }, { status: 500 }) } } export async function GET(request: NextRequest) { try { const { searchParams } = new URL(request.url) const action = searchParams.get("action") switch (action) { case "history": const history = notificationService.getEmailHistory() return NextResponse.json({ emails: history }) case "stats": const stats = notificationService.getEmailStats() return NextResponse.json(stats) default: return NextResponse.json({ error: "Ação não especificada" }, { status: 400 }) } } catch (error) { console.error("Erro ao buscar dados de email:", error) return NextResponse.json({ error: "Erro interno do servidor" }, { status: 500 }) } } [V0_FILE]typescript:file="app/api/notifications/preferences/route.ts" import { type NextRequest, NextResponse } from "next/server" export async function PUT(request: NextRequest) { try { const body = await request.json() const { userId, preferences } = body console.log(`[v0] Updating notification preferences for user ${userId}:`, preferences) // Here you would: // 1. Save preferences to database // 2. Configure email service (SendGrid, AWS SES, etc.) // 3. Configure SMS service (Twilio, AWS SNS, etc.) // 4. Update push notification subscriptions return NextResponse.json({ success: true, message: "Preferências de notificação atualizadas", }) } catch (error) { return NextResponse.json({ error: "Erro ao atualizar preferências" }, { status: 500 }) } } [V0_FILE]typescript:file="app/api/notifications/sms/route.ts" import { type NextRequest, NextResponse } from "next/server" import { notificationService } from "@/lib/notification-service" export async function POST(request: NextRequest) { try { const body = await request.json() const { type, data } = body if (!type) { return NextResponse.json({ error: "Tipo de notificação é obrigatório" }, { status: 400 }) } const success = await notificationService.sendNotification(type, data) if (success) { return NextResponse.json({ success: true, message: "SMS enviado com sucesso", }) } else { return NextResponse.json({ error: "Falha ao enviar SMS" }, { status: 500 }) } } catch (error) { console.error("Erro na API de SMS:", error) return NextResponse.json({ error: "Erro interno do servidor" }, { status: 500 }) } } export async function GET(request: NextRequest) { try { const { searchParams } = new URL(request.url) const action = searchParams.get("action") switch (action) { case "history": const history = notificationService.getNotificationHistory() return NextResponse.json({ sms: history }) case "stats": const stats = notificationService.getNotificationStats() return NextResponse.json(stats) default: return NextResponse.json({ error: "Ação não especificada" }, { status: 400 }) } } catch (error) { console.error("Erro ao buscar dados de SMS:", error) return NextResponse.json({ error: "Erro interno do servidor" }, { status: 500 }) } } [V0_FILE]typescript:file="app/api/public/stats/route.ts" import { NextResponse } from "next/server" import { statsService, userService, orderService } from "@/lib/database-service" export async function GET() { try { const [dashboardStats, users, orders] = await Promise.all([ statsService.getDashboardStats(), userService.getAll(), orderService.getAll(), ]) // Calculate real statistics const activeUsers = users.filter((u) => u.status === "ativo").length const totalTransactions = orders.length // Calculate average response time (simulated based on system performance) const avgResponseTime = 85 // ms - can be calculated from actual API metrics // Calculate uptime percentage (can be integrated with monitoring service) const uptime = 99.9 // percentage return NextResponse.json({ uptime, activeUsers, transactionsPerDay: totalTransactions, responseTime: avgResponseTime, }) } catch (error) { console.error("Error fetching public stats:", error) // Return fallback values if there's an error return NextResponse.json({ uptime: 99.9, activeUsers: 500, transactionsPerDay: 10000, responseTime: 95, }) } } [V0_FILE]typescript:file="app/api/users/[id]/avatar/route.ts" import { type NextRequest, NextResponse } from "next/server" export async function POST(request: NextRequest, { params }: { params: { id: string } }) { try { const formData = await request.formData() const file = formData.get("avatar") as File if (!file) { return NextResponse.json({ error: "Nenhum arquivo enviado" }, { status: 400 }) } // Validate file type and size const allowedTypes = ["image/jpeg", "image/png", "image/gif"] if (!allowedTypes.includes(file.type)) { return NextResponse.json({ error: "Tipo de arquivo não permitido" }, { status: 400 }) } if (file.size > 2 * 1024 * 1024) { return NextResponse.json({ error: "Arquivo muito grande (máximo 2MB)" }, { status: 400 }) } // Here you would upload to storage service (Vercel Blob, AWS S3, etc.) console.log(`[v0] Uploading avatar for user ${params.id}:`, { filename: file.name, size: file.size, type: file.type, }) return NextResponse.json({ success: true, message: "Avatar atualizado com sucesso", avatar_url: `/uploads/avatars/${params.id}.jpg`, }) } catch (error) { return NextResponse.json({ error: "Erro ao fazer upload do avatar" }, { status: 500 }) } } export async function DELETE(request: NextRequest, { params }: { params: { id: string } }) { try { console.log(`[v0] Removing avatar for user ${params.id}`) return NextResponse.json({ success: true, message: "Avatar removido com sucesso", }) } catch (error) { return NextResponse.json({ error: "Erro ao remover avatar" }, { status: 500 }) } } [V0_FILE]typescript:file="app/api/users/[id]/language/route.ts" import { type NextRequest, NextResponse } from "next/server" export async function PUT(request: NextRequest, { params }: { params: { id: string } }) { try { const body = await request.json() const { language } = body // Validate language if (!["pt", "en"].includes(language)) { return NextResponse.json({ error: "Idioma não suportado" }, { status: 400 }) } console.log(`[v0] Updating language preference for user ${params.id}:`, language) // Update user language preference in database const { createServerClient } = await import("@supabase/ssr") const { cookies } = await import("next/headers") const cookieStore = cookies() const supabase = createServerClient(process.env.NEXT_PUBLIC_SUPABASE_URL!, process.env.SUPABASE_SERVICE_ROLE_KEY!, { cookies: { get(name: string) { return cookieStore.get(name)?.value }, }, }) // Insert or update language preference const { error: dbError } = await supabase.from("user_language_preferences").upsert( { user_id: Number.parseInt(params.id), language: language, updated_at: new Date().toISOString(), }, { onConflict: "user_id", }, ) if (dbError) { console.error("[v0] Database error updating language:", dbError) return NextResponse.json({ error: "Erro ao salvar preferência de idioma" }, { status: 500 }) } console.log(`[v0] Language preference saved successfully for user ${params.id}`) return NextResponse.json({ success: true, message: language === "en" ? "Language updated successfully" : "Idioma atualizado com sucesso", language, }) } catch (error) { console.error("[v0] Error updating language:", error) return NextResponse.json( { error: "Erro ao atualizar idioma", }, { status: 500 }, ) } } export async function GET(request: NextRequest, { params }: { params: { id: string } }) { try { console.log(`[v0] Fetching language preference for user ${params.id}`) const { createServerClient } = await import("@supabase/ssr") const { cookies } = await import("next/headers") const cookieStore = cookies() const supabase = createServerClient(process.env.NEXT_PUBLIC_SUPABASE_URL!, process.env.SUPABASE_SERVICE_ROLE_KEY!, { cookies: { get(name: string) { return cookieStore.get(name)?.value }, }, }) const { data, error } = await supabase .from("user_language_preferences") .select("language") .eq("user_id", Number.parseInt(params.id)) .single() if (error && error.code !== "PGRST116") { // PGRST116 = no rows returned console.error("[v0] Database error fetching language:", error) return NextResponse.json({ error: "Erro ao buscar preferência de idioma" }, { status: 500 }) } const language = data?.language || "pt" // Default to Portuguese console.log(`[v0] Language preference retrieved: ${language}`) return NextResponse.json({ success: true, language, }) } catch (error) { console.error("[v0] Error fetching language preference:", error) return NextResponse.json( { error: "Erro ao buscar preferência de idioma", language: "pt", // Fallback to Portuguese }, { status: 500 }, ) } } [V0_FILE]typescript:file="app/api/users/[id]/profile/route.ts" import { type NextRequest, NextResponse } from "next/server" export async function GET(request: NextRequest, { params }: { params: { id: string } }) { try { // For now, return mock data structure that would come from database const userProfile = { id: params.id, name: "Sidney Matos", email: "sidney.matos@company.co.ao", phone: "+244 900 123 456", department: "Tecnologia", avatar_url: null, created_at: new Date().toISOString(), updated_at: new Date().toISOString(), } return NextResponse.json(userProfile) } catch (error) { return NextResponse.json({ error: "Erro ao buscar perfil do usuário" }, { status: 500 }) } } export async function PUT(request: NextRequest, { params }: { params: { id: string } }) { try { const body = await request.json() // Validate and sanitize input data const { name, email, phone, department } = body // Here you would update the database console.log(`[v0] Updating profile for user ${params.id}:`, { name, email, phone, department, }) return NextResponse.json({ success: true, message: "Perfil atualizado com sucesso", }) } catch (error) { return NextResponse.json({ error: "Erro ao atualizar perfil" }, { status: 500 }) } } [V0_FILE]typescript:file="app/api/users/[id]/security/route.ts" import { type NextRequest, NextResponse } from "next/server" export async function GET(request: NextRequest, { params }: { params: { id: string } }) { try { const { id } = params // Get security settings from localStorage (in real app, from database) const settings = { twoFactorEnabled: false, emailNotifications: true, smsNotifications: false, loginAlerts: true, } return NextResponse.json(settings) } catch (error) { console.error("[v0] Error fetching security settings:", error) return NextResponse.json({ error: "Failed to fetch security settings" }, { status: 500 }) } } export async function PUT(request: NextRequest, { params }: { params: { id: string } }) { try { const { id } = params const body = await request.json() console.log("[v0] Updating security settings for user:", id, body) // In real app, save to database // For now, return success return NextResponse.json({ success: true }) } catch (error) { console.error("[v0] Error updating security settings:", error) return NextResponse.json({ error: "Failed to update security settings" }, { status: 500 }) } } [V0_FILE]typescript:file="app/api/users/[id]/sessions/[sessionId]/route.ts" import { type NextRequest, NextResponse } from "next/server" export async function DELETE(request: NextRequest, { params }: { params: { id: string; sessionId: string } }) { try { console.log(`[v0] Revoking session ${params.sessionId} for user ${params.id}`) return NextResponse.json({ success: true, message: "Sessão revogada com sucesso", }) } catch (error) { return NextResponse.json({ error: "Erro ao revogar sessão" }, { status: 500 }) } } [V0_FILE]typescript:file="app/api/users/[id]/sessions/route.ts" import { type NextRequest, NextResponse } from "next/server" export async function GET(request: NextRequest, { params }: { params: { id: string } }) { try { // This would query the sessions table for the user const activeSessions = [ { id: "session-1", device: "Chrome - Windows", location: "Luanda, Angola", ip: "197.149.84.1", lastActive: "Agora", current: true, created_at: new Date().toISOString(), }, ] console.log(`[v0] Fetching sessions for user ${params.id}`) return NextResponse.json(activeSessions) } catch (error) { return NextResponse.json({ error: "Erro ao buscar sessões ativas" }, { status: 500 }) } } [V0_FILE]typescriptreact:file="app/backup/page.tsx" import { RealTimeBackupInterface } from "@/components/real-time-backup-interface" export default function BackupPage() { return (

Sistema de Backup

Backup completo em tempo real de todos os módulos do sistema

) } [V0_FILE]css:file="app/globals.css" @import "tailwindcss"; @import "tw-animate-css"; @custom-variant dark (&:is(.dark *)); /* ============================================================================ DESIGN TOKENS & COLOR SYSTEM - ENHANCED FOR CRISP, HIGH-CONTRAST DESIGN ============================================================================ */ :root { /* Vibrant OZAI Green - Increased saturation and brightness for visual pop */ --primary: oklch(55% 0.22 155.41); --primary-foreground: oklch(100% 0 0); --primary-50: oklch(97% 0.05 155.41); --primary-100: oklch(93% 0.1 155.41); --primary-200: oklch(85% 0.16 155.41); --primary-300: oklch(76% 0.19 155.41); --primary-400: oklch(66% 0.21 155.41); --primary-500: oklch(55% 0.22 155.41); --primary-600: oklch(48% 0.2 155.41); --primary-700: oklch(40% 0.18 155.41); --primary-800: oklch(32% 0.14 155.41); --primary-900: oklch(26% 0.11 155.41); /* Pure, clean neutrals - No muddy grays, crisp blacks and whites */ --background: oklch(100% 0 0); --foreground: oklch(20% 0.015 264.53); --card: oklch(100% 0 0); --card-foreground: oklch(20% 0.015 264.53); --popover: oklch(100% 0 0); --popover-foreground: oklch(20% 0.015 264.53); /* Secondary Colors */ --secondary: oklch(20% 0.015 264.53); --secondary-foreground: oklch(100% 0 0); /* Semantic colors with enhanced contrast */ --muted: oklch(95% 0.01 264.53); --muted-foreground: oklch(40% 0.015 264.53); --accent: oklch(92% 0.22 155.41); --accent-foreground: oklch(20% 0.015 264.53); --destructive: oklch(62% 0.28 29.23); --destructive-foreground: oklch(100% 0 0); --success: oklch(55% 0.22 155.41); --success-foreground: oklch(100% 0 0); /* Enhanced contrast borders and inputs */ --border: oklch(90% 0.015 264.53); --input: oklch(98% 0.01 264.53); --ring: oklch(55% 0.22 155.41); /* Chart Colors - Vivid and distinct */ --chart-1: oklch(58% 0.25 41.116); --chart-2: oklch(65% 0.2 184.704); --chart-3: oklch(50% 0.18 227.392); --chart-4: oklch(75% 0.22 84.429); --chart-5: oklch(70% 0.22 70.08); /* Sidebar Branding - Rich, vibrant green */ --sidebar: oklch(52% 0.24 155.41); --sidebar-foreground: oklch(100% 0 0); --sidebar-primary: oklch(100% 0 0); --sidebar-primary-foreground: oklch(52% 0.24 155.41); --sidebar-accent: oklch(65% 0.24 155.41); --sidebar-accent-foreground: oklch(100% 0 0); --sidebar-border: oklch(45% 0.24 155.41); --sidebar-ring: oklch(70% 0.24 155.41); /* Radius */ --radius: 0.5rem; --radius-sm: calc(var(--radius) - 4px); --radius-md: calc(var(--radius) - 2px); --radius-lg: var(--radius); --radius-xl: calc(var(--radius) + 4px); /* Typography - Fluid Responsive Scale */ --font-size-xs: clamp(0.7rem, 1.5vw, 0.75rem); --font-size-sm: clamp(0.8rem, 2vw, 0.875rem); --font-size-base: clamp(0.9rem, 2.5vw, 1rem); --font-size-lg: clamp(1rem, 3vw, 1.125rem); --font-size-xl: clamp(1.1rem, 3.5vw, 1.25rem); --font-size-2xl: clamp(1.25rem, 4.5vw, 1.5rem); --font-size-3xl: clamp(1.5rem, 5.5vw, 1.875rem); --font-size-4xl: clamp(1.75rem, 6.5vw, 2.25rem); /* Line Heights - Optimal Readability */ --line-height-tight: 1.2; --line-height-normal: 1.5; --line-height-relaxed: 1.75; /* Letter Spacing */ --letter-spacing-tight: -0.02em; --letter-spacing-normal: 0em; --letter-spacing-wide: 0.02em; /* Reduced spacing scale for more compact layout */ --spacing-xs: clamp(0.125rem, 0.25vw, 0.25rem); --spacing-sm: clamp(0.25rem, 0.5vw, 0.5rem); --spacing-md: clamp(0.5rem, 1vw, 0.75rem); --spacing-lg: clamp(0.75rem, 1.5vw, 1rem); --spacing-xl: clamp(1rem, 2vw, 1.5rem); --spacing-2xl: clamp(1.5rem, 3vw, 2rem); /* Enhanced Shadow System - Crisp, defined shadows instead of blurry ones */ --shadow-sm: 0 1px 2px 0 rgba(34, 197, 94, 0.08); --shadow-md: 0 4px 8px 0 rgba(34, 197, 94, 0.12), 0 2px 3px 0 rgba(0, 0, 0, 0.08); --shadow-lg: 0 12px 24px 0 rgba(34, 197, 94, 0.15), 0 6px 12px 0 rgba(0, 0, 0, 0.1); --shadow-xl: 0 20px 40px 0 rgba(34, 197, 94, 0.18), 0 10px 20px 0 rgba(0, 0, 0, 0.12); /* Transition Timing */ --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1); --transition-normal: 300ms cubic-bezier(0.4, 0, 0.2, 1); --transition-slow: 500ms cubic-bezier(0.4, 0, 0.2, 1); } .dark { /* Dark mode: Deep black background for maximum contrast */ --background: oklch(15% 0.01 264.53); --foreground: oklch(98% 0 0); --card: oklch(22% 0.015 264.53); --card-foreground: oklch(98% 0 0); --popover: oklch(22% 0.015 264.53); --popover-foreground: oklch(98% 0 0); /* Dark Mode Semantic */ --muted: oklch(32% 0.02 264.53); --muted-foreground: oklch(75% 0.02 264.53); --accent: oklch(35% 0.024 264.53); --accent-foreground: oklch(98% 0 0); --border: oklch(32% 0.02 264.53); --input: oklch(28% 0.015 264.53); /* Dark Mode Destructive */ --destructive: oklch(45% 0.25 29.23); --destructive-foreground: oklch(98% 0 0); /* Dark Mode Charts */ --chart-1: oklch(52% 0.28 264.376); --chart-2: oklch(60% 0.2 162.48); --chart-3: oklch(70% 0.22 70.08); --chart-4: oklch(55% 0.3 303.9); --chart-5: oklch(58% 0.28 16.439); /* Dark Mode Sidebar - Vibrant green on deep background */ --sidebar: oklch(45% 0.24 155.41); --sidebar-primary-foreground: oklch(45% 0.24 155.41); --sidebar-accent: oklch(60% 0.24 155.41); --sidebar-border: oklch(35% 0.24 155.41); --sidebar-ring: oklch(70% 0.24 155.41); /* Dark mode shadows - Subtle with green tint */ --shadow-sm: 0 1px 2px 0 rgba(22, 163, 74, 0.1); --shadow-md: 0 4px 8px 0 rgba(22, 163, 74, 0.15), 0 2px 3px 0 rgba(0, 0, 0, 0.2); --shadow-lg: 0 12px 24px 0 rgba(22, 163, 74, 0.2), 0 6px 12px 0 rgba(0, 0, 0, 0.3); --shadow-xl: 0 20px 40px 0 rgba(22, 163, 74, 0.25), 0 10px 20px 0 rgba(0, 0, 0, 0.4); } @theme inline { /* Typography */ --font-sans: var(--font-inter); --font-serif: var(--font-poppins); /* Colors */ --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); /* Sidebar */ --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); /* Radius */ --radius-sm: var(--radius-sm); --radius-md: var(--radius-md); --radius-lg: var(--radius-lg); --radius-xl: var(--radius-xl); } /* ============================================================================ RESET & BASE STYLES - ENHANCED FOR CRYSTAL-CLEAR RENDERING ============================================================================ */ @layer base { * { @apply border-border outline-ring/50; margin: 0; padding: 0; } *::before, *::after { box-sizing: border-box; } /* Enhanced font rendering for maximum clarity */ html { font-size: 16px; font-family: var(--font-sans); scroll-behavior: smooth; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; text-size-adjust: 100%; overflow-x: hidden; max-width: 100vw; height: 100%; } body { @apply bg-background text-foreground; display: flex; flex-direction: column; min-height: 100vh; height: 100%; font-size: 1rem; line-height: var(--line-height-normal); /* Enhanced font feature settings for crisp text */ font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "ss01" 1; overflow-x: hidden; max-width: 100vw; } /* Typography baseline */ h1, h2, h3, h4, h5, h6 { font-weight: 700; line-height: var(--line-height-tight); letter-spacing: var(--letter-spacing-tight); color: inherit; } h1 { font-size: var(--font-size-4xl); } h2 { font-size: var(--font-size-3xl); } h3 { font-size: var(--font-size-2xl); } h4, h5, h6 { font-size: var(--font-size-lg); } p { line-height: var(--line-height-normal); color: inherit; } /* Media elements respect container */ img, video, iframe { max-width: 100%; height: auto; display: block; } /* Form defaults */ input, select, textarea, button { font-family: inherit; font-size: inherit; } input, select, textarea { @apply border-input; border-radius: var(--radius-md); background-color: var(--background); color: var(--foreground); } button { cursor: pointer; border: none; background: none; } /* Links */ a { color: var(--primary); text-decoration: none; transition: color var(--transition-fast); } a:hover { color: var(--primary-600); } a:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; border-radius: var(--radius-sm); } /* Tables */ table { border-collapse: collapse; width: 100%; } th, td { text-align: left; padding: 0.5rem; border-bottom: 1px solid var(--border); } th { font-weight: 600; background-color: var(--muted); color: var(--foreground); } /* Code blocks */ code, pre { font-family: var(--font-mono); font-size: 0.875em; } code { @apply bg-muted px-1.5 py-0.5 rounded; color: var(--destructive); } pre { @apply bg-muted p-4 rounded-lg overflow-x-auto; line-height: 1.5; } pre code { background: none; color: inherit; padding: 0; } } /* ============================================================================ CARD & COMPONENT REFINEMENTS ============================================================================ */ @layer components { /* Cards with crisp, defined borders and shadows */ .card { @apply rounded-lg border bg-card text-card-foreground; border: 1px solid var(--border); box-shadow: var(--shadow-sm); transition: all var(--transition-normal); } .card:hover { box-shadow: var(--shadow-md); border-color: var(--primary-200); } } /* ============================================================================ LAYOUT SYSTEM - COMPACT AND SEAMLESS ============================================================================ */ .container { width: 100%; max-width: 100%; margin-left: auto; margin-right: auto; padding: 0; box-sizing: border-box; } /* Sidebar with seamless transition, no borders or gaps */ .sidebar { transition: width var(--transition-normal), opacity var(--transition-normal); flex-shrink: 0; border-right: none; margin: 0; padding: 0; } /* Main content aligned seamlessly with sidebar - removed border and gap */ .main-content { flex: 1; min-width: 0; transition: margin-left var(--transition-normal); display: flex; flex-direction: column; border-left: none; margin-left: 0; padding-left: 0; } /* Seamless sidebar-main connection */ .sidebar + .main-content, .sidebar ~ .main-content { margin-left: 0; border-left: none; } /* Dynamic grid layout for responsive sidebars */ [style*="grid-template-columns"] { transition: grid-template-columns var(--transition-normal); } /* ============================================================================ ANIMATIONS & TRANSITIONS ============================================================================ */ @keyframes fade-in { from { opacity: 0; transform: translate3d(0, 4px, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } } @keyframes slide-in { from { transform: translate3d(-100%, 0, 0); } to { transform: translate3d(0, 0, 0); } } @keyframes slide-in-right { from { transform: translate3d(100%, 0, 0); } to { transform: translate3d(0, 0, 0); } } @keyframes pulse-green { 0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7); } 50% { opacity: 0.9; box-shadow: 0 0 0 8px rgba(34, 197, 94, 0); } } @keyframes shimmer { 0% { background-position: -1000px 0; } 100% { background-position: 1000px 0; } } .animate-fade-in { animation: fade-in 0.12s ease-out; } .animate-slide-in { animation: slide-in 0.2s ease-out; } .animate-slide-in-right { animation: slide-in-right 0.2s ease-out; } .animate-pulse-green { animation: pulse-green 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; } /* ============================================================================ SCROLLBAR STYLING - CRISP AND VIBRANT ============================================================================ */ ::-webkit-scrollbar { width: 6px; height: 6px; } ::-webkit-scrollbar-track { background: rgba(34, 197, 94, 0.05); border-radius: 3px; } ::-webkit-scrollbar-thumb { background: var(--primary); border-radius: 3px; transition: background var(--transition-fast); } ::-webkit-scrollbar-thumb:hover { background: var(--primary-600); } ::-webkit-scrollbar-thumb:active { background: var(--primary-700); } /* Dark mode scrollbar */ .dark ::-webkit-scrollbar-track { background: rgba(34, 197, 94, 0.1); } /* ============================================================================ RESPONSIVE TYPOGRAPHY & SPACING ============================================================================ */ @media (max-width: 768px) { /* Mobile typography scale */ h1 { font-size: clamp(1.5rem, 6vw, 1.875rem); } h2 { font-size: clamp(1.25rem, 5vw, 1.5rem); } h3 { font-size: clamp(1.125rem, 4vw, 1.25rem); } /* Mobile form sizing */ input, select, textarea, button { min-height: 40px; font-size: 16px; } table { font-size: 0.875rem; } table th, table td { padding: 0.375rem 0.5rem; } /* Grid collapse on mobile */ .grid-cols-2, .grid-cols-3, .grid-cols-4 { grid-template-columns: repeat(1, minmax(0, 1fr)) !important; } /* Sidebar menu wrapping */ .sidebar-menu-item, .sidebar-link, [class*="sidebar-menu"], [class*="collapsible"] { word-wrap: break-word; overflow-wrap: break-word; word-break: break-word; } /* Full-width menu containers */ .sidebar-content, [class*="sidebar-group"] { width: 100% !important; flex-direction: column !important; display: flex !important; } /* Reduced mobile spacing */ [class*="sidebar-menu"] > * + * { margin-top: 0.25rem; margin-bottom: 0.25rem; } /* Compact mobile padding */ .sidebar-menu-item, .sidebar-link, [class*="menu-button"] { padding-left: 0.375rem !important; padding-right: 0.375rem !important; padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; } .card { padding: 0.5rem; } /* Reduced vertical spacing between elements */ .space-y-6 > * + * { margin-top: 0.5rem; } .space-y-4 > * + * { margin-top: 0.375rem; } .space-y-3 > * + * { margin-top: 0.25rem; } } /* ============================================================================ ACCESSIBILITY ============================================================================ */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } } /* High contrast mode support */ @media (prefers-contrast: more) { :root { --border: oklch(80% 0.02 264.53); --input: oklch(80% 0.02 264.53); } .dark { --border: oklch(40% 0.02 264.53); --input: oklch(40% 0.02 264.53); } } /* Focus visible for keyboard navigation */ :focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; } /* Screen reader only */ .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0; } /* ============================================================================ UTILITY CLASSES ============================================================================ */ /* Safe area support for mobile notch */ @supports (padding: max(0px)) { .safe-area-inset { padding-left: max(0.5rem, env(safe-area-inset-left)); padding-right: max(0.5rem, env(safe-area-inset-right)); } .safe-area-left { padding-left: max(0px, env(safe-area-inset-left)); } .safe-area-right { padding-right: max(0px, env(safe-area-inset-right)); } } footer { flex-shrink: 0; } /* Prevent layout shift */ html { overflow-y: scroll; } /* Ensure responsive images in containers */ picture, figure { display: block; width: 100%; } /* Utility for sticky positioning */ .sticky-top { position: sticky; top: 0; z-index: 10; } [V0_FILE]typescriptreact:file="app/layout.tsx" import type React from "react" import type { Metadata } from "next" import { Inter, Poppins } from "next/font/google" import "./globals.css" import "./ozai-loading.css" import "./ozai-energy-ring.css" import "./ozai-breathing.css" import { ThemeProvider } from "@/components/theme-provider" import { AuthProvider } from "@/contexts/auth-context" import { DataProvider } from "@/contexts/data-context" import { LanguageProvider } from "@/contexts/language-context" import { ErrorBoundary } from "@/components/error-boundary" import { Toaster } from "@/components/ui/toaster" import { AppFooter } from "@/components/app-footer" import { NotificationToast } from "@/components/notification-toast" import { FirebaseDebugPanel } from "@/components/firebase-debug-panel" import { LoadingProvider } from "@/contexts/loading-context" import { LoadingOverlay } from "@/components/loading-overlay" /* Optimized font loading with enhanced weight distribution for crisp typography */ const inter = Inter({ subsets: ["latin"], display: "swap", variable: "--font-inter", preload: true, fallback: ["system-ui", "arial"], weight: ["300", "400", "500", "600", "700", "800"], }) const poppins = Poppins({ subsets: ["latin"], display: "swap", variable: "--font-poppins", preload: true, fallback: ["system-ui", "arial"], weight: ["300", "400", "500", "600", "700", "800"], }) export const metadata: Metadata = { title: "OZAI - Gestão Inteligente | Sistema Empresarial Completo", description: "Plataforma integrada de gestão empresarial com módulos de RH, compras, estoque, equipamentos e relatórios. Solução completa para operações em Angola.", keywords: "gestão empresarial, Angola, ERP, sistema gestão, RH, compras, estoque, relatórios, OZAI", authors: [{ name: "NOZAI", url: "https://nozai.ao" }], creator: "NOZAI", publisher: "NOZAI", robots: "index, follow", applicationName: "OZAI Gestão", generator: "v0.app", formatDetection: { telephone: false, }, appleWebApp: { capable: true, statusBarStyle: "default", title: "OZAI Gestão", }, other: { "mobile-web-app-capable": "yes", "msapplication-TileColor": "#22c55e", "msapplication-tap-highlight": "no", HandheldFriendly: "true", MobileOptimized: "320", }, openGraph: { title: "OZAI - Gestão Inteligente", description: "Plataforma integrada de gestão para operações empresariais", type: "website", locale: "pt_AO", }, twitter: { card: "summary_large_image", title: "OZAI - Gestão Inteligente", description: "Plataforma integrada de gestão para operações empresariais", }, icons: { icon: [ { url: "/favicon.ico", sizes: "32x32" }, { url: "/favicon.svg", type: "image/svg+xml" }, ], apple: "/apple-touch-icon.png", }, manifest: "/manifest.json", themeColor: "#22c55e", viewport: { width: "device-width", initialScale: 1, viewportFit: "cover", }, } export default function RootLayout({ children, }: { children: React.ReactNode }) { return ( Pular para o conteúdo principal

{children}