From 74b6bcae2dd91eef8981586b0d581c4db9e374b3 Mon Sep 17 00:00:00 2001
From: Chris Redelinghuys <chris.redelinghuys@safelite.com>
Date: Tue, 5 Aug 2025 09:57:24 -0400
Subject: [PATCH] CASH-1183: Schedule page parity updates

---
 .../button-question/button-question.vue              | 12 ++++++++++++
 src/digital-components/date-picker/date-picker.vue   |  4 ++--
 .../time-slot-question/time-slot-question.vue        |  5 +++++
 3 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/digital-components/button-question/button-question.vue b/src/digital-components/button-question/button-question.vue
index 82fbf424c..cf704faa9 100644
--- a/src/digital-components/button-question/button-question.vue
+++ b/src/digital-components/button-question/button-question.vue
@@ -12,6 +12,10 @@ https://safelite.atlassian.net/wiki/spaces/DC/pages/76644418/Button+Question+Com
             <span class="fw-bold w-100" :class="[labelBold ? 'span-bold' : '']">
                 {{ questionText }}
             </span>
+            <p
+                v-if="questionTextDescription"
+                class="question-text-description"
+                v-html="questionTextDescription"></p>
         </div>
 
         <div class="w-100 d-flex justify-content-center">
@@ -118,6 +122,7 @@ export default {
         isMultiSelect: Boolean,
         groupName: String,
         questionText: String,
+        questionTextDescription: String,
         answers: Array,
         textPosition: {
             type: String,
@@ -376,6 +381,13 @@ export default {
         font-weight: 600;
     }
 }
+.question-text-description {
+    font-family: UrbanistRegular;
+    & > sup {
+        font-size: 0.5rem;
+        top: -0.4rem;
+    }
+}
 .small-question-text {
     &.question-text {
         span {
diff --git a/src/digital-components/date-picker/date-picker.vue b/src/digital-components/date-picker/date-picker.vue
index b68d99dc2..007dc0615 100644
--- a/src/digital-components/date-picker/date-picker.vue
+++ b/src/digital-components/date-picker/date-picker.vue
@@ -336,7 +336,7 @@ export default {
             );
 
             if (this.estimatedServiceMinutesMinimum && this.estimatedServiceMinutesMaximum) {
-                return `${inshopDurationTextWithoutTime} ${inshopDurationTime}`;
+                return `${inshopDurationTextWithoutTime} <b>${inshopDurationTime}</b>`;
             }
 
             return null;
@@ -353,7 +353,7 @@ export default {
             );
 
             if (this.estimatedServiceMinutesMinimum && this.estimatedServiceMinutesMaximum) {
-                return `${mobileDurationTextWithoutTime} ${mobileDurationTime}`;
+                return `${mobileDurationTextWithoutTime} <b>${mobileDurationTime}</b>`;
             }
 
             return null;
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 3c83bd039..2a66c78a2 100644
--- a/src/layouts/schedule/time-slot-question/time-slot-question.vue
+++ b/src/layouts/schedule/time-slot-question/time-slot-question.vue
@@ -4,6 +4,7 @@
             v-if="isDropOffAppointmentAvailable"
             v-model="selectedAnswerForDropOffOrInshop"
             :questionText="dropOffOrPickATimeQuestionLabelText"
+            :questionTextDescription="dropOffOrPickATimeQuestionDescription"
             :answers="answersForDropOffQuestion"
             isRequired
             insertOrLabelBeforeFinalOption
@@ -228,6 +229,10 @@ export default {
         dropOffOrPickATimeQuestionLabelText() {
             return this.getCmsContent(this.dropOffOrPickATimeQuestionCmsWidgetName, "QuestionText");
         },
+        dropOffOrPickATimeQuestionDescription() {
+            // This is hardcoded because Input Question Widget doesn't currently have a place to add additional text
+            return "You can drop off your vehicle in the morning and pick it up later in the day with Drop & Go<sup>&#8482</sup> or pick an appointment time.";
+        },
         pickATimeButtonLabelText() {
             return this.getCmsContent(this.dropOffOrPickATimeQuestionCmsWidgetName, "Answers")[0]
                 .Text;