import 'package:flutter/cupertino.dart';
import 'package:please_pay_me/theme/tokens.dart';
import 'package:please_pay_me/ui/atoms/app_text.dart';

/// Inset-grouped section: rounded surface + hairline separators between rows.
class AppListSection extends StatelessWidget {
  const AppListSection({
    super.key,
    required this.children,
    this.header,
    this.footer,
    this.separatorIndent = 16,
    this.margin = const EdgeInsets.symmetric(horizontal: AppSpacing.gutter),
  });

  final List<Widget> children;
  final String? header;
  final String? footer;
  final double separatorIndent;
  final EdgeInsetsGeometry margin;

  @override
  Widget build(BuildContext context) {
    final rows = <Widget>[];
    for (var i = 0; i < children.length; i++) {
      rows.add(children[i]);
      if (i < children.length - 1) {
        rows.add(
          Padding(
            padding: EdgeInsets.only(left: separatorIndent),
            child: Container(
              height: AppSizes.hairline,
              color: AppColors.of(context, AppColors.opaqueSeparator),
            ),
          ),
        );
      }
    }

    return Column(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: [
        if (header != null) AppSectionHeader(header!),
        Container(
          margin: margin,
          decoration: BoxDecoration(
            color: AppColors.of(context, AppColors.groupedSurface),
            borderRadius: BorderRadius.circular(AppRadii.lg),
          ),
          clipBehavior: Clip.antiAlias,
          child: Column(children: rows),
        ),
        if (footer != null)
          Padding(
            padding: const EdgeInsets.fromLTRB(
              AppSpacing.gutter + 4,
              AppSpacing.s2,
              AppSpacing.gutter + 4,
              0,
            ),
            child: AppText.footnote(footer!),
          ),
      ],
    );
  }
}