import 'package:flutter/material.dart';

class MessagesPage extends StatelessWidget {
  const MessagesPage({super.key});

  @override
  Widget build(BuildContext context) {
    final List<Map<String, dynamic>> notifications = [
      {
        'title': 'Welcome to Prank Sounds!',
        'body': 'Thanks for downloading! Start your prank journey with our hilarious sounds.',
        'time': 'Just now',
        'icon': Icons.waving_hand_rounded,
        'color': const Color(0xFF6C63FF),
      },
      {
        'title': 'New Sounds Added! 📢',
        'body': 'We just updated the library with 10+ new "Air Horn" and "Fart" sounds. Check them out!',
        'time': '2h ago',
        'icon': Icons.new_releases_rounded,
        'color': const Color(0xFFFF6584),
      },
      {
        'title': 'Unlock Pro Features 💎',
        'body': 'Remove ads and unlock exclusive sound effects by upgrading to Pro today.',
        'time': '1d ago',
        'icon': Icons.diamond_rounded,
        'color': const Color(0xFFFF9F0A),
      },
      {
        'title': 'Enjoying the app?',
        'body': 'If you like Prank Sounds, please take a moment to rate us 5 stars on the store!',
        'time': '3d ago',
        'icon': Icons.star_rounded,
        'color': const Color(0xFF32D74B),
      },
      {
        'title': 'Prank Tip #101',
        'body': 'Did you know you can loop sounds in Settings? Perfect for long pranks!',
        'time': '5d ago',
        'icon': Icons.lightbulb_rounded,
        'color': const Color(0xFF30B0C7),
      },
    ];

    return Scaffold(
      appBar: AppBar(title: const Text('Inbox')),
      body: ListView.separated(
        padding: const EdgeInsets.fromLTRB(20, 20, 20, 120),
        itemCount: notifications.length,
        separatorBuilder: (context, index) => const SizedBox(height: 16),
        itemBuilder: (context, index) {
          final item = notifications[index];
          return Container(
            padding: const EdgeInsets.all(16),
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(20),
              boxShadow: [
                BoxShadow(
                  color: const Color(0xFF6C63FF).withOpacity(0.05),
                  blurRadius: 15,
                  offset: const Offset(0, 5),
                )
              ],
            ),
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Container(
                  padding: const EdgeInsets.all(12),
                  decoration: BoxDecoration(
                    color: (item['color'] as Color).withOpacity(0.1),
                    shape: BoxShape.circle,
                  ),
                  child: Icon(
                    item['icon'] as IconData,
                    color: item['color'] as Color,
                    size: 22,
                  ),
                ),
                const SizedBox(width: 16),
                Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Expanded(
                            child: Text(
                              item['title'],
                              style: const TextStyle(
                                fontWeight: FontWeight.bold,
                                fontSize: 15,
                                color: Color(0xFF1D1D35),
                              ),
                              maxLines: 1,
                              overflow: TextOverflow.ellipsis,
                            ),
                          ),
                          Text(
                            item['time'],
                            style: const TextStyle(
                              color: Colors.grey,
                              fontSize: 12,
                              fontWeight: FontWeight.w500,
                            ),
                          ),
                        ],
                      ),
                      const SizedBox(height: 6),
                      Text(
                        item['body'],
                        style: const TextStyle(
                          color: Color(0xFF64748B),
                          fontSize: 13,
                          height: 1.5,
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          );
        },
      ),
    );
  }
}