diff --git a/src/digital-components/date-picker/date-picker.vue b/src/digital-components/date-picker/date-picker.vue
index d586ff839..9d620ec77 100644
--- a/src/digital-components/date-picker/date-picker.vue
+++ b/src/digital-components/date-picker/date-picker.vue
@@ -281,7 +281,7 @@ export default {
             if (event.screenX === 0 && event.screenY === 0) {
                 return;
             }
-            this.$emit("date-clicked", date);
+            this.$emit("date-selected", date);
         },
         getWeekStartDate(dateString) {
             const date = convertDateStringToDate(dateString);
@@ -846,12 +846,6 @@ export default {
         },
     },
     watch: {
-        isLoading(newValue) {
-            // if done loading dates, then set to first available date
-            if (newValue === false && this.firstAvailableSelectableDate) {
-                this.selectedDate = this.firstAvailableSelectableDate;
-            }
-        },
         modelValue(newValue) {
             this.resetField({
                 value: newValue,
diff --git a/src/layouts/schedule/schedule.vue b/src/layouts/schedule/schedule.vue
index 748c14ecd..62a669bcd 100644
--- a/src/layouts/schedule/schedule.vue
+++ b/src/layouts/schedule/schedule.vue
@@ -134,8 +134,6 @@
                             :isOvernightDropoff="isOvernightDropoff" />
                     </div>
                     <datePicker
-                        :currentZip="zipCode"
-                        :currentProviderNumber="selectedProvider?.providerNumber"
                         v-show="appointmentType"
                         customComponentId="dateQuestion"
                         selectableDatesSetting="custom"
@@ -145,7 +143,7 @@
                         class="text-link-small"
                         :getMoreDatesCallback="getMoreScheduleData"
                         validationRules="date-required"
-                        @date-clicked="handleDateClicked"
+                        @date-selected="handleDateSelected"
                         :pricingByDayBasePrice="pricingByDayBasePrice"
                         :pricingByDayUpcharge="pricingByDayUpcharge"
                         :showPricingByDay="showPricingByDay"
@@ -637,12 +635,12 @@ export default {
         showTimeSlotQuestion() {
             if (
                 this.selectedDate &&
-                this.selectedDate.includes("mobile") &&
-                !this.isMobileSelected
+                this.appointmentTypeFromAppointmentTypeQuestion &&
+                this.timeSlotsForSelectedDate
             ) {
-                this.setSelectedDateToFirstAvailable();
+                return true;
             }
-            return this.selectedDate && this.appointmentTypeFromAppointmentTypeQuestion;
+            return false;
         },
         isMobileStaticRecalibrationApplicable() {
             return (
@@ -1138,29 +1136,6 @@ export default {
                 );
             }
         },
-        getTimeSlotInfo() {
-            // Get the current date
-            const currentDate = getTodayDate();
-
-            // Add 10 days to the current date
-            currentDate.setDate(currentDate.getDate() + 10);
-
-            // Format the date as yyyy-mm-dd
-            const year = currentDate.getFullYear();
-            const month = String(currentDate.getMonth() + 1).padStart(2, "0");
-            const day = String(currentDate.getDate()).padStart(2, "0");
-
-            const formattedDate = `${year}-${month}-${day}`;
-
-            return {
-                date: formattedDate,
-                endTime: "12:00",
-                jobMaxMinutes: "180",
-                jobMinMinutes: "120",
-                routeCode: "3357I-03357-M-I*20988*AM",
-                startTime: "08:00",
-            };
-        },
         onShopSelected(shopQuestionPopUpData) {
             this.resetWaitlist();
             this.preSelectedDate = null;
@@ -1210,8 +1185,6 @@ export default {
         async initializeDatePicker() {
             this.isShowMobileFirstAppt && this.showLoadingModal();
 
-            this.selectedDate = null;
-
             const includeMobileTimeSlots = this.isServiceableMobile;
             const includeInshopTimeSlots = this.isServiceableInshop || this.isServiceableDropoff;
             const datePickerInitialData = await this.$refs.datePicker.loadInitialData({
@@ -1599,28 +1572,40 @@ export default {
         handleWaitListRequested(value) {
             this.waitListRequested = value;
         },
-        handleDateClicked(date) {
-            // do something to mark this as upcharge day or not...
-            if (date.isPricingByDayUpchargeDay) {
-                this.includePricingByDayUpcharge = true;
-            } else {
-                this.includePricingByDayUpcharge = false;
+        handleDateSelected(date) {
+            const previousDate = this.selectedDate;
+
+            // check if date actually changed
+            if (previousDate !== date.dateString) {
+                this.selectedTimeSlotInfo = this.getEmptyTimeSlot();
+                this.updateFooterButtonText(this.selectedTimeSlotInfo);
             }
+
+            // TODO: REMOVE AS PART OF CASH-1634
+            // // do something to mark this as upcharge day or not...
+            // if (date.isPricingByDayUpchargeDay) {
+            //     this.includePricingByDayUpcharge = true;
+            // } else {
+            //     this.includePricingByDayUpcharge = false;
+            // }
+        },
+        getEmptyTimeSlot() {
+            return {
+                timeSlot: {
+                    date: null,
+                    routeCode: null,
+                    startTime: null,
+                    endTime: null,
+                    jobMaxMinutes: null,
+                    jobMinMinutes: null,
+                },
+                isPremiumAppointment: null,
+            };
         },
         updateTimeSlot(timeSlotObj) {
             if (!timeSlotObj?.routeCode) {
                 this.appointmentType = AppointmentTypeStrings.IN_SHOP_OR_DROP_OFF;
-                this.selectedTimeSlotInfo = {
-                    timeSlot: {
-                        date: null,
-                        routeCode: null,
-                        startTime: null,
-                        endTime: null,
-                        jobMaxMinutes: null,
-                        jobMinMinutes: null,
-                    },
-                    isPremiumAppointment: null,
-                };
+                this.selectedTimeSlotInfo = this.getEmptyTimeSlot();
                 return;
             }
             const timeSlot = this.timeSlotsForSelectedDate?.timeSlots?.find(
@@ -1717,6 +1702,9 @@ export default {
         },
         handleAppointmentTypeChange(newAppointmentType) {
             this.updateFooterButtonText();
+            // if time appointment type changes, clear any selected time slot
+            this.selectedTimeSlotInfo = this.getEmptyTimeSlot();
+
             if (newAppointmentType === AppointmentTypeStrings.MOBILE) {
                 // Remember last shop selected if previous selection was inshop/dropoff
                 if (
@@ -1725,17 +1713,6 @@ export default {
                         AppointmentTypeStrings.IN_SHOP_OR_DROP_OFF) &&
                     this.selectedProvider
                 ) {
-                    this.selectedTimeSlotInfo = {
-                        timeSlot: {
-                            date: null,
-                            routeCode: null,
-                            startTime: null,
-                            endTime: null,
-                            jobMaxMinutes: null,
-                            jobMinMinutes: null,
-                        },
-                        isPremiumAppointment: null,
-                    };
                     this.lastSelectedInshopOrDropoffProvider = this.selectedProvider;
                 }
                 this.appointmentType = AppointmentTypeStrings.MOBILE;
@@ -1883,32 +1860,6 @@ export default {
                 this.handleAppointmentTypeChange(newValue); // v-if on appointmentTypeQuestion ensures dates have been loaded by now
             },
         },
-        selectedDate(newValue, oldValue) {
-            // Clear time slot selection if date selected changes
-            const selectedDate = this.getSelectedDateFromStore();
-            if (oldValue && this.appointmentType === AppointmentTypeStrings.MOBILE) {
-                oldValue = `${oldValue}-mobile`;
-            }
-            const hasValueChanged = newValue !== oldValue;
-            const isDateDifferent = (newValue || oldValue) !== selectedDate;
-
-            if (hasValueChanged && isDateDifferent && !this.selectedMobileFirstAppointment) {
-                this.selectedTimeSlotInfo = {
-                    timeSlot: {
-                        date: null,
-                        routeCode: null,
-                        startTime: null,
-                        endTime: null,
-                        jobMaxMinutes: null,
-                        jobMinMinutes: null,
-                    },
-                    isPremiumAppointment: null,
-                };
-            }
-        },
-        selectedTimeSlotInfo(newValue) {
-            this.updateFooterButtonText(newValue);
-        },
     },
     components: {
         funnelHeader,
@@ -1921,7 +1872,6 @@ export default {
         textBlock,
         timeSlotQuestion,
         mobileFirstModal,
-
         alert,
         serviceZipModalQuestion,
         appointmentTypeQuestion,
diff --git a/src/layouts/schedule/time-slot-question/time-slot-question.vue b/src/layouts/schedule/time-slot-question/time-slot-question.vue
index 1b8a2cb2e..d12757571 100644
--- a/src/layouts/schedule/time-slot-question/time-slot-question.vue
+++ b/src/layouts/schedule/time-slot-question/time-slot-question.vue
@@ -1,6 +1,7 @@
 <template>
     <div class="time-slots-question">
         <buttonQuestion
+            ref="chooseDropOffOrInshop"
             v-if="isDropOffAppointmentAvailable"
             v-model="selectedAnswerForDropOffOrInshop"
             @update:modelValue="dropOffSelectionChanged"
@@ -23,8 +24,9 @@
             </div>
         </buttonQuestion>
         <buttonQuestion
-            ref="buttonQuestion"
-            v-if="shouldDisplayTimeSlotQuestion"
+            ref="chooseTimeSlot"
+            v-if="displayTimeSlotQuestion"
+            v-model="selectedAnswerForTimeSlots"
             @update:modelValue="timeSlotSelectionChanged"
             buttonTypeString="timeSlotModalListButton"
             :buttonTypeObject="timeSlotModalListButton"
@@ -34,10 +36,12 @@
                 isInshopOrDropOffAppointment ? 'is-inshop-or-drop-off-appointment' : '',
             ]"
             :answers="availableTimeSlots"
-            :lazyLoad="{ isLazyLoad: !isMobileAppointment, amountToLoad: 10 }"
+            :lazyLoad="{
+                isLazyLoad: !isMobileAppointment && !selectedAnswerForTimeSlots,
+                amountToLoad: 10,
+            }"
             groupName="chooseTimeSlot"
             textPosition="text-center"
-            v-model="selectedAnswerForTimeSlots"
             questionText="Available times:"
             isRequired
             validationRules="time-slot-required" />
@@ -389,7 +393,7 @@ export default {
                 this.answersForDropOffQuestion[0].value !== PICK_A_TIME_BUTTON_VALUE
             );
         },
-        shouldDisplayTimeSlotQuestion() {
+        displayTimeSlotQuestion() {
             return (
                 this.selectedAnswerForDropOffOrInshop == PICK_A_TIME_BUTTON_VALUE ||
                 !this.isDropOffAppointmentAvailable
diff --git a/src/layouts/service-location/appointment-type-question/appointment-type-question.vue b/src/layouts/service-location/appointment-type-question/appointment-type-question.vue
index fc4d08b92..924b2e62a 100644
--- a/src/layouts/service-location/appointment-type-question/appointment-type-question.vue
+++ b/src/layouts/service-location/appointment-type-question/appointment-type-question.vue
@@ -80,6 +80,7 @@ export default {
             },
             set: function (newValue) {
                 this.$emit("update:modelValue", newValue);
+                this.$emit("handle-appointment-type-change", newValue);
             },
         },
         isMobileOnly() {