import 'package:autos/core/theme/app_typography.dart';
import 'package:flutter/material.dart';
import 'package:autos/core/widgets/hamburger_button.dart';
import 'package:autos/core/widgets/side_menu.dart';

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

  @override
  State<EbayScreen> createState() => _EbayScreenState();
}

class _EbayScreenState extends State<EbayScreen> {
  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
  String selected = "ebay";

  @override
  Widget build(BuildContext context) {
    final double topPadding = MediaQuery.of(context).padding.top + 16;

    return Scaffold(
      key: _scaffoldKey,
      drawer: SideMenu(
        selected: selected,
        onItemSelected: (key) {
          setState(() => selected = key);
        },
      ),

      // backgroundColor: const Color(0xFFEFFAFF),
      body: Stack(
        children: [
          /// TITLE
          Positioned(
            top: topPadding,
            left: 0,
            right: 0,
            child: Center(
              child: Text(
                "eBay Settings",
                style: AppTypo.h2.copyWith(fontWeight: FontWeight.w700),
              ),
            ),
          ),

          /// MAIN BOX UI
          Center(
            child: Container(
              width: MediaQuery.of(context).size.width * 0.90,
              padding: const EdgeInsets.symmetric(horizontal: 40, vertical: 40),
              margin: EdgeInsets.only(top: topPadding + 60),
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(25),
                boxShadow: [
                  BoxShadow(
                    color: Colors.black12,
                    blurRadius: 25,
                    offset: const Offset(0, 12),
                  ),
                ],
              ),
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  /// Description
                  Text(
                    "Connect your eBay store to enable product sync, inventory updates, and order flow.",
                    textAlign: TextAlign.center,
                    style: const TextStyle(
                      fontSize: 15,
                      color: Colors.black54,
                      height: 1.5,
                    ),
                  ),

                  const SizedBox(height: 30),

                  /// BUTTON
                  SizedBox(
                    width: double.infinity,
                    child: ElevatedButton(
                      onPressed: () {
                        // TODO: Add eBay authorization flow
                      },
                      style: ElevatedButton.styleFrom(
                        backgroundColor: const Color(0xFF00CFFF),
                        padding: const EdgeInsets.symmetric(vertical: 16),
                        shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(10),
                        ),
                      ),
                      child: const Text(
                        "Connect your eBay store",
                        style: TextStyle(
                          color: Colors.white,
                          fontWeight: FontWeight.w600,
                          fontSize: 16,
                        ),
                      ),
                    ),
                  ),

                  const SizedBox(height: 20),

                  Text(
                    "You'll be redirected to eBay to authorize access, then returned here.",
                    style: const TextStyle(fontSize: 13, color: Colors.black45),
                    textAlign: TextAlign.center,
                  ),
                ],
              ),
            ),
          ),

          /// HAMBURGER BUTTON
          HamburgerButton(scaffoldKey: _scaffoldKey),
        ],
      ),
    );
  }
}