Merge branch 'release/2025.08.21' into CASH-1327-fix-two-package-layout

src/digital-components/date-picker/date-picker.vue

@@ -1483,6 +1483,8 @@ export default {
     display: block;
     position: relative;
     height: 2rem;
+    font-size: 0.875rem;
+    padding-top: 0;
     width: 100%;
     justify-content: center;
     background: transparent;

src/layouts/schedule/schedule.vue

@@ -5,40 +5,9 @@
         <div class="container page-container-grouped-styles">
             <div class="row">
                 <div class="col-12 col-md-10 col-lg-8 col-xl-7">
-                    <alert
-                        ref="alertMilitaryBaseZip"
-                        class="my-5"
-                        cmsWidgetName="AlertMilitaryBaseZipWidget"
-                        v-if="displayMilitaryZipAlert"
-                        alertClass="alert-warning" />
-                    <alert
-                        ref="alertMobileOnly"
-                        class="my-5"
-                        cmsWidgetName="AlertMobileOnlyWidget"
-                        v-if="displayServiceableMobileOnly"
-                        alertClass="alert-warning" />
-                    <alert
-                        ref="alertRecalNoMobile"
-                        class="my-5"
-                        cmsWidgetName="AlertRecalNoMobileWidget"
-                        v-if="displayRecalibrationWarning"
-                        @text-link-clicked="openModalAction"
-                        alertClass="alert-warning" />
-                    <alert
-                        ref="alertInshopOnly"
-                        class="my-5"
-                        cmsWidgetName="AlertInshopOnlyWidget"
-                        v-if="displayServiceableInshopOnly"
-                        alertClass="alert-warning" />
-                    <alert
-                        ref="alertNoShops"
-                        class="my-5"
-                        cmsWidgetName="AlertNoShopsWidget"
-                        v-if="displayNoShopsAlert"
-                        alertClass="alert-warning" />
                     <alert
                         ref="alertMobileFeeFree"
-                        class="my-5"
+                        class="mb-5"
                         cmsWidgetName="AlertMobileFeeFreeWidget"
                         v-if="showMobileFreeAlert"
                         alertClass="alert-success" />
@@ -46,7 +15,7 @@
             </div>
             <div class="row appointment-type">
                 <div class="col-12 col-md-10 col-lg-8 col-xl-7">
-                    <funnelSubHeader cmsWidgetName="ScheduleYourServiceWidget" class="my-5" />
+                    <funnelSubHeader cmsWidgetName="ScheduleYourServiceWidget" class="mb-5" />
                     <appointmentTypeQuestion
                         v-model="appointmentTypeFromAppointmentTypeQuestion"
                         v-show="isAppointmentTypeDisplayed"
@@ -62,6 +31,41 @@
                         labelBold="true" />
                 </div>
             </div>
+            <div class="row">
+                <div class="col-12 col-md-10 col-lg-8 col-xl-7">
+                    <alert
+                        ref="alertMobileOnly"
+                        class="mt-5 mb-5"
+                        cmsWidgetName="AlertMobileOnlyWidget"
+                        v-if="displayServiceableMobileOnly"
+                        alertClass="alert-warning" />
+                    <alert
+                        ref="alertRecalNoMobile"
+                        class="mt-5 mb-5"
+                        cmsWidgetName="AlertRecalNoMobileWidget"
+                        v-if="displayRecalibrationWarning"
+                        @text-link-clicked="openModalAction"
+                        alertClass="alert-warning" />
+                    <alert
+                        ref="alertInshopOnly"
+                        class="mt-5 mb-5"
+                        cmsWidgetName="AlertInshopOnlyWidget"
+                        v-if="displayServiceableInshopOnly"
+                        alertClass="alert-warning" />
+                    <alert
+                        ref="alertMilitaryBaseZip"
+                        class="mt-5 mb-5"
+                        cmsWidgetName="AlertMilitaryBaseZipWidget"
+                        v-if="displayMilitaryZipAlert"
+                        alertClass="alert-warning" />
+                    <alert
+                        ref="alertNoShops"
+                        class="mt-5 mb-5"
+                        cmsWidgetName="AlertNoShopsWidget"
+                        v-if="displayNoShopsAlert"
+                        alertClass="alert-warning" />
+                </div>
+            </div>
             <div
                 v-if="appointmentType && appointmentType === appointmentTypeStrings.MOBILE"
                 class="col-12 col-md-10 col-lg-8 col-xl-7">
@@ -695,7 +699,12 @@ export default {
             );
         },
         isAppointmentTypeDisplayed() {
-            return this.zipCode && !this.displayNoShopsAlert;
+            return (
+                this.zipCode &&
+                !this.displayNoShopsAlert &&
+                this.isServiceableMobile &&
+                this.isServiceableInshop
+            );
         },
         requiresInshopRecalibration() {
             // Specifically check for isRecalibrationServiceableMobile === false, not null or true.
@@ -1739,47 +1748,24 @@ export default {
 
 <style lang="scss">
 .container {
-    &.page-schedule {
+    .question-text {
-        padding: 0 1rem;
+        margin-bottom: 1.5rem;
-        .text-link-small {
+
-            a,
+        & > span {
-            .btn-link {
+            display: flex;
-                width: auto;
+            justify-content: flex-start;
-                margin: 0 auto;
+            margin-bottom: 0.25rem;
-                height: auto;
-                font-size: 0.875rem;
-                line-height: 1.75;
-                padding: 0;
-                border-radius: 0;
-                &:focus {
-                    outline: 1px solid $blue;
-                }
-                @include media-breakpoint-up(md) {
-                    font-size: 1rem;
-                }
-            }
         }
-        .funnel-sub-header {
-            h5.dark-header {
-                margin-bottom: 0.25rem;
-            }
-        }
-        .change-location a {
-            font-family: UrbanistSemibold;
-        }
-        .date-picker {
-            border-top: 1px solid $gray-500;
-            margin-top: 1.5rem;
-        }
-        .time-slots-question {
-            padding: 0 0.75rem;
-        }
-    }
-    .question-text > span {
-        display: flex;
-        justify-content: flex-start;
     }
 }
+.alert.alert-warning {
+    .alert-heading {
+        color: $black;
+        font-family: UrbanistSemibold;
+        font-size: 1rem;
+    }
+}
+
 .shop-question-button .list-button-content {
     background: $blue-100;
     box-shadow: 0 0 0 1px $primary;
@@ -1801,6 +1787,7 @@ export default {
 
 .appointment-type .funnel-sub-header h5 {
     font-family: UrbanistRegular;
+    font-size: 1.25rem;
 }
 
 .funnel-sub-header.my-5 h5 {
@@ -1814,4 +1801,8 @@ export default {
     line-height: 26px;
     text-underline-offset: 4px;
 }
+
+.text-block.duration-text-block b {
+    font-family: UrbanistSemibold;
+}
 </style>

src/layouts/schedule/shop-location/shop-location.vue

@@ -1,6 +1,6 @@
 <template>
     <div id="shop-location">
-        <textBlock :customText="questionText" typeStyle="button-question" />
+        <textBlock :customText="questionText" typeStyle="button-question" class="mb-2" />
         <div>
             <div>
                 <label v-for="addressItem in addressDetails" :key="addressItem">

src/layouts/schedule/time-slot-question/time-slot-question.vue

@@ -9,6 +9,7 @@
             isRequired
             insertOrLabelBeforeFinalOption
             groupName="chooseDropOffOrInshop"
+            class="choose-dropoff-or-inshop"
             validationRules="time-slot-required">
             <div>
                 <alert
@@ -49,6 +50,7 @@
                 cmsWidgetName="WaitListLabelWidget"
                 typeStyle="medium"
                 fontWeight="600"
+                class="waitlist-label"
                 marginTopSizeOverride="0" />
             <checkboxQuestion
                 class="mt-3"
@@ -651,6 +653,15 @@ export default {
             margin-bottom: 8px;
         }
     }
+    .button-question.choose-dropoff-or-inshop
+        .button-inner-wrapper
+        .col:first-child
+        .button-content.list-button-content
+        > span::after {
+        content: "TM";
+        vertical-align: super;
+        font-size: 50%;
+    }
     .waitlist {
         box-shadow: 0px 1px 4px 0px #00000033;
         border-radius: 8px;
@@ -658,6 +669,10 @@ export default {
         padding: 16px;
         text-align: left;
 
+        .waitlist-label {
+            font-family: UrbanistSemibold;
+        }
+
         .ui-checkbox {
             padding-left: 0px;
             input {