import 'package:flutter/material.dart'; // ─── DATOS DE CATEGORÍAS (sin conexión, todo local) ───────────── const List> _categorias = [ { 'nombre' : 'Orgánicos', 'icono' : '🍃', 'color' : Color(0xFF2E7D32), 'colorFondo': Color(0xFFE8F5E9), 'descripcion': 'Residuos de origen natural que se descomponen fácilmente.', 'ejemplos': [ '🥦 Restos de frutas y verduras', '🥚 Cáscaras de huevo', '☕ Café molido y filtros de té', '🌿 Pasto, hojas y flores', '🍖 Restos de comida cocinada', ], 'noIncluir': [ '🚫 Aceites o grasas', '🚫 Plásticos o envases', '🚫 Papel de baño usado', ], 'consejo': 'Deposítalos en bolsa VERDE. Son ideales para compostar y nutrir la tierra.', }, { 'nombre' : 'Reciclables', 'icono' : '♻️', 'color' : Color(0xFF1565C0), 'colorFondo': Color(0xFFE3F2FD), 'descripcion': 'Materiales que pueden transformarse en nuevos productos.', 'ejemplos': [ '🧴 Botellas y envases de plástico (PET)', '📦 Cajas y cartón limpio', '🗞️ Papel y periódico', '🥫 Latas de aluminio y acero', '🍶 Botellas y frascos de vidrio', ], 'noIncluir': [ '🚫 Papel sucio o con grasa', '🚫 Vidrio roto sin envolver', '🚫 Plásticos con comida', ], 'consejo': 'Deposítalos en bolsa AZUL. Enjuaga los envases antes de separarlos.', }, { 'nombre' : 'Sanitarios', 'icono' : '🚽', 'color' : Color(0xFF6D4C41), 'colorFondo': Color(0xFFEFEBE9), 'descripcion': 'Residuos que por higiene no pueden mezclarse con reciclables.', 'ejemplos': [ '🧻 Papel higiénico usado', '👶 Pañales desechables', '🩹 Curitas y vendas usadas', '😷 Cubrebocas desechables', '🧼 Toallas húmedas y servilletas', ], 'noIncluir': [ '🚫 Medicamentos (van en especiales)', '🚫 Jeringas o material médico cortante', ], 'consejo': 'Deposítalos en bolsa NEGRA bien cerrada. No mezclar con reciclables.', }, { 'nombre' : 'Especiales', 'icono' : '⚠️', 'color' : Color(0xFFE65100), 'colorFondo': Color(0xFFFFF3E0), 'descripcion': 'Residuos peligrosos que requieren manejo especial.', 'ejemplos': [ '🔋 Pilas y baterías', '💊 Medicamentos caducados', '💡 Focos y luminarias', '📱 Electrónicos en desuso', '🛢️ Aceite vegetal o de motor usado', ], 'noIncluir': [ '🚫 NO van en el camión regular', '🚫 NO tirar a la basura común', ], 'consejo': '⚠️ Llévalos al punto ECORED más cercano. ¡Nunca al camión recolector!', }, ]; // ════════════════════════════════════════════════════════════════ // PANTALLA GUÍA DE SEPARACIÓN // ════════════════════════════════════════════════════════════════ class GuiaSeparacionScreen extends StatefulWidget { const GuiaSeparacionScreen({super.key}); @override State createState() => _GuiaSeparacionScreenState(); } class _GuiaSeparacionScreenState extends State { // Controla qué categoría está expandida (-1 = ninguna) int _expandida = -1; @override Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.grey[100], appBar: AppBar( title: const Text('Guía de Separación'), backgroundColor: const Color(0xFF2E7D32), foregroundColor: Colors.white, ), body: ListView( padding: const EdgeInsets.all(16), children: [ // ── ENCABEZADO ──────────────────────────────────── Container( padding: const EdgeInsets.all(16), decoration: BoxDecoration( color: const Color(0xFF2E7D32), borderRadius: BorderRadius.circular(16), ), child: const Row( children: [ Text('♻️', style: TextStyle(fontSize: 36)), SizedBox(width: 14), Expanded( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( 'Separa correctamente', style: TextStyle( color: Colors.white, fontSize: 18, fontWeight: FontWeight.bold, ), ), SizedBox(height: 4), Text( 'Toca cada categoría para ver qué residuos incluye. Funciona sin conexión.', style: TextStyle( color: Colors.white70, fontSize: 12, ), ), ], ), ), ], ), ), const SizedBox(height: 16), // ── CATEGORÍAS ──────────────────────────────────── ..._categorias.asMap().entries.map((entry) { final index = entry.key; final categoria = entry.value; final expandida = _expandida == index; final color = categoria['color'] as Color; final colorFondo = categoria['colorFondo'] as Color; return Container( margin: const EdgeInsets.only(bottom: 12), decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.circular(16), boxShadow: [ BoxShadow( color: color.withValues(alpha: 0.15), blurRadius: 8, offset: const Offset(0, 3), ), ], ), child: Column( children: [ // ── Header de categoría (siempre visible) ── GestureDetector( onTap: () { setState(() { _expandida = expandida ? -1 : index; }); }, child: Container( padding: const EdgeInsets.symmetric( horizontal: 16, vertical: 14), decoration: BoxDecoration( color: color, borderRadius: expandida ? const BorderRadius.vertical( top: Radius.circular(16)) : BorderRadius.circular(16), ), child: Row( children: [ Text( categoria['icono'] as String, style: const TextStyle(fontSize: 28), ), const SizedBox(width: 12), Expanded( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( categoria['nombre'] as String, style: const TextStyle( color: Colors.white, fontSize: 18, fontWeight: FontWeight.bold, ), ), Text( categoria['descripcion'] as String, style: const TextStyle( color: Colors.white70, fontSize: 12, ), ), ], ), ), Icon( expandida ? Icons.keyboard_arrow_up : Icons.keyboard_arrow_down, color: Colors.white, size: 28, ), ], ), ), ), // ── Contenido expandible ── if (expandida) Container( padding: const EdgeInsets.all(16), decoration: BoxDecoration( color: colorFondo, borderRadius: const BorderRadius.vertical( bottom: Radius.circular(16), ), ), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ // Sí incluir Text( '✅ Sí incluir:', style: TextStyle( fontSize: 14, fontWeight: FontWeight.bold, color: color, ), ), const SizedBox(height: 8), ...(categoria['ejemplos'] as List).map( (e) => Padding( padding: const EdgeInsets.only(bottom: 6), child: Text( e, style: const TextStyle(fontSize: 13), ), ), ), const SizedBox(height: 12), // No incluir Text( '🚫 No incluir:', style: TextStyle( fontSize: 14, fontWeight: FontWeight.bold, color: color, ), ), const SizedBox(height: 8), ...(categoria['noIncluir'] as List).map( (e) => Padding( padding: const EdgeInsets.only(bottom: 6), child: Text( e, style: const TextStyle(fontSize: 13), ), ), ), const SizedBox(height: 12), // Consejo Container( padding: const EdgeInsets.all(12), decoration: BoxDecoration( color: color.withValues(alpha: 0.1), borderRadius: BorderRadius.circular(10), border: Border.all( color: color.withValues(alpha: 0.3), ), ), child: Row( crossAxisAlignment: CrossAxisAlignment.start, children: [ const Text('💡', style: TextStyle(fontSize: 16)), const SizedBox(width: 8), Expanded( child: Text( categoria['consejo'] as String, style: TextStyle( fontSize: 13, color: color, fontWeight: FontWeight.w600, ), ), ), ], ), ), ], ), ), ], ), ); }), const SizedBox(height: 8), // ── PIE DE PÁGINA ───────────────────────────────── Container( padding: const EdgeInsets.all(14), decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.circular(12), ), child: const Row( children: [ Icon(Icons.wifi_off, color: Colors.grey, size: 18), SizedBox(width: 8), Expanded( child: Text( 'Esta guía funciona completamente sin conexión a internet.', style: TextStyle(fontSize: 12, color: Colors.grey), ), ), ], ), ), const SizedBox(height: 24), ], ), ); } }