From de143ef75232792435d1750247b26fda77b3907e Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Thu, 4 Dec 2025 15:02:21 -0500
Subject: [PATCH 01/17] add progress bar WIP

---
 src/constants/progress-bar-mapper.js          |  82 +++++++++++++
 .../progress-bar/progress-bar.vue             | 111 ++++++++++++++++++
 2 files changed, 193 insertions(+)
 create mode 100644 src/constants/progress-bar-mapper.js
 create mode 100644 src/iss-components/progress-bar/progress-bar.vue

diff --git a/src/constants/progress-bar-mapper.js b/src/constants/progress-bar-mapper.js
new file mode 100644
index 00000000..c3a69c59
--- /dev/null
+++ b/src/constants/progress-bar-mapper.js
@@ -0,0 +1,82 @@
+export const pageProgressMapper = {
+    'duplicate-check': {
+        percent: 10
+    },
+    'policy-holder-details': {
+        percent: 15
+    },
+    'policy-vehicles': {
+        percent: 15
+    },
+    'policy-endorsements': {
+        percent: 15
+    },
+    'vehicle-selection': {
+        percent: 20
+    },
+    'vehicle-damage': {
+        percent: 25
+    },
+    'part-questions': {
+        percent: 30
+    },
+    'molding-questions': {
+        percent: 35
+    },
+    'vehicle-parts': {
+        percent: 35
+    },
+    'capability-questions': {
+        percent: 35
+    },
+    'vehicle-lookup': {
+        percent: 40
+    },
+    'vin-lookup': {
+        percent: 45
+    },
+    'license-plate-lookup': {
+        percent: 45
+    },
+    'address-lookup': {
+        percent: 45
+    },
+    'address-vehicles': {
+        percent: 45
+    },
+    'coverage-statement': {
+        percent: 50
+    },
+    'provider-preference': {
+        percent: 55
+    },
+    'service-location': {
+        percent: 60
+    },
+    'tpa-search': {
+        percent: 65
+    },
+    'schedule-page': {
+        percent: 70
+    },
+    'contact-details': {
+        percent: 75
+    },
+    'service-packages': {
+        percent: 80
+    },
+    'payment-method': {
+        percent: 85
+    },
+    'payment-page': {
+        percent: 95
+    },
+    'tpa-confirmation': {
+        percent: 100
+    },
+    'order-confirmation': {
+        percent: 100
+    }
+};
+
+export const getProgressBarPercentage = (page) => pageProgressMapper[page]?.percent || 0;
diff --git a/src/iss-components/progress-bar/progress-bar.vue b/src/iss-components/progress-bar/progress-bar.vue
new file mode 100644
index 00000000..d8006b5a
--- /dev/null
+++ b/src/iss-components/progress-bar/progress-bar.vue
@@ -0,0 +1,111 @@
+<template>
+    <div :class="barClass">
+        <div
+class="progress-bar-inner"
+:style="progressStyle"></div>
+    </div>
+</template>
+
+<script>
+import { getProgressBarPercentage } from '@/constants/progress-bar-mapper';
+
+// Module-level variable to persist progress across component lifecycles
+let lastProgress = 0;
+
+export default {
+    name: 'progress-bar',
+    props: {
+        page: {
+            type: String,
+            required: true
+        },
+        vertical: {
+            type: Boolean,
+            default: false
+        }
+    },
+    data() {
+        return {
+            displayedProgress: lastProgress,
+            timeoutId: null
+        };
+    },
+    computed: {
+        progressStyle() {
+            if (this.vertical) {
+                return {
+                    height: `${this.displayedProgress}%`,
+                    width: '100%'
+                };
+            }
+            return {
+                width: `${this.displayedProgress}%`,
+                height: '100%'
+            };
+        },
+        barClass() {
+            return this.vertical ? 'progress-bar-outer-vertical' : 'progress-bar-outer';
+        }
+    },
+    watch: {
+        page: {
+            immediate: true,
+            handler(newPage) {
+                const target = getProgressBarPercentage(newPage);
+                if (this.timeoutId) clearTimeout(this.timeoutId);
+
+                // Animate from current value to new value
+                this.timeoutId = setTimeout(() => {
+                    this.displayedProgress = target;
+                    lastProgress = target; // Update the module-level variable
+                }, 150);
+            }
+        }
+    },
+    beforeUnmount() {
+        if (this.timeoutId) clearTimeout(this.timeoutId);
+    }
+};
+</script>
+<style lang="scss">
+.progress-bar-outer {
+    background: $blue-100;
+    height: 5px;
+    position: relative;
+    border-radius: 0;
+    width: 100%;
+    margin-top: 0;
+    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
+    .progress-bar-inner {
+        transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1);
+        will-change: width;
+        height: 100%;
+        background-color: $red;
+        position: absolute;
+        top: 0;
+        left: 0;
+        border-radius: 0;
+    }
+}
+
+.progress-bar-outer-vertical {
+    background: $blue-100;
+    width: 24px;
+    height: 356px;
+    position: relative;
+    margin-top: 0;
+    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
+    overflow: hidden;
+    border-radius: 50rem;
+    .progress-bar-inner {
+        transition: height 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
+        will-change: height !important;
+        width: 100%;
+        background-color: $red;
+        position: absolute;
+        left: 0;
+        top: 0;
+        border-radius: 50rem;
+    }
+}
+</style>

From 7c9b6247d3bbac2d9381aeedfb8e41a6b52071a4 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Thu, 4 Dec 2025 15:19:26 -0500
Subject: [PATCH 02/17] update percentages

---
 src/constants/progress-bar-mapper.js | 62 ++++++++++++++--------------
 1 file changed, 31 insertions(+), 31 deletions(-)

diff --git a/src/constants/progress-bar-mapper.js b/src/constants/progress-bar-mapper.js
index c3a69c59..b9f3af77 100644
--- a/src/constants/progress-bar-mapper.js
+++ b/src/constants/progress-bar-mapper.js
@@ -15,62 +15,62 @@ export const pageProgressMapper = {
         percent: 20
     },
     'vehicle-damage': {
-        percent: 25
-    },
-    'part-questions': {
         percent: 30
     },
+    'part-questions': {
+        percent: 35
+    },
     'molding-questions': {
-        percent: 35
-    },
-    'vehicle-parts': {
-        percent: 35
-    },
-    'capability-questions': {
-        percent: 35
-    },
-    'vehicle-lookup': {
         percent: 40
     },
+    'vehicle-parts': {
+        percent: 40
+    },
+    'capability-questions': {
+        percent: 40
+    },
+    'vehicle-lookup': {
+        percent: 45
+    },
     'vin-lookup': {
-        percent: 45
-    },
-    'license-plate-lookup': {
-        percent: 45
-    },
-    'address-lookup': {
-        percent: 45
-    },
-    'address-vehicles': {
-        percent: 45
-    },
-    'coverage-statement': {
         percent: 50
     },
-    'provider-preference': {
+    'license-plate-lookup': {
+        percent: 50
+    },
+    'address-lookup': {
+        percent: 50
+    },
+    'address-vehicles': {
+        percent: 50
+    },
+    'coverage-statement': {
         percent: 55
     },
-    'service-location': {
+    'provider-preference': {
         percent: 60
     },
-    'tpa-search': {
+    'service-location': {
         percent: 65
     },
     'schedule-page': {
         percent: 70
     },
     'contact-details': {
-        percent: 75
-    },
-    'service-packages': {
         percent: 80
     },
-    'payment-method': {
+    'service-packages': {
         percent: 85
     },
+    'payment-method': {
+        percent: 90
+    },
     'payment-page': {
         percent: 95
     },
+    'tpa-search': {
+        percent: 85
+    },
     'tpa-confirmation': {
         percent: 100
     },

From af0436e77178b3d64b9b13f0a9217d6b4ce519fe Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Thu, 4 Dec 2025 15:36:49 -0500
Subject: [PATCH 03/17] move progress bar component into site-header folder

---
 .../{ => site-header}/progress-bar/progress-bar.vue    | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)
 rename src/iss-components/{ => site-header}/progress-bar/progress-bar.vue (95%)

diff --git a/src/iss-components/progress-bar/progress-bar.vue b/src/iss-components/site-header/progress-bar/progress-bar.vue
similarity index 95%
rename from src/iss-components/progress-bar/progress-bar.vue
rename to src/iss-components/site-header/progress-bar/progress-bar.vue
index d8006b5a..7373b161 100644
--- a/src/iss-components/progress-bar/progress-bar.vue
+++ b/src/iss-components/site-header/progress-bar/progress-bar.vue
@@ -1,8 +1,10 @@
 <template>
-    <div :class="barClass">
-        <div
-class="progress-bar-inner"
-:style="progressStyle"></div>
+    <div id="progress-bar-container">
+        <progress
+v-if="progress > 0"
+:value="progress"
+max="100"
+v-html="progress + '%' " />
     </div>
 </template>
 

From a253312245aaa8f737ef5a9eba5cf19bdf857386 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Thu, 4 Dec 2025 15:37:28 -0500
Subject: [PATCH 04/17] spacing

---
 .../site-header/progress-bar/progress-bar.vue             | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/iss-components/site-header/progress-bar/progress-bar.vue b/src/iss-components/site-header/progress-bar/progress-bar.vue
index 7373b161..27f6bd1a 100644
--- a/src/iss-components/site-header/progress-bar/progress-bar.vue
+++ b/src/iss-components/site-header/progress-bar/progress-bar.vue
@@ -1,10 +1,10 @@
 <template>
     <div id="progress-bar-container">
         <progress
-v-if="progress > 0"
-:value="progress"
-max="100"
-v-html="progress + '%' " />
+            v-if="progress > 0"
+            :value="progress"
+            max="100"
+            v-html="progress + '%' " />
     </div>
 </template>
 

From 2c135c429cf463766f484272ba66018d93ef53d9 Mon Sep 17 00:00:00 2001
From: Jeremy-Z <Jeremy.Zimmerman@safelite.com>
Date: Thu, 4 Dec 2025 16:21:06 -0500
Subject: [PATCH 05/17] Fixing issue with combined-quote call.

---
 .../service-packages/service-packages.vue        | 16 ++++++++++------
 src/store/index.js                               | 12 +++++++++++-
 2 files changed, 21 insertions(+), 7 deletions(-)

diff --git a/src/layouts/service-packages/service-packages.vue b/src/layouts/service-packages/service-packages.vue
index 8905db79..2f5f4473 100644
--- a/src/layouts/service-packages/service-packages.vue
+++ b/src/layouts/service-packages/service-packages.vue
@@ -112,11 +112,16 @@ export default {
 
         const { feeItems } = store.order.lineItems;
 
-        const availableLineItems = [
-            resultMap.rainDefense,
-            ...resultMap.wipers,
-            ...feeItems
-        ];
+        let availableLineItems = [];
+
+        if ( resultMap?.rainDefense?.length > 0 )
+            availableLineItems.push(resultMap.rainDefense);
+
+        if ( resultMap?.wipers?.length > 0 )
+            availableLineItems.push(...resultMap.wipers);
+
+        if ( feeItems?.length > 0 )
+            availableLineItems.push(...feeItems);
 
         let hasBailedOut = false;
         await store.getCombinedQuote(availableLineItems)
@@ -195,7 +200,6 @@ export default {
     }
 };
 </script>
-
 <style lang="scss" scoped>
 .iss-heritage-container-width {
     .service-packages-container {
diff --git a/src/store/index.js b/src/store/index.js
index f11b6933..2396ed19 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -1242,6 +1242,16 @@ export const useMainStore = defineStore({
             if (availableLineItems && availableLineItems.length > 0) {
                 const { vehicle, serviceLocation, policy, eon, referralNumber, referralDate, referralSequenceNumber, lineItems } = this.order;
 
+                console.error("get combined quote");
+
+                console.error("line items 1: " + JSON.stringify(availableLineItems, null, 2));
+
+                const lineItemsWithOnlyPartNumbers = availableLineItems.map((lineItem) => ({
+                    partNumber: lineItem.partNumber,
+                }));
+
+                console.error("line items2: " + lineItemsWithOnlyPartNumbers);
+
                 const payload = {
                     ParentAccountNumber: this.order.parentAccountNumber,
                     BillToAccountNumber: this.billToAccountNumber,
@@ -1259,7 +1269,7 @@ export const useMainStore = defineStore({
                     ServiceZipCode: serviceLocation.zipCode,
                     IsReplacement: !this.isRepair,
                     ServerData: lineItems.serverData,
-                    LineItems: getLineItemsFlattened(availableLineItems),
+                    LineItems: lineItemsWithOnlyPartNumbers,
                     FeatureToggles: getFeatureTogglesPayloadObject(this.experimentSettings)
                 };
 

From ebc3671f4f99f1d7932673a7d4a69475455fc443 Mon Sep 17 00:00:00 2001
From: Jeremy-Z <Jeremy.Zimmerman@safelite.com>
Date: Fri, 5 Dec 2025 11:43:03 -0500
Subject: [PATCH 06/17] Some debugging code.... to be removed when testing is
 finished.

---
 src/store/index.js | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/store/index.js b/src/store/index.js
index 2396ed19..b131e4e5 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -1244,13 +1244,18 @@ export const useMainStore = defineStore({
 
                 console.error("get combined quote");
 
-                console.error("line items 1: " + JSON.stringify(availableLineItems, null, 2));
+                console.error("line items 1: " + availableLineItems.length + " : " + JSON.stringify(availableLineItems, null, 2));
 
-                const lineItemsWithOnlyPartNumbers = availableLineItems.map((lineItem) => ({
-                    partNumber: lineItem.partNumber,
-                }));
+                for ( let i = 0; i < availableLineItems.length; i++ )
+                {
+                    console.error("" + i + ": " + availableLineItems[i].partNumber);
+                }
 
-                console.error("line items2: " + lineItemsWithOnlyPartNumbers);
+                const lineItemsWithOnlyPartNumbers = availableLineItems.map((lineItem) => {
+                    return {partNumber: lineItem.partNumber};
+                });
+
+                console.error("line items2: " + JSON.stringify(lineItemsWithOnlyPartNumbers, null, 2));
 
                 const payload = {
                     ParentAccountNumber: this.order.parentAccountNumber,

From c66a560ea991008c9a4db5e20a1bcec855023613 Mon Sep 17 00:00:00 2001
From: Jeremy-Z <Jeremy.Zimmerman@safelite.com>
Date: Fri, 5 Dec 2025 11:56:48 -0500
Subject: [PATCH 07/17] Some debugging code.... to be removed when testing is
 finished.

---
 src/store/index.js | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/store/index.js b/src/store/index.js
index b131e4e5..670b224e 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -1246,12 +1246,14 @@ export const useMainStore = defineStore({
 
                 console.error("line items 1: " + availableLineItems.length + " : " + JSON.stringify(availableLineItems, null, 2));
 
-                for ( let i = 0; i < availableLineItems.length; i++ )
-                {
-                    console.error("" + i + ": " + availableLineItems[i].partNumber);
-                }
+                const availableLineItemsFiltered = availableLineItems.filter((lineItem) => {
+                    if ( lineItem.partNumber )
+                        return true;
+                    else
+                        return false;
+                });
 
-                const lineItemsWithOnlyPartNumbers = availableLineItems.map((lineItem) => {
+                const lineItemsWithOnlyPartNumbers = availableLineItemsFiltered.map((lineItem) => {
                     return {partNumber: lineItem.partNumber};
                 });
 

From 5d99bad99e7220fcafb19f363fdfe8ddcc507070 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Mon, 8 Dec 2025 09:11:49 -0500
Subject: [PATCH 08/17] WIP

---
 .../site-header/progress-bar/progress-bar.vue | 168 ++++++++----------
 .../site-header/site-header.vue               |  20 ++-
 2 files changed, 92 insertions(+), 96 deletions(-)

diff --git a/src/iss-components/site-header/progress-bar/progress-bar.vue b/src/iss-components/site-header/progress-bar/progress-bar.vue
index 27f6bd1a..1312783c 100644
--- a/src/iss-components/site-header/progress-bar/progress-bar.vue
+++ b/src/iss-components/site-header/progress-bar/progress-bar.vue
@@ -1,113 +1,103 @@
 <template>
-    <div id="progress-bar-container">
+    <div
+        v-if="progress > 0"
+        class="progress-bar-container">
+        <div class="progress-bar-header">
+            <span aria-hidden="true">{{ progress }}%</span>
+        </div>
         <progress
-            v-if="progress > 0"
+            class="progress-bar progress-bar-success"
             :value="progress"
             max="100"
-            v-html="progress + '%' " />
+            aria-label="Scheduling progress">
+                <div class="progress-bar-middle"></div>
+        </progress>
     </div>
 </template>
 
 <script>
 import { getProgressBarPercentage } from '@/constants/progress-bar-mapper';
-
-// Module-level variable to persist progress across component lifecycles
-let lastProgress = 0;
+import { useMainStore } from '@/store';
 
 export default {
     name: 'progress-bar',
-    props: {
-        page: {
-            type: String,
-            required: true
-        },
-        vertical: {
-            type: Boolean,
-            default: false
-        }
-    },
     data() {
         return {
-            displayedProgress: lastProgress,
-            timeoutId: null
+            progress: this.getProgress()
         };
     },
-    computed: {
-        progressStyle() {
-            if (this.vertical) {
-                return {
-                    height: `${this.displayedProgress}%`,
-                    width: '100%'
-                };
-            }
-            return {
-                width: `${this.displayedProgress}%`,
-                height: '100%'
-            };
-        },
-        barClass() {
-            return this.vertical ? 'progress-bar-outer-vertical' : 'progress-bar-outer';
+    methods: {
+        getProgress() {
+            const pageName = useMainStore().applicationUser.lastPageVisited;
+            return getProgressBarPercentage(pageName);
         }
-    },
-    watch: {
-        page: {
-            immediate: true,
-            handler(newPage) {
-                const target = getProgressBarPercentage(newPage);
-                if (this.timeoutId) clearTimeout(this.timeoutId);
-
-                // Animate from current value to new value
-                this.timeoutId = setTimeout(() => {
-                    this.displayedProgress = target;
-                    lastProgress = target; // Update the module-level variable
-                }, 150);
-            }
-        }
-    },
-    beforeUnmount() {
-        if (this.timeoutId) clearTimeout(this.timeoutId);
     }
 };
 </script>
 <style lang="scss">
-.progress-bar-outer {
-    background: $blue-100;
-    height: 5px;
-    position: relative;
-    border-radius: 0;
-    width: 100%;
-    margin-top: 0;
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
-    .progress-bar-inner {
-        transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1);
-        will-change: width;
-        height: 100%;
-        background-color: $red;
-        position: absolute;
-        top: 0;
-        left: 0;
-        border-radius: 0;
-    }
-}
+    .progress-bar-container {
+        padding: .75rem 0;
+        width: 55%;
+        display: block;
 
-.progress-bar-outer-vertical {
-    background: $blue-100;
-    width: 24px;
-    height: 356px;
-    position: relative;
-    margin-top: 0;
-    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
-    overflow: hidden;
-    border-radius: 50rem;
-    .progress-bar-inner {
-        transition: height 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
-        will-change: height !important;
-        width: 100%;
-        background-color: $red;
-        position: absolute;
-        left: 0;
-        top: 0;
-        border-radius: 50rem;
+        .progress-bar-header {
+            width: 38px;
+            height: 15px;
+            float: left;
+            padding-right: 5px;
+            // color: @color-progress-bar;
+            // font-weight: @font-weight-bold;
+            font-style: normal;
+            font-stretch: normal;
+            font-size: 14px;
+            line-height: 15px;
+            text-align: right;
+        }
+
+        .progress {
+            height: 10px;
+            width: 100%;
+            box-shadow: none;
+            border-top-left-radius: 7.5px;
+            border-bottom-left-radius: 7.5px;
+            line-height: inherit;
+
+            /* Firefox */
+            appearance: none;
+            background-color: $blue-100;
+            border: 0;
+            border-radius: $border-radius-pill;
+            box-shadow: $box-shadow-inset;
+
+            &::-moz-progress-bar {
+                background-color: $blue;
+                border-radius: $border-radius-pill;
+            }
+
+            /* Webkit */
+            -webkit-appearance: none;
+            &::-webkit-progress-bar {
+                background-color: $blue-100;
+                border-radius: $border-radius-pill;
+                box-shadow: $box-shadow-inset;
+            }
+            &::-webkit-progress-value {
+                background-color: $blue;
+                border-radius: $border-radius-pill;
+            }
+        }
+
+        .progress-bar-middle {
+            position: relative;
+            float: right;
+            margin-right: -8.5px;
+            width: 17px;
+            height: 17px;
+            margin-top: -1px;
+            border: solid 2px; //@progress-bar-outer-color;
+            border-radius: 50%;
+            //background-color: @color-progress-bar;
+            box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
+        }
     }
-}
 </style>
diff --git a/src/iss-components/site-header/site-header.vue b/src/iss-components/site-header/site-header.vue
index bbd4f900..b16bdb69 100644
--- a/src/iss-components/site-header/site-header.vue
+++ b/src/iss-components/site-header/site-header.vue
@@ -2,12 +2,17 @@
     <div
         class="site-header-container"
         :style="logoBackgroundStyle">
-        <div class="site-header iss-heritage-container-width">
-            <img
-                id="siteHeaderImage"
-                class="img-fluid"
-                :src="imageSrc"
-                :alt="altText" />
+        <div class="site-header iss-heritage-container-width row">
+            <div class="col">
+                <img
+                    id="siteHeaderImage"
+                    class="img-fluid"
+                    :src="imageSrc"
+                    :alt="altText" />
+            </div>
+            <div class="col">
+                <progress-bar />
+            </div>
         </div>
         <alert
             v-if="displayGlobalAlert"
@@ -25,11 +30,12 @@ import alert from '@/ux-components/alert/alert.vue';
 import { useMainStore } from '@/store';
 import eventBus from '@/helpers/event-bus/event-bus';
 import { globalEvents } from '@/constants/events';
+import progressBar from '@/iss-components/site-header/progress-bar/progress-bar.vue';
 
 export default {
     name: 'site-header',
     components: {
-        alert
+        alert, progressBar
     },
     props: {
         cmsWidgetName: String

From 9c137257aaa67893ad23753c3ab2f33803752103 Mon Sep 17 00:00:00 2001
From: Alex Humphries <Alex.Humphries@safelite.com>
Date: Mon, 8 Dec 2025 10:00:59 -0500
Subject: [PATCH 09/17] INSR-7764: Update input styles and dropdown icons

Updated the styles for dropdown, textbox, and textarea components to
more closely align with heritage design, including the icon for the
dropdown component.
---
 src/assets/img/icons/select-error.png         | Bin 0 -> 1413 bytes
 src/assets/img/icons/select-error.svg         |   5 +++
 src/assets/img/icons/select.png               | Bin 0 -> 1392 bytes
 src/assets/img/icons/select.svg               |   5 +++
 .../dropdown-question/dropdown-question.vue   |  18 ++++------
 .../textarea-question/textarea-question.vue   |  15 +++------
 .../textbox-question/textbox-question.vue     |  19 ++++-------
 src/styles/common-error-styles.scss           |  31 ++++++++----------
 src/styles/ux-variables.scss                  |   5 +++
 9 files changed, 44 insertions(+), 54 deletions(-)
 create mode 100644 src/assets/img/icons/select-error.png
 create mode 100644 src/assets/img/icons/select-error.svg
 create mode 100644 src/assets/img/icons/select.png
 create mode 100644 src/assets/img/icons/select.svg

diff --git a/src/assets/img/icons/select-error.png b/src/assets/img/icons/select-error.png
new file mode 100644
index 0000000000000000000000000000000000000000..9e971ee9de78789dd8302b19418f8fbca8d7ba54
GIT binary patch
literal 1413
zcmV;01$z34P)<h;3K|Lk000e1NJLTq0015U001)x1^@s6fC9Km00001b5ch_0Itp)
z=>Px)KS@MER9Fe^SY2pbMHHTy-87m)L@TkaNp_Rn4d$n*QV@-$tyO450}YZ^-;}5Y
zq1Y!;sZdZ6eG?%s8WchNCzVo?g4U|Ficr*;AMNfoyV+2+7>m^=+2-zy=ey=6GqZb>
z-6r6J8CdQ)-}%n@?wz@J@0rWl6^uknb*GZ-6{K>(o`?=j^p#qMmzt1l3Ei8Mxx-Ac
zpqtB?6A*#jk)ia_QfieX9B&QZ#vJEUrC5b7!a18_!Qfr7!PGZ8zL;IK@YtsCO|y=3
zl8UYKDL7dc3~sIaG4+#A+<=AQ`8eaZ)NFKe&H#n|M3K1;9B_Tg81Rz9$u0HQWM|j_
zO>fA^EZ~3xE^-Ql4QNr}_&w2bIW_ySVrr9-MGmdeOZeG1xX3}S9n*bZVRh(`VCk8+
zsnB*k0XAp+t>{SRY5ZW@aW@CKsNpkw1Bv%~U!|$L-_D~uxIcPBq?>cD@SC%-{>DHq
zY8asA6uhewjWq`)Q_pF<e@)K6tqfkfbN%4pB|Y|QYwOyJ&V}Plsatg%wqX3(=xFA7
z8_yGtH&%Bm#$GQ#JhQf<;*O1{&-`x3;Gf&laQ&sJsjn!v!H$#2BeBtmUL7}t<IS}l
zOv*k=4(KFW)nCfW18sHRr&1<vdSf?-!?W4kDaO<WJwhTmCPZg!c>IWm&kHA7LTxH1
zKcO4rYA=W*-8>fqBDk%7c<cuq_p{G7*KN*8=L@P+sdK2#G!KZoqeE#rF)RU%R7<E)
zN_nJ!XqF4HyI4`w0v9<Xl!fmN)P@GMfbq=c>KkWf+1GRz)_5d0z?h_0&jYcM@eg#o
zSUcWS+r^Z8mzK?Va_FhZTvf(y7c;ZG#};*kIXiHrqR2-si5##`6k5;}GzB~DAU&Ti
zMn@)mpFx}N=c5K{*>PxM8j^Z|h;PJ3GSBGPa%{I2=Wkjyl0t~U<1{7b-2f4yRguRm
z(z4xHRpe1NCk`!Wx<yr2SD=_T%5u*D8qiv9oz?u+8Cacx)fxCd&cJ{1U(MZKOXm9M
z1zm+V2;L<8#0h657eMXU5saTtzDDiuLwGxJ5$Fs`nd_mwZj~!U0V2SBcqN5BQPji*
zD$+zF5HUm`-c+5}H5i-{9JdzLv{E91y20ZXh_iYs(Nw+P#!K~41GVftXnI}dDI(PB
z1Zud^Wj;tv+xt3RtW90!9_ljRDbQt(Q<vH1HuUIqFH3onF7-O2Fz1&A7wysE^k)XX
zgp+6v-6@qEpn7WzD(8Q!5n^k2C_U=-ysjZc2fBTONQp|y!`K}d_#zIt$gxFHn;N_h
zXd&GdhT(241m8<jkc00HYDFs@>GWe?<Y9hCaB|8SK#tCFYf^1*`-0fKFr2wf)jrtf
zP#c`Aa|}B|6JPKU14k*fegU1g_URiopoTC2Y$s_?dl0rh=q73SdwTjP_QE<28yI5X
z*fG?yx2WLc2?L~!^b52mJ+O^I8}GlI3m@X2$ira+qczRjl%ob}d0hQiP#A>h-tPVM
z_x6!ahD}r1p7<@<OGl31oZW8okc%2N?)mQH<T>`y{c@Aa9;2IOyB(uD^krbQ^?cHf
z(UpGA!sWYS{Rv~Ms`C~V1`*vqeLnh<#PdEm>4h|VFi^2(TjccFKQ%1RTv8Yr_*$3E
zD*U^J@+xQmO>erqoVV3}mpP}w1x?>I*4Zc&2$t<4Y*NQ9dlH;tM3GmNFo^YoV?Xn<
z;C*yeQ}Fcx3^8zYd@;LdVHCk<VcKHup)WEEjRM)gO8I1rT1Blfi27KGFZBNaFRn32
T<FG;j00000NkvXXu0mjfpz*OM

literal 0
HcmV?d00001

diff --git a/src/assets/img/icons/select-error.svg b/src/assets/img/icons/select-error.svg
new file mode 100644
index 00000000..c2bb165d
--- /dev/null
+++ b/src/assets/img/icons/select-error.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="30" height="51">
+<path d="M0 0 C2.71542435 0.28189787 3.8318973 0.83226595 5.78125 2.77734375 C6.3484375 3.49019531 6.915625 4.20304687 7.5 4.9375 C9.80138447 7.81946101 11.57696893 9.56623041 15 11 C15.54269531 10.45730469 16.08539062 9.91460937 16.64453125 9.35546875 C19.76302083 6.23697917 22.88151042 3.11848958 26 0 C26.99 0.33 27.98 0.66 29 1 C29.51189221 3.69906804 29.37732021 5.42276968 27.86181641 7.74121094 C26.2447994 9.69112803 24.55507255 11.53655776 22.8125 13.375 C21.9452832 14.35533203 21.9452832 14.35533203 21.06054688 15.35546875 C16.82647579 19.9005168 16.82647579 19.9005168 13.46875 20.3046875 C9.84893056 18.39168166 7.40844895 15.77180722 4.6875 12.75 C3.86282227 11.88955078 3.86282227 11.88955078 3.02148438 11.01171875 C-0.89121643 6.74420159 -0.89121643 6.74420159 -1.41796875 3.140625 C-1 1 -1 1 0 0 Z " fill="#DC2D20" transform="translate(1,31)"/>
+<path d="M0 0 C3.61981944 1.91300584 6.06030105 4.53288028 8.78125 7.5546875 C9.33103516 8.12832031 9.88082031 8.70195312 10.44726562 9.29296875 C14.38100352 13.5834307 14.38100352 13.5834307 14.82421875 17.2265625 C14.70691406 17.91234375 14.58960937 18.598125 14.46875 19.3046875 C13.47875 19.6346875 12.48875 19.9646875 11.46875 20.3046875 C7.80208333 16.63802083 4.13541667 12.97135417 0.46875 9.3046875 C-3.82338446 11.10248943 -5.91021282 13.95824759 -8.75 17.52734375 C-10.6993527 19.47242155 -11.81582565 20.02278963 -14.53125 20.3046875 C-15.53125 19.3046875 -15.53125 19.3046875 -15.98046875 17.203125 C-15.27729167 12.66610417 -12.42969789 10.18541246 -9.34375 6.9296875 C-8.76560547 6.27613281 -8.18746094 5.62257813 -7.59179688 4.94921875 C-3.35772579 0.4041707 -3.35772579 0.4041707 0 0 Z " fill="#DC2D20" transform="translate(15.53125,-0.3046875)"/>
+</svg>
diff --git a/src/assets/img/icons/select.png b/src/assets/img/icons/select.png
new file mode 100644
index 0000000000000000000000000000000000000000..0845f7532a3ff4a4cb8c85110d42535970f01f41
GIT binary patch
literal 1392
zcmV-$1&{iPP)<h;3K|Lk000e1NJLTq0015U001)x1^@s6fC9Km00001b5ch_0Itp)
z=>Px)DoI2^R9Fe^SX*cuRTw^JX0laV8;F`sQj20mtsuS?ZHwB9G*N?1HmyD?^#X;e
zFG`gpjA_K%i(1Hw28$qg$>u_+O(?dCZ51DV@P-vHkY-ygBsPuN?9B1|PBWXCGrQT{
zB;bP?*q#6X{{R2JnRCvZIcKC;#8KOsZjruti>1mE&z$W_4OB`aD=nz&Oh4c&F({OB
zbgh&*ONyQ2U8%#Ba8)FnbklbTPkg47x*{whrMxI?ac{;=eI3RZvdb23aQklYa`J={
z>Z(G7Qpmq-M{ON*+kPk%H!;fu3i<2Zp$3SK6cc3)W6WW0Ar2EODSX4LN2{~mEJd#~
zi%p+7%w>%kGyMgHZ+!dHRZ~-wLrRI;%tC3&*Z4DW=CX#hW-RO%6?R=^O`e<n00Zgn
zaDld^e1H6<)))8_u+2DYSW6Bw7WhR2JzoDoJTj>uF@Kig$gOtG9*ktgA8jGzNIo7I
zsMQ>SZ=4H`>SRZ{9anw8$Q2m5--zlp+cVGYm<q>|Z;Y-M6Bmx5k2i&J+PJum%z;#Q
z3^##fXL^tF)w?DRhMycev1QC{{xcQ>(BKYVo%6CM(MmU&ag2q>GhM0PFdn(%WM^Nq
z@&%_qJDh~;K4Ur7=5e>>*C-zK>fC|r{hWUa4_AFOB0On{mP}XMaDeCgxWOIVEPU}1
z0#Q*ZCaa`uDkVxn<}eq1G8qWWoo#Y!jX6NyaeaILMqm0T@F>)T3(%)CxY8!f!^gvT
zDI4?oHniLk^m*iwl2V+vl(qFtckB1^+V0_Xv;SnjLelyOp%lI)tw+YYT0e>4Wjb}8
z{kweSe~2k9->NLd&HPbyS>jG>b|%{s6J>&w&n{M!0<0wm?eIY@YFaS1hXb@R3SYq}
zJZR#T`s5&&Sw~GYgFGD$pef!%!HZ#RDYoX4@=%mRp0*s@-iszVs{=^b=+rzJO<KB#
z+3gAR-61kji<+8s*T>2(=Z&J1m+(goYAu0crF5kQR$5@C1^%}!@L$Z;lItMP^9Hb-
zt>qhpZ<5d5ZMo&_g?rrN&UfDVcd!C|ly4{7wp*N>=k)-n)j|j$f#ze&DIAEBlQ&3B
zECkeshzP`!9sRLYLnNmHM{|KQTB0^!GcS)tL0*-=9}D|^CSIve4sw}w)U>KrC9nb!
zzneic$(wZ@1G`PUT%Wb%F!QOUH5n+nu9hN;!O*y<b+u9>Sf?k#!r^r_`dA1qux;CE
z#_E1LoXA37sljy}{kMnlg>2@sCMF7QYEX;yTA0R|yYm#hhhcj3^M?{^XO%j_eNi4O
zVlZb`_#;@vuQgIUa%+vbKwg+WH&s{%KV=lbRrS8-k8(#Ck6l6-V-7^?%p7utH*AbY
zgb83B+>0h}ryV)4{q%C#!+I|q2?#-qF+2|OEh@OkX_Ul;nULvjdl|D>kC}`ez$P_u
zp^r0B5Ti|uu>i}T!J)bGz`PN=;~=!xZrum*bl}gQRU>AiUOXz2KicSu#`*Z1g<8!K
z3tR&9Hnm7h@XO8L=cY#?Q0N29>$*;<=goRNf?r&D&E-3Oe)|3yGZy#@3NwkT|EZ~o
zFY$Q9J~;&>;WG%oUA?CIu3z@wHxb57yJ%Afi6ltaRgIYDehaW-XXYfFs-{w+tS@=T
zfk;F9(9NF6ox~t2{w-5DTgJK{`Z1_k=v?xSgJMnShzHSs7XvIfYYee+MOjz2Fq8RN
y81wCJjQ0730&HTHd@?3i*-g#l;8>0?^#1~s#WuFLq=|$80000<MNUMnLSTXp^_hqO

literal 0
HcmV?d00001

diff --git a/src/assets/img/icons/select.svg b/src/assets/img/icons/select.svg
new file mode 100644
index 00000000..31dc193b
--- /dev/null
+++ b/src/assets/img/icons/select.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="30" height="51">
+<path d="M0 0 C2.71542435 0.28189787 3.8318973 0.83226595 5.78125 2.77734375 C6.3484375 3.49019531 6.915625 4.20304687 7.5 4.9375 C9.80138447 7.81946101 11.57696893 9.56623041 15 11 C15.54269531 10.45730469 16.08539062 9.91460937 16.64453125 9.35546875 C19.76302083 6.23697917 22.88151042 3.11848958 26 0 C26.99 0.33 27.98 0.66 29 1 C29.51189221 3.69906804 29.37732021 5.42276968 27.86181641 7.74121094 C26.2447994 9.69112803 24.55507255 11.53655776 22.8125 13.375 C21.9452832 14.35533203 21.9452832 14.35533203 21.06054688 15.35546875 C16.82647579 19.9005168 16.82647579 19.9005168 13.46875 20.3046875 C9.84893056 18.39168166 7.40844895 15.77180722 4.6875 12.75 C3.86282227 11.88955078 3.86282227 11.88955078 3.02148438 11.01171875 C-0.89121643 6.74420159 -0.89121643 6.74420159 -1.41796875 3.140625 C-1 1 -1 1 0 0 Z " fill="#1A7EAF" transform="translate(1,31)"/>
+<path d="M0 0 C3.61981944 1.91300584 6.06030105 4.53288028 8.78125 7.5546875 C9.33103516 8.12832031 9.88082031 8.70195312 10.44726562 9.29296875 C14.38100352 13.5834307 14.38100352 13.5834307 14.82421875 17.2265625 C14.70691406 17.91234375 14.58960937 18.598125 14.46875 19.3046875 C13.47875 19.6346875 12.48875 19.9646875 11.46875 20.3046875 C7.80208333 16.63802083 4.13541667 12.97135417 0.46875 9.3046875 C-3.82338446 11.10248943 -5.91021282 13.95824759 -8.75 17.52734375 C-10.6993527 19.47242155 -11.81582565 20.02278963 -14.53125 20.3046875 C-15.53125 19.3046875 -15.53125 19.3046875 -15.98046875 17.203125 C-15.27729167 12.66610417 -12.42969789 10.18541246 -9.34375 6.9296875 C-8.76560547 6.27613281 -8.18746094 5.62257813 -7.59179688 4.94921875 C-3.35772579 0.4041707 -3.35772579 0.4041707 0 0 Z " fill="#1A7EAF" transform="translate(15.53125,-0.3046875)"/>
+</svg>
diff --git a/src/digital-components/dropdown-question/dropdown-question.vue b/src/digital-components/dropdown-question/dropdown-question.vue
index 341120a5..f0634855 100644
--- a/src/digital-components/dropdown-question/dropdown-question.vue
+++ b/src/digital-components/dropdown-question/dropdown-question.vue
@@ -132,29 +132,23 @@ export default {
         margin-bottom: 0.25rem;
     }
     .form-select {
-        border: 1px solid $gray-500;
-        background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 8.89' xml:space='preserve'%3e%3cpath d='M8 8.89c-.24 0-.46-.09-.63-.26L.26 1.53a.901.901 0 0 1 0-1.27C.43.1.66 0 .9 0s.47.1.64.26L8 6.74 14.47.27c.17-.17.4-.27.64-.27s.47.1.63.27c.17.17.26.4.26.64s-.1.47-.27.63l-7.1 7.09a.86.86 0 0 1-.63.26z' fill='%231474a2'/%3e%3c/svg%3e");
+        border: $border-input;
+        background-image: url(~@/assets/img/icons/select.png);
+        background-size: 0.625rem 1rem;
         color: $gray-600;
-        border-radius: 0.5rem;
+        border-radius: $border-radius;
         min-height: 3rem;
         letter-spacing: inherit;
+        box-shadow: $box-shadow-input;
         &:focus,
         &:focus-visible {
-            box-shadow: 0 0 0 2.5px $blue;
+            border: $border-input-focus;
         }
         &:disabled,
         &.disabled {
             background-color: $gray-100;
             color: $gray-500;
             filter: grayscale(100%);
-            &:hover {
-                box-shadow: 0 0 0 4px transparent;
-                border: 1px solid $gray-500;
-            }
-        }
-        &:hover {
-            border: 1px solid $gray-500;
-            box-shadow: 0 0 0 4px $blue-300;
         }
     }
 }
diff --git a/src/digital-components/textarea-question/textarea-question.vue b/src/digital-components/textarea-question/textarea-question.vue
index 152b86de..a7f777fe 100644
--- a/src/digital-components/textarea-question/textarea-question.vue
+++ b/src/digital-components/textarea-question/textarea-question.vue
@@ -153,27 +153,20 @@ export default {
 
     .form-control {
         max-height: 30rem;
-        border: 1px solid $gray-500;
-        border-radius: 0.5rem;
+        border: $border-input;
+        border-radius: $border-radius;
         padding: 12px 16px;
         letter-spacing: inherit;
+        box-shadow: $box-shadow-input;
         &::placeholder {
             color: $gray-500;
         }
         &:focus {
-            box-shadow: 0 0 0 2.5px $blue;
+            border: $border-input-focus;
         }
         &:disabled,
         &.disabled {
             background-color: $gray-100;
-            &:hover {
-                box-shadow: 0 0 0 4px transparent;
-                border: 1px solid $gray-500;
-            }
-        }
-        &:hover {
-            border: 1px solid $gray-500;
-            box-shadow: 0 0 0 4px $blue-300;
         }
     }
 }
diff --git a/src/digital-components/textbox-question/textbox-question.vue b/src/digital-components/textbox-question/textbox-question.vue
index 8b5c6c84..31402629 100644
--- a/src/digital-components/textbox-question/textbox-question.vue
+++ b/src/digital-components/textbox-question/textbox-question.vue
@@ -275,7 +275,7 @@ input::-webkit-date-and-time-value {
         position: relative;
         &.has-search-icon {
             input[type='text'] {
-                border-radius: $border-radius-lg;
+                border-radius: $border-radius;
             }
             button[type='submit'] {
                 position: absolute;
@@ -329,29 +329,22 @@ input::-webkit-date-and-time-value {
         margin-bottom: 0.25rem;
     }
     .form-control {
-        border: 1px solid $gray-500;
-        border-radius: 0.5rem;
+        border: $border-input;
+        border-radius: $border-radius;
         min-height: 3rem;
         max-height: 3rem;
         padding: 0.75rem 1rem;
         letter-spacing: inherit;
+        box-shadow: $box-shadow-input;
         &::placeholder {
             color: $gray-500;
         }
-        &:focus {
-            box-shadow: 0 0 0 2.5px $blue;
+        &:focus, &:focus-within {
+            border: $border-input-focus;
         }
         &:disabled,
         &.disabled {
             background-color: $gray-100;
-            &:hover {
-                box-shadow: 0 0 0 4px transparent;
-                border: 1px solid $gray-500;
-            }
-        }
-        &:hover {
-            border: 1px solid $gray-500;
-            box-shadow: 0 0 0 4px $blue-300;
         }
     }
     p {
diff --git a/src/styles/common-error-styles.scss b/src/styles/common-error-styles.scss
index 1fe0d071..d1d5bf91 100644
--- a/src/styles/common-error-styles.scss
+++ b/src/styles/common-error-styles.scss
@@ -1,3 +1,5 @@
+
+@import "@/styles/ux-variables-svg-strings.scss";
 html {
     .has-error {
 
@@ -111,27 +113,20 @@ html {
             input,
             input.form-control,
             select,
-            select.form-select {
-                border: 1px solid $red;
-
-                &:focus {
-                    border: 1px solid transparent;
-                    box-shadow: 0 0 0 2.5px $red;
-                }
-
-                &:hover {
-                    box-shadow: 0px 0px 0px 4px $red-200;
-                    border-radius: 0.5rem;
-                    border: 1px solid $red;
-                }
+            select.form-select,
+            input:focus,
+            input.form-control:focus,
+            input.form-control:focus-within,
+            select:focus,
+            select.form-select:focus {
+                border-color: $red;
             }
 
             select,
-            select.form-select {
-                background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 8.89' xml:space='preserve'%3e%3cpath d='M8 8.89c-.24 0-.46-.09-.63-.26L.26 1.53a.901.901 0 0 1 0-1.27C.43.1.66 0 .9 0s.47.1.64.26L8 6.74 14.47.27c.17-.17.4-.27.64-.27s.47.1.63.27c.17.17.26.4.26.64s-.1.47-.27.63l-7.1 7.09a.86.86 0 0 1-.63.26z' fill='%23d4281c'/%3e%3c/svg%3e");
-                background-repeat: no-repeat;
-                background-position: right 0.75rem center;
-                background-size: 16px 12px;
+            select.form-select,
+            select:focus,
+            select.form-select:focus {
+                background-image: url(~@/assets/img/icons/select-error.png);
             }
         }
     }
diff --git a/src/styles/ux-variables.scss b/src/styles/ux-variables.scss
index 409fc9e5..02d29d6c 100644
--- a/src/styles/ux-variables.scss
+++ b/src/styles/ux-variables.scss
@@ -193,6 +193,7 @@ $box-shadow: 0 0.5rem 1rem rgba($black, 0.15);
 $box-shadow-sm: 0 0.125rem 0.25rem rgba($black, 0.075);
 $box-shadow-lg: 0 1rem 3rem rgba($black, 0.25); //Safelite default
 $box-shadow-inset: inset 0 1px 2px rgba($black, 0.075);
+$box-shadow-input: rgba($black, 0.2) 0rem 0.0625rem 0.3125rem 0rem;
 
 //Alerts
 $alert-bg-scale: -90%;
@@ -209,3 +210,7 @@ $enable-important-utilities: false;
 
 // Letter Spacing
 $letter-spacing-primary: 0.03em;
+
+// Borders
+$border-input: 1px solid rgba(179, 180, 181);
+$border-input-focus: 2.5px solid $blue;
\ No newline at end of file

From a9694b94d19f1d227e26cdcec415606b9ca6f58f Mon Sep 17 00:00:00 2001
From: Alex Humphries <Alex.Humphries@safelite.com>
Date: Mon, 8 Dec 2025 10:03:07 -0500
Subject: [PATCH 10/17] INSR-7764: Remove SVG versions of dropdown icons

The tool I used to convert the PNGs to SVGs made the SVGs look...bad.
So we're going to stick with the PNGs.
---
 src/assets/img/icons/select-error.svg | 5 -----
 src/assets/img/icons/select.svg       | 5 -----
 2 files changed, 10 deletions(-)
 delete mode 100644 src/assets/img/icons/select-error.svg
 delete mode 100644 src/assets/img/icons/select.svg

diff --git a/src/assets/img/icons/select-error.svg b/src/assets/img/icons/select-error.svg
deleted file mode 100644
index c2bb165d..00000000
--- a/src/assets/img/icons/select-error.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="30" height="51">
-<path d="M0 0 C2.71542435 0.28189787 3.8318973 0.83226595 5.78125 2.77734375 C6.3484375 3.49019531 6.915625 4.20304687 7.5 4.9375 C9.80138447 7.81946101 11.57696893 9.56623041 15 11 C15.54269531 10.45730469 16.08539062 9.91460937 16.64453125 9.35546875 C19.76302083 6.23697917 22.88151042 3.11848958 26 0 C26.99 0.33 27.98 0.66 29 1 C29.51189221 3.69906804 29.37732021 5.42276968 27.86181641 7.74121094 C26.2447994 9.69112803 24.55507255 11.53655776 22.8125 13.375 C21.9452832 14.35533203 21.9452832 14.35533203 21.06054688 15.35546875 C16.82647579 19.9005168 16.82647579 19.9005168 13.46875 20.3046875 C9.84893056 18.39168166 7.40844895 15.77180722 4.6875 12.75 C3.86282227 11.88955078 3.86282227 11.88955078 3.02148438 11.01171875 C-0.89121643 6.74420159 -0.89121643 6.74420159 -1.41796875 3.140625 C-1 1 -1 1 0 0 Z " fill="#DC2D20" transform="translate(1,31)"/>
-<path d="M0 0 C3.61981944 1.91300584 6.06030105 4.53288028 8.78125 7.5546875 C9.33103516 8.12832031 9.88082031 8.70195312 10.44726562 9.29296875 C14.38100352 13.5834307 14.38100352 13.5834307 14.82421875 17.2265625 C14.70691406 17.91234375 14.58960937 18.598125 14.46875 19.3046875 C13.47875 19.6346875 12.48875 19.9646875 11.46875 20.3046875 C7.80208333 16.63802083 4.13541667 12.97135417 0.46875 9.3046875 C-3.82338446 11.10248943 -5.91021282 13.95824759 -8.75 17.52734375 C-10.6993527 19.47242155 -11.81582565 20.02278963 -14.53125 20.3046875 C-15.53125 19.3046875 -15.53125 19.3046875 -15.98046875 17.203125 C-15.27729167 12.66610417 -12.42969789 10.18541246 -9.34375 6.9296875 C-8.76560547 6.27613281 -8.18746094 5.62257813 -7.59179688 4.94921875 C-3.35772579 0.4041707 -3.35772579 0.4041707 0 0 Z " fill="#DC2D20" transform="translate(15.53125,-0.3046875)"/>
-</svg>
diff --git a/src/assets/img/icons/select.svg b/src/assets/img/icons/select.svg
deleted file mode 100644
index 31dc193b..00000000
--- a/src/assets/img/icons/select.svg
+++ /dev/null
@@ -1,5 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="30" height="51">
-<path d="M0 0 C2.71542435 0.28189787 3.8318973 0.83226595 5.78125 2.77734375 C6.3484375 3.49019531 6.915625 4.20304687 7.5 4.9375 C9.80138447 7.81946101 11.57696893 9.56623041 15 11 C15.54269531 10.45730469 16.08539062 9.91460937 16.64453125 9.35546875 C19.76302083 6.23697917 22.88151042 3.11848958 26 0 C26.99 0.33 27.98 0.66 29 1 C29.51189221 3.69906804 29.37732021 5.42276968 27.86181641 7.74121094 C26.2447994 9.69112803 24.55507255 11.53655776 22.8125 13.375 C21.9452832 14.35533203 21.9452832 14.35533203 21.06054688 15.35546875 C16.82647579 19.9005168 16.82647579 19.9005168 13.46875 20.3046875 C9.84893056 18.39168166 7.40844895 15.77180722 4.6875 12.75 C3.86282227 11.88955078 3.86282227 11.88955078 3.02148438 11.01171875 C-0.89121643 6.74420159 -0.89121643 6.74420159 -1.41796875 3.140625 C-1 1 -1 1 0 0 Z " fill="#1A7EAF" transform="translate(1,31)"/>
-<path d="M0 0 C3.61981944 1.91300584 6.06030105 4.53288028 8.78125 7.5546875 C9.33103516 8.12832031 9.88082031 8.70195312 10.44726562 9.29296875 C14.38100352 13.5834307 14.38100352 13.5834307 14.82421875 17.2265625 C14.70691406 17.91234375 14.58960937 18.598125 14.46875 19.3046875 C13.47875 19.6346875 12.48875 19.9646875 11.46875 20.3046875 C7.80208333 16.63802083 4.13541667 12.97135417 0.46875 9.3046875 C-3.82338446 11.10248943 -5.91021282 13.95824759 -8.75 17.52734375 C-10.6993527 19.47242155 -11.81582565 20.02278963 -14.53125 20.3046875 C-15.53125 19.3046875 -15.53125 19.3046875 -15.98046875 17.203125 C-15.27729167 12.66610417 -12.42969789 10.18541246 -9.34375 6.9296875 C-8.76560547 6.27613281 -8.18746094 5.62257813 -7.59179688 4.94921875 C-3.35772579 0.4041707 -3.35772579 0.4041707 0 0 Z " fill="#1A7EAF" transform="translate(15.53125,-0.3046875)"/>
-</svg>

From e2b66ebdab5c8bf9b7f39536198471c8fbb789a9 Mon Sep 17 00:00:00 2001
From: Bill Richardson <william.richardson@safelite.com>
Date: Mon, 8 Dec 2025 10:22:26 -0500
Subject: [PATCH 11/17] couple tweaks

---
 .../site-header/progress-bar/progress-bar.vue   | 12 ++++++++++--
 src/iss-components/site-header/site-header.vue  | 17 ++++++++++++++---
 2 files changed, 24 insertions(+), 5 deletions(-)

diff --git a/src/iss-components/site-header/progress-bar/progress-bar.vue b/src/iss-components/site-header/progress-bar/progress-bar.vue
index 1312783c..49e2d9a8 100644
--- a/src/iss-components/site-header/progress-bar/progress-bar.vue
+++ b/src/iss-components/site-header/progress-bar/progress-bar.vue
@@ -37,8 +37,7 @@ export default {
 <style lang="scss">
     .progress-bar-container {
         padding: .75rem 0;
-        width: 55%;
-        display: block;
+        display: flex;
 
         .progress-bar-header {
             width: 38px;
@@ -54,6 +53,11 @@ export default {
             text-align: right;
         }
 
+        .progress-bar {
+            min-width: 17.1875rem;
+            margin-left: .5rem;
+        }
+
         .progress {
             height: 10px;
             width: 100%;
@@ -87,6 +91,10 @@ export default {
             }
         }
 
+        .progress {
+            margin-left: .5rem;
+        }
+
         .progress-bar-middle {
             position: relative;
             float: right;
diff --git a/src/iss-components/site-header/site-header.vue b/src/iss-components/site-header/site-header.vue
index b16bdb69..ec52c5d3 100644
--- a/src/iss-components/site-header/site-header.vue
+++ b/src/iss-components/site-header/site-header.vue
@@ -2,15 +2,15 @@
     <div
         class="site-header-container"
         :style="logoBackgroundStyle">
-        <div class="site-header iss-heritage-container-width row">
-            <div class="col">
+        <div class="site-header iss-heritage-container-width">
+            <div class="header-logo-container">
                 <img
                     id="siteHeaderImage"
                     class="img-fluid"
                     :src="imageSrc"
                     :alt="altText" />
             </div>
-            <div class="col">
+            <div class="header-progress-bar-container">
                 <progress-bar />
             </div>
         </div>
@@ -145,9 +145,20 @@ export default {
     }
 
     .site-header {
+        display: flex;
         @include media-breakpoint-down(md) {
             margin: 0 -.75rem;
         }
+
+        .header-logo-container {
+            flex: 1 1 auto;
+        }
+        .header-progress-bar-container {
+            flex: 0 1 auto;
+            display: flex;
+            align-items: center;
+            justify-content: flex-end;
+        }
     }
 }
 

From ed5cccfb6adcf171db536ab303534d96023e37f8 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Mon, 8 Dec 2025 16:26:03 -0500
Subject: [PATCH 12/17] use bootstrap progress element, update styling

---
 .../site-header/progress-bar/progress-bar.vue | 82 ++++++++++---------
 1 file changed, 42 insertions(+), 40 deletions(-)

diff --git a/src/iss-components/site-header/progress-bar/progress-bar.vue b/src/iss-components/site-header/progress-bar/progress-bar.vue
index 49e2d9a8..d813bbbf 100644
--- a/src/iss-components/site-header/progress-bar/progress-bar.vue
+++ b/src/iss-components/site-header/progress-bar/progress-bar.vue
@@ -5,13 +5,17 @@
         <div class="progress-bar-header">
             <span aria-hidden="true">{{ progress }}%</span>
         </div>
-        <progress
-            class="progress-bar progress-bar-success"
-            :value="progress"
-            max="100"
-            aria-label="Scheduling progress">
-                <div class="progress-bar-middle"></div>
-        </progress>
+        <div class="progress">
+            <div
+                class="progress-bar progress-bar-success"
+                role="progressbar"
+                :aria-valuetext="`Scheduling progress ${progress}%`"
+                aria-valuemin="0"
+                aria-valuemax="100"
+                :style="{ width: progress + '%' }">
+                    <div class="progress-bar-middle"></div>
+            </div>
+        </div>
     </div>
 </template>
 
@@ -36,28 +40,41 @@ export default {
 </script>
 <style lang="scss">
     .progress-bar-container {
-        padding: .75rem 0;
         display: flex;
 
         .progress-bar-header {
-            width: 38px;
-            height: 15px;
-            float: left;
-            padding-right: 5px;
-            // color: @color-progress-bar;
-            // font-weight: @font-weight-bold;
-            font-style: normal;
-            font-stretch: normal;
-            font-size: 14px;
-            line-height: 15px;
+            padding-right: 0.3125rem;
+            color: $green;
+            font-weight: 600;
+            font-size: 0.875rem;
+            line-height: 0.9375rem;
             text-align: right;
         }
 
-        .progress-bar {
+        .progress {
             min-width: 17.1875rem;
-            margin-left: .5rem;
+            margin-left: 0;
+            border-radius: $border-radius-pill;
+
+            .progress-bar {
+                background-color: $green;
+
+                .progress-bar-middle {
+                    width: 1.0625rem;
+                    height: 1.0625rem;
+                    position: relative;
+                    float: right;
+                    margin-right: -8.5px;
+                    margin-top: -1px;
+                    border: 0.125rem solid #ffffff;
+                    border-radius: 50%;
+                    background-color: $green;
+                    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
+                }
+            }
         }
 
+        /*
         .progress {
             height: 10px;
             width: 100%;
@@ -66,7 +83,7 @@ export default {
             border-bottom-left-radius: 7.5px;
             line-height: inherit;
 
-            /* Firefox */
+            /* Firefox
             appearance: none;
             background-color: $blue-100;
             border: 0;
@@ -77,8 +94,9 @@ export default {
                 background-color: $blue;
                 border-radius: $border-radius-pill;
             }
+             */
 
-            /* Webkit */
+            /* Webkit
             -webkit-appearance: none;
             &::-webkit-progress-bar {
                 background-color: $blue-100;
@@ -89,23 +107,7 @@ export default {
                 background-color: $blue;
                 border-radius: $border-radius-pill;
             }
-        }
-
-        .progress {
-            margin-left: .5rem;
-        }
-
-        .progress-bar-middle {
-            position: relative;
-            float: right;
-            margin-right: -8.5px;
-            width: 17px;
-            height: 17px;
-            margin-top: -1px;
-            border: solid 2px; //@progress-bar-outer-color;
-            border-radius: 50%;
-            //background-color: @color-progress-bar;
-            box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
-        }
+                */
+        /*}*/
     }
 </style>

From ab7273f74dfba1a554333af1f25723b7ce29a219 Mon Sep 17 00:00:00 2001
From: Jeremy-Z <Jeremy.Zimmerman@safelite.com>
Date: Tue, 9 Dec 2025 11:33:29 -0500
Subject: [PATCH 13/17] Removed debugging code.

---
 src/store/index.js | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/src/store/index.js b/src/store/index.js
index 670b224e..78b686cd 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -1242,10 +1242,6 @@ export const useMainStore = defineStore({
             if (availableLineItems && availableLineItems.length > 0) {
                 const { vehicle, serviceLocation, policy, eon, referralNumber, referralDate, referralSequenceNumber, lineItems } = this.order;
 
-                console.error("get combined quote");
-
-                console.error("line items 1: " + availableLineItems.length + " : " + JSON.stringify(availableLineItems, null, 2));
-
                 const availableLineItemsFiltered = availableLineItems.filter((lineItem) => {
                     if ( lineItem.partNumber )
                         return true;
@@ -1257,8 +1253,6 @@ export const useMainStore = defineStore({
                     return {partNumber: lineItem.partNumber};
                 });
 
-                console.error("line items2: " + JSON.stringify(lineItemsWithOnlyPartNumbers, null, 2));
-
                 const payload = {
                     ParentAccountNumber: this.order.parentAccountNumber,
                     BillToAccountNumber: this.billToAccountNumber,

From 20a39fc155f8a27fd3762f157143f123e9298f14 Mon Sep 17 00:00:00 2001
From: Jeremy-Z <Jeremy.Zimmerman@safelite.com>
Date: Tue, 9 Dec 2025 11:53:39 -0500
Subject: [PATCH 14/17] Fixed issue with rain defense part call .... endpoint
 method was renamed from rain-defense to rain-repel

---
 .../parts/api/v1/parts/{rain-defense.json => rain-repel.json}   | 0
 .../parts/api/v1/parts/{rain-defense.json => rain-repel.json}   | 0
 playwright-tests/tests/mockResponses/mockResponsesConfig.json   | 2 +-
 src/constants/endpoints.js                                      | 2 +-
 4 files changed, 2 insertions(+), 2 deletions(-)
 rename playwright-tests/tests/mockResponses/0001a_Advanced_Replace_Deductible_Client/parts/api/v1/parts/{rain-defense.json => rain-repel.json} (100%)
 rename playwright-tests/tests/mockResponses/0002a_Advanced_Replace_Deductible_Client/parts/api/v1/parts/{rain-defense.json => rain-repel.json} (100%)

diff --git a/playwright-tests/tests/mockResponses/0001a_Advanced_Replace_Deductible_Client/parts/api/v1/parts/rain-defense.json b/playwright-tests/tests/mockResponses/0001a_Advanced_Replace_Deductible_Client/parts/api/v1/parts/rain-repel.json
similarity index 100%
rename from playwright-tests/tests/mockResponses/0001a_Advanced_Replace_Deductible_Client/parts/api/v1/parts/rain-defense.json
rename to playwright-tests/tests/mockResponses/0001a_Advanced_Replace_Deductible_Client/parts/api/v1/parts/rain-repel.json
diff --git a/playwright-tests/tests/mockResponses/0002a_Advanced_Replace_Deductible_Client/parts/api/v1/parts/rain-defense.json b/playwright-tests/tests/mockResponses/0002a_Advanced_Replace_Deductible_Client/parts/api/v1/parts/rain-repel.json
similarity index 100%
rename from playwright-tests/tests/mockResponses/0002a_Advanced_Replace_Deductible_Client/parts/api/v1/parts/rain-defense.json
rename to playwright-tests/tests/mockResponses/0002a_Advanced_Replace_Deductible_Client/parts/api/v1/parts/rain-repel.json
diff --git a/playwright-tests/tests/mockResponses/mockResponsesConfig.json b/playwright-tests/tests/mockResponses/mockResponsesConfig.json
index b0dc208d..f121da14 100644
--- a/playwright-tests/tests/mockResponses/mockResponsesConfig.json
+++ b/playwright-tests/tests/mockResponses/mockResponsesConfig.json
@@ -19,7 +19,7 @@
         "location/api/v1/location/providers/75023/Replace/100/550036/true/CR00056707/DW01571GTNNOEM": "0002a_Advanced_Replace_Deductible_Client/location/api/v1/location/providers/75023/Replace/100/550036/true/CR00056707/DW01571GTNNOEM.json",
         "schedule/api/v1/schedule/shop-time-slots": "0002a_Advanced_Replace_Deductible_Client/schedule/api/v1/schedule/shop-time-slots.json",
         "location/api/v1/location/alert-reasons/01813": "0002a_Advanced_Replace_Deductible_Client/location/api/v1/location/alert-reasons/01813.json",
-        "parts/api/v1/parts/rain-defense": "0002a_Advanced_Replace_Deductible_Client/parts/api/v1/parts/rain-defense.json",
+        "parts/api/v1/parts/rain-repel": "0002a_Advanced_Replace_Deductible_Client/parts/api/v1/parts/rain-repel.json",
         "price/api/v1/price/combined-quote": "0002a_Advanced_Replace_Deductible_Client/price/api/v1/price/combined-quote.json"
     }
 }
\ No newline at end of file
diff --git a/src/constants/endpoints.js b/src/constants/endpoints.js
index 3750f194..055b56b4 100644
--- a/src/constants/endpoints.js
+++ b/src/constants/endpoints.js
@@ -97,7 +97,7 @@ const endpoints = Object.freeze({
         method: 'GET'
     },
     GetRainDefense: {
-        url: `${PARTS_BASE_URL}/rain-defense`,
+        url: `${PARTS_BASE_URL}/rain-repel`,
         method: 'GET'
     },
     GetRecalParts: {

From 9c84db61ef07df8294c50f60b1d2dacd6615494b Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Tue, 9 Dec 2025 12:28:47 -0500
Subject: [PATCH 15/17] updates - rename component, change margin-left

---
 .../site-header/progress-bar/progress-bar.vue | 38 +------------------
 .../site-header/site-header.vue               |  2 +-
 2 files changed, 2 insertions(+), 38 deletions(-)

diff --git a/src/iss-components/site-header/progress-bar/progress-bar.vue b/src/iss-components/site-header/progress-bar/progress-bar.vue
index d813bbbf..8c4013f0 100644
--- a/src/iss-components/site-header/progress-bar/progress-bar.vue
+++ b/src/iss-components/site-header/progress-bar/progress-bar.vue
@@ -63,8 +63,8 @@ export default {
                     width: 1.0625rem;
                     height: 1.0625rem;
                     position: relative;
-                    float: right;
                     margin-right: -8.5px;
+                    margin-left: auto;
                     margin-top: -1px;
                     border: 0.125rem solid #ffffff;
                     border-radius: 50%;
@@ -73,41 +73,5 @@ export default {
                 }
             }
         }
-
-        /*
-        .progress {
-            height: 10px;
-            width: 100%;
-            box-shadow: none;
-            border-top-left-radius: 7.5px;
-            border-bottom-left-radius: 7.5px;
-            line-height: inherit;
-
-            /* Firefox
-            appearance: none;
-            background-color: $blue-100;
-            border: 0;
-            border-radius: $border-radius-pill;
-            box-shadow: $box-shadow-inset;
-
-            &::-moz-progress-bar {
-                background-color: $blue;
-                border-radius: $border-radius-pill;
-            }
-             */
-
-            /* Webkit
-            -webkit-appearance: none;
-            &::-webkit-progress-bar {
-                background-color: $blue-100;
-                border-radius: $border-radius-pill;
-                box-shadow: $box-shadow-inset;
-            }
-            &::-webkit-progress-value {
-                background-color: $blue;
-                border-radius: $border-radius-pill;
-            }
-                */
-        /*}*/
     }
 </style>
diff --git a/src/iss-components/site-header/site-header.vue b/src/iss-components/site-header/site-header.vue
index ec52c5d3..22ced000 100644
--- a/src/iss-components/site-header/site-header.vue
+++ b/src/iss-components/site-header/site-header.vue
@@ -11,7 +11,7 @@
                     :alt="altText" />
             </div>
             <div class="header-progress-bar-container">
-                <progress-bar />
+                <progressBar />
             </div>
         </div>
         <alert

From 5771f88959262ad95467d9e69643a4f4a2c5d8ef Mon Sep 17 00:00:00 2001
From: Bill Richardson <william.richardson@safelite.com>
Date: Tue, 9 Dec 2025 13:32:37 -0500
Subject: [PATCH 16/17] Updates to progress ball

---
 .../site-header/progress-bar/progress-bar.vue       | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/iss-components/site-header/progress-bar/progress-bar.vue b/src/iss-components/site-header/progress-bar/progress-bar.vue
index 8c4013f0..4c21d476 100644
--- a/src/iss-components/site-header/progress-bar/progress-bar.vue
+++ b/src/iss-components/site-header/progress-bar/progress-bar.vue
@@ -52,12 +52,23 @@ export default {
         }
 
         .progress {
-            min-width: 17.1875rem;
+            @include media-breakpoint-up(xs) {
+                min-width: 5.9375rem;
+            }
+
+            @include media-breakpoint-up(md) {
+                min-width: 17.1875rem;
+            }
+
             margin-left: 0;
             border-radius: $border-radius-pill;
+            background-color: #ffffff;
+            overflow: visible;
 
             .progress-bar {
                 background-color: $green;
+                border-radius: $border-radius-pill 0 0 $border-radius-pill;
+                overflow: visible;
 
                 .progress-bar-middle {
                     width: 1.0625rem;

From 3c2078a6c3c944ccb44b6352bd5bb136db317b6c Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Tue, 9 Dec 2025 14:44:34 -0500
Subject: [PATCH 17/17] update ux variables, add Liberty Mutual customizations

---
 .../site-header/progress-bar/progress-bar.vue   |  7 +++----
 src/styles/client-customizations.scss           | 17 +++++++++++++++++
 src/styles/ux-variables.scss                    |  5 ++++-
 3 files changed, 24 insertions(+), 5 deletions(-)

diff --git a/src/iss-components/site-header/progress-bar/progress-bar.vue b/src/iss-components/site-header/progress-bar/progress-bar.vue
index 4c21d476..700556ad 100644
--- a/src/iss-components/site-header/progress-bar/progress-bar.vue
+++ b/src/iss-components/site-header/progress-bar/progress-bar.vue
@@ -44,7 +44,7 @@ export default {
 
         .progress-bar-header {
             padding-right: 0.3125rem;
-            color: $green;
+            color: $progress-bar-color;
             font-weight: 600;
             font-size: 0.875rem;
             line-height: 0.9375rem;
@@ -62,11 +62,10 @@ export default {
 
             margin-left: 0;
             border-radius: $border-radius-pill;
-            background-color: #ffffff;
             overflow: visible;
 
             .progress-bar {
-                background-color: $green;
+                background-color: $progress-bar-color;
                 border-radius: $border-radius-pill 0 0 $border-radius-pill;
                 overflow: visible;
 
@@ -79,7 +78,7 @@ export default {
                     margin-top: -1px;
                     border: 0.125rem solid #ffffff;
                     border-radius: 50%;
-                    background-color: $green;
+                    background-color: $progress-bar-color;
                     box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
                 }
             }
diff --git a/src/styles/client-customizations.scss b/src/styles/client-customizations.scss
index ae6a41b6..54ba605e 100644
--- a/src/styles/client-customizations.scss
+++ b/src/styles/client-customizations.scss
@@ -11,6 +11,7 @@
     $button-color: #a9e3e9;
     $button-text-color: #181643;
     $svg-fill-color: '%2309748b'; // Color of calendar icon. Place HEX code *after* %23
+    $progress-bar-color: #181643;
 
     //Variables
     --iss-loader-color: #{$button-text-color};
@@ -76,6 +77,22 @@
             }
         }
     }
+
+    .progress-bar-container {
+        .progress-bar-header {
+            color: $progress-bar-color;
+        }
+
+        .progress {
+            .progress-bar {
+                background-color: $progress-bar-color;
+
+                .progress-bar-middle {
+                    background-color: $progress-bar-color;
+                }
+            }
+        }
+    }
 }
 
 // End Liberty Mutual, SafeCo
diff --git a/src/styles/ux-variables.scss b/src/styles/ux-variables.scss
index 409fc9e5..3a12300c 100644
--- a/src/styles/ux-variables.scss
+++ b/src/styles/ux-variables.scss
@@ -155,6 +155,9 @@ $border-radius-sm: 0.2rem;
 $border-radius-lg: 0.5rem; //Used for buttons. Can be used for other things, of course.
 $border-radius-pill: 50rem;
 
+//Progress Bar Styling
+$progress-bar-color: $green;
+
 //Spacing
 // 8 spacers available instead of the usual 5
 $spacer: 1rem;
@@ -208,4 +211,4 @@ $modal-backdrop-opacity: 0;
 $enable-important-utilities: false;
 
 // Letter Spacing
-$letter-spacing-primary: 0.03em;
+$letter-spacing-primary: 0.03em;
\ No newline at end of file