CSR-927 Fix address-lookup error styling

src/common-components/dropdown-question/dropdown-question.vue

@@ -1,7 +1,7 @@
 <template>
     <div
         class="dropdown-question"
-        :class="(errors && errors.length) || hasError ? 'has-error' : ''">
+        :class="errorMessage || hasError ? 'has-error' : ''">
         <label
             :for="inputId"
             :aria-label="questionText"
@@ -43,6 +43,7 @@ export default {
         disableAutoFill: Boolean,
         validationRules: String,
         cmsWidgetName: String,
+        hasError: Boolean,
     },
     setup(props) {
         const propsClone = Object.assign({}, props);

src/styles/common-error-styles.scss

@@ -75,23 +75,21 @@ html {
         }
         &.textbox-question,
         &.dropdown-question {
-            input:hover {
-                box-shadow: 0px 0px 0px 4px $red-200;
-                border-radius: 0.5rem;
-                border: 1px solid $red;
-            }
-            input:focus {
-                box-shadow: 0 0 0 2.5px $red;
-            }
             p {
                 color: $red;
             }
             input,
             select {
-                border: 1px solid transparent;
-                box-shadow: 0 0 0 1px $red;
+                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 {