completed group batch feature

lib/screens/onboarding/complete_screen.dart

@@ -1,6 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart';
-import 'package:qpay/models/responsive_policy.dart';
+import 'package:qpay/screens/onboarding/widgets/onboarding_layout.dart';
 
 class CompleteScreen extends StatefulWidget {
   const CompleteScreen({super.key});
@@ -12,65 +12,77 @@ class CompleteScreen extends StatefulWidget {
 class _CompleteScreenState extends State<CompleteScreen> {
   @override
   Widget build(BuildContext context) {
-    return Scaffold(
-      body: SingleChildScrollView(
-        child: Padding(
-          padding: const EdgeInsets.all(25),
-          child: Center(
-            child: LayoutBuilder(
-                builder: (context, constraints) {
-                  final maxWidth = constraints.maxWidth > ResponsivePolicy.md
-                      ? ResponsivePolicy.md.toDouble()
-                      : constraints.maxWidth;
-                  return SizedBox(
-                    width: maxWidth,
-                  child: Column(
-                    mainAxisAlignment: MainAxisAlignment.center,
-                    crossAxisAlignment: CrossAxisAlignment.center,
-                    children: [
-                      SizedBox(height: 75),
-                      Text(
-                        'Registration Complete',
-                        style: TextStyle(
-                          fontSize: 30,
-                          fontWeight: FontWeight.bold,
-                          color: Theme.of(context).colorScheme.primary,
-                        ),
-                      ),
-                      SizedBox(height: 5),
-                      Text(
-                        'Thank you for registering with Velocity payments',
-                        style: TextStyle(fontSize: 18),
-                        textAlign: TextAlign.center,
-                      ),
-                      Image.asset('assets/landing.png', width: 300),
-                      Text(
-                        'Tap Login to get started',
-                        style: TextStyle(fontSize: 18),
-                      ),
-                      SizedBox(height: 30),
-                      Padding(
-                        padding: const EdgeInsets.symmetric(horizontal: 25),
-                        child: Row(
-                          children: [
-                            Expanded(
-                              child: ElevatedButton(
-                                onPressed: () {
-                                  context.go('/onboarding/login');
-                                },
-                                child: Text('Go to Login', style: TextStyle(fontSize: 16)),
-                              ),
-                            ),
-                          ],
-                        ),
-                      ),
-                      SizedBox(height: 5),
-                    ],
-                  ),
-                );
-              }
+    final colorScheme = Theme.of(context).colorScheme;
+    return OnboardingLayout(
+      // No back button - the user shouldn't be able to go back to the
+      // verification step after their account is fully set up.
+      showBackButton: false,
+      child: OnboardingCard(
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.stretch,
+          children: [
+            // Success badge - green to differentiate from the brand primary.
+            Container(
+              padding: const EdgeInsets.all(20),
+              decoration: BoxDecoration(
+                color: Colors.green.withValues(alpha: 0.12),
+                shape: BoxShape.circle,
+              ),
+              child: const Icon(
+                Icons.check_circle_rounded,
+                color: Colors.green,
+                size: 56,
+              ),
             ),
-          ),
+            const SizedBox(height: 20),
+            Text(
+              "You're all set!",
+              textAlign: TextAlign.center,
+              style: Theme.of(context).textTheme.headlineSmall?.copyWith(
+                fontWeight: FontWeight.w800,
+                color: colorScheme.onSurface,
+                letterSpacing: -0.5,
+              ),
+            ),
+            const SizedBox(height: 8),
+            Text(
+              'Welcome to Velocity. Your account is ready — sign in to start sending and receiving payments.',
+              textAlign: TextAlign.center,
+              style: Theme.of(context).textTheme.bodyMedium?.copyWith(
+                color: colorScheme.onSurface.withValues(alpha: 0.65),
+                height: 1.45,
+              ),
+            ),
+            const SizedBox(height: 28),
+            Container(
+              decoration: BoxDecoration(
+                borderRadius: BorderRadius.circular(16),
+                boxShadow: [
+                  BoxShadow(
+                    color: colorScheme.primary.withValues(alpha: 0.2),
+                    blurRadius: 24,
+                    offset: const Offset(0, 12),
+                  ),
+                ],
+              ),
+              child: ClipRRect(
+                borderRadius: BorderRadius.circular(16),
+                child: Image.asset(
+                  'assets/complete.png',
+                  width: 180,
+                  fit: BoxFit.contain,
+                ),
+              ),
+            ),
+            const SizedBox(height: 32),
+            OnboardingPrimaryButton(
+              label: 'Continue to sign in',
+              icon: Icons.arrow_forward_rounded,
+              onPressed: () {
+                context.go('/onboarding/login');
+              },
+            ),
+          ],
         ),
       ),
     );