class _HusbandLearnScreen extends StatelessWidget {
  const _HusbandLearnScreen();

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: SingleChildScrollView(
        padding: const EdgeInsets.all(20),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              'Learn',
              style: GoogleFonts.outfit(
                fontSize: 28,
                fontWeight: FontWeight.w600,
                color: AppColors.navyBlue,
              ),
            ),
            const SizedBox(height: 24),
            _buildSection(context, 'Understanding Her', [
              _LearnItem(
                icon: Icons.loop,
                title: 'The 4 Phases of Her Cycle',
                subtitle: 'What\'s happening in her body each month',
                articleId: 'four_phases',
              ),
              _LearnItem(
                icon: Icons.psychology_outlined,
                title: 'Why Does Her Mood Change?',
                subtitle: 'Hormones explained simply',
                articleId: 'mood_changes',
              ),
              _LearnItem(
                icon: Icons.medical_information_outlined,
                title: 'PMS is Real',
                subtitle: 'Medical facts for supportive husbands',
                articleId: 'pms_is_real',
              ),
            ]),
            const SizedBox(height: 24),
            _buildSection(context, 'Biblical Manhood', [
              _LearnItem(
                icon: Icons.favorite,
                title: 'Loving Like Christ',
                subtitle: 'Ephesians 5 in daily practice',
                articleId: 'loving_like_christ',
              ),
              _LearnItem(
                icon: Icons.handshake,
                title: 'Servant Leadership at Home',
                subtitle: 'What it really means',
                articleId: 'servant_leadership',
              ),
              _LearnItem(
                icon: Icons.auto_awesome,
                title: 'Praying for Your Wife',
                subtitle: 'Practical guide',
                articleId: 'praying_for_wife',
              ),
            ]),
            const SizedBox(height: 24),
            _buildSection(context, 'NFP for Husbands', [
              _LearnItem(
                icon: Icons.show_chart,
                title: 'Reading the Charts Together',
                subtitle: 'Understanding fertility signs',
                articleId: 'reading_charts',
              ),
              _LearnItem(
                icon: Icons.schedule,
                title: 'Abstinence as Spiritual Discipline',
                subtitle: 'Growing together during fertile days',
                articleId: 'abstinence_discipline',
              ),
            ]),
          ],
        ),
      ),
    );
  }

  Widget _buildSection(BuildContext context, String title, List<_LearnItem> items) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          title,
          style: GoogleFonts.outfit(
            fontSize: 14,
            fontWeight: FontWeight.w500,
            color: AppColors.warmGray,
            letterSpacing: 0.5,
          ),
        ),
        const SizedBox(height: 8),
        Container(
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(12),
          ),
          child: Column(
            children: items
                .map((item) => ListTile(
                      leading: Container(
                        width: 40,
                        height: 40,
                        decoration: BoxDecoration(
                          color: AppColors.navyBlue.withOpacity(0.1),
                          borderRadius: BorderRadius.circular(10),
                        ),
                        child: Icon(
                          item.icon,
                          color: AppColors.navyBlue,
                          size: 20,
                        ),
                      ),
                      title: Text(
                        item.title,
                        style: GoogleFonts.outfit(
                          fontSize: 15,
                          fontWeight: FontWeight.w500,
                          color: AppColors.charcoal,
                        ),
                      ),
                      subtitle: Text(
                        item.subtitle,
                        style: GoogleFonts.outfit(
                          fontSize: 13,
                          color: AppColors.warmGray,
                        ),
                      ),
                      trailing: const Icon(
                        Icons.chevron_right,
                        color: AppColors.lightGray,
                      ),
                      onTap: () {
                        Navigator.push(
                          context,
                          MaterialPageRoute(
                            builder: (context) => LearnArticleScreen(articleId: item.articleId),
                          ),
                        );
                      },
                    ))
                .toList(),
          ),
        ),
      ],
    );
  }

class _LearnItem {
  final IconData icon;
  final String title;
  final String subtitle;
  final String articleId;

  const _LearnItem({
    required this.icon,
    required this.title,
    required this.subtitle,
    required this.articleId,
  });
}