<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="@color/gray_50">

    <!-- Top bar -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:background="@color/primary"
        android:orientation="vertical">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Book Your Flight"
            android:textSize="20sp"
            android:textStyle="bold"
            android:textColor="@color/white" />
        <TextView
            android:id="@+id/step_indicator"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Step 1 of 4"
            android:textSize="13sp"
            android:textColor="#CCFFFFFF"
            android:layout_marginTop="4dp" />
    </LinearLayout>

    <!-- Steps -->
    <ViewFlipper
        android:id="@+id/view_flipper"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

        <!-- Step 1: Package Summary -->
        <ScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:padding="16dp">
                <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:text="Selected Packages" android:textSize="16sp" android:textStyle="bold"
                    android:textColor="@color/navy" android:layout_marginBottom="8dp" />
                <LinearLayout android:id="@+id/summary_packages"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:orientation="vertical" />
                <TextView android:id="@+id/summary_total"
                    android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:textSize="18sp" android:textStyle="bold" android:textColor="@color/accent"
                    android:layout_marginTop="12dp" />
                <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:text="Number of Passengers" android:textSize="14sp"
                    android:layout_marginTop="24dp" android:textColor="@color/navy" />
                <EditText android:id="@+id/input_passengers"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:inputType="number" android:hint="1" android:text="1" />
            </LinearLayout>
        </ScrollView>

        <!-- Step 2: Date & Time -->
        <ScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:padding="16dp">
                <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:text="Choose Date &amp; Time" android:textSize="16sp" android:textStyle="bold"
                    android:textColor="@color/navy" android:layout_marginBottom="12dp" />
                <Button android:id="@+id/btn_select_date"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:text="Select Date" android:backgroundTint="@color/primary" />
                <TextView android:id="@+id/selected_date_text"
                    android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:textSize="16sp" android:textStyle="bold"
                    android:layout_marginTop="8dp" android:visibility="gone" />
                <ProgressBar android:id="@+id/slots_progress"
                    android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:layout_gravity="center" android:layout_marginTop="16dp"
                    android:visibility="gone" />
                <RadioGroup android:id="@+id/time_slots_group"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:layout_marginTop="16dp" />
            </LinearLayout>
        </ScrollView>

        <!-- Step 3: Personal Details -->
        <ScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:padding="16dp">
                <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:text="Personal Details" android:textSize="16sp" android:textStyle="bold"
                    android:textColor="@color/navy" android:layout_marginBottom="12dp" />
                <EditText android:id="@+id/input_first_name"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:hint="First Name *" android:inputType="textPersonName" />
                <EditText android:id="@+id/input_last_name"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:hint="Last Name" android:inputType="textPersonName" />
                <EditText android:id="@+id/input_email"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:hint="Email" android:inputType="textEmailAddress" />
                <EditText android:id="@+id/input_mobile"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:hint="Mobile Number *" android:inputType="phone" />
                <EditText android:id="@+id/input_social_media"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:hint="Social Media Name (FB/IG)" android:inputType="text" />
                <EditText android:id="@+id/input_birthdate"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:hint="Birthdate (YYYY-MM-DD)" android:inputType="date" />
                <EditText android:id="@+id/input_address"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:hint="Home Address" android:inputType="textPostalAddress" />
                <Spinner android:id="@+id/spinner_gender"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:layout_marginTop="8dp" />
                <EditText android:id="@+id/input_weight"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:hint="Weight (kg)" android:inputType="numberDecimal" />
                <EditText android:id="@+id/input_age"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:hint="Age" android:inputType="number" />
            </LinearLayout>
        </ScrollView>

        <!-- Step 4: Payment & Waiver -->
        <ScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:padding="16dp">
                <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:text="Payment &amp; Waiver" android:textSize="16sp" android:textStyle="bold"
                    android:textColor="@color/navy" android:layout_marginBottom="12dp" />
                <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:text="Payment Option" android:textSize="14sp" android:textColor="@color/gray_600" />
                <RadioGroup android:id="@+id/payment_option_group"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:layout_marginTop="4dp">
                    <RadioButton android:id="@+id/radio_full"
                        android:layout_width="wrap_content" android:layout_height="wrap_content"
                        android:text="Full Payment" android:checked="true" />
                    <RadioButton android:id="@+id/radio_downpayment"
                        android:layout_width="wrap_content" android:layout_height="wrap_content"
                        android:text="Downpayment (₱500/pax)" />
                </RadioGroup>
                <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:text="Waiver Signature" android:textSize="14sp" android:textColor="@color/gray_600"
                    android:layout_marginTop="16dp" />
                <EditText android:id="@+id/input_waiver_name"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:hint="Type your full name *" android:inputType="textPersonName" />
                <CheckBox android:id="@+id/check_terms"
                    android:layout_width="match_parent" android:layout_height="wrap_content"
                    android:text="I agree to the Booking &amp; Payment Terms"
                    android:layout_marginTop="12dp" />
                <ProgressBar android:id="@+id/submit_progress"
                    android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:layout_gravity="center" android:layout_marginTop="16dp"
                    android:visibility="gone" />
            </LinearLayout>
        </ScrollView>
    </ViewFlipper>

    <!-- Bottom buttons -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="16dp"
        android:background="@color/white"
        android:elevation="8dp">
        <Button android:id="@+id/btn_back"
            android:layout_width="0dp" android:layout_height="wrap_content"
            android:layout_weight="1" android:text="@string/back"
            android:backgroundTint="@color/gray_400"
            android:layout_marginEnd="8dp"
            android:visibility="invisible" />
        <Button android:id="@+id/btn_next"
            android:layout_width="0dp" android:layout_height="wrap_content"
            android:layout_weight="1" android:text="@string/next"
            android:backgroundTint="@color/accent" />
    </LinearLayout>
</LinearLayout>
