import 'package:citycards_customer/common_packages/custom_filled_button.dart';
import 'package:citycards_customer/common_packages/custom_text.dart';
import 'package:citycards_customer/core/route_constants.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Color(0xFFFFF5F5),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Container(
              height: 103.h,
              width: 103.w,

              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(24.r),
                boxShadow: [
                  BoxShadow(
                    color: Colors.black12,
                    offset: Offset(0, 4),
                    blurRadius: 5,
                  ),
                ],
              ),
              child: Center(
                child: Image.asset("assets/icons/magic_creation.png", scale: 4),
              ),
            ),

            SizedBox(height: 34.h),
            Text.rich(
              TextSpan(
                children: [
                  TextSpan(
                    text: "Create your",
                    style: TextStyle(
                      color: Color(0xFF101828),
                      fontSize: 24.sp,
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                  TextSpan(
                    text: " magic itinerary",
                    style: TextStyle(
                      color: Color(0xFFF95F62),
                      fontSize: 24.sp,
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                ],
              ),
            ),

            SizedBox(height: 13.h),
            Padding(
              padding: EdgeInsets.symmetric(horizontal: 25.w),
              child: Text(
                "Answer a few quick questions and we'll craft a personalized travel experience just for you ✨",
                style: TextStyle(fontSize: 14, color: Color(0xFF4A5565)),
                textAlign: TextAlign.center,
              ),
            ),
            SizedBox(height: 47.h),
            CustomFilledButton(
              onTap: () {
                Navigator.pushNamed(context, RouteConstants.itineraryCreation);
              },
              showArrow: true,
              label: "Let’s Get Started",
            ),
            SizedBox(height: 38.h),
            CustomText(
              text: "Takes only 2 minutes ⏱️",
              color: Color(0xFF6A7282),
              size: 14.sp,
            ),
          ],
        ),
      ),
    );
  }
}
