import 'package:citycards_customer/common_bloc/language_selection_bloc.dart';
import 'package:citycards_customer/common_packages/app_bar.dart';
import 'package:citycards_customer/common_packages/custom_text.dart';
import 'package:citycards_customer/common_packages/language_selection_bottomsheet.dart';
import 'package:citycards_customer/core/route_constants.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class ProfilePage extends StatelessWidget {
  const ProfilePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: SafeArea(
        child: SingleChildScrollView(
          padding: EdgeInsets.symmetric(horizontal: 20.w, vertical: 10.h),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              CommonAppBar(isWhiteLogo: false, isProfilePage: true),
              SizedBox(height: 12.h),
              Divider(height: 1.h, color: Color(0xFFD9D9D9)),
              SizedBox(height: 22.h),
              Row(
                children: [
                  GestureDetector(
                    onTap: () {
                      Navigator.pop(context);
                    },
                    child: Icon(Icons.arrow_back, size: 24.sp),
                  ),
                  SizedBox(width: 8.w),
                  Text("My profile", style: TextStyle(fontSize: 12.sp)),
                ],
              ),
              SizedBox(height: 29.h),
              // Profile Image and Name
              Row(
                children: [
                   CircleAvatar(
                    radius: 38.r,
                    backgroundImage: AssetImage(
                      "assets/images/profile_img.png",
                    ),
                  ),
                  SizedBox(width: 16.w),
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        'Laysha Adams',
                        style: TextStyle(
                          fontSize: 16.sp,
                          fontWeight: FontWeight.w500,
                        ),
                      ),
                      // SizedBox(height: 4,),
                      Row(
                        children: [
                          Icon(
                            Icons.location_on_sharp,
                            color: Color(0xFF8E8E8E),
                            size: 14.sp,
                          ),
                          SizedBox(width: 4.w),
                          Text(
                            'Louisiana, United States',
                            style: TextStyle(
                              fontSize: 12.sp,
                              color: Color(0xFF8E8E8E),
                            ),
                          ),
                        ],
                      ),
                    ],
                  ),
                ],
              ),

              SizedBox(height: 30.h),

              // Account Settings Section
              Align(
                alignment: Alignment.centerLeft,
                child: CustomText(
                  text: "Account Settings",
                  weight: FontWeight.w500,
                  size: 18.sp,
                ),
              ),
              SizedBox(height: 10.h),

              _buildListTile(
                icon: "assets/icons/user_profile.png",
                title: 'Edit profile',
                onTap: () {
                  Navigator.pushNamed(context, RouteConstants.editProfile);
                },
              ),
              _buildListTile(
                icon: "assets/icons/change_language.png",
                title: 'Change language',
                onTap: () {
                  showModalBottomSheet(
                    context: context,
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.vertical(
                        top: Radius.circular(12.r),
                      ),
                    ),
                    builder: (context) => BlocProvider(
                        create: (_)=> LanguageBloc(),
                        child: LanguageSelectionBottomsheet()),
                  );
                },
              ),
              SizedBox(height: 24.h),

              // Support & Legal Section
              Align(
                alignment: Alignment.centerLeft,
                child: CustomText(
                  text: "Support & Legal",
                  weight: FontWeight.w500,
                  size: 18.sp,
                ),
              ),
              SizedBox(height: 10.h),

              _buildListTile(
                icon: "assets/icons/contact_us.png",
                title: 'Contact Us',
                onTap: () {
                  Navigator.pushNamed(context, RouteConstants.contactUs);
                },
              ),
              _buildListTile(
                icon: "assets/icons/terms_and_condition.png",
                title: 'Terms and Conditions',
                onTap: () {
                  Navigator.pushNamed(
                    context,
                    RouteConstants.termsAndCondition,
                  );
                },
              ),
              _buildListTile(
                icon: "assets/icons/faq.png",
                title: 'FAQ',
                onTap: () {
                  Navigator.pushNamed(context, RouteConstants.faq);
                },
              ),
              _buildListTile(
                icon: "assets/icons/privacy.png",
                title: 'Privacy Policy',
                onTap: () {
                  Navigator.pushNamed(context, RouteConstants.privacyPolicy);
                },
              ),

              SizedBox(height: 22.h),

              // Logout Button
              SizedBox(
                width: double.infinity,
                child: OutlinedButton(
                  style: OutlinedButton.styleFrom(
                    foregroundColor: Color(0xFFF95F62),
                    side: const BorderSide(color: Color(0xFFF95F62)),
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(38.r),
                    ),
                    padding: EdgeInsets.symmetric(vertical: 6.h),
                  ),
                  onPressed: () {},
                  child: Text(
                    'Log out',
                    style: TextStyle(fontSize: 16.sp, fontWeight: FontWeight.w600),
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  Widget _buildListTile({
    required String icon,
    required String title,
    required VoidCallback onTap,
  }) {
    return Container(
      height: 64.h,
      decoration: BoxDecoration(
        border: Border.all(color: Colors.black.withOpacity(.10)),
        borderRadius: BorderRadius.circular(15.r),
      ),
      margin: EdgeInsets.symmetric(vertical: 6.h, horizontal: 12.w),
      child: ListTile(
        leading: Image.asset(icon, scale: 4),
        title: Text(
          title,
          style: TextStyle(fontSize: 15.sp, fontWeight: FontWeight.w500),
        ),
        trailing: Icon(Icons.arrow_forward_ios, size: 16.sp),
        onTap: onTap,
      ),
    );
  }
}
