import 'package:flutter/material.dart';
import '../theme/app_colors.dart';
import '../theme/app_text_styles.dart';
import '../theme/app_radius.dart';

class JargonPanel extends StatelessWidget {
  final Map<String, String> definitions;

  const JargonPanel({super.key, required this.definitions});

  @override
  Widget build(BuildContext context) {
    if (definitions.isEmpty) return const SizedBox.shrink();

    return Container(
      decoration: BoxDecoration(
        color: AppColors.purpleBg,
        border: Border.all(color: AppColors.purple.withOpacity(0.15)),
        borderRadius: AppRadius.smAll,
      ),
      child: Theme(
        data: Theme.of(context).copyWith(dividerColor: Colors.transparent),
        child: ExpansionTile(
          tilePadding: const EdgeInsets.symmetric(horizontal: 12, vertical: 0),
          childrenPadding: const EdgeInsets.fromLTRB(12, 0, 12, 8),
          title: Text(
            '📚 Financial Terms Explained (${definitions.length} terms)',
            style: AppTextStyles.labelMedium.copyWith(color: AppColors.purpleLight),
          ),
          children: definitions.entries.map((e) {
            return Padding(
              padding: const EdgeInsets.symmetric(vertical: 4),
              child: Row(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  SizedBox(
                    width: 90,
                    child: Text(
                      e.key,
                      style: AppTextStyles.labelMedium.copyWith(color: AppColors.purpleLight),
                    ),
                  ),
                  const SizedBox(width: 8),
                  Expanded(
                    child: Text(e.value, style: AppTextStyles.bodySmall),
                  ),
                ],
              ),
            );
          }).toList(),
        ),
      ),
    );
  }
}