import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import 'package:responsive_builder/responsive_builder.dart';

import '../../services/apiService.dart';
import '../../widgets/custom_text_field.dart';
import '../../widgets/custom_text_itnerary_sub.dart';

class AccomodationScreen extends StatefulWidget {
  final List<Map<String, dynamic>> flightData;
  final Function(bool) onClose; // Callback function
  final Function(Map<String, dynamic>) onSaveAccomadation;
  final Map<String, dynamic>? selectedItem;
  final String? loginUser;

  AccomodationScreen(
      {required this.onClose,
      required this.onSaveAccomadation,
      required this.selectedItem,
      required this.loginUser,
      required this.flightData});

  @override
  _AccomodationScreenState createState() => _AccomodationScreenState();
}

class _AccomodationScreenState extends State<AccomodationScreen> {
  ApiService apiService = ApiService();

  // late Map<String, String> countryMap;
  Map<String, String> countryMap = {};

  late ValueNotifier<String?> flightFirstTripDateNotifier;
  late ValueNotifier<String?> flightLastTripDateNotifier;
  late ValueNotifier<String?> flightFirstToDestinationNotifier;

  final GlobalKey<FormState> _formKey = GlobalKey<FormState>();

  final FocusNode _destinationFocusNode = FocusNode();
  final FocusNode _hotelNameFocusNode = FocusNode();
  final FocusNode _checkInFocusNode = FocusNode();
  final FocusNode _checkInTimeFocusNode = FocusNode();
  final FocusNode _checkOutFocusNode = FocusNode();
  final FocusNode _checkOutTimeFocusNode = FocusNode();
  final FocusNode _commentsFocusNode = FocusNode();

  late TextEditingController _destinationController = TextEditingController();
  late TextEditingController _hotelNameController = TextEditingController();
  late TextEditingController _checkInController = TextEditingController();
  late TextEditingController _checkInTimeController = TextEditingController();
  late TextEditingController _checkOutController = TextEditingController();
  late TextEditingController _checkOutTimeController = TextEditingController();
  late TextEditingController _commentsController = TextEditingController();

  bool _destinationFocused = false;
  bool _isHotelNameFocused = false;
  bool _checkInFocus = false;
  bool _checkInTimeFocus = false;
  bool _checkOutFocus = false;
  bool _checkOutTimeFocus = false;
  bool _commentsFocus = false;

  void _addFocusListener(FocusNode node, Function(bool) onFocusChange) {
    node.addListener(() {
      setState(() {
        onFocusChange(node.hasFocus);
      });
    });
  }

  Map<String, String> errorMessages = {};

  Map<String, dynamic> get accomadationData {
    Map<String, dynamic> data = {
      "destination_city": _destinationController.text,
      "hotel_name": _hotelNameController.text,
      "checkin_date": _checkInController.text,
      "checkin_time": _checkInTimeController.text,
      "checkout_date": _checkOutController.text,
      "checkout_time": _checkOutTimeController.text,
      "comments": _commentsController.text,
      "created_by": widget.loginUser,
      "updated_by": widget.loginUser,
    };

    if (widget.selectedItem != null) {
      if (widget.selectedItem?["indx"] != null &&
          widget.selectedItem?["indx"] != 0) {
        data["indx"] = widget.selectedItem!["indx"];
      } else if (widget.selectedItem?["accomodation_id"] != null &&
          widget.selectedItem?["accomodation_id"] != 0) {
        data["accomodation_id"] = widget.selectedItem!["accomodation_id"];
      }
    }
    return data;
  }

  TextEditingController initController(String key) {
    return TextEditingController(text: widget.selectedItem?[key] ?? "");
  }

  @override
  void initState() {
    super.initState();

    _addFocusListener(
        _destinationFocusNode, (focus) => _destinationFocused = focus);
    _addFocusListener(
        _hotelNameFocusNode, (focus) => _isHotelNameFocused = focus);
    _addFocusListener(_checkInFocusNode, (focus) => _checkInFocus = focus);
    _addFocusListener(
        _checkInTimeFocusNode, (focus) => _checkInTimeFocus = focus);
    _addFocusListener(_checkOutFocusNode, (focus) => _checkOutFocus = focus);
    _addFocusListener(
        _checkOutTimeFocusNode, (focus) => _checkOutTimeFocus = focus);
    _addFocusListener(_commentsFocusNode, (focus) => _commentsFocus = focus);

    _destinationController = initController("destination_city");
    _hotelNameController = initController("hotel_name");
    _checkInController = initController("checkin_date");
    _checkInTimeController = initController("checkin_time");
    _checkOutController = initController("checkout_date");
    _checkOutTimeController = initController("checkout_time");
    _commentsController = initController("comments");

    _destinationController.addListener(() => _clearError("destination_city"));
    _hotelNameController.addListener(() => _clearError("hotel_name"));
    _checkInController.addListener(() => _clearError("checkin_date"));
    _checkInTimeController.addListener(() => _clearError("checkin_time"));
    _checkOutController.addListener(() => _clearError("checkout_date"));
    _checkOutTimeController.addListener(() => _clearError("checkout_time"));

    flightFirstTripDateNotifier = ValueNotifier<String?>(null);
    flightLastTripDateNotifier = ValueNotifier<String?>(null);
    flightFirstToDestinationNotifier = ValueNotifier<String?>(null);

    WidgetsBinding.instance.addPostFrameCallback((_) {
      loadCountryList();

      final result = getFlightTripDateRange(widget.flightData);

      print("Rs: $result");

      flightFirstTripDateNotifier.value = result['firstTripDate'];
      flightLastTripDateNotifier.value = result['lastTripDate'];
      flightFirstToDestinationNotifier.value = result['firstToDestination'];

      print(
          "flightfirstToDestinationNotifier: $flightFirstToDestinationNotifier.value ");

      // ✅ Only set controller after value is updated
      final parsedDate =
          DateTime.tryParse(flightFirstTripDateNotifier.value ?? '');
      if (parsedDate != null) {
        _checkInController.text = DateFormat('yyyy-MM-dd').format(parsedDate);
      }

      // ✅ Check and set default times if empty
      if (_checkInTimeController.text.isEmpty) {
        _checkInTimeController.text = '14:00'; // 2 PM
      }
      if (_checkOutTimeController.text.isEmpty) {
        _checkOutTimeController.text = '12:00'; // 12 PM
      }
    });
  }

  @override
  void dispose() {
    _destinationFocusNode.dispose();
    _destinationController.dispose();
    _hotelNameController.dispose();
    _checkInController.dispose();
    _checkInTimeController.dispose();
    _checkOutController.dispose();
    _checkOutTimeController.dispose();
    _commentsController.dispose();
    super.dispose();
  }

  void _clearError(String field) {
    if (mounted && errorMessages.containsKey(field)) {
      setState(() {
        errorMessages.remove(field);
      });
    }
  }

  Map<String, String?> getFlightTripDateRange(
      List<Map<String, dynamic>> flightData) {
    final allTrips = flightData
        .expand((flight) => flight['trips'] ?? [])
        .whereType<Map<String, dynamic>>()
        .toList();

    if (allTrips.isEmpty) {
      return {
        'firstTripDate': null,
        'lastTripDate': null,
      };
    }

    allTrips.sort((a, b) {
      final aDate = DateTime.tryParse(a['date'] ?? '') ?? DateTime(1900);
      final bDate = DateTime.tryParse(b['date'] ?? '') ?? DateTime(1900);
      return aDate.compareTo(bDate);
    });

    final firstTrip = allTrips.first;
    final lastTrip = allTrips.last;
    final firstTripToDestination = allTrips.first;

    print("allTrips - $allTrips");

    return {
      'firstTripDate': firstTrip['date'],
      'lastTripDate': lastTrip['date'],
      'firstToDestination': firstTripToDestination['to_place']
    };
  }

  bool isValidData(Map<String, dynamic> data) {
    errorMessages.clear(); // Reset errors

    // Required fields that must not be empty
    List<String> requiredFields = [
      "destination_city",
      "hotel_name",
      "checkin_date",
      "checkin_time",
      "checkout_date",
      "checkout_time"
    ];

    // Check validation for each field
    for (String field in requiredFields) {
      if (data[field] == null || data[field].toString().trim().isEmpty) {
        errorMessages[field] = "Required";
      }
    }

    // Additional validation: checkout_date >= checkin_date
    final checkIn = data["checkin_date"];
    final checkInTime = data["checkin_time"];
    final checkOut = data["checkout_date"];
    final checkOutTime = data["checkout_time"];

    if (checkIn != null &&
        checkOut != null &&
        checkIn.toString().isNotEmpty &&
        checkOut.toString().isNotEmpty) {
      try {
        final checkInDate = DateTime.parse(checkIn);
        final checkOutDate = DateTime.parse(checkOut);

        if (checkOutDate.isBefore(checkInDate)) {
          errorMessages["checkout_date"] =
              "Check-out date cannot be before check-in date";
        } else if (checkOutDate.isAtSameMomentAs(checkInDate)) {
          // If dates are same, check the times
          if (checkInTime != null &&
              checkOutTime != null &&
              checkInTime.toString().isNotEmpty &&
              checkOutTime.toString().isNotEmpty) {
            try {
              final checkInDateTime =
                  DateTime.parse("${checkIn}T${checkInTime}");
              final checkOutDateTime =
                  DateTime.parse("${checkOut}T${checkOutTime}");

              if (!checkOutDateTime.isAfter(checkInDateTime)) {
                errorMessages["checkout_time"] =
                    "Check-out must be after check-in time";
              } else {
                final difference = checkOutDateTime.difference(checkInDateTime);
                if (difference.inMinutes < 30) {
                  errorMessages["checkout_time"] =
                      "Check-out must be at least 30 minutes after check-in";
                }
              }
            } catch (e) {
              errorMessages["checkout_time"] = "Invalid time format";
            }
          }
        }
      } catch (e) {
        errorMessages["checkout_date"] = "Invalid date format";
      }
    }

    return errorMessages.isEmpty; // Valid if there are no errors
  }

  Future<void> loadCountryList() async {
    final result = await apiService.fetchFlightsCountryList();

    print("ResultCountry : $result");

    // Create a map: Country_Code -> "City, Airport"
    Map<String, String> tempCountryMap = {};

    for (var country in result) {
      String city = country['City'] ?? '';
      String airport = country['Airport'] ?? '';
      String displayName = '${country['City']}';
      // String displayName = '${country['City']} | ${country['Airport']}';

      tempCountryMap[country['Code']] = displayName;
    }

    setState(() {
      countryMap = tempCountryMap; // Update the map
      _updateDestinationCity();
    });
  }

  void _updateDestinationCity() {
    final toDestination = flightFirstToDestinationNotifier.value ?? '';
    final toDestinationCity = countryMap[toDestination] ?? "";
    if (toDestinationCity != '') {
      _destinationController.text = toDestinationCity;
    }
  }

  void handleSave() {
    print("Handle Save accomadationData $accomadationData");

    Map<String, dynamic> data = accomadationData;

    if (!isValidData(data)) {
      print("Validation Failed: Required fields are missing.");
      setState(() {});
      return; // Stop execution if validation fails
    } else {
      widget.onSaveAccomadation(accomadationData);
    }

    widget.onClose(false); // Close screen after saving
  }

  @override
  Widget build(BuildContext context) {
    return ResponsiveBuilder(builder: (context, sizingInfo) {
      bool isMobile = sizingInfo.isMobile;
      bool isDesktop = sizingInfo.deviceScreenType == DeviceScreenType.desktop;

      return Container(
        // color: Color(0xFFF4F4FB),
        child: Form(
          key: _formKey,
          child: Padding(
            padding: const EdgeInsets.all(16.0),
            child: Column(
              children: [
                Padding(
                  padding: const EdgeInsets.all(28.0),
                  child: Center(
                    child: Column(children: _buildAccomadtionForm(isDesktop)),
                  ),
                )
              ],
            ),
          ),
        ),
      );
    });
  }

  List<Widget> _buildAccomadtionForm(isDesktop) {
    return [
      isDesktop
          ? Row(
              children: _buildFirstRow(isDesktop),
            )
          : Column(
              children: _buildFirstRow(isDesktop),
            ),

      SizedBox(height: 10), // Spacing between first and second row
      isDesktop
          ? Row(
              children: _buildSecondRow(isDesktop),
            )
          : Column(
              children: _buildSecondRow(isDesktop),
            ),

      SizedBox(height: 10),

      isDesktop
          ? Row(
              children: _buildThirdRow(isDesktop),
            )
          : Column(
              children: _buildThirdRow(isDesktop),
            ),
    ];
  }

  List<Widget> _buildFirstRow(isDesktop) {
    return [
      // Column(
      //   children: [
      //     ValueListenableBuilder<String?>(
      //       valueListenable: flightFirstTripDateNotifier,
      //       builder: (context, value, child) =>
      //           Text("First Trip Date: ${value ?? 'Not available'}"),
      //     ),
      //     ValueListenableBuilder<String?>(
      //       valueListenable: flightLastTripDateNotifier,
      //       builder: (context, value, child) =>
      //           Text("Last Trip Date: ${value ?? 'Not available'}"),
      //     ),
      //   ],
      // ),

      Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "Destination",
            style: TextStyle(
                fontSize: 12,
                fontWeight: FontWeight.w600,
                color: Color(0xFF575A74)),
          ),
          SizedBox(height: 5),
          CustomTextFieldWrapper(
            isFocused: _destinationFocused,
            isDesktop: isDesktop,
            width: isDesktop
                ? MediaQuery.of(context).size.width * 0.34
                : MediaQuery.of(context).size.width * 0.66,
            child: SizedBox(
              height: 40,
              child: TextField(
                focusNode: _destinationFocusNode,
                controller: _destinationController,
                style: TextStyle(fontSize: 12),
                decoration: InputDecoration(
                  labelText: "Destination",
                  labelStyle: TextStyle(fontSize: 12, color: Colors.grey),
                  floatingLabelBehavior: FloatingLabelBehavior.never,
                  border: InputBorder.none,
                  contentPadding: EdgeInsets.symmetric(vertical: 16),
                ),
              ),
            ),
          ),
          if (errorMessages["destination_city"] != null) ...[
            SizedBox(height: 5), // Space before error message
            Text(
              errorMessages["destination_city"]!,
              style: TextStyle(color: Colors.red, fontSize: 12),
            ),
          ],
        ],
      ),
      if (isDesktop)
        Spacer()
      else
        SizedBox(
          height: 8,
        ),
      Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "Hotel Name",
            style: TextStyle(
                fontSize: 12,
                fontWeight: FontWeight.w600,
                color: Color(0xFF575A74)),
          ),
          SizedBox(height: 5),
          CustomTextFieldWrapper(
            isFocused: _isHotelNameFocused,
            isDesktop: isDesktop,
            width: isDesktop
                ? MediaQuery.of(context).size.width * 0.34
                : MediaQuery.of(context).size.width * 0.66,
            child: SizedBox(
              height: 40,
              child: TextField(
                focusNode: _hotelNameFocusNode, // Assign the correct focus node
                controller: _hotelNameController,
                style: TextStyle(fontSize: 12),
                decoration: InputDecoration(
                  labelText: "Hotel Name",
                  labelStyle: TextStyle(fontSize: 12, color: Colors.grey),
                  floatingLabelBehavior: FloatingLabelBehavior.never,
                  border: InputBorder.none,
                  contentPadding: EdgeInsets.symmetric(vertical: 16),
                ),
              ),
            ),
          ),
          if (errorMessages["hotel_name"] != null) ...[
            SizedBox(height: 5), // Space before error message
            Text(
              errorMessages["hotel_name"]!,
              style: TextStyle(color: Colors.red, fontSize: 12),
            ),
          ],
        ],
      ),
    ];
  }

  List<Widget> _buildSecondRow(bool isDesktop) {
    DateTime? _selectedCheckInDate;
    TimeOfDay? _selectedCheckInTime;

    Future<void> _selectCheckInDate(BuildContext context) async {
      DateTime now = DateTime.now();
      DateTime today = DateTime(now.year, now.month, now.day);

      // Parse date from notifier if available, else use today
      DateTime initialDate;
      if (flightFirstTripDateNotifier.value != null) {
        try {
          initialDate = DateTime.parse(flightFirstTripDateNotifier.value!);
        } catch (e) {
          initialDate = today;
        }
      } else {
        initialDate = today;
      }

      // Use previously selected date if valid
      if (_selectedCheckInDate != null &&
          _selectedCheckInDate!.isAfter(today)) {
        initialDate = _selectedCheckInDate!;
      }

      final pickedDate = await showDatePicker(
        context: context,
        initialDate: initialDate,
        firstDate: initialDate,
        lastDate: DateTime(2100),
      );

      // DateTime? pickedDate = await showDatePicker(
      //   context: context,
      //   initialDate:
      //       _selectedCheckInDate != null && _selectedCheckInDate!.isAfter(today)
      //           ? _selectedCheckInDate!
      //           : today,
      //   firstDate: today,
      //   lastDate: DateTime(2100),
      // );

      if (pickedDate != null && pickedDate != _selectedCheckInDate) {
        setState(() {
          _selectedCheckInDate = pickedDate;
          _checkInController.text = DateFormat('yyyy-MM-dd').format(pickedDate);
        });
      }
    }

    Future<void> _selectCheckInTime(BuildContext context) async {
      TimeOfDay? pickedTime = await showTimePicker(
        context: context,
        initialTime: _selectedCheckInTime ?? TimeOfDay.now(),
      );

      if (pickedTime != null && pickedTime != _selectedCheckInTime) {
        setState(() {
          _selectedCheckInTime = pickedTime;
          // Formatting time to HH:mm (24-hour format)
          final now = DateTime.now();
          final formattedTime = DateFormat('HH:mm').format(
            DateTime(now.year, now.month, now.day, pickedTime.hour,
                pickedTime.minute),
          );
          _checkInTimeController.text = formattedTime;
        });
      }
    }
    //-------------------------------Check-In End

    DateTime? _selectedCheckOutDate;
    TimeOfDay? _selectedCheckOutTime;

    // Future<void> _selectCheckOutDate(BuildContext context) async {
    //   DateTime now = DateTime.now();
    //   DateTime today = DateTime(now.year, now.month, now.day);
    //
    //   DateTime? pickedDate = await showDatePicker(
    //     context: context,
    //     initialDate: _selectedCheckOutDate != null &&
    //             _selectedCheckOutDate!.isAfter(today)
    //         ? _selectedCheckOutDate!
    //         : today,
    //     firstDate: today,
    //     lastDate: DateTime(2100),
    //   );
    //
    //   if (pickedDate != null && pickedDate != _selectedCheckOutDate) {
    //     setState(() {
    //       _selectedCheckOutDate = pickedDate;
    //       _checkOutController.text =
    //           DateFormat('yyyy-MM-dd').format(pickedDate);
    //     });
    //   }
    // }

    Future<void> _selectCheckOutDate(BuildContext context) async {
      DateTime now = DateTime.now();
      DateTime today = DateTime(now.year, now.month, now.day);

      DateTime? checkInDate;
      try {
        checkInDate = DateTime.parse(_checkInController.text);
      } catch (e) {
        checkInDate = today;
      }

      // // Ensure at least today is used
      // DateTime firstDate = checkInDate.isAfter(today) ? checkInDate : today;
      // DateTime initialDate = _selectedCheckOutDate != null &&
      //         _selectedCheckOutDate!.isAfter(firstDate)
      //     ? _selectedCheckOutDate!
      //     : firstDate;

      DateTime firstDate = checkInDate;
      DateTime initialDate = _selectedCheckOutDate != null &&
              _selectedCheckOutDate!.isAfter(firstDate)
          ? _selectedCheckOutDate!
          : firstDate;

      final pickedDate = await showDatePicker(
        context: context,
        initialDate: initialDate,
        firstDate: firstDate,
        lastDate: DateTime(2100),
      );

      if (pickedDate != null && pickedDate != _selectedCheckOutDate) {
        setState(() {
          _selectedCheckOutDate = pickedDate;
          _checkOutController.text =
              DateFormat('yyyy-MM-dd').format(pickedDate);
        });
      }
    }

    Future<void> _selectCheckOutTime(BuildContext context) async {
      TimeOfDay? pickedTime = await showTimePicker(
        context: context,
        initialTime: _selectedCheckOutTime ?? TimeOfDay.now(),
      );

      if (pickedTime != null && pickedTime != _selectedCheckOutTime) {
        setState(() {
          _selectedCheckOutTime = pickedTime;
          // Formatting time to HH:mm (24-hour format)
          final now = DateTime.now();
          final formattedTime = DateFormat('HH:mm').format(
            DateTime(now.year, now.month, now.day, pickedTime.hour,
                pickedTime.minute),
          );
          _checkOutTimeController.text = formattedTime;
        });
      }
    }

    return [
      Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "Check-in*",
            style: TextStyle(
                fontSize: 12,
                fontWeight: FontWeight.w600,
                color: Color(0xFF575A74)),
          ),
          SizedBox(height: 5),
          CustomTextFieldItnerarySubWrapper(
            isFocused: _checkInFocus,
            isDesktop: isDesktop,
            child: SizedBox(
              height: 40,
              child: GestureDetector(
                onTap: () => _selectCheckInDate(context),
                child: AbsorbPointer(
                  child: TextField(
                    focusNode: _checkInFocusNode,
                    controller: _checkInController,
                    style: const TextStyle(fontSize: 12),
                    decoration: const InputDecoration(
                      labelText: "Select Date",
                      labelStyle: TextStyle(fontSize: 12, color: Colors.grey),
                      floatingLabelBehavior: FloatingLabelBehavior.never,
                      border: InputBorder.none,
                      contentPadding: EdgeInsets.symmetric(vertical: 16),
                      suffixIcon: Icon(Icons.calendar_today,
                          size: 16, color: Colors.grey),
                    ),
                  ),
                ),
              ),
            ),
          ),
          if (errorMessages["checkin_date"] != null) ...[
            SizedBox(height: 5), // Space before error message
            Text(
              errorMessages["checkin_date"]!,
              style: TextStyle(color: Colors.red, fontSize: 12),
            ),
          ],
        ],
      ),
      if (isDesktop)
        Spacer()
      else
        SizedBox(
          height: 8,
        ),
      Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "Time (Check-in)",
            style: TextStyle(
                fontSize: 12,
                fontWeight: FontWeight.w600,
                color: Color(0xFF575A74)),
          ),
          SizedBox(height: 5),
          CustomTextFieldItnerarySubWrapper(
            isFocused: _checkInTimeFocus,
            isDesktop: isDesktop,
            child: SizedBox(
              height: 40,
              child: GestureDetector(
                onTap: () => _selectCheckInTime(context),
                child: AbsorbPointer(
                  child: TextField(
                    focusNode: _checkInTimeFocusNode,
                    controller: _checkInTimeController,
                    style: const TextStyle(fontSize: 12),
                    decoration: const InputDecoration(
                      labelText: "Select Time",
                      labelStyle: TextStyle(fontSize: 12, color: Colors.grey),
                      floatingLabelBehavior: FloatingLabelBehavior.never,
                      border: InputBorder.none,
                      contentPadding: EdgeInsets.symmetric(vertical: 16),
                      suffixIcon:
                          Icon(Icons.access_time, size: 16, color: Colors.grey),
                    ),
                  ),
                ),
              ),
            ),
          ),
          if (errorMessages["checkin_time"] != null) ...[
            SizedBox(height: 5), // Space before error message
            Text(
              errorMessages["checkin_time"]!,
              style: TextStyle(color: Colors.red, fontSize: 12),
            ),
          ],
        ],
      ),
      if (isDesktop)
        Spacer()
      else
        SizedBox(
          height: 8,
        ),
      Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "Check-out*",
            style: TextStyle(
                fontSize: 12,
                fontWeight: FontWeight.w600,
                color: Color(0xFF575A74)),
          ),
          SizedBox(height: 5),
          CustomTextFieldItnerarySubWrapper(
            isFocused: _checkOutFocus,
            isDesktop: isDesktop,
            child: SizedBox(
              height: 40,
              child: GestureDetector(
                onTap: () => _selectCheckOutDate(context),
                child: AbsorbPointer(
                  child: TextField(
                    focusNode: _checkOutFocusNode,
                    controller: _checkOutController,
                    style: const TextStyle(fontSize: 12),
                    decoration: const InputDecoration(
                      labelText: "Select Date",
                      labelStyle: TextStyle(fontSize: 12, color: Colors.grey),
                      floatingLabelBehavior: FloatingLabelBehavior.never,
                      border: InputBorder.none,
                      contentPadding: EdgeInsets.symmetric(vertical: 16),
                      suffixIcon: Icon(Icons.calendar_today,
                          size: 16, color: Colors.grey),
                    ),
                  ),
                ),
              ),
            ),
          ),
          if (errorMessages["checkout_date"] != null) ...[
            SizedBox(height: 5), // Space before error message
            Text(
              errorMessages["checkout_date"]!,
              style: TextStyle(color: Colors.red, fontSize: 12),
            ),
          ],
        ],
      ),
      if (isDesktop)
        Spacer()
      else
        SizedBox(
          height: 8,
        ),
      Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "Time (Check-out)",
            style: TextStyle(
                fontSize: 12,
                fontWeight: FontWeight.w600,
                color: Color(0xFF575A74)),
          ),
          SizedBox(height: 5),
          CustomTextFieldItnerarySubWrapper(
            isFocused: _checkOutTimeFocus,
            isDesktop: isDesktop,
            child: SizedBox(
              height: 40,
              child: GestureDetector(
                onTap: () => _selectCheckOutTime(context),
                child: AbsorbPointer(
                  child: TextField(
                    focusNode: _checkOutTimeFocusNode,
                    controller: _checkOutTimeController,
                    style: const TextStyle(fontSize: 12),
                    decoration: const InputDecoration(
                      labelText: "Select Time",
                      labelStyle: TextStyle(fontSize: 12, color: Colors.grey),
                      floatingLabelBehavior: FloatingLabelBehavior.never,
                      border: InputBorder.none,
                      contentPadding: EdgeInsets.symmetric(vertical: 16),
                      suffixIcon:
                          Icon(Icons.access_time, size: 16, color: Colors.grey),
                    ),
                  ),
                ),
              ),
            ),
          ),
          if (errorMessages["checkout_time"] != null) ...[
            SizedBox(height: 5), // Space before error message
            Text(
              errorMessages["checkout_time"]!,
              style: TextStyle(color: Colors.red, fontSize: 12),
            ),
          ],
        ],
      ),
    ];
  }

  List<Widget> _buildThirdRow(bool isDesktop) {
    return [
      Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "Comments",
            style: TextStyle(
                fontSize: 12,
                fontWeight: FontWeight.w600,
                color: Color(0xFF575A74)),
          ),
          SizedBox(height: 5),
          CustomTextFieldWrapper(
            isFocused: _commentsFocus, // Dropdown doesn't use focus
            isDesktop: isDesktop,
            width: isDesktop
                ? MediaQuery.of(context).size.width * 0.34
                : MediaQuery.of(context).size.width * 0.66,
            child: SizedBox(
              height: 40,
              child: TextField(
                focusNode: _commentsFocusNode,
                controller: _commentsController,
                style: TextStyle(fontSize: 12),
                decoration: InputDecoration(
                  labelText: "Comments",
                  labelStyle: TextStyle(fontSize: 12, color: Colors.grey),
                  floatingLabelBehavior: FloatingLabelBehavior.never,
                  border: InputBorder.none,
                  contentPadding: EdgeInsets.symmetric(vertical: 16),
                ),
              ),
            ),
          ),
        ],
      ),
      if (isDesktop) Spacer(),
      SizedBox(
        height: 5,
      ),
      Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.end,
            children: _handleAction(isDesktop),
          ),
        ],
      ),
    ];
  }

  List<Widget> _handleAction(bool isDesktop) {
    return [
      // Close Button
      ElevatedButton(
        onPressed: () {
          widget.onClose(false); // Close the dialog or screen
        },
        style: ElevatedButton.styleFrom(
          backgroundColor: Colors.grey[400], // Light grey color
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(8),
          ),
          padding: EdgeInsets.symmetric(horizontal: 20, vertical: 12),
        ),
        child: Text(
          "Close",
          style: TextStyle(color: Colors.white, fontSize: 14),
        ),
      ),
      SizedBox(width: 10), // Space between buttons

      // Save Changes Button
      ElevatedButton(
        onPressed: () {
          handleSave();
        },
        style: ElevatedButton.styleFrom(
          backgroundColor: Color(0xFF114D8B), // Primary color for save
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(8),
          ),
          padding: EdgeInsets.symmetric(horizontal: 20, vertical: 12),
        ),
        child: Text(
          "Save Changes",
          style: TextStyle(color: Colors.white, fontSize: 14),
        ),
      ),
    ];
  }
}