chore: refactor UI consistency using design system tokens and remove LucideIcons

apps/mobile/packages/features/client/home/lib/src/presentation/widgets/actions_widget.dart

@@ -32,20 +32,20 @@ class ActionsWidget extends StatelessWidget {
         Row(
           children: <Widget>[
         /// TODO: FEATURE_NOT_YET_IMPLEMENTED
-        // Expanded(
-        //   child: _ActionCard(
-        //     title: i18n.rapid,
-        //     subtitle: i18n.rapid_subtitle,
-        //     icon: UiIcons.zap,
-        //     color: const Color(0xFFFEF2F2),
-        //     borderColor: const Color(0xFFFECACA),
-        //     iconBgColor: const Color(0xFFFEE2E2),
-        //     iconColor: const Color(0xFFDC2626),
-        //     textColor: const Color(0xFF7F1D1D),
-        //     subtitleColor: const Color(0xFFB91C1C),
-        //     onTap: onRapidPressed,
-        //   ),
-        // ),
+        Expanded(
+          child: _ActionCard(
+            title: i18n.rapid,
+            subtitle: i18n.rapid_subtitle,
+            icon: UiIcons.zap,
+            color: UiColors.tagError,
+            borderColor: UiColors.borderError.withValues(alpha: 0.3),
+            iconBgColor: UiColors.white,
+            iconColor: UiColors.textError,
+            textColor: UiColors.textError,
+            subtitleColor: UiColors.textError.withValues(alpha: 0.8),
+            onTap: onRapidPressed,
+          ),
+        ),
         // const SizedBox(width: UiConstants.space2),
         Expanded(
           child: _ActionCard(

apps/mobile/packages/features/client/home/lib/src/presentation/widgets/coverage_dashboard.dart

@@ -47,11 +47,11 @@ class CoverageDashboard extends StatelessWidget {
 
     final bool isCoverageGood = coveragePercent >= 90;
     final Color coverageBadgeColor = isCoverageGood
-        ? const Color(0xFFD1FAE5) // TODO: Use design system color if available
-        : const Color(0xFFFEF3C7);
+        ? UiColors.tagSuccess
+        : UiColors.tagPending;
     final Color coverageTextColor = isCoverageGood
-        ? const Color(0xFF047857)
-        : const Color(0xFFB45309);
+        ? UiColors.textSuccess
+        : UiColors.textWarning;
 
     return Container(
       padding: const EdgeInsets.all(UiConstants.space4),
@@ -163,26 +163,26 @@ class _StatusCard extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    Color bg = const Color(0xFFF1F5F9);
-    Color border = const Color(0xFFE2E8F0);
+    Color bg = UiColors.bgSecondary;
+    Color border = UiColors.border;
     Color iconColor = UiColors.iconSecondary;
     Color textColor = UiColors.textPrimary;
 
     if (isWarning) {
-      bg = const Color(0xFFFFFBEB);
-      border = const Color(0xFFFDE68A);
-      iconColor = const Color(0xFFD97706);
-      textColor = const Color(0xFFB45309);
+      bg = UiColors.tagPending;
+      border = UiColors.borderStill;
+      iconColor = UiColors.textWarning;
+      textColor = UiColors.textWarning;
     } else if (isError) {
-      bg = const Color(0xFFFEF2F2);
-      border = const Color(0xFFFECACA);
-      iconColor = const Color(0xFFDC2626);
-      textColor = const Color(0xFFB91C1C);
+      bg = UiColors.tagError;
+      border = UiColors.borderError;
+      iconColor = UiColors.textError;
+      textColor = UiColors.textError;
     } else if (isInfo) {
-      bg = const Color(0xFFEFF6FF);
-      border = const Color(0xFFBFDBFE);
-      iconColor = const Color(0xFF2563EB);
-      textColor = const Color(0xFF1D4ED8);
+      bg = UiColors.tagInProgress;
+      border = UiColors.primary.withValues(alpha: 0.2);
+      iconColor = UiColors.primary;
+      textColor = UiColors.primary;
     }
 
     return Container(

apps/mobile/packages/features/client/home/lib/src/presentation/widgets/header_icon_button.dart

@@ -35,14 +35,14 @@ class HeaderIconButton extends StatelessWidget {
         clipBehavior: Clip.none,
         children: <Widget>[
           Container(
-            width: 32,
-            height: 32,
+            width: UiConstants.space8,
+            height: UiConstants.space8,
             decoration: BoxDecoration(
               color: isActive ? UiColors.primary : UiColors.white,
               borderRadius: UiConstants.radiusMd,
               boxShadow: <BoxShadow>[
                 BoxShadow(
-                  color: Colors.black.withValues(alpha: 0.05),
+                  color: UiColors.black.withValues(alpha: 0.05),
                   blurRadius: 2,
                 ),
               ],
@@ -50,20 +50,23 @@ class HeaderIconButton extends StatelessWidget {
             child: Icon(
               icon,
               color: isActive ? UiColors.white : UiColors.iconSecondary,
-              size: 16,
+              size: UiConstants.iconSm,
             ),
           ),
           if (badgeText != null)
             Positioned(
-              top: -4,
-              right: -4,
+              top: -UiConstants.space1,
+              right: -UiConstants.space1,
               child: Container(
-                padding: const EdgeInsets.all(4),
+                padding: const EdgeInsets.all(UiConstants.space1),
                 decoration: const BoxDecoration(
                   color: UiColors.iconError,
                   shape: BoxShape.circle,
                 ),
-                constraints: const BoxConstraints(minWidth: 16, minHeight: 16),
+                constraints: const BoxConstraints(
+                  minWidth: UiConstants.space4,
+                  minHeight: UiConstants.space4,
+                ),
                 child: Center(
                   child: Text(
                     badgeText!,

apps/mobile/packages/features/client/home/lib/src/presentation/widgets/shift_order_form_sheet.dart

@@ -613,9 +613,9 @@ class _ShiftOrderFormSheetState extends State<ShiftOrderFormSheet> {
 
     return Container(
       height: MediaQuery.of(context).size.height * 0.95,
-      decoration: const BoxDecoration(
+      decoration: BoxDecoration(
         color: UiColors.bgPrimary,
-        borderRadius: BorderRadius.vertical(top: Radius.circular(24)),
+        borderRadius: const BorderRadius.vertical(top: Radius.circular(UiConstants.space6)),
       ),
       child: Column(
         children: <Widget>[
@@ -773,10 +773,10 @@ class _ShiftOrderFormSheetState extends State<ShiftOrderFormSheet> {
           end: Alignment.bottomRight,
           colors: <Color>[
             UiColors.primary,
-            Color(0xFF1E3A8A),
+            UiColors.primary.withValues(alpha: 0.8),
           ],
         ),
-        borderRadius: BorderRadius.vertical(top: Radius.circular(24)),
+        borderRadius: const BorderRadius.vertical(top: Radius.circular(UiConstants.space6)),
       ),
       child: Row(
         children: <Widget>[

apps/mobile/packages/features/client/home/lib/src/presentation/widgets/spending_widget.dart

@@ -52,8 +52,11 @@ class SpendingWidget extends StatelessWidget {
         Container(
           padding: const EdgeInsets.all(UiConstants.space3),
           decoration: BoxDecoration(
-            gradient: const LinearGradient(
-              colors: <Color>[UiColors.primary, Color(0xFF0830B8)],
+            gradient: LinearGradient(
+              colors: <Color>[
+                UiColors.primary,
+                UiColors.primary.withValues(alpha: 0.85),
+              ],
               begin: Alignment.topLeft,
               end: Alignment.bottomRight,
             ),
@@ -74,9 +77,12 @@ class SpendingWidget extends StatelessWidget {
                     child: Column(
                       crossAxisAlignment: CrossAxisAlignment.start,
                       children: <Widget>[
-                        const Text(
+                        Text(
                           'This Week',
-                          style: TextStyle(color: Colors.white70, fontSize: 9),
+                          style: UiTypography.footnote2r.white.copyWith(
+                            color: UiColors.white.withValues(alpha: 0.7),
+                            fontSize: 9,
+                          ),
                         ),
                         const SizedBox(height: UiConstants.space1),
                         Text(
@@ -88,8 +94,8 @@ class SpendingWidget extends StatelessWidget {
                         ),
                         Text(
                           '$weeklyShifts shifts',
-                          style: TextStyle(
-                            color: Colors.white.withValues(alpha: 0.6),
+                          style: UiTypography.footnote2r.white.copyWith(
+                            color: UiColors.white.withValues(alpha: 0.6),
                             fontSize: 9,
                           ),
                         ),
@@ -100,9 +106,12 @@ class SpendingWidget extends StatelessWidget {
                     child: Column(
                       crossAxisAlignment: CrossAxisAlignment.end,
                       children: <Widget>[
-                        const Text(
+                        Text(
                           'Next 7 Days',
-                          style: TextStyle(color: Colors.white70, fontSize: 9),
+                          style: UiTypography.footnote2r.white.copyWith(
+                            color: UiColors.white.withValues(alpha: 0.7),
+                            fontSize: 9,
+                          ),
                         ),
                         const SizedBox(height: UiConstants.space1),
                         Text(
@@ -114,8 +123,8 @@ class SpendingWidget extends StatelessWidget {
                         ),
                         Text(
                           '$next7DaysScheduled scheduled',
-                          style: TextStyle(
-                            color: Colors.white.withValues(alpha: 0.6),
+                          style: UiTypography.footnote2r.white.copyWith(
+                            color: UiColors.white.withValues(alpha: 0.6),
                             fontSize: 9,
                           ),
                         ),