import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../../core/l10n/app_localizations.dart';
import 'package:go_router/go_router.dart';
import '../../../core/design/tokens.dart';
import '../../../core/ui/tripz_button.dart';
import '../bloc/trip_bloc.dart';
import '../bloc/trip_state.dart';
import '../bloc/trip_event.dart';

/// شاشة فاتورة الرحلة بعد الانتهاء.
class TripInvoiceScreen extends StatelessWidget {
  const TripInvoiceScreen({super.key});

  @override
  Widget build(BuildContext context) {
    final l10n = AppLocalizations.of(context)!;
    final cs = Theme.of(context).colorScheme;

    return BlocBuilder<TripBloc, TripState>(
      builder: (context, state) {
        final trip = state.trip;
        if (trip == null) {
          return Scaffold(
            appBar: AppBar(title: Text(l10n.rideCompleted)),
            body: const Center(child: CircularProgressIndicator()),
          );
        }

        final fare = trip.fare ?? 0;
        final currency = trip.currency ?? 'JOD';

        return Scaffold(
          appBar: AppBar(
            title: Text(l10n.rideCompleted),
            automaticallyImplyLeading: false,
          ),
          body: Padding(
            padding: const EdgeInsets.all(T.pagePadding),
            child: Column(
              children: [
                // أيقونة النجاح
                Container(
                  width: 80,
                  height: 80,
                  decoration: BoxDecoration(
                    color: Colors.green.withValues(alpha: 0.1),
                    shape: BoxShape.circle,
                  ),
                  child: const Icon(Icons.check_circle_rounded, size: 48, color: Colors.green),
                ),
                const SizedBox(height: T.s16),
                Text(
                  l10n.rideCompleted,
                  style: Theme.of(context).textTheme.headlineSmall?.copyWith(
                        fontWeight: FontWeight.w700,
                      ),
                ),
                const SizedBox(height: T.s24),

                // تفاصيل الأجرة
                Card(
                  child: Padding(
                    padding: const EdgeInsets.all(T.pagePadding),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.stretch,
                      children: [
                        Text(l10n.fareBreakdown,
                            style: Theme.of(context).textTheme.titleMedium?.copyWith(
                                  fontWeight: FontWeight.w600,
                                )),
                        const SizedBox(height: T.s12),
                        _FareRow(label: l10n.tripFare, value: '$fare $currency'),
                        if (trip.paymentMethod == 'wallet')
                          _FareRow(label: l10n.walletPayment, value: l10n.youPaid),
                        if (trip.paymentMethod == 'cash')
                          _FareRow(label: l10n.cash, value: l10n.payCash),
                        const Divider(height: T.s16),
                        _FareRow(
                          label: l10n.total,
                          value: '$fare $currency',
                          bold: true,
                        ),
                      ],
                    ),
                  ),
                ),

                const Spacer(),

                // أزرار الإجراءات
                TripzButton(
                  label: l10n.rateYourTrip,
                  onPressed: () => context.push('/trip-rating'),
                ),
                const SizedBox(height: T.s8),
                TextButton(
                  onPressed: () {
                    context.read<TripBloc>().add(const TripClear());
                    context.go('/home');
                  },
                  child: Text(l10n.skipRating),
                ),
              ],
            ),
          ),
        );
      },
    );
  }
}

class _FareRow extends StatelessWidget {
  final String label;
  final String value;
  final bool bold;

  const _FareRow({required this.label, required this.value, this.bold = false});

  @override
  Widget build(BuildContext context) {
    final style = bold
        ? Theme.of(context).textTheme.titleMedium?.copyWith(fontWeight: FontWeight.w700)
        : Theme.of(context).textTheme.bodyMedium;
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 4),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Text(label, style: style),
          Text(value, style: style),
        ],
      ),
    );
  }
}