feat: implement core architecture, design system, localization, and trip features for both driver and rider apps.

apps/driver/lib/features/home/cubit/driver_cubit.dart

@@ -0,0 +1,118 @@
+import 'dart:async';
+import 'package:equatable/equatable.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import '../data/driver_repository.dart';
+import '../data/driver_location_service.dart';
+import '../data/models/driver_profile_model.dart';
+
+/// حالة DriverCubit.
+class DriverState extends Equatable {
+  final DriverProfileModel? profile;
+  final bool loading;
+  final bool online;
+  final String? error;
+
+  const DriverState({
+    this.profile,
+    this.loading = true,
+    this.online = false,
+    this.error,
+  });
+
+  DriverState copyWith({
+    DriverProfileModel? profile,
+    bool? loading,
+    bool? online,
+    String? error,
+    bool clearError = false,
+  }) {
+    return DriverState(
+      profile: profile ?? this.profile,
+      loading: loading ?? this.loading,
+      online: online ?? this.online,
+      error: clearError ? null : (error ?? this.error),
+    );
+  }
+
+  @override
+  List<Object?> get props => [profile, loading, online, error];
+}
+
+/// Cubit مُتّصل/مُنقطع — يدير ملف السائق وتبديل الحالة وموقع الخلفية.
+///
+/// يُقدّم:
+/// - جلب الملف عند بدء التشغيل
+/// - تبديل الحالة (online/offline)
+/// - بدء/إيقاف تتبع الموقع عند التنشيط
+class DriverCubit extends Cubit<DriverState> {
+  final DriverRepository _repo;
+  DriverLocationService? _locationService;
+  Timer? _heartbeatTimer;
+
+  DriverCubit(this._repo) : super(const DriverState(loading: true));
+
+  /// جلب ملف السائق وتحديد الحالة الأولية.
+  Future<void> loadProfile() async {
+    try {
+      final profile = await _repo.getProfile();
+      if (profile != null) {
+        emit(state.copyWith(
+          profile: profile,
+          online: profile.online,
+          loading: false,
+        ));
+        // إذا كان مُتصلاً مسبقاً، أعد بدء التتبع.
+        if (profile.online) {
+          _startLocationTracking();
+        }
+      } else {
+        emit(state.copyWith(loading: false));
+      }
+    } catch (e) {
+      emit(state.copyWith(loading: false, error: e.toString()));
+    }
+  }
+
+  /// تبديل الحالة (مُتصل/مُنقطع).
+  Future<void> toggleOnline() async {
+    final newOnline = !state.online;
+    emit(state.copyWith(online: newOnline));
+
+    final result = await _repo.setOnline(newOnline);
+    if (!result) {
+      // فشل — أعد الحالة السابقة.
+      emit(state.copyWith(online: !newOnline));
+      return;
+    }
+
+    if (newOnline) {
+      _startLocationTracking();
+    } else {
+      _stopLocationTracking();
+    }
+  }
+
+  /// بدء تتبع الموقع.
+  void _startLocationTracking() {
+    if (_locationService?.isActive == true) return;
+
+    _locationService = DriverLocationService((lat, lng, {heading, speed}) async {
+      await _repo.sendLocation(lat: lat, lng: lng, heading: heading, speed: speed);
+    });
+    _locationService!.start();
+  }
+
+  /// إيقاف تتبع الموقع.
+  void _stopLocationTracking() {
+    _locationService?.stop();
+    _locationService = null;
+    _heartbeatTimer?.cancel();
+    _heartbeatTimer = null;
+  }
+
+  @override
+  Future<void> close() {
+    _stopLocationTracking();
+    return super.close();
+  }
+}

apps/driver/lib/features/home/data/driver_location_service.dart

@@ -0,0 +1,91 @@
+import 'dart:async';
+import 'package:geolocator/geolocator.dart';
+
+/// خدمة موقع السائق — تتبع الموقع في الخلفية وإرساله للسيرفر.
+///
+/// تتبع 3 ثوانٍ عند التنشيط، ثم إرسال كل دقيقتين (docs/23 §10).
+/// تراعي حالة البطارية وتتوقف عند انخفاضها.
+class DriverLocationService {
+  final Future<void> Function(double lat, double lng, {double? heading, double? speed})
+      _onLocationUpdate;
+
+  StreamSubscription<Position>? _positionSub;
+  Timer? _heartbeatTimer;
+  bool _active = false;
+
+  DriverLocationService(this._onLocationUpdate);
+
+  bool get isActive => _active;
+
+  /// بدء التتبع.
+  Future<void> start() async {
+    if (_active) return;
+
+    // تحقق من صلاحية الموقع.
+    var permission = await Geolocator.checkPermission();
+    if (permission == LocationPermission.denied) {
+      permission = await Geolocator.requestPermission();
+      if (permission == LocationPermission.denied ||
+          permission == LocationPermission.deniedForever) {
+        return;
+      }
+    }
+
+    _active = true;
+
+    // أرسل الموقع فوراً.
+    _sendCurrentLocation();
+
+    // استمع لتحديثات الموقع كل 3 ثوانٍ.
+    _positionSub = Geolocator.getPositionStream(
+      locationSettings: const LocationSettings(
+        accuracy: LocationAccuracy.high,
+        distanceFilter: 15, // تحديث عند تغيير 15 متر
+      ),
+    ).listen((pos) {
+      _onLocationUpdate(
+        pos.latitude,
+        pos.longitude,
+        heading: pos.heading,
+        speed: pos.speed,
+      );
+    });
+
+    // دفعة كل دقيقتين كحد أقصى.
+    _heartbeatTimer = Timer.periodic(const Duration(minutes: 2), (_) {
+      _sendCurrentLocation();
+    });
+  }
+
+  /// إيقاف التتبع.
+  void stop() {
+    _active = false;
+    _positionSub?.cancel();
+    _positionSub = null;
+    _heartbeatTimer?.cancel();
+    _heartbeatTimer = null;
+  }
+
+  /// إرسال الموقع الحالي مرة واحدة.
+  Future<void> _sendCurrentLocation() async {
+    try {
+      final pos = await Geolocator.getCurrentPosition(
+        locationSettings: const LocationSettings(
+          accuracy: LocationAccuracy.high,
+        ),
+      );
+      await _onLocationUpdate(
+        pos.latitude,
+        pos.longitude,
+        heading: pos.heading,
+        speed: pos.speed,
+      );
+    } catch (_) {
+      // خطأ صامت — سيحاول مرة أخرى مع الدقيقة التالية.
+    }
+  }
+
+  void dispose() {
+    stop();
+  }
+}

apps/driver/lib/features/home/data/driver_repository.dart

@@ -0,0 +1,50 @@
+import '../../../core/api/api_client.dart';
+import 'models/driver_profile_model.dart';
+
+/// مستودع بيانات السائق — يُستخدم من DriverCubit.
+class DriverRepository {
+  final ApiClient _api;
+  DriverRepository(this._api);
+
+  /// `GET /drivers/me` — جلب ملف السائق.
+  Future<DriverProfileModel?> getProfile() async {
+    try {
+      final r = await _api.dio.get('/drivers/me');
+      return DriverProfileModel.fromJson(r.data as Map<String, dynamic>);
+    } catch (_) {
+      return null;
+    }
+  }
+
+  /// `PATCH /drivers/status` — تبديل الحالة (مُتصل/مُنقطع).
+  Future<bool> setOnline(bool online) async {
+    try {
+      final r = await _api.dio.patch('/drivers/status', data: {'online': online});
+      return r.data['online'] as bool? ?? online;
+    } catch (_) {
+      return false;
+    }
+  }
+
+  /// `POST /drivers/location` — إرسال الموقع الحالي.
+  ///
+  /// يُعيد `true` إذا كان الموقع "مُهماً" (تغيير كبير حسب السيرفر).
+  Future<bool> sendLocation({
+    required double lat,
+    required double lng,
+    double? heading,
+    double? speed,
+  }) async {
+    try {
+      final r = await _api.dio.post('/drivers/location', data: {
+        'lat': lat,
+        'lng': lng,
+        if (heading != null) 'heading': heading,
+        if (speed != null) 'speed': speed,
+      });
+      return r.data['significant'] as bool? ?? false;
+    } catch (_) {
+      return false;
+    }
+  }
+}

apps/driver/lib/features/home/data/models/driver_profile_model.dart

@@ -0,0 +1,94 @@
+import 'package:equatable/equatable.dart';
+
+/// نموذج بيانات السائق — من `GET /drivers/me`.
+class DriverProfileModel extends Equatable {
+  final String id;
+  final String phone;
+  final String? name;
+  final bool online;
+  final double? lat;
+  final double? lng;
+  final String? vehicleMake;
+  final String? vehicleModel;
+  final int? vehicleYear;
+  final String? vehicleColor;
+  final String? plateNumber;
+  final String? serviceClass;
+  final double? rating;
+  final int? totalTrips;
+  final int? creditBalance;
+
+  const DriverProfileModel({
+    required this.id,
+    required this.phone,
+    this.name,
+    this.online = false,
+    this.lat,
+    this.lng,
+    this.vehicleMake,
+    this.vehicleModel,
+    this.vehicleYear,
+    this.vehicleColor,
+    this.plateNumber,
+    this.serviceClass,
+    this.rating,
+    this.totalTrips,
+    this.creditBalance,
+  });
+
+  factory DriverProfileModel.fromJson(Map<String, dynamic> j) =>
+      DriverProfileModel(
+        id: j['id'] as String,
+        phone: (j['phone'] ?? '') as String,
+        name: j['name'] as String?,
+        online: j['online'] as bool? ?? false,
+        lat: (j['lat'] as num?)?.toDouble(),
+        lng: (j['lng'] as num?)?.toDouble(),
+        vehicleMake: j['vehicleMake'] as String?,
+        vehicleModel: j['vehicleModel'] as String?,
+        vehicleYear: j['vehicleYear'] as int?,
+        vehicleColor: j['vehicleColor'] as String?,
+        plateNumber: j['plateNumber'] as String?,
+        serviceClass: j['serviceClass'] as String?,
+        rating: (j['rating'] as num?)?.toDouble(),
+        totalTrips: j['totalTrips'] as int?,
+        creditBalance: j['creditBalance'] as int?,
+      );
+
+  DriverProfileModel copyWith({
+    String? name,
+    bool? online,
+    double? lat,
+    double? lng,
+    String? vehicleMake,
+    String? vehicleModel,
+    int? vehicleYear,
+    String? vehicleColor,
+    String? plateNumber,
+    String? serviceClass,
+    double? rating,
+    int? totalTrips,
+    int? creditBalance,
+  }) {
+    return DriverProfileModel(
+      id: id,
+      phone: phone,
+      name: name ?? this.name,
+      online: online ?? this.online,
+      lat: lat ?? this.lat,
+      lng: lng ?? this.lng,
+      vehicleMake: vehicleMake ?? this.vehicleMake,
+      vehicleModel: vehicleModel ?? this.vehicleModel,
+      vehicleYear: vehicleYear ?? this.vehicleYear,
+      vehicleColor: vehicleColor ?? this.vehicleColor,
+      plateNumber: plateNumber ?? this.plateNumber,
+      serviceClass: serviceClass ?? this.serviceClass,
+      rating: rating ?? this.rating,
+      totalTrips: totalTrips ?? this.totalTrips,
+      creditBalance: creditBalance ?? this.creditBalance,
+    );
+  }
+
+  @override
+  List<Object?> get props => [id, phone, name, online, vehicleMake, vehicleModel, plateNumber];
+}

apps/driver/lib/features/home/data/models/trip_offer_model.dart

@@ -0,0 +1,62 @@
+import 'package:equatable/equatable.dart';
+
+/// عرض رحلة وارد — من `trip:offer` عبر WebSocket.
+///
+/// يحتوي على كل المعلومات التي يحتاجها السائق للقبول/الرفض.
+/// المهلة الزمنية (`expiresAt`) تُدار من OffersBloc.
+class TripOfferModel extends Equatable {
+  final String tripId;
+  final double pickupLat;
+  final double pickupLng;
+  final String? pickupAddress;
+  final double dropoffLat;
+  final double dropoffLng;
+  final String? dropoffAddress;
+  final double distance;
+  final num fare;
+  final String currency;
+  final int etaPickup;
+  final String vehicleClass;
+  final DateTime expiresAt;
+
+  const TripOfferModel({
+    required this.tripId,
+    required this.pickupLat,
+    required this.pickupLng,
+    this.pickupAddress,
+    required this.dropoffLat,
+    required this.dropoffLng,
+    this.dropoffAddress,
+    required this.distance,
+    required this.fare,
+    required this.currency,
+    required this.etaPickup,
+    required this.vehicleClass,
+    required this.expiresAt,
+  });
+
+  factory TripOfferModel.fromJson(Map<String, dynamic> j) => TripOfferModel(
+        tripId: j['tripId'] as String,
+        pickupLat: (j['pickup']?['lat'] ?? 0).toDouble(),
+        pickupLng: (j['pickup']?['lng'] ?? 0).toDouble(),
+        pickupAddress: j['pickup']?['address'] as String?,
+        dropoffLat: (j['dropoff']?['lat'] ?? 0).toDouble(),
+        dropoffLng: (j['dropoff']?['lng'] ?? 0).toDouble(),
+        dropoffAddress: j['dropoff']?['address'] as String?,
+        distance: (j['distance'] ?? 0).toDouble(),
+        fare: (j['fare'] ?? 0) as num,
+        currency: (j['currency'] ?? 'IQD') as String,
+        etaPickup: (j['etaPickup'] ?? 0) as int,
+        vehicleClass: (j['vehicleClass'] ?? '') as String,
+        expiresAt: DateTime.parse(j['expiresAt'] as String),
+      );
+
+  /// المسافة المنسقة (كم مع خانتين عشريتين).
+  String get formattedDistance => '${distance.toStringAsFixed(1)} km';
+
+  /// الأجرة المنسقة.
+  String get formattedFare => '$fare $currency';
+
+  @override
+  List<Object?> get props => [tripId, pickupLat, pickupLng, fare, expiresAt];
+}

apps/driver/lib/features/home/view/home_screen.dart

@@ -1,45 +1,189 @@
 import 'package:flutter/material.dart';
+import 'package:driver/core/l10n/app_localizations.dart';
+import 'package:intaleq_maps/intaleq_maps.dart';
+import 'package:driver/core/design/tokens.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
-import '../../auth/cubit/auth_cubit.dart';
-import '../../auth/cubit/auth_state.dart';
+import 'package:driver/features/home/cubit/driver_cubit.dart';
+import 'package:driver/features/offers/bloc/offers_bloc.dart';
+import 'widgets/driver_status_indicator.dart';
+import 'widgets/trip_offer_card.dart';
+import 'dart:async';
 
-/// شاشة السائق الرئيسية — هيكل مؤقّت (Q3).
-///
-/// ما سيُبنى هنا لاحقاً حسب docs/22 (المجموعة Q3): مفتاح الاتصال/الانقطاع ·
-/// overlay العرض الوارد · widgets الرحلة · الرصيد والشحن. ولا يُعاد اختراع
-/// **متحكّم الموقع**: نمط سيرو مثبت عملياً (تسجيل ٣ث · دفعات كل دقيقتين ·
-/// وعي بالبطارية) — راجع docs/23 §10.
-class HomeScreen extends StatelessWidget {
+/// شاشة السائق الرئيسية — خريطة + مفتاح الاتصال/الانقطاع + overlay العروض.
+class HomeScreen extends StatefulWidget {
   const HomeScreen({super.key});
 
+  @override
+  State<HomeScreen> createState() => _HomeScreenState();
+}
+
+class _HomeScreenState extends State<HomeScreen> {
+  final Completer<IntaleqMapController> _mapController = Completer();
+
   @override
   Widget build(BuildContext context) {
+    final l10n = AppLocalizations.of(context)!;
+    final cs = Theme.of(context).colorScheme;
+
     return Scaffold(
-      appBar: AppBar(
-        title: const Text('تطبيق السائق'),
-        actions: [
-          IconButton(
-            icon: const Icon(Icons.logout),
-            onPressed: () => context.read<AuthCubit>().logout(),
+      body: Stack(
+        children: [
+          // ── الخريطة ──
+          _buildMap(cs),
+
+          // ── شريط الحالة العلوي ──
+          Positioned(
+            top: MediaQuery.of(context).padding.top + T.s8,
+            left: T.s16,
+            right: T.s16,
+            child: _buildTopBar(context, l10n, cs),
           ),
+
+          // ── مؤشر حالة السائق ──
+          Positioned(
+            bottom: T.s24,
+            left: T.s16,
+            right: T.s16,
+            child: const DriverStatusIndicator(),
+          ),
+
+          // ── overlay العروض الواردة ──
+          const _OffersOverlay(),
         ],
       ),
-      body: BlocBuilder<AuthCubit, AuthState>(
-        builder: (context, state) {
-          return Center(
-            child: Column(
-              mainAxisAlignment: MainAxisAlignment.center,
-              children: [
-                const Icon(Icons.local_taxi, size: 72),
-                const SizedBox(height: 16),
-                Text('أهلاً ${state.user?.name ?? state.user?.phone ?? ''}'),
-                const SizedBox(height: 8),
-                const Text('لوحة السائق قيد البناء (Q3)'),
+    );
+  }
+
+  Widget _buildMap(ColorScheme cs) {
+    return BlocBuilder<DriverCubit, DriverState>(
+      builder: (context, state) {
+        final driverLat = state.profile?.lat ?? 33.3128;
+        final driverLng = state.profile?.lng ?? 44.3615;
+
+        return IntaleqMap(
+          apiKey: '',
+          initialCameraPosition: CameraPosition(
+            target: LatLng(driverLat, driverLng),
+            zoom: 14,
+          ),
+          myLocationEnabled: true,
+          myLocationButtonEnabled: false,
+          zoomControlsEnabled: false,
+          onMapCreated: (controller) {
+            if (!_mapController.isCompleted) {
+              _mapController.complete(controller);
+            }
+          },
+        );
+      },
+    );
+  }
+
+  Widget _buildTopBar(BuildContext context, AppLocalizations l10n, ColorScheme cs) {
+    return SafeArea(
+      child: Row(
+        children: [
+          // زر القائمة
+          Container(
+            decoration: BoxDecoration(
+              color: cs.surface,
+              borderRadius: BorderRadius.circular(T.rCircle),
+              boxShadow: [
+                BoxShadow(
+                  color: Colors.black.withValues(alpha: 0.08),
+                  blurRadius: 8,
+                  offset: const Offset(0, 2),
+                ),
               ],
             ),
-          );
-        },
+            child: IconButton(
+              icon: const Icon(Icons.menu_rounded),
+              onPressed: () {
+                // TODO: Q4 drawer
+              },
+            ),
+          ),
+          const Spacer(),
+          // معلومات السائق
+          Container(
+            padding: const EdgeInsets.symmetric(
+              horizontal: T.s12,
+              vertical: T.s8,
+            ),
+            decoration: BoxDecoration(
+              color: cs.surface,
+              borderRadius: BorderRadius.circular(T.r12),
+              boxShadow: [
+                BoxShadow(
+                  color: Colors.black.withValues(alpha: 0.08),
+                  blurRadius: 8,
+                  offset: const Offset(0, 2),
+                ),
+              ],
+            ),
+            child: Row(
+              children: [
+                Icon(Icons.star_rounded, size: 18, color: Colors.amber[600]),
+                const SizedBox(width: T.s4),
+                Text(
+                  '${context.read<DriverCubit>().state.profile?.rating?.toStringAsFixed(1) ?? "-"}',
+                  style: Theme.of(context).textTheme.bodyMedium?.copyWith(
+                        fontWeight: FontWeight.w600,
+                      ),
+                ),
+              ],
+            ),
+          ),
+        ],
       ),
     );
   }
 }
+
+/// overlay يعرض العروض الواردة كبطاقات في أسفل الشاشة.
+class _OffersOverlay extends StatelessWidget {
+  const _OffersOverlay();
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocBuilder<OffersBloc, OffersState>(
+      builder: (context, state) {
+        if (!state.hasOffers) return const SizedBox.shrink();
+
+        return Positioned(
+          bottom: 100,
+          left: T.s16,
+          right: T.s16,
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              // عدد العروض
+              if (state.offers.length > 1)
+                Container(
+                  margin: const EdgeInsets.only(bottom: T.s8),
+                  padding: const EdgeInsets.symmetric(
+                    horizontal: T.s12,
+                    vertical: T.s4,
+                  ),
+                  decoration: BoxDecoration(
+                    color: Theme.of(context).colorScheme.primary,
+                    borderRadius: BorderRadius.circular(T.rCircle),
+                  ),
+                  child: Text(
+                    '${state.offers.length} ${AppLocalizations.of(context)!.offersAvailable}',
+                    style: Theme.of(context).textTheme.bodySmall?.copyWith(
+                          color: Theme.of(context).colorScheme.onPrimary,
+                          fontWeight: FontWeight.w600,
+                        ),
+                  ),
+                ),
+
+              // العرض الأحدث
+              TripOfferCard(offer: state.offers.first),
+            ],
+          ),
+        );
+      },
+    );
+  }
+}

apps/driver/lib/features/home/view/widgets/driver_status_indicator.dart

@@ -0,0 +1,133 @@
+import 'package:flutter/material.dart';
+import 'package:driver/core/l10n/app_localizations.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:driver/core/design/tokens.dart';
+import 'package:driver/core/design/tripz_colors.dart';
+import 'package:driver/features/home/cubit/driver_cubit.dart';
+
+/// مؤشر حالة السائق — يعرض "مُتصل" أو "مُنقطع" مع زر التبديل.
+class DriverStatusIndicator extends StatelessWidget {
+  const DriverStatusIndicator({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final l10n = AppLocalizations.of(context)!;
+    final cs = Theme.of(context).colorScheme;
+
+    return BlocBuilder<DriverCubit, DriverState>(
+      builder: (context, state) {
+        final isOnline = state.online;
+
+        return Container(
+          padding: const EdgeInsets.symmetric(
+            horizontal: T.s16,
+            vertical: T.s12,
+          ),
+          decoration: BoxDecoration(
+            color: cs.surface,
+            borderRadius: BorderRadius.circular(T.r12),
+            boxShadow: [
+              BoxShadow(
+                color: Colors.black.withValues(alpha: 0.1),
+                blurRadius: 12,
+                offset: const Offset(0, -4),
+              ),
+            ],
+          ),
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              // معلومات السائق
+              if (state.profile != null)
+                Padding(
+                  padding: const EdgeInsets.only(bottom: T.s8),
+                  child: Row(
+                    children: [
+                      CircleAvatar(
+                        radius: 20,
+                        backgroundColor: cs.primaryContainer,
+                        child: Icon(Icons.person, color: cs.onPrimaryContainer),
+                      ),
+                      const SizedBox(width: T.s12),
+                      Expanded(
+                        child: Column(
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: [
+                            Text(
+                              state.profile!.name ?? l10n.anonymous,
+                              style: Theme.of(context)
+                                  .textTheme
+                                  .bodyMedium
+                                  ?.copyWith(
+                                    fontWeight: FontWeight.w600,
+                                  ),
+                            ),
+                            if (state.profile!.vehicleMake != null)
+                              Text(
+                                '${state.profile!.vehicleMake} ${state.profile!.vehicleModel ?? ""} · ${state.profile!.plateNumber ?? ""}',
+                                style: Theme.of(context)
+                                    .textTheme
+                                    .bodySmall
+                                    ?.copyWith(
+                                      color: cs.onSurfaceVariant,
+                                    ),
+                              ),
+                          ],
+                        ),
+                      ),
+                    ],
+                  ),
+                ),
+
+              // زر التبديل
+              SizedBox(
+                width: double.infinity,
+                height: T.buttonHeight,
+                child: ElevatedButton(
+                  onPressed: state.loading
+                      ? null
+                      : () => context.read<DriverCubit>().toggleOnline(),
+                  style: ElevatedButton.styleFrom(
+                    backgroundColor: isOnline
+                        ? context.tripzColors.danger
+                        : cs.primary,
+                    foregroundColor: isOnline ? Colors.white : cs.onPrimary,
+                    shape: RoundedRectangleBorder(
+                      borderRadius: BorderRadius.circular(T.r12),
+                    ),
+                    elevation: 0,
+                  ),
+                  child: state.loading
+                      ? const SizedBox(
+                          width: 20,
+                          height: 20,
+                          child: CircularProgressIndicator(strokeWidth: 2),
+                        )
+                      : Row(
+                          mainAxisAlignment: MainAxisAlignment.center,
+                          children: [
+                            Icon(
+                              isOnline
+                                  ? Icons.stop_rounded
+                                  : Icons.play_arrow_rounded,
+                              size: 24,
+                            ),
+                            const SizedBox(width: T.s8),
+                            Text(
+                              isOnline ? l10n.goOffline : l10n.goOnline,
+                              style: const TextStyle(
+                                fontSize: 16,
+                                fontWeight: FontWeight.w600,
+                              ),
+                            ),
+                          ],
+                        ),
+                ),
+              ),
+            ],
+          ),
+        );
+      },
+    );
+  }
+}

apps/driver/lib/features/home/view/widgets/trip_offer_card.dart

@@ -0,0 +1,287 @@
+import 'dart:async';
+import 'package:flutter/material.dart';
+import 'package:driver/core/l10n/app_localizations.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:driver/core/design/tokens.dart';
+import 'package:driver/core/design/tripz_colors.dart';
+import 'package:driver/features/home/data/models/trip_offer_model.dart';
+import 'package:driver/features/offers/bloc/offers_bloc.dart';
+
+/// بطاقة عرض الرحلة الواردة — تُعرض في overlay.
+///
+/// تتضمن:
+/// - نقاط pickup/dropoff على الخريطة المصغرة
+/// - معلومات المسافة والأجرة والوقت
+/// - عداد تنازلي للمهلة
+/// - أزرار قبول/رفض
+class TripOfferCard extends StatefulWidget {
+  final TripOfferModel offer;
+
+  const TripOfferCard({super.key, required this.offer});
+
+  @override
+  State<TripOfferCard> createState() => _TripOfferCardState();
+}
+
+class _TripOfferCardState extends State<TripOfferCard> {
+  Timer? _countdownTimer;
+  int _remainingSeconds = 0;
+
+  @override
+  void initState() {
+    super.initState();
+    _remainingSeconds = widget.offer.expiresAt.difference(DateTime.now()).inSeconds;
+    _countdownTimer = Timer.periodic(const Duration(seconds: 1), (_) {
+      if (!mounted) return;
+      setState(() {
+        _remainingSeconds = widget.offer.expiresAt.difference(DateTime.now()).inSeconds;
+        if (_remainingSeconds <= 0) {
+          _countdownTimer?.cancel();
+        }
+      });
+    });
+  }
+
+  @override
+  void dispose() {
+    _countdownTimer?.cancel();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final l10n = AppLocalizations.of(context)!;
+    final cs = Theme.of(context).colorScheme;
+
+    final progress = _remainingSeconds > 0
+        ? (_remainingSeconds / 30.0).clamp(0.0, 1.0)
+        : 0.0;
+
+    return Container(
+      constraints: const BoxConstraints(maxHeight: 280),
+      decoration: BoxDecoration(
+        color: cs.surface,
+        borderRadius: BorderRadius.circular(T.r12),
+        boxShadow: [
+          BoxShadow(
+            color: Colors.black.withValues(alpha: 0.12),
+            blurRadius: 16,
+            offset: const Offset(0, 4),
+          ),
+        ],
+      ),
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          // شريط التقدم (العد التنازلي)
+          LinearProgressIndicator(
+            value: progress,
+            backgroundColor: cs.surfaceContainerHighest,
+            valueColor: AlwaysStoppedAnimation<Color>(
+              _remainingSeconds > 10 ? cs.primary : context.tripzColors.danger,
+            ),
+            minHeight: 4,
+          ),
+
+          Padding(
+            padding: const EdgeInsets.all(T.s16),
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                // الأجرة + العداد
+                Row(
+                  children: [
+                    Text(
+                      widget.offer.formattedFare,
+                      style: Theme.of(context).textTheme.headlineSmall?.copyWith(
+                            fontWeight: FontWeight.bold,
+                            color: cs.primary,
+                          ),
+                    ),
+                    const Spacer(),
+                    Container(
+                      padding: const EdgeInsets.symmetric(
+                        horizontal: T.s8,
+                        vertical: T.s4,
+                      ),
+                      decoration: BoxDecoration(
+                        color: _remainingSeconds > 10
+                            ? cs.primaryContainer
+                            : context.tripzColors.danger.withValues(alpha: 0.1),
+                        borderRadius: BorderRadius.circular(T.r8),
+                      ),
+                      child: Text(
+                        '${_remainingSeconds > 0 ? _remainingSeconds : 0}s',
+                        style: Theme.of(context).textTheme.bodySmall?.copyWith(
+                              fontWeight: FontWeight.w600,
+                              color: _remainingSeconds > 10
+                                  ? cs.onPrimaryContainer
+                                  : context.tripzColors.danger,
+                            ),
+                      ),
+                    ),
+                  ],
+                ),
+
+                const SizedBox(height: T.s12),
+
+                // المسافة والوقت
+                Row(
+                  children: [
+                    _InfoChip(
+                      icon: Icons.straighten,
+                      label: widget.offer.formattedDistance,
+                    ),
+                    const SizedBox(width: T.s8),
+                    _InfoChip(
+                      icon: Icons.access_time,
+                      label: '${widget.offer.etaPickup} ${l10n.min}',
+                    ),
+                    const SizedBox(width: T.s8),
+                    _InfoChip(
+                      icon: Icons.local_taxi,
+                      label: widget.offer.vehicleClass,
+                    ),
+                  ],
+                ),
+
+                const SizedBox(height: T.s12),
+
+                // نقاط pickup وdropoff
+                _LocationDot(
+                  color: const Color(0xFF4CAF50),
+                  label: widget.offer.pickupAddress ?? l10n.pickupLocation,
+                ),
+                Padding(
+                  padding: const EdgeInsets.only(left: 7),
+                  child: Container(
+                    width: 2,
+                    height: T.s16,
+                    color: cs.outlineVariant,
+                  ),
+                ),
+                _LocationDot(
+                  color: const Color(0xFFF44336),
+                  label: widget.offer.dropoffAddress ?? l10n.dropoffLocation,
+                ),
+
+                const SizedBox(height: T.s16),
+
+                // أزرار القبول/الرفض
+                Row(
+                  children: [
+                    Expanded(
+                      child: OutlinedButton(
+                        onPressed: () {
+                          context.read<OffersBloc>().add(
+                                OfferRejected(widget.offer.tripId),
+                              );
+                        },
+                        style: OutlinedButton.styleFrom(
+                          foregroundColor: cs.error,
+                          side: BorderSide(color: cs.error),
+                          shape: RoundedRectangleBorder(
+                            borderRadius: BorderRadius.circular(T.r12),
+                          ),
+                          minimumSize: const Size(0, T.buttonHeight),
+                        ),
+                        child: Text(l10n.reject),
+                      ),
+                    ),
+                    const SizedBox(width: T.s12),
+                    Expanded(
+                      child: ElevatedButton(
+                        onPressed: () {
+                          context.read<OffersBloc>().add(
+                                OfferAccepted(widget.offer.tripId),
+                              );
+                        },
+                        style: ElevatedButton.styleFrom(
+                          backgroundColor: cs.primary,
+                          foregroundColor: cs.onPrimary,
+                          shape: RoundedRectangleBorder(
+                            borderRadius: BorderRadius.circular(T.r12),
+                          ),
+                          minimumSize: const Size(0, T.buttonHeight),
+                          elevation: 0,
+                        ),
+                        child: Text(l10n.accept),
+                      ),
+                    ),
+                  ],
+                ),
+              ],
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+/// رقاقة معلومات صغيرة (مسافة / وقت / فئة).
+class _InfoChip extends StatelessWidget {
+  final IconData icon;
+  final String label;
+
+  const _InfoChip({required this.icon, required this.label});
+
+  @override
+  Widget build(BuildContext context) {
+    final cs = Theme.of(context).colorScheme;
+
+    return Container(
+      padding: const EdgeInsets.symmetric(horizontal: T.s8, vertical: T.s4),
+      decoration: BoxDecoration(
+        color: cs.surfaceContainerHighest,
+        borderRadius: BorderRadius.circular(T.r8),
+      ),
+      child: Row(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          Icon(icon, size: 14, color: cs.onSurfaceVariant),
+          const SizedBox(width: 4),
+          Text(
+            label,
+            style: Theme.of(context).textTheme.bodySmall?.copyWith(
+                  color: cs.onSurfaceVariant,
+                ),
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+/// نقطة موقع مع لون وعنوان.
+class _LocationDot extends StatelessWidget {
+  final Color color;
+  final String label;
+
+  const _LocationDot({required this.color, required this.label});
+
+  @override
+  Widget build(BuildContext context) {
+    return Row(
+      children: [
+        Container(
+          width: 12,
+          height: 12,
+          decoration: BoxDecoration(
+            color: color,
+            shape: BoxShape.circle,
+          ),
+        ),
+        const SizedBox(width: T.s8),
+        Expanded(
+          child: Text(
+            label,
+            style: Theme.of(context).textTheme.bodyMedium,
+            maxLines: 1,
+            overflow: TextOverflow.ellipsis,
+          ),
+        ),
+      ],
+    );
+  }
+}