From 88875f730a679bbce4fc493e21d3c08c21c1974c Mon Sep 17 00:00:00 2001
From: Alex Humphries <Alex.Humphries@safelite.com>
Date: Thu, 11 Dec 2025 16:46:02 -0500
Subject: [PATCH] INSR-7776: Vehicle Selection page parity updates

- Update placeholder handling for vehicle questions
- Update error messages for vehicle selection
- Adjust error styles to match heritage
---
 src/constants/error-messages.js                    |  8 ++++----
 .../vehicle-question/vehicle-question.vue          | 14 +++++++++++---
 src/styles/common-error-styles.scss                |  3 +--
 3 files changed, 16 insertions(+), 9 deletions(-)

diff --git a/src/constants/error-messages.js b/src/constants/error-messages.js
index f4d2a590..7ea13330 100644
--- a/src/constants/error-messages.js
+++ b/src/constants/error-messages.js
@@ -52,10 +52,10 @@ const errorMessages = Object.freeze({
     POLICYHOLDER_LAST_NAME_REQUIRED: 'Please enter the policyholder last name',
     ACKNOWLEDGEMENT_REQUIRED: 'You must agree to the terms to continue',
 
-    YEAR_REQUIRED: 'Please select your vehicle year',
-    MAKE_REQUIRED: 'Please select your vehicle make',
-    MODEL_REQUIRED: 'Please select your vehicle model',
-    STYLE_REQUIRED: 'Please select your vehicle style',
+    YEAR_REQUIRED: 'Vehicle year is required.',
+    MAKE_REQUIRED: 'Vehicle make is required.',
+    MODEL_REQUIRED: 'Vehicle model is required.',
+    STYLE_REQUIRED: 'Vehicle style is required.',
     MOBILE_LOCATION_REQUIRED: 'Please enter your service address',
     DATE_REQUIRED: 'Please select a date'
 });
diff --git a/src/layouts/vehicle-selection/vehicle-question/vehicle-question.vue b/src/layouts/vehicle-selection/vehicle-question/vehicle-question.vue
index aea4dd8d..5b7cc00b 100644
--- a/src/layouts/vehicle-selection/vehicle-question/vehicle-question.vue
+++ b/src/layouts/vehicle-selection/vehicle-question/vehicle-question.vue
@@ -3,8 +3,9 @@
     v-model="selectedValue"
     :options="values"
     disableAutoFill
-    placeHolderText="Select an option"
-    :isDisabled="!values.length" />
+    :placeHolderText="isDisabled ? '' : placeHolderText"
+    :cmsWidgetName="cmsWidgetName"
+    :isDisabled="isDisabled" />
 </template>
 
 <script>
@@ -18,7 +19,8 @@ export default {
     },
     props: {
         modelValue: String,
-        updateValues: Function
+        updateValues: Function,
+        cmsWidgetName: String
     },
     emits: ['update:modelValue'],
     data() {
@@ -37,6 +39,12 @@ export default {
                 const newValue = newIndex != null && newIndex > -1 ? this.values[newIndex] : null;
                 this.$emit('update:modelValue', newValue);
             }
+        },
+        isDisabled() {
+            return this.values.length === 0;
+        },
+        placeHolderText() {
+            return this.getCmsContent(this.cmsWidgetName, 'ButtonText');
         }
     },
     methods: {
diff --git a/src/styles/common-error-styles.scss b/src/styles/common-error-styles.scss
index 774cb05d..5aacfa51 100644
--- a/src/styles/common-error-styles.scss
+++ b/src/styles/common-error-styles.scss
@@ -197,8 +197,7 @@ html {
 
     .form-test-error {
         color: $red;
-        font-size: 0.875rem;
-        font-weight: 500;
+        font-size: 1rem;
     }
 
     .form-test-invalid {