import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import '../../../core/theme/halo_tokens.dart';
import '../../../core/theme/widgets/halo_button.dart';

/// "Pembayaran expired" — terminal screen for the timeout path. The retry CTA
/// pushes back to `/payment/method`; the draft is intentionally retained so
/// the user re-pays the same plan/mode/discount without re-picking.
class PaymentExpiredScreen extends ConsumerWidget {
  final String paymentId;
  const PaymentExpiredScreen({super.key, required this.paymentId});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return PopScope(
      canPop: true,
      child: Scaffold(
        backgroundColor: HaloTokens.bg,
        body: SafeArea(
          child: Padding(
            padding: const EdgeInsets.fromLTRB(
              HaloSpacing.s24,
              HaloSpacing.s32,
              HaloSpacing.s24,
              HaloSpacing.s32,
            ),
            child: Column(
              children: [
                Expanded(
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Container(
                        width: 90,
                        height: 90,
                        decoration: const BoxDecoration(
                          color: Color(0xFFFFE5E5),
                          borderRadius: HaloRadius.xl,
                        ),
                        alignment: Alignment.center,
                        child: const Text('⏰', style: TextStyle(fontSize: 42)),
                      ),
                      const SizedBox(height: HaloSpacing.s20),
                      const Text(
                        'pembayaran kedaluwarsa',
                        textAlign: TextAlign.center,
                        style: TextStyle(
                          fontFamily: HaloTokens.fontDisplay,
                          fontSize: 22,
                          fontWeight: FontWeight.w700,
                          color: HaloTokens.brandDark,
                          height: 1.25,
                          letterSpacing: -0.5,
                        ),
                      ),
                      const SizedBox(height: HaloSpacing.s12),
                      const SizedBox(
                        width: 280,
                        child: Text(
                          'sesi pembayaran udah lewat 20 menit. coba lagi yuk, gak ada potongan apapun.',
                          textAlign: TextAlign.center,
                          style: TextStyle(
                            fontSize: 13.5,
                            color: HaloTokens.inkSoft,
                            height: 1.55,
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
                HaloButton(
                  label: 'coba lagi',
                  size: HaloButtonSize.lg,
                  fullWidth: true,
                  onPressed: () => context.go('/payment/method'),
                ),
                const SizedBox(height: HaloSpacing.s8),
                HaloButton(
                  label: 'kembali ke home',
                  variant: HaloButtonVariant.ghost,
                  size: HaloButtonSize.md,
                  fullWidth: true,
                  onPressed: () => context.go('/home'),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}