From 5c13ee9dd2264e158ffab42e0359d69a5dca23dc Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Mon, 8 Jul 2024 13:13:43 -0400
Subject: [PATCH] WIP move css block to fix specificity issue.

---
 .../service-package-radio.vue                 | 42 +++++++++++--------
 1 file changed, 25 insertions(+), 17 deletions(-)

diff --git a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
index 90f234220..d637fd21c 100644
--- a/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
+++ b/src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue
@@ -12,7 +12,7 @@
             ]"
             for="testradio">
             <div class="package-specs">
-                <div v-if="this.additionalButtonData.servicePackageDiscount" class="row">
+                <div v-if="this.additionalButtonData.servicePackageDiscount" class="row justify-content-between">
                     <div class="col md-6">
                         <p class="m-0">
                             <span v-html="this.buttonLabel"></span>
@@ -136,21 +136,7 @@ export default {
 </script>
 
 <style lang="scss">
-.discount-text {
-    line-height: 36px;
-    display: flex;
-    border-top-right-radius: 0.5rem;
-    border-top-left-radius: 0.5rem;
-    background-color: #469d2a;
-    align-items: center;
-    justify-content: center;
-    padding: 5px;
-    width: 100%;
-    color: white;
-    @include media-breakpoint-up(md) {
-        position: absolute;
-    }
-}
+
 .package-main {
     .package-wrapper {
         margin: 1rem 0;
@@ -193,7 +179,7 @@ export default {
                 &.has-subheader {
                     min-height: 80px;
                     @include media-breakpoint-up(md) {
-                        padding-top: 46px;
+                        padding-top: 60px;
                     }
                 }
                 &.has-text {
@@ -367,6 +353,28 @@ export default {
                 }
             }
         }
+        .discount-text {
+            line-height: 36px;
+            display: flex;
+            border-top-right-radius: 0.5rem;
+            border-top-left-radius: 0.5rem;
+            background-color: #469d2a;
+            align-items: center;
+            justify-content: center;
+            padding: 5px;
+            width: 100%;
+            color: white;
+            height: 2.875rem;
+            @include media-breakpoint-up(md) {
+                position: absolute;
+                z-index: 1;
+            }
+            @include media-breakpoint-up(md) {
+                ~label .package-label:after {
+                    top: 68px;
+                }
+            }
+        }
     }
 }
 </style>