From 501576630956cdfe02a38beafd7d0ec10babac34 Mon Sep 17 00:00:00 2001
From: Johnny shultz <John.Shultz@safelite.com>
Date: Mon, 8 Sep 2025 09:51:47 -0400
Subject: [PATCH] CASH-1480

CASH-1480 right aligned price for insurance in mobile view when user can use afterpay
---
 .../service-package-radio-for-afterpay.vue    | 41 +++++++++++++++++++
 1 file changed, 41 insertions(+)

diff --git a/src/experiment-components/service-package-radio-for-afterpay.vue b/src/experiment-components/service-package-radio-for-afterpay.vue
index 7a3a42278..ecb9fce5c 100644
--- a/src/experiment-components/service-package-radio-for-afterpay.vue
+++ b/src/experiment-components/service-package-radio-for-afterpay.vue
@@ -214,6 +214,47 @@ export default {
 
                 &.is-insurance {
                     padding-bottom: 3rem;
+                    
+                    @include media-breakpoint-down(md) {
+                        padding-bottom: 0.75rem;
+                        .pricing-info {
+                            top: 0.75rem;
+                            right: 0.75rem;
+                            bottom: auto;
+                            left: auto;
+                            width: auto;
+                            margin: 0;
+                            text-align: end;
+                            max-width: 60%;
+                        }
+                        
+                        @media (max-width: 320px) {
+                            min-height: 80px;
+                            max-height: 120px;
+                            
+                            .pricing-info {
+                                top: 2.1rem;
+                                right: auto;
+                                left: 2.3rem;
+                                bottom: auto;
+                                position: absolute;
+                                width: calc(100% - 2.5rem);
+                                text-align: left;
+                                max-width: none;
+                            }
+                        }
+                        
+                        &.has-subheader {
+                            @media (max-width: 320px) {
+                                min-height: 100px;
+                                max-height: 160px;
+                                
+                                .pricing-info {
+                                    top: 3.9rem;
+                                }
+                            }
+                        }
+                    }
                 }
 
                 &.has-subheader {