import 'package:flutter/material.dart';
import 'package:flux/core/theme/theme.dart';
import 'package:flux/features/customers/ui/customers_content.dart';
import 'package:flux/features/master_data/products/ui/products_screen.dart';
import 'package:flux/features/master_data/providers/ui/providers_master_data_screen.dart';
import 'package:flux/features/master_data/staff/ui/staff_screen.dart';
import 'package:flux/features/master_data/store/ui/stores_screen.dart';

class MasterDataHubContent extends StatelessWidget {
  final Function(Widget) onOpenPage;

  const MasterDataHubContent({super.key, required this.onOpenPage});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(24.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "Anagrafiche",
            style: TextStyle(
              fontSize: 28,
              fontWeight: FontWeight.bold,
              color: context.accent,
            ),
          ),
          const SizedBox(height: 8),
          Text(
            "Gestisci i dati fondamentali del tuo business",
            style: TextStyle(color: context.secondaryText),
          ),
          const SizedBox(height: 32),

          Expanded(
            child: GridView(
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: MediaQuery.of(context).size.width > 600 ? 3 : 2,
                mainAxisSpacing: 14,
                crossAxisSpacing: 14,
                // LA MAGIA: Fissiamo l'altezza della card a 200 pixel
                // indipendentemente da quanto sia stretta la colonna!
                mainAxisExtent: 200,
              ),
              children: [
                _buildHubCard(
                  context,
                  title: 'Prodotti',
                  subtitle: 'Anagrafica di Marche e Modelli',
                  icon: Icons.inventory_2_outlined,
                  color: Colors.blue,
                  onTap: () => onOpenPage(const ProductsScreen()),
                ),
                _buildHubCard(
                  context,
                  title: 'Clienti',
                  subtitle: 'Anagrafica dei clienti del tuo business',
                  icon: Icons.people_outlined,
                  color: Colors.orange,
                  onTap: () => onOpenPage(const CustomersContent()),
                ),
                _buildHubCard(
                  context,
                  title: 'Addetti',
                  subtitle: 'Anagrafica del personale e dei collaboratori',
                  icon: Icons.badge_outlined,
                  color: Colors.teal,
                  onTap: () => onOpenPage(const StaffScreen()),
                ),
                _buildHubCard(
                  context,
                  title: 'Negozi',
                  subtitle: 'Anagrafica punti vendita della tua azienda',
                  icon: Icons.storefront_outlined,
                  color: Colors.purple,
                  onTap: () => onOpenPage(const StoresScreen()),
                ),
                _buildHubCard(
                  context,
                  title:
                      'Provider', // Accorciato per non andare a capo male su mobile
                  subtitle: 'Anagrafica mandati e servizi',
                  icon: Icons.handshake_rounded,
                  color: Colors.indigo,
                  onTap: () {
                    Navigator.push(
                      context,
                      MaterialPageRoute(
                        builder: (context) => const ProvidersMasterDataScreen(),
                      ),
                    );
                  },
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

Widget _buildHubCard(
  BuildContext context, {
  required String title,
  required String subtitle,
  required IconData icon,
  required Color color,
  required VoidCallback onTap,
}) {
  return Card(
    clipBehavior: Clip.antiAlias,
    elevation: 2,
    shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
    child: InkWell(
      onTap: onTap,
      child: Padding(
        // Ridotto da 22 a 16 per dare più respiro orizzontale su mobile
        padding: const EdgeInsets.all(16.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Container(
              padding: const EdgeInsets.all(12),
              decoration: BoxDecoration(
                color: color.withValues(alpha: 0.1),
                shape: BoxShape.circle,
              ),
              child: Icon(icon, size: 40, color: color),
            ),
            const SizedBox(height: 12), // Leggermente ridotto
            Text(
              title,
              textAlign: TextAlign.center,
              style: const TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
              maxLines: 1,
              overflow: TextOverflow.ellipsis,
            ),
            const SizedBox(height: 4), // Leggermente ridotto
            Expanded(
              // Impedisce matematicamente l'overflow verticale
              child: Text(
                subtitle,
                textAlign: TextAlign.center,
                style: TextStyle(fontSize: 13, color: Colors.grey.shade500),
                maxLines: 2,
                overflow: TextOverflow.ellipsis,
              ),
            ),
          ],
        ),
      ),
    ),
  );
}