import 'dart:ui';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';

class PricingScreen extends StatefulWidget {
  const PricingScreen({super.key});

  @override
  State<PricingScreen> createState() => _PricingScreenState();
}

class _PricingScreenState extends State<PricingScreen> {
  bool _isYearly = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color(0xFF0A0B17),
      appBar: AppBar(
        backgroundColor: Colors.transparent,
        elevation: 0,
        title: Text("Pricing Plans", 
          style: GoogleFonts.nunito(color: Colors.white, fontWeight: FontWeight.bold)),
        leading: IconButton(
          icon: const Icon(Icons.arrow_back, color: Colors.white),
          onPressed: () => Navigator.pop(context),
        ),
      ),
      body: Stack(
        children: [
          // Background Glows
          Positioned(top: 100, left: -50, child: _buildGlowBlob(const Color(0xFF1D8BE0), 150)),
          Positioned(bottom: 50, right: -50, child: _buildGlowBlob(const Color(0xFFEC4899), 150)),

          SingleChildScrollView(
            padding: const EdgeInsets.all(24),
            child: Column(
              children: [
                Text(
                  "Choose Your Plan",
                  style: GoogleFonts.nunito(
                    color: Colors.white,
                    fontSize: 32,
                    fontWeight: FontWeight.w800,
                  ),
                ),
                const SizedBox(height: 8),
                Text(
                  "Unlock premium features and grow your social presence.",
                  textAlign: TextAlign.center,
                  style: GoogleFonts.nunito(
                    color: Colors.white.withOpacity(0.6),
                    fontSize: 16,
                  ),
                ),
                const SizedBox(height: 32),

                // Billing Toggle
                Container(
                  padding: const EdgeInsets.all(4),
                  decoration: BoxDecoration(
                    color: Colors.white.withOpacity(0.05),
                    borderRadius: BorderRadius.circular(50),
                  ),
                  child: Row(
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      _buildToggleButton("Monthly", !_isYearly),
                      _buildToggleButton("Yearly (Save 20%)", _isYearly),
                    ],
                  ),
                ),
                const SizedBox(height: 40),
                
                // Free Trial
                _buildPricingCard(
                  title: "7-Day Free Trial",
                  price: "\$0",
                  duration: "7 Days",
                  desc: "Experience SocialBuddy with no commitment.",
                  features: ["Full Platform Access", "All Premium Features", "No Credits Required", "Cancel Anytime"],
                  isPopular: false,
                  color: Colors.cyanAccent,
                  buttonText: "START FREE TRIAL",
                ),
                const SizedBox(height: 24),

                // Basic Buddy
                _buildPricingCard(
                  title: "Basic Buddy",
                  price: _isYearly ? "\$100" : "\$10",
                  duration: _isYearly ? "Year" : "Month",
                  desc: "Perfect for individual creators.",
                  features: ["1 Social Profile", "Basic Analytics", "Content Scheduling", "Standard Support"],
                  isPopular: false,
                  color: Colors.blueAccent,
                ),
                const SizedBox(height: 24),

                // Standard Buddy
                _buildPricingCard(
                  title: "Standard Buddy",
                  price: _isYearly ? "\$500" : "\$50",
                  duration: _isYearly ? "Year" : "Month",
                  desc: "For growing businesses and influencers.",
                  features: ["10 Social Profiles", "Advanced Analytics", "AI Content Generation", "Priority Support", "Team Collaboration (3)"],
                  isPopular: true,
                  color: const Color(0xFFEC4899),
                ),
                const SizedBox(height: 24),

                // Premium Buddy
                _buildPricingCard(
                  title: "Premium Buddy",
                  price: _isYearly ? "\$1500" : "\$150",
                  duration: _isYearly ? "Year" : "Month",
                  desc: "Ultimate solution for agencies.",
                  features: ["25 Social Profiles", "White Label Reports", "Dedicated Account Manager", "API Access", "Unlimited Team Members"],
                  isPopular: false,
                  color: Colors.purpleAccent,
                ),
                const SizedBox(height: 40),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildToggleButton(String label, bool isActive) {
    return GestureDetector(
      onTap: () => setState(() => _isYearly = label.contains("Yearly")),
      child: Container(
        padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(50),
          gradient: isActive 
            ? const LinearGradient(colors: [Color(0xFF4361EE), Color(0xFFC026D3)])
            : null,
          color: isActive ? null : Colors.transparent,
        ),
        child: Text(
          label,
          style: GoogleFonts.nunito(
            color: isActive ? Colors.white : Colors.white38,
            fontWeight: FontWeight.bold,
            fontSize: 14,
          ),
        ),
      ),
    );
  }

  Widget _buildPricingCard({
    required String title,
    required String price,
    required String duration,
    required String desc,
    required List<String> features,
    required bool isPopular,
    required Color color,
    String buttonText = "GET STARTED",
  }) {
    return Container(
      width: double.infinity,
      decoration: BoxDecoration(
        color: const Color(0xFF1A1D26).withOpacity(0.8),
        borderRadius: BorderRadius.circular(24),
        border: Border.all(
          color: isPopular ? color : Colors.white.withOpacity(0.1),
          width: isPopular ? 2 : 1,
        ),
      ),
      child: Stack(
        children: [
          if (isPopular)
            Positioned(
              top: 0,
              right: 0,
              child: Container(
                padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
                decoration: BoxDecoration(
                  color: color,
                  borderRadius: const BorderRadius.only(
                    topRight: Radius.circular(22),
                    bottomLeft: Radius.circular(24),
                  ),
                ),
                child: const Text(
                  "POPULAR",
                  style: TextStyle(color: Colors.white, fontSize: 10, fontWeight: FontWeight.bold),
                ),
              ),
            ),
          Padding(
            padding: const EdgeInsets.all(28),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  title,
                  style: GoogleFonts.nunito(
                    color: Colors.white,
                    fontSize: 22,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                const SizedBox(height: 8),
                Text(
                  desc,
                  style: GoogleFonts.nunito(color: Colors.white54, fontSize: 14),
                ),
                const SizedBox(height: 24),
                Row(
                  crossAxisAlignment: CrossAxisAlignment.end,
                  children: [
                    Text(
                      price,
                      style: GoogleFonts.nunito(
                        color: Colors.white,
                        fontSize: 40,
                        fontWeight: FontWeight.w800,
                      ),
                    ),
                    Padding(
                      padding: const EdgeInsets.only(bottom: 8, left: 4),
                      child: Text(
                        "/$duration",
                        style: TextStyle(color: Colors.white.withOpacity(0.5), fontSize: 16),
                      ),
                    ),
                  ],
                ),
                const SizedBox(height: 24),
                const Divider(color: Colors.white10),
                const SizedBox(height: 24),
                ...features.map((f) => Padding(
                  padding: const EdgeInsets.only(bottom: 12),
                  child: Row(
                    children: [
                      Container(
                        padding: const EdgeInsets.all(2),
                        decoration: BoxDecoration(
                          color: color.withOpacity(0.1),
                          shape: BoxShape.circle,
                        ),
                        child: Icon(Icons.check, color: color, size: 16),
                      ),
                      const SizedBox(width: 12),
                      Expanded(
                        child: Text(f, style: const TextStyle(color: Colors.white70, fontSize: 14)),
                      ),
                    ],
                  ),
                )),
                const SizedBox(height: 32),
                SizedBox(
                  width: double.infinity,
                  height: 56,
                  child: Container(
                    decoration: BoxDecoration(
                      gradient: LinearGradient(colors: [color, color.withOpacity(0.7)]),
                      borderRadius: BorderRadius.circular(16),
                      boxShadow: [
                        BoxShadow(color: color.withOpacity(0.3), blurRadius: 10, offset: const Offset(0, 4)),
                      ],
                    ),
                    child: ElevatedButton(
                      onPressed: () {
                        ScaffoldMessenger.of(context).showSnackBar(
                          SnackBar(content: Text("Subscription to $title coming soon!")),
                        );
                      },
                      style: ElevatedButton.styleFrom(
                        backgroundColor: Colors.transparent,
                        shadowColor: Colors.transparent,
                        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
                      ),
                      child: Text(buttonText, 
                        style: const TextStyle(fontWeight: FontWeight.bold, color: Colors.white, fontSize: 16)),
                    ),
                  ),
                )
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildGlowBlob(Color color, double size) {
    return Container(
      width: size,
      height: size,
      decoration: BoxDecoration(
        color: color.withOpacity(0.2),
        shape: BoxShape.circle,
        boxShadow: [
          BoxShadow(color: color.withOpacity(0.4), blurRadius: 100, spreadRadius: 10),
        ],
      ),
    );
  }
}