import 'package:bot_toast/bot_toast.dart';
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';

class PaymentNotificationCard extends StatelessWidget {
  final VoidCallback onBindCard;
  final VoidCallback onClose;

  const PaymentNotificationCard({
    super.key,
    required this.onBindCard,
    required this.onClose,
  });

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 20),
      child: Stack(
        clipBehavior: Clip.none,
        children: [
          Container(
            padding: const EdgeInsets.fromLTRB(24, 10, 20, 24),
            decoration: BoxDecoration(
              color: const Color(0xFF2D2B4D),
              borderRadius: BorderRadius.circular(32),
            ),
            child: Column(
              mainAxisSize: MainAxisSize.min,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                const SizedBox(height: 8),
                Padding(
                  padding: const EdgeInsets.only(left: 64),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      const Text(
                        'Не привязана карта',
                        style: TextStyle(
                          color: Colors.white,
                          fontSize: 18,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      const SizedBox(height: 12),
                      const Text(
                        'Привяжите карту, чтобы начать поездку',
                        style: TextStyle(
                          color: Colors.white70,
                          fontSize: 14,
                          height: 1.2,
                        ),
                      ),
                      const SizedBox(height: 8),
                      FilledButton(
                        onPressed: onBindCard,
                        style: FilledButton.styleFrom(
                          backgroundColor: const Color(0xFF0D0B26),
                          padding: const EdgeInsets.symmetric(
                            horizontal: 20,
                            vertical: 10,
                          ),
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(24),
                          ),
                        ),
                        child: const Row(
                          children: [
                            const Icon(
                              Icons.credit_card,
                              color: Color(0xFF80FFD1),
                              size: 28,
                            ),
                            const SizedBox(width: 16),
                            const Expanded(
                              child: Text(
                                'Привязать карту',
                                style: TextStyle(
                                  color: Colors.white,
                                  fontSize: 14,
                                  fontWeight: FontWeight.w500,
                                ),
                              ),
                            ),
                            Icon(
                              Icons.add,
                              color: Colors.cyanAccent,
                              size: 20,
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),

          Positioned(
            top: -20,
            left: -30,
            child: Image.asset(
              'assets/icons/card-screen.png',
              width: 120,
              height: 120,
              fit: BoxFit.contain,
            ),
          ),

          Positioned(
            top: 15,
            right: 15,
            child: GestureDetector(
              onTap: onClose,
              child: Container(
                padding: const EdgeInsets.all(6),
                decoration: BoxDecoration(
                  color: Colors.white.withOpacity(0.2),
                  shape: BoxShape.circle,
                ),
                child: const Icon(Icons.close, color: Colors.white70, size: 20),
              ),
            ),
          ),
        ],
      ),
    );
  }
}