import 'package:flutter/material.dart';
import 'tarjetaeta.dart';
import 'configuraciondomicilio.dart';
import 'notificaciones_service.dart';
import 'ruta_exclusiva.dart';
import 'guia_separacion.dart';

class Domicilio {
  final String id;
  final String etiqueta;
  final String direccion;
  final String colonia; // ← NUEVO

  Domicilio({
    required this.id,
    required this.etiqueta,
    required this.direccion,
    required this.colonia, // ← NUEVO
  });
}

class GestionDomiciliosScreen extends StatefulWidget {
  const GestionDomiciliosScreen({super.key});

  @override
  State<GestionDomiciliosScreen> createState() =>
      _GestionDomiciliosScreenState();
}

class _GestionDomiciliosScreenState
    extends State<GestionDomiciliosScreen> {

  final List<Domicilio> _misDomicilios = [
    Domicilio(
      id: '1',
      etiqueta: 'Casa',
      direccion: 'Av. Reforma 222, CDMX',
      colonia: 'Zona Centro', // ← NUEVO
    ),
    Domicilio(
      id: '2',
      etiqueta: 'Trabajo',
      direccion: 'Benito Juárez 45',
      colonia: 'Las Arboledas', // ← NUEVO
    ),
  ];

  bool _notificarInicioRuta     = true;
  bool _notificarAproximacion   = true;
  bool _notificarRetrasosFallas = false;

  void _mostrarFormularioAgregar() {
    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(
          top: Radius.circular(24),
        ),
      ),
      builder: (context) {
        return PanelConfiguracionBottomSheet(
          notificarInicioRuta: _notificarInicioRuta,
          notificarAproximacion: _notificarAproximacion,
          notificarRetrasosFallas: _notificarRetrasosFallas,
          // ← ahora recibe también colonia
          onDomicilioGuardado: (String etiqueta, String direccion, String colonia) {
            setState(() {
              _misDomicilios.add(
                Domicilio(
                  id: DateTime.now().toString(),
                  etiqueta: etiqueta,
                  direccion: direccion,
                  colonia: colonia, // ← NUEVO
                ),
              );
            });
            ScaffoldMessenger.of(context).showSnackBar(
              SnackBar(
                content: Text('Domicilio "$etiqueta" agregado'),
                backgroundColor: Colors.green,
              ),
            );
          },
          onAlertasChanged: (bool valor, String tipo) {
            setState(() {
              switch (tipo) {
                case 'inicio':
                  _notificarInicioRuta = valor;
                  break;
                case 'aproximacion':
                  _notificarAproximacion = valor;
                  break;
                case 'retrasos':
                  _notificarRetrasosFallas = valor;
                  break;
              }
            });
          },
        );
      },
    );
  }

  IconData _obtenerIcono(String etiqueta) {
    switch (etiqueta.toLowerCase()) {
      case 'casa':
        return Icons.home;
      case 'trabajo':
        return Icons.business;
      default:
        return Icons.location_on;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: [

          Container(
            width: double.infinity,
            height: double.infinity,
            color: const Color(0xFF5BB8E8),
          ),

          Positioned(
            top: 80,
            left: -40,
            right: -40,
            child: Container(
              height: MediaQuery.of(context).size.height * 0.75,
              decoration: BoxDecoration(
                color: const Color(0xFF4AA8D8).withValues(alpha: 0.5),
                borderRadius: BorderRadius.circular(200),
              ),
            ),
          ),

          Positioned(
            bottom: 80,
            right: -10,
            child: CustomPaint(
              size: const Size(160, 130),
              painter: _MountainPainter(color: const Color(0xFF2E7D32)),
            ),
          ),
          Positioned(
            bottom: 80,
            right: 60,
            child: CustomPaint(
              size: const Size(120, 100),
              painter: _MountainPainter(color: const Color(0xFF388E3C)),
            ),
          ),

          Positioned(
            bottom: 0, left: 0, right: 0,
            child: Container(height: 90, color: const Color(0xFF4CAF50)),
          ),

          Positioned(
            bottom: 30, left: 0, right: 0,
            child: Container(
              height: 18,
              color: const Color(0xFF424242),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: List.generate(
                  12,
                      (_) => Container(width: 20, height: 3, color: Colors.white),
                ),
              ),
            ),
          ),

          Positioned(bottom: 45, left: 20,
              child: _buildHouse(const Color(0xFF90A4AE), 40)),
          Positioned(bottom: 45, left: 80,
              child: _buildHouse(const Color(0xFF795548), 35)),
          Positioned(bottom: 45, right: 20,
              child: _buildHouse(const Color(0xFFFFCC80), 45)),

          Positioned(bottom: 33, left: 110,
              child: _buildTruck(const Color(0xFFE53935))),
          Positioned(bottom: 33, right: 80,
              child: _buildTruck(const Color(0xFFE53935))),

          Column(
            children: [

              Column(
                children: [
                  Container(height: 10, color: const Color(0xFFE8534A)),
                  Container(height: 8,  color: const Color(0xFFF5A623)),
                  Container(height: 8,  color: const Color(0xFFFFD700)),
                  Container(height: 8,  color: const Color(0xFF4CAF50)),
                ],
              ),

              SafeArea(
                bottom: false,
                child: Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
                  child: Row(
                    children: [

                      const Text(
                        'ECOUBICEL.',
                        style: TextStyle(
                          fontSize: 22,
                          fontWeight: FontWeight.w900,
                          color: Colors.black87,
                          letterSpacing: 1.5,
                        ),
                      ),
                      const SizedBox(width: 8),
                      const Icon(Icons.recycling, color: Color(0xFF2E7D32), size: 28),
                      const Spacer(),

                      // ── Botón notificaciones ──
                      Container(
                        decoration: BoxDecoration(
                          color: const Color(0xFF4CAF50),
                          borderRadius: BorderRadius.circular(12),
                        ),
                        child: IconButton(
                          icon: const Icon(Icons.notifications_outlined, color: Colors.white),
                          tooltip: 'Alertas y Notificaciones',
                          onPressed: () async {
                            final resultado = await Navigator.push(
                              context,
                              MaterialPageRoute(
                                builder: (context) => AlertasNotificacionesScreen(
                                  notificarInicioRuta: _notificarInicioRuta,
                                  notificarAproximacion: _notificarAproximacion,
                                  notificarRetrasosFallas: _notificarRetrasosFallas,
                                ),
                              ),
                            );
                            if (resultado != null) {
                              setState(() {
                                _notificarInicioRuta     = resultado['inicio'];
                                _notificarAproximacion   = resultado['aproximacion'];
                                _notificarRetrasosFallas = resultado['retrasos'];
                              });
                            }
                          },
                        ),
                      ),

                      // ── Botón Mi Ruta ──
                      const SizedBox(width: 8),
                      Container(
                        decoration: BoxDecoration(
                          color: const Color(0xFF1E88E5),
                          borderRadius: BorderRadius.circular(12),
                        ),
                        child: IconButton(
                          icon: const Icon(Icons.map_outlined, color: Colors.white),
                          tooltip: 'Mi Ruta',
                          onPressed: () {
                            // ← usa colonia real del primer domicilio
                            final domicilio = _misDomicilios.isNotEmpty
                                ? _misDomicilios[0]
                                : null;
                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                builder: (context) => RutaExclusivaScreen(
                                  direccionUsuario: domicilio?.direccion ?? 'Sin dirección',
                                  coloniaUsuario: domicilio?.colonia ?? '', // ← CAMBIADO
                                ),
                              ),
                            );
                          },
                        ),
                      ),
                      const SizedBox(width: 8),
                      Container(
                        decoration: BoxDecoration(
                          color: const Color(0xFF558B2F),
                          borderRadius: BorderRadius.circular(12),
                        ),
                        child: IconButton(
                          icon: const Icon(Icons.eco_outlined, color: Colors.white),
                          tooltip: 'Guía de Separación',
                          onPressed: () {
                            Navigator.push(
                              context,
                              MaterialPageRoute(
                                builder: (context) => const GuiaSeparacionScreen(),
                              ),
                            );
                          },
                        ),
                      ),
                    ],
                  ),
                ),
              ),

              const Padding(
                padding: EdgeInsets.symmetric(horizontal: 16),
                child: TarjetaEtaWidget(),
              ),

              const SizedBox(height: 12),

              Padding(
                padding: const EdgeInsets.symmetric(horizontal: 16),
                child: Row(
                  children: [
                    Container(
                      width: 5,
                      height: 22,
                      decoration: BoxDecoration(
                        color: const Color(0xFF4CAF50),
                        borderRadius: BorderRadius.circular(4),
                      ),
                    ),
                    const SizedBox(width: 8),
                    const Text(
                      'Lugares Registrados',
                      style: TextStyle(
                        fontSize: 18,
                        fontWeight: FontWeight.bold,
                        color: Colors.black87,
                      ),
                    ),
                  ],
                ),
              ),

              const SizedBox(height: 10),

              Expanded(
                child: ListView.builder(
                  padding: const EdgeInsets.only(bottom: 100),
                  itemCount: _misDomicilios.length,
                  itemBuilder: (context, index) {
                    final domicilio = _misDomicilios[index];
                    final cardColors = [
                      const Color(0xFF4CAF50),
                      const Color(0xFF1E88E5),
                      const Color(0xFFE65100),
                    ];
                    final cardColor = cardColors[index % cardColors.length];

                    return Container(
                      margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
                      decoration: BoxDecoration(
                        color: cardColor,
                        borderRadius: BorderRadius.circular(30),
                        boxShadow: [
                          BoxShadow(
                            color: cardColor.withValues(alpha: 0.4),
                            blurRadius: 8,
                            offset: const Offset(0, 3),
                          ),
                        ],
                      ),
                      child: ListTile(
                        contentPadding: const EdgeInsets.symmetric(
                            horizontal: 20, vertical: 4),
                        leading: CircleAvatar(
                          backgroundColor: Colors.white.withValues(alpha: 0.3),
                          child: Icon(
                            _obtenerIcono(domicilio.etiqueta),
                            color: Colors.white,
                          ),
                        ),
                        title: Text(
                          domicilio.etiqueta,
                          style: const TextStyle(
                            color: Colors.white,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                        // ← muestra colonia como subtítulo
                        subtitle: Text(
                          '${domicilio.direccion} • ${domicilio.colonia}',
                          style: const TextStyle(color: Colors.white70),
                        ),
                        trailing: IconButton(
                          icon: const Icon(Icons.delete, color: Colors.white),
                          onPressed: () {
                            setState(() {
                              _misDomicilios.removeAt(index);
                            });
                          },
                        ),
                      ),
                    );
                  },
                ),
              ),
            ],
          ),
        ],
      ),

      floatingActionButton: FloatingActionButton.extended(
        onPressed: _mostrarFormularioAgregar,
        backgroundColor: const Color(0xFFE65100),
        foregroundColor: Colors.white,
        shape: const StadiumBorder(),
        icon: const Icon(Icons.add),
        label: const Text(
          'Agregar',
          style: TextStyle(fontWeight: FontWeight.bold),
        ),
      ),
    );
  }

  Widget _buildHouse(Color color, double size) {
    return CustomPaint(
      size: Size(size, size * 0.9),
      painter: _HousePainter(color: color),
    );
  }

  Widget _buildTruck(Color color) {
    return Container(
      width: 36,
      height: 18,
      decoration: BoxDecoration(
        color: color,
        borderRadius: BorderRadius.circular(3),
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.end,
        children: [
          Container(
            width: 12,
            height: 14,
            margin: const EdgeInsets.only(right: 2),
            decoration: BoxDecoration(
              color: color.withValues(alpha: 0.7),
              borderRadius: const BorderRadius.only(
                topRight: Radius.circular(3),
                topLeft: Radius.circular(2),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

class _MountainPainter extends CustomPainter {
  final Color color;
  _MountainPainter({required this.color});

  @override
  void paint(Canvas canvas, Size size) {
    final paint = Paint()..color = color;
    final path = Path()
      ..moveTo(0, size.height)
      ..lineTo(size.width / 2, 0)
      ..lineTo(size.width, size.height)
      ..close();
    canvas.drawPath(path, paint);
  }

  @override
  bool shouldRepaint(_) => false;
}

class _HousePainter extends CustomPainter {
  final Color color;
  _HousePainter({required this.color});

  @override
  void paint(Canvas canvas, Size size) {
    final paint = Paint()..color = color;
    canvas.drawRect(
      Rect.fromLTWH(0, size.height * 0.4, size.width, size.height * 0.6),
      paint,
    );
    final roof = Paint()..color = const Color(0xFFB71C1C);
    final path = Path()
      ..moveTo(0, size.height * 0.4)
      ..lineTo(size.width / 2, 0)
      ..lineTo(size.width, size.height * 0.4)
      ..close();
    canvas.drawPath(path, roof);
    canvas.drawRect(
      Rect.fromLTWH(size.width * 0.25, size.height * 0.55,
          size.width * 0.2, size.height * 0.2),
      Paint()..color = const Color(0xFFB3E5FC),
    );
    canvas.drawRect(
      Rect.fromLTWH(size.width * 0.55, size.height * 0.65,
          size.width * 0.2, size.height * 0.35),
      Paint()..color = const Color(0xFF5D4037),
    );
  }

  @override
  bool shouldRepaint(_) => false;
}