I'll build a modern fintech Credit Card Fraud Detection dashboard based on this detailed design specification. Let me first generate design inspiration and check the codebase structure.

Now let me read the existing layout, globals.css, and check what chart components are available:

Now let me update the globals.css with a dark fintech theme and build the dashboard. I'll start with the theme and then create the dashboard components:

Now let me create the dashboard components:

Now let me update the layout and create the main page:

I've built a comprehensive Credit Card Fraud Detection Dashboard with all the features specified in your config. The dashboard includes:

Layout & Navigation:

• Dark fintech sidebar with navigation items (Dashboard, Transactions, Alerts, Analytics, Users, Reports, Settings)
• Header with search bar, notification bell with animated pulse indicator, and user profile

Key Metrics:

• Total Transactions, Fraud Rate, Risk Score, and Amount Protected cards with trend indicators

Visualizations:

• Interactive world map showing transaction locations with glowing markers (green=safe, yellow=warning, red with pulse animation=fraud)
• Transaction volume area chart showing real-time transaction flow
• Bar chart comparing normal vs fraudulent transactions
• Circular risk gauge meter with color-coded segments

Transaction Table:

• Sortable columns with Transaction ID, User, Location, Amount, Time, Status, and Risk Score
• Fraudulent transactions highlighted in red with warning badges
• Visual risk score bars with color coding

Real-time Alerts:

• Animated alert notifications with critical (red) and warning (yellow) severity levels
• Pulse effects for urgent alerts
• AI-generated alert descriptions

AI Features:

• Risk scoring visualization with contributing factor breakdown
• AI explanations panel showing why transactions were flagged (unusual location, high amount, new device, odd timing)