From d7a7f19abdaa9aa95f0919df2e8aa8f249d6c813 Mon Sep 17 00:00:00 2001
From: cyprain-okeke <108260115+cyprain-okeke@users.noreply.github.com>
Date: Tue, 16 Dec 2025 14:55:40 +0100
Subject: [PATCH] [PM-29633]Discount badge misaligned on Subscription page for
 Organizations and MSP/BUP (#17924)

* Fix the discount

* Fix the spacing and alignment issue

* reverted unneeded change

* Changes for provider discount badge
---
 .../organization-subscription-cloud.component.html | 14 ++++++++------
 .../provider-subscription.component.html           |  9 ++++++---
 2 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/apps/web/src/app/billing/organizations/organization-subscription-cloud.component.html b/apps/web/src/app/billing/organizations/organization-subscription-cloud.component.html
index 8b9b98dc390..860f80eb346 100644
--- a/apps/web/src/app/billing/organizations/organization-subscription-cloud.component.html
+++ b/apps/web/src/app/billing/organizations/organization-subscription-cloud.component.html
@@ -14,16 +14,18 @@
     ></app-subscription-status>
     <ng-container *ngIf="userOrg.canEditSubscription">
       <div class="tw-flex-col">
-        <strong class="tw-block tw-border-0 tw-border-b tw-border-solid tw-border-secondary-300"
-          >{{ "details" | i18n
-          }}<span
-            class="tw-ml-3"
+        <strong
+          class="tw-flex tw-items-center tw-gap-3 tw-border-0 tw-border-b tw-border-solid tw-border-secondary-300 tw-pb-2"
+        >
+          {{ "details" | i18n }}
+          <span
             *ngIf="customerDiscount?.percentOff > 0 && !isSecretsManagerTrial()"
             bitBadge
             variant="success"
+            class="tw-inline-flex tw-items-center"
             >{{ "providerDiscount" | i18n: customerDiscount?.percentOff }}</span
-          ></strong
-        >
+          >
+        </strong>
         <bit-table>
           <ng-template body>
             <ng-container *ngIf="subscription && !userOrg.isFreeOrg">
diff --git a/bitwarden_license/bit-web/src/app/billing/providers/subscription/provider-subscription.component.html b/bitwarden_license/bit-web/src/app/billing/providers/subscription/provider-subscription.component.html
index d71dcf77170..783bd155e61 100644
--- a/bitwarden_license/bit-web/src/app/billing/providers/subscription/provider-subscription.component.html
+++ b/bitwarden_license/bit-web/src/app/billing/providers/subscription/provider-subscription.component.html
@@ -11,11 +11,14 @@
     <ng-container>
       <div class="tw-flex-col">
         <strong
-          class="tw-block tw-border-0 tw-border-b tw-border-solid tw-border-secondary-300 tw-pb-2"
-          >{{ "details" | i18n }} &#160;<span
+          class="tw-flex tw-items-center tw-gap-3 tw-border-0 tw-border-b tw-border-solid tw-border-secondary-300 tw-pb-2"
+        >
+          {{ "details" | i18n }}
+          <span
+            *ngIf="subscription.discountPercentage"
             bitBadge
             variant="success"
-            *ngIf="subscription.discountPercentage"
+            class="tw-inline-flex tw-items-center"
             >{{ "providerDiscount" | i18n: subscription.discountPercentage }}</span
           >
         </strong>