feat(design-system): dark mode adaptatif sur widgets partagés

Pattern AppColors pair (isDark ? AppColors.surfaceDark : AppColors.surface)
appliqué sur :
- UnionStatWidget, UnionBalanceCard, UnionActionButton, UFSectionHeader
- DashboardEventRow, DashboardActivityRow, UnionExportButton
- MiniAvatar (border adaptatif)
- ConfirmationDialog (cancel colors adaptés)
- FileUploadWidget (textSecondary adaptatif)

Les couleurs surface/border/textPrimary/textSecondary hardcodées (light-only)
sont remplacées par les paires *Dark conditionnelles.
Les couleurs sémantiques (error, success, warning, primary) restent inchangées.

lib/shared/design_system/components/dashboard_activity_row.dart

@@ -1,8 +1,9 @@
 import 'package:flutter/material.dart';
+import '../tokens/app_colors.dart';
 import '../tokens/unionflow_colors.dart';
 
-/// Ligne d'activité récente — style fintech compact identique au super_admin
+/// Ligne d'activité récente — style fintech compact
-/// Icône dans carré arrondi 28×28 + titre + description + timestamp
+/// Adaptatif dark/light via AppColors
 class DashboardActivityRow extends StatelessWidget {
   final String title;
   final String description;
@@ -21,13 +22,20 @@ class DashboardActivityRow extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final isDark        = Theme.of(context).brightness == Brightness.dark;
+    final bgColor       = isDark ? AppColors.surfaceDark      : AppColors.surface;
+    final borderColor   = isDark ? AppColors.borderDark       : AppColors.border;
+    final textPrimary   = isDark ? AppColors.textPrimaryDark  : AppColors.textPrimary;
+    final textSecondary = isDark ? AppColors.textSecondaryDark: AppColors.textSecondary;
+    final textTertiary  = isDark ? AppColors.textSecondaryDark: AppColors.textTertiary;
+
     return Container(
       margin: const EdgeInsets.only(bottom: 6),
       padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 9),
       decoration: BoxDecoration(
-        color: UnionFlowColors.surface,
+        color: bgColor,
         borderRadius: BorderRadius.circular(8),
-        border: Border.all(color: UnionFlowColors.border),
+        border: Border.all(color: borderColor),
       ),
       child: Row(
         children: [
@@ -35,7 +43,7 @@ class DashboardActivityRow extends StatelessWidget {
             width: 28,
             height: 28,
             decoration: BoxDecoration(
-              color: color.withOpacity(0.12),
+              color: color.withOpacity(isDark ? 0.2 : 0.12),
               borderRadius: BorderRadius.circular(6),
             ),
             child: Icon(icon, size: 14, color: color),
@@ -47,20 +55,13 @@ class DashboardActivityRow extends StatelessWidget {
               children: [
                 Text(
                   title,
-                  style: const TextStyle(
+                  style: TextStyle(fontSize: 12, fontWeight: FontWeight.w600, color: textPrimary),
-                    fontSize: 12,
-                    fontWeight: FontWeight.w600,
-                    color: UnionFlowColors.textPrimary,
-                  ),
                   maxLines: 1,
                   overflow: TextOverflow.ellipsis,
                 ),
                 Text(
                   description,
-                  style: const TextStyle(
+                  style: TextStyle(fontSize: 10, color: textSecondary),
-                    fontSize: 10,
-                    color: UnionFlowColors.textSecondary,
-                  ),
                   maxLines: 1,
                   overflow: TextOverflow.ellipsis,
                 ),
@@ -68,10 +69,7 @@ class DashboardActivityRow extends StatelessWidget {
             ),
           ),
           const SizedBox(width: 8),
-          Text(
+          Text(timeAgo, style: TextStyle(fontSize: 10, color: textTertiary)),
-            timeAgo,
-            style: const TextStyle(fontSize: 10, color: UnionFlowColors.textTertiary),
-          ),
         ],
       ),
     );
@@ -80,28 +78,20 @@ class DashboardActivityRow extends StatelessWidget {
   /// Icône selon le type d'activité
   static IconData iconFor(String type) {
     switch (type) {
-      case 'member':
+      case 'member':       return Icons.person_add_rounded;
-        return Icons.person_add_rounded;
+      case 'event':        return Icons.event_rounded;
-      case 'event':
+      case 'contribution': return Icons.payments_rounded;
-        return Icons.event_rounded;
+      default:             return Icons.circle_notifications_rounded;
-      case 'contribution':
-        return Icons.payments_rounded;
-      default:
-        return Icons.circle_notifications_rounded;
     }
   }
 
   /// Couleur selon le type d'activité
   static Color colorFor(String type) {
     switch (type) {
-      case 'member':
+      case 'member':       return UnionFlowColors.unionGreen;
-        return UnionFlowColors.unionGreen;
+      case 'event':        return UnionFlowColors.info;
-      case 'event':
+      case 'contribution': return UnionFlowColors.gold;
-        return UnionFlowColors.info;
+      default:             return AppColors.textSecondary;
-      case 'contribution':
-        return UnionFlowColors.gold;
-      default:
-        return UnionFlowColors.textSecondary;
     }
   }
 }

lib/shared/design_system/components/dashboard_event_row.dart

@@ -1,8 +1,9 @@
 import 'package:flutter/material.dart';
+import '../tokens/app_colors.dart';
 import '../tokens/unionflow_colors.dart';
 
 /// Ligne d'événement à venir — style fintech avec bordure gauche verte
-/// Titre + date + countdown optionnel + participants optionnel
+/// Adaptatif dark/light via AppColors
 class DashboardEventRow extends StatelessWidget {
   final String title;
   final String date;
@@ -19,11 +20,17 @@ class DashboardEventRow extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final isDark       = Theme.of(context).brightness == Brightness.dark;
+    final bgColor      = isDark ? AppColors.surfaceDark      : AppColors.surface;
+    final textPrimary  = isDark ? AppColors.textPrimaryDark  : AppColors.textPrimary;
+    final textSecondary= isDark ? AppColors.textSecondaryDark: AppColors.textSecondary;
+    final textTertiary = isDark ? AppColors.textSecondaryDark: AppColors.textTertiary;
+
     return Container(
       margin: const EdgeInsets.only(bottom: 6),
       padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 9),
       decoration: BoxDecoration(
-        color: UnionFlowColors.surface,
+        color: bgColor,
         borderRadius: BorderRadius.circular(8),
         border: const Border(
           left: BorderSide(color: UnionFlowColors.unionGreen, width: 3),
@@ -37,21 +44,14 @@ class DashboardEventRow extends StatelessWidget {
               children: [
                 Text(
                   title,
-                  style: const TextStyle(
+                  style: TextStyle(fontSize: 12, fontWeight: FontWeight.w600, color: textPrimary),
-                    fontSize: 12,
-                    fontWeight: FontWeight.w600,
-                    color: UnionFlowColors.textPrimary,
-                  ),
                   maxLines: 1,
                   overflow: TextOverflow.ellipsis,
                 ),
                 const SizedBox(height: 2),
                 Text(
                   date,
-                  style: const TextStyle(
+                  style: TextStyle(fontSize: 10, color: textSecondary),
-                    fontSize: 10,
-                    color: UnionFlowColors.textSecondary,
-                  ),
                 ),
               ],
             ),
@@ -73,10 +73,7 @@ class DashboardEventRow extends StatelessWidget {
                   const SizedBox(height: 2),
                   Text(
                     participants!,
-                    style: const TextStyle(
+                    style: TextStyle(fontSize: 10, color: textTertiary),
-                      fontSize: 10,
-                      color: UnionFlowColors.textTertiary,
-                    ),
                   ),
                 ],
               ],

lib/shared/design_system/components/uf_section_header.dart

@@ -1,8 +1,8 @@
 import 'package:flutter/material.dart';
-import '../tokens/unionflow_colors.dart';
+import '../tokens/app_colors.dart';
 
 /// En-tête de section dashboard — titre 13px w700 avec trailing optionnel
-/// Style de référence : super_admin_dashboard._buildSectionHeader
+/// Adaptatif dark/light via AppColors
 class UFSectionHeader extends StatelessWidget {
   final String title;
 
@@ -13,24 +13,21 @@ class UFSectionHeader extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final isDark        = Theme.of(context).brightness == Brightness.dark;
+    final titleColor    = isDark ? AppColors.textPrimaryDark   : AppColors.textPrimary;
+    final trailingColor = isDark ? AppColors.textSecondaryDark : AppColors.textTertiary;
+
     return Row(
       children: [
         Text(
           title,
-          style: const TextStyle(
+          style: TextStyle(fontSize: 13, fontWeight: FontWeight.w700, color: titleColor),
-            fontSize: 13,
-            fontWeight: FontWeight.w700,
-            color: UnionFlowColors.textPrimary,
-          ),
         ),
         if (trailing != null && trailing!.isNotEmpty) ...[
           const SizedBox(width: 6),
           Text(
             '· $trailing',
-            style: const TextStyle(
+            style: TextStyle(fontSize: 11, color: trailingColor),
-              fontSize: 11,
-              color: UnionFlowColors.textTertiary,
-            ),
           ),
         ],
       ],

lib/shared/design_system/components/union_action_button.dart

@@ -1,9 +1,9 @@
 import 'package:flutter/material.dart';
+import '../tokens/app_colors.dart';
 import '../tokens/unionflow_colors.dart';
 
 /// Bouton d'action rapide UnionFlow
-/// Style fintech : fond blanc, icône + texte colorés, bordure grise légère
+/// Adaptatif dark/light via AppColors
-/// Copie exacte du style _buildActionCell du super_admin_dashboard
 class UnionActionButton extends StatelessWidget {
   final IconData icon;
   final String label;
@@ -22,7 +22,9 @@ class UnionActionButton extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    // backgroundColor sert d'accent (icône + texte), iconColor prend la priorité
+    final isDark      = Theme.of(context).brightness == Brightness.dark;
+    final bgColor     = isDark ? AppColors.surfaceDark : AppColors.surface;
+    final borderColor = isDark ? AppColors.borderDark  : AppColors.border;
     final accentColor = iconColor ?? backgroundColor ?? UnionFlowColors.unionGreen;
 
     return InkWell(
@@ -31,9 +33,9 @@ class UnionActionButton extends StatelessWidget {
       child: Container(
         padding: const EdgeInsets.symmetric(vertical: 9, horizontal: 8),
         decoration: BoxDecoration(
-          color: UnionFlowColors.surface,
+          color: bgColor,
           borderRadius: BorderRadius.circular(10),
-          border: Border.all(color: UnionFlowColors.border),
+          border: Border.all(color: borderColor),
         ),
         child: Row(
           mainAxisAlignment: MainAxisAlignment.center,

lib/shared/design_system/components/union_balance_card.dart

@@ -1,7 +1,9 @@
 import 'package:flutter/material.dart';
+import '../tokens/app_colors.dart';
 import '../tokens/unionflow_colors.dart';
 
-/// Card de balance UnionFlow - Affichage élégant du solde principal
+/// Card de balance UnionFlow — Affichage élégant du solde principal
+/// Adaptatif dark/light via AppColors
 class UnionBalanceCard extends StatelessWidget {
   final String label;
   final String amount;
@@ -20,14 +22,20 @@ class UnionBalanceCard extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final isDark       = Theme.of(context).brightness == Brightness.dark;
+    final bgColor      = isDark ? AppColors.surfaceDark      : AppColors.surface;
+    final borderColor  = isDark ? AppColors.borderDark       : AppColors.border;
+    final textPrimary  = isDark ? AppColors.textPrimaryDark  : AppColors.textPrimary;
+    final textSecondary= isDark ? AppColors.textSecondaryDark: AppColors.textSecondary;
+
     return GestureDetector(
       onTap: onTap,
       child: ClipRRect(
         borderRadius: BorderRadius.circular(10),
         child: Container(
           decoration: BoxDecoration(
-            color: UnionFlowColors.surface,
+            color: bgColor,
-            border: Border.all(color: UnionFlowColors.border),
+            border: Border.all(color: borderColor),
           ),
           child: Column(
             mainAxisSize: MainAxisSize.min,
@@ -43,20 +51,20 @@ class UnionBalanceCard extends StatelessWidget {
                         children: [
                           Text(
                             label.toUpperCase(),
-                            style: const TextStyle(
+                            style: TextStyle(
                               fontSize: 9,
                               fontWeight: FontWeight.w600,
-                              color: UnionFlowColors.textSecondary,
+                              color: textSecondary,
                               letterSpacing: 0.8,
                             ),
                           ),
                           const SizedBox(height: 4),
                           Text(
                             amount,
-                            style: const TextStyle(
+                            style: TextStyle(
                               fontSize: 22,
                               fontWeight: FontWeight.w800,
-                              color: UnionFlowColors.textPrimary,
+                              color: textPrimary,
                               height: 1,
                               letterSpacing: -0.5,
                             ),
@@ -76,8 +84,8 @@ class UnionBalanceCard extends StatelessWidget {
                                     : Icons.arrow_downward_rounded,
                                 size: 11,
                                 color: isTrendPositive == true
-                                    ? UnionFlowColors.success
+                                    ? AppColors.success
-                                    : UnionFlowColors.error,
+                                    : AppColors.error,
                               ),
                               const SizedBox(width: 2),
                               Text(
@@ -86,15 +94,15 @@ class UnionBalanceCard extends StatelessWidget {
                                   fontSize: 12,
                                   fontWeight: FontWeight.w700,
                                   color: isTrendPositive == true
-                                      ? UnionFlowColors.success
+                                      ? AppColors.success
-                                      : UnionFlowColors.error,
+                                      : AppColors.error,
                                 ),
                               ),
                             ],
                           ),
-                          const Text(
+                          Text(
                             'ce mois',
-                            style: TextStyle(fontSize: 9, color: UnionFlowColors.textTertiary),
+                            style: TextStyle(fontSize: 9, color: textSecondary),
                           ),
                         ],
                       ),

lib/shared/design_system/components/union_export_button.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import '../tokens/app_colors.dart';
 import '../tokens/unionflow_colors.dart';
 
 /// Type d'export disponible
@@ -12,7 +13,7 @@ enum ExportType {
   const ExportType(this.label, this.icon);
 }
 
-/// Bouton d'export avec options
+/// Bouton d'export avec options — adaptatif dark/light via AppColors
 class UnionExportButton extends StatelessWidget {
   final Function(ExportType) onExport;
   final bool isLoading;
@@ -25,6 +26,10 @@ class UnionExportButton extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final isDark   = Theme.of(context).brightness == Brightness.dark;
+    final bgPopup  = isDark ? AppColors.surfaceDark     : AppColors.surface;
+    final textColor= isDark ? AppColors.textPrimaryDark : AppColors.textPrimary;
+
     return PopupMenuButton<ExportType>(
       icon: Container(
         padding: const EdgeInsets.all(10),
@@ -42,29 +47,21 @@ class UnionExportButton extends StatelessWidget {
                   valueColor: AlwaysStoppedAnimation<Color>(Colors.white),
                 ),
               )
-            : const Icon(
+            : const Icon(Icons.download, color: Colors.white, size: 20),
-                Icons.download,
-                color: Colors.white,
-                size: 20,
-              ),
       ),
       itemBuilder: (context) => ExportType.values.map((type) {
         return PopupMenuItem<ExportType>(
           value: type,
           child: Row(
             children: [
-              Icon(
+              Icon(type.icon, size: 20, color: UnionFlowColors.unionGreen),
-                type.icon,
-                size: 20,
-                color: UnionFlowColors.unionGreen,
-              ),
               const SizedBox(width: 12),
               Text(
                 'Exporter en ${type.label}',
-                style: const TextStyle(
+                style: TextStyle(
                   fontSize: 13,
                   fontWeight: FontWeight.w600,
-                  color: UnionFlowColors.textPrimary,
+                  color: textColor,
                 ),
               ),
             ],
@@ -72,16 +69,14 @@ class UnionExportButton extends StatelessWidget {
         );
       }).toList(),
       onSelected: onExport,
-      shape: RoundedRectangleBorder(
+      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
-        borderRadius: BorderRadius.circular(12),
-      ),
       elevation: 8,
-      color: UnionFlowColors.surface,
+      color: bgPopup,
     );
   }
 }
 
-/// Dialog pour confirmer l'export
+/// Dialog pour confirmer l'export — adaptatif dark/light via AppColors
 class ExportConfirmDialog extends StatelessWidget {
   final ExportType exportType;
   final VoidCallback onConfirm;
@@ -96,11 +91,14 @@ class ExportConfirmDialog extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final isDark        = Theme.of(context).brightness == Brightness.dark;
+    final bgColor       = isDark ? AppColors.surfaceDark      : AppColors.surface;
+    final textPrimary   = isDark ? AppColors.textPrimaryDark  : AppColors.textPrimary;
+    final textSecondary = isDark ? AppColors.textSecondaryDark: AppColors.textSecondary;
+
     return AlertDialog(
-      shape: RoundedRectangleBorder(
+      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
-        borderRadius: BorderRadius.circular(20),
+      backgroundColor: bgColor,
-      ),
-      backgroundColor: UnionFlowColors.surface,
       title: Row(
         children: [
           Container(
@@ -109,39 +107,27 @@ class ExportConfirmDialog extends StatelessWidget {
               color: UnionFlowColors.unionGreen.withOpacity(0.1),
               borderRadius: BorderRadius.circular(12),
             ),
-            child: Icon(
+            child: Icon(exportType.icon, color: UnionFlowColors.unionGreen, size: 24),
-              exportType.icon,
-              color: UnionFlowColors.unionGreen,
-              size: 24,
-            ),
           ),
           const SizedBox(width: 12),
-          Text(
+          Expanded(
-            'Exporter en ${exportType.label}',
+            child: Text(
-            style: const TextStyle(
+              'Exporter en ${exportType.label}',
-              fontSize: 16,
+              style: TextStyle(fontSize: 16, fontWeight: FontWeight.w700, color: textPrimary),
-              fontWeight: FontWeight.w700,
-              color: UnionFlowColors.textPrimary,
             ),
           ),
         ],
       ),
       content: Text(
         message ?? 'Voulez-vous exporter le rapport au format ${exportType.label}?',
-        style: const TextStyle(
+        style: TextStyle(fontSize: 14, color: textSecondary),
-          fontSize: 14,
-          color: UnionFlowColors.textSecondary,
-        ),
       ),
       actions: [
         TextButton(
           onPressed: () => Navigator.pop(context),
-          child: const Text(
+          child: Text(
             'Annuler',
-            style: TextStyle(
+            style: TextStyle(color: textSecondary, fontWeight: FontWeight.w600),
-              color: UnionFlowColors.textSecondary,
-              fontWeight: FontWeight.w600,
-            ),
           ),
         ),
         ElevatedButton(
@@ -152,15 +138,10 @@ class ExportConfirmDialog extends StatelessWidget {
           style: ElevatedButton.styleFrom(
             backgroundColor: UnionFlowColors.unionGreen,
             foregroundColor: Colors.white,
-            shape: RoundedRectangleBorder(
+            shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
-              borderRadius: BorderRadius.circular(12),
-            ),
             elevation: 0,
           ),
-          child: const Text(
+          child: const Text('Confirmer', style: TextStyle(fontWeight: FontWeight.w700)),
-            'Confirmer',
-            style: TextStyle(fontWeight: FontWeight.w700),
-          ),
         ),
       ],
     );

lib/shared/design_system/components/union_stat_widget.dart

@@ -1,8 +1,8 @@
 import 'package:flutter/material.dart';
-import '../tokens/unionflow_colors.dart';
+import '../tokens/app_colors.dart';
 
 /// Widget de statistique compacte — style identique à _buildKpiCell du super admin
-/// fond blanc, bordure gauche colorée, icône + valeur + label
+/// Fond adaptatif dark/light via AppColors, bordure gauche colorée, icône + valeur + label
 /// [compact] réduit le padding vertical pour les grilles très plates
 class UnionStatWidget extends StatelessWidget {
   final String label;
@@ -28,6 +28,10 @@ class UnionStatWidget extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final isDark = Theme.of(context).brightness == Brightness.dark;
+    final bgColor     = isDark ? AppColors.surfaceDark     : AppColors.surface;
+    final labelColor  = isDark ? AppColors.textSecondaryDark : AppColors.textSecondary;
+
     final EdgeInsets pad = compact
         ? const EdgeInsets.symmetric(horizontal: 8, vertical: 5)
         : const EdgeInsets.all(6);
@@ -35,7 +39,7 @@ class UnionStatWidget extends StatelessWidget {
     return Container(
       padding: pad,
       decoration: BoxDecoration(
-        color: UnionFlowColors.surface,
+        color: bgColor,
         borderRadius: BorderRadius.circular(10),
         border: Border(left: BorderSide(color: color, width: 3)),
       ),
@@ -51,11 +55,7 @@ class UnionStatWidget extends StatelessWidget {
                 const Spacer(),
                 Text(
                   trend!,
-                  style: TextStyle(
+                  style: TextStyle(fontSize: 8, fontWeight: FontWeight.w700, color: color),
-                    fontSize: 8,
-                    fontWeight: FontWeight.w700,
-                    color: color,
-                  ),
                 ),
               ],
             ],
@@ -74,11 +74,7 @@ class UnionStatWidget extends StatelessWidget {
           SizedBox(height: compact ? 1 : 2),
           Text(
             label,
-            style: const TextStyle(
+            style: TextStyle(fontSize: 9, fontWeight: FontWeight.w500, color: labelColor),
-              fontSize: 9,
-              fontWeight: FontWeight.w500,
-              color: UnionFlowColors.textSecondary,
-            ),
             maxLines: 1,
             overflow: TextOverflow.ellipsis,
           ),

lib/shared/widgets/confirmation_dialog.dart

@@ -3,6 +3,7 @@
 library confirmation_dialog;
 
 import 'package:flutter/material.dart';
+import '../design_system/tokens/app_colors.dart';
 
 /// Type d'action pour personnaliser l'apparence du dialogue
 enum ConfirmationAction {
@@ -70,7 +71,7 @@ class ConfirmationDialog extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    final colors = _getColors();
+    final colors = _getColors(context);
     
     return AlertDialog(
       shape: RoundedRectangleBorder(
@@ -159,43 +160,44 @@ class ConfirmationDialog extends StatelessWidget {
     }
   }
 
-  Map<String, Color> _getColors() {
+  Map<String, Color> _getColors(BuildContext context) {
+    final isDark = Theme.of(context).brightness == Brightness.dark;
     switch (action) {
       case ConfirmationAction.delete:
         return {
-          'icon': Colors.red,
+          'icon': AppColors.error,
-          'title': Colors.red[700]!,
+          'title': AppColors.error,
-          'button': Colors.red,
+          'button': AppColors.error,
         };
       case ConfirmationAction.deactivate:
         return {
-          'icon': Colors.orange,
+          'icon': AppColors.warning,
-          'title': Colors.orange[700]!,
+          'title': AppColors.warning,
-          'button': Colors.orange,
+          'button': AppColors.warning,
         };
       case ConfirmationAction.activate:
         return {
-          'icon': Colors.green,
+          'icon': AppColors.success,
-          'title': Colors.green[700]!,
+          'title': AppColors.success,
-          'button': Colors.green,
+          'button': AppColors.success,
         };
       case ConfirmationAction.cancel:
         return {
-          'icon': Colors.grey,
+          'icon': isDark ? AppColors.textSecondaryDark : AppColors.textTertiary,
-          'title': Colors.grey[700]!,
+          'title': isDark ? AppColors.textSecondaryDark : AppColors.textSecondary,
-          'button': Colors.grey,
+          'button': isDark ? AppColors.textSecondaryDark : AppColors.textTertiary,
         };
       case ConfirmationAction.warning:
         return {
-          'icon': Colors.amber,
+          'icon': AppColors.warningUI,
-          'title': Colors.amber[700]!,
+          'title': AppColors.warning,
-          'button': Colors.amber,
+          'button': AppColors.warningUI,
         };
       case ConfirmationAction.info:
         return {
-          'icon': Colors.blue,
+          'icon': AppColors.info,
-          'title': Colors.blue[700]!,
+          'title': AppColors.primary,
-          'button': Colors.blue,
+          'button': AppColors.info,
         };
     }
   }

lib/shared/widgets/file_upload_widget.dart

@@ -2,6 +2,7 @@ import 'dart:io';
 import 'package:flutter/material.dart';
 import 'package:file_picker/file_picker.dart';
 import 'package:image_picker/image_picker.dart';
+import '../design_system/tokens/app_colors.dart';
 
 /// Widget réutilisable pour uploader un fichier (image ou PDF)
 /// avec prévisualisation et validation
@@ -105,7 +106,7 @@ class _FileUploadWidgetState extends State<FileUploadWidget> {
       ScaffoldMessenger.of(context).showSnackBar(
         SnackBar(
           content: Text(message),
-          backgroundColor: Colors.red,
+          backgroundColor: AppColors.error,
         ),
       );
     }
@@ -179,7 +180,7 @@ class _FileUploadWidgetState extends State<FileUploadWidget> {
                 ),
                 if (_selectedFile != null)
                   IconButton(
-                    icon: const Icon(Icons.delete, color: Colors.red),
+                    icon: const Icon(Icons.delete, color: AppColors.error),
                     onPressed: _removeFile,
                   ),
               ],
@@ -202,7 +203,7 @@ class _FileUploadWidgetState extends State<FileUploadWidget> {
                   width: double.infinity,
                   decoration: BoxDecoration(
                     borderRadius: BorderRadius.circular(8),
-                    border: Border.all(color: Colors.grey.shade300),
+                    border: Border.all(color: AppColors.borderStrong),
                   ),
                   child: ClipRRect(
                     borderRadius: BorderRadius.circular(8),
@@ -218,13 +219,13 @@ class _FileUploadWidgetState extends State<FileUploadWidget> {
                   width: double.infinity,
                   decoration: BoxDecoration(
                     borderRadius: BorderRadius.circular(8),
-                    border: Border.all(color: Colors.grey.shade300),
+                    border: Border.all(color: AppColors.borderStrong),
                   ),
                   child: const Center(
                     child: Column(
                       mainAxisAlignment: MainAxisAlignment.center,
                       children: [
-                        Icon(Icons.picture_as_pdf, size: 48, color: Colors.red),
+                        Icon(Icons.picture_as_pdf, size: 48, color: AppColors.error),
                         SizedBox(height: 8),
                         Text('Document PDF'),
                       ],
@@ -234,7 +235,11 @@ class _FileUploadWidgetState extends State<FileUploadWidget> {
               const SizedBox(height: 8),
               Text(
                 _selectedFile!.path.split('/').last,
-                style: TextStyle(color: Colors.grey.shade700),
+                style: TextStyle(
+                  color: Theme.of(context).brightness == Brightness.dark
+                      ? AppColors.textSecondaryDark
+                      : AppColors.textSecondary,
+                ),
                 maxLines: 1,
                 overflow: TextOverflow.ellipsis,
               ),
@@ -244,7 +249,7 @@ class _FileUploadWidgetState extends State<FileUploadWidget> {
               'Formats acceptés: JPEG, PNG, PDF (max 5 MB)',
               style: TextStyle(
                 fontSize: 12,
-                color: Colors.grey.shade600,
+                color: AppColors.textTertiary,
               ),
             ),
           ],

lib/shared/widgets/mini_avatar.dart

@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:cached_network_image/cached_network_image.dart';
 import '../design_system/tokens/app_colors.dart';
 import '../design_system/tokens/app_typography.dart';
+import '../design_system/tokens/color_tokens.dart';
 
 /// UnionFlow Mobile - Composant DRY : MiniAvatar
 /// Évite toute répétition de configuration d'image de profil.
@@ -28,6 +29,9 @@ class MiniAvatar extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final isDark = Theme.of(context).brightness == Brightness.dark;
+    final borderColor = isDark ? AppColors.borderDark : AppColors.border;
+
     return Stack(
       children: [
         Container(
@@ -35,11 +39,8 @@ class MiniAvatar extends StatelessWidget {
           height: size,
           decoration: BoxDecoration(
             shape: BoxShape.circle,
-            color: backgroundColor ?? AppColors.primaryGreen.withOpacity(0.1),
+            color: backgroundColor ?? AppColors.primary.withOpacity(isDark ? 0.2 : 0.1),
-            border: Border.all(
+            border: Border.all(color: borderColor, width: 0.5),
-              color: AppColors.lightBorder,
-              width: 0.5,
-            ),
           ),
           child: ClipOval(
             child: isIcon 
@@ -80,7 +81,7 @@ class MiniAvatar extends StatelessWidget {
       child: Text(
         fallbackText.toUpperCase(),
         style: AppTypography.actionText.copyWith(
-          color: iconColor ?? AppColors.primaryGreen,
+          color: iconColor ?? AppColors.primary,
           fontSize: size * 0.4,
         ),
       ),
@@ -99,7 +100,7 @@ class MiniAvatar extends StatelessWidget {
     return Center(
       child: Icon(
         iconData,
-        color: iconColor ?? AppColors.primaryGreen,
+        color: iconColor ?? AppColors.primary,
         size: size * 0.6,
       ),
     );