[PM-26984] Use medium instead of semibold or bold (#17194)

apps/browser/src/billing/popup/settings/premium-v2.component.html

@@ -6,7 +6,7 @@
   </popup-header>
 
   <div class="tw-flex tw-flex-col tw-p-2">
-    <h2 class="tw-font-bold">{{ "premiumFeatures" | i18n }}</h2>
+    <h2 class="tw-font-medium">{{ "premiumFeatures" | i18n }}</h2>
     <bit-section>
       <bit-card>
         <div class="tw-flex tw-flex-col tw-p-2">

apps/web/src/app/billing/individual/upgrade/upgrade-account/upgrade-account.component.html

@@ -16,7 +16,7 @@
     </header>
     <div class="tw-px-14 tw-pb-8">
       <div class="tw-flex tw-text-center tw-flex-col tw-pb-4">
-        <h1 class="tw-font-semibold tw-text-[32px]">
+        <h1 class="tw-font-medium tw-text-[32px]">
           {{ dialogTitle() | i18n }}
         </h1>
         <p bitTypography="body1" class="tw-text-muted">

apps/web/src/app/billing/individual/upgrade/upgrade-nav-button/upgrade-nav-button/upgrade-nav-button.component.html

@@ -4,7 +4,7 @@
       is not supported by the button in the CL. -->
     <button
       type="button"
-      class="tw-py-1.5 tw-px-4 tw-flex tw-gap-2 tw-items-center tw-size-full focus-visible:tw-ring-2 focus-visible:tw-ring-offset-0 focus:tw-outline-none focus-visible:tw-outline-none focus-visible:tw-ring-text-alt2 focus-visible:tw-z-10 tw-font-semibold tw-rounded-full tw-transition tw-border tw-border-solid tw-text-left tw-bg-primary-100 tw-text-primary-600 tw-border-primary-600 hover:tw-bg-hover-default hover:tw-text-primary-700 hover:tw-border-primary-700"
+      class="tw-py-1.5 tw-px-4 tw-flex tw-gap-2 tw-items-center tw-size-full focus-visible:tw-ring-2 focus-visible:tw-ring-offset-0 focus:tw-outline-none focus-visible:tw-outline-none focus-visible:tw-ring-text-alt2 focus-visible:tw-z-10 tw-font-medium tw-rounded-full tw-transition tw-border tw-border-solid tw-text-left tw-bg-primary-100 tw-text-primary-600 tw-border-primary-600 hover:tw-bg-hover-default hover:tw-text-primary-700 hover:tw-border-primary-700"
       (click)="upgrade()"
     >
       <i class="bwi bwi-premium" aria-hidden="true"></i>

apps/web/src/app/billing/individual/upgrade/upgrade-payment/upgrade-payment.component.html

@@ -1,6 +1,6 @@
 <form [formGroup]="formGroup" [bitSubmit]="submit">
   <bit-dialog dialogSize="large" [loading]="loading()">
-    <span bitDialogTitle class="tw-font-semibold">{{ upgradeToMessage }}</span>
+    <span bitDialogTitle class="tw-font-medium">{{ upgradeToMessage }}</span>
     <ng-container bitDialogContent>
       <section>
         @if (isFamiliesPlan) {

apps/web/src/app/billing/organizations/billing-sync-api-key.component.html

@@ -37,7 +37,7 @@
           ></button>
         </bit-form-field>
         <div class="tw-mt-2 tw-text-sm tw-text-muted" *ngIf="showLastSyncText">
-          <b class="tw-font-semibold">{{ "lastSync" | i18n }}:</b>
+          <b class="tw-font-medium">{{ "lastSync" | i18n }}:</b>
           {{ lastSyncDate | date: "medium" }}
         </div>
         <div class="tw-mt-2 tw-text-sm tw-text-danger" *ngIf="showAwaitingSyncText">

apps/web/src/app/billing/organizations/change-plan-dialog.component.html

@@ -1,12 +1,12 @@
 <form [formGroup]="formGroup" [bitSubmit]="submit">
   <bit-dialog dialogSize="large" [loading]="loading">
-    <span bitDialogTitle class="tw-font-semibold">
+    <span bitDialogTitle class="tw-font-medium">
       {{ dialogHeaderName }}
     </span>
     <div bitDialogContent>
       <p>{{ "upgradePlans" | i18n }}</p>
       <div class="tw-mb-3 tw-flex tw-justify-between">
-        <span [hidden]="isSubscriptionCanceled" class="tw-text-lg tw-pr-1 tw-font-bold">{{
+        <span [hidden]="isSubscriptionCanceled" class="tw-text-lg tw-pr-1 tw-font-medium">{{
           "selectAPlan" | i18n
         }}</span>
         <!-- Discount Badge -->
@@ -57,7 +57,7 @@
                   selectableProduct.productTier === productTypes.Enterprise &&
                   !isSubscriptionCanceled
                 "
-                class="tw-bg-secondary-100 tw-text-center !tw-border-0 tw-text-sm tw-font-bold tw-py-1"
+                class="tw-bg-secondary-100 tw-text-center !tw-border-0 tw-text-sm tw-font-medium tw-py-1"
                 [ngClass]="{
                   'tw-bg-primary-700 !tw-text-contrast': selectableProduct === selectedPlan,
                   'tw-bg-secondary-100': !(selectableProduct === selectedPlan),
@@ -73,7 +73,7 @@
                 }"
               >
                 <h3
-                  class="tw-text-[1.25rem] tw-mt-[6px] tw-font-bold tw-mb-0 tw-leading-[2rem] tw-flex tw-items-center"
+                  class="tw-text-[1.25rem] tw-mt-[6px] tw-font-medium tw-mb-0 tw-leading-[2rem] tw-flex tw-items-center"
                 >
                   <span class="tw-capitalize tw-whitespace-nowrap">{{
                     selectableProduct.nameLocalizationKey | i18n
@@ -91,7 +91,7 @@
                   <ng-container
                     *ngIf="selectableProduct.PasswordManager.basePrice && !acceptingSponsorship"
                   >
-                    <b class="tw-text-lg tw-font-semibold">
+                    <b class="tw-text-lg tw-font-medium">
                       {{
                         (selectableProduct.isAnnual
                           ? selectableProduct.PasswordManager.basePrice / 12
@@ -106,7 +106,7 @@
                           : ("monthPerMember" | i18n)
                       }}</span
                     >
-                    <b class="tw-text-sm tw-font-semibold">
+                    <b class="tw-text-sm tw-font-medium">
                       <ng-container
                         *ngIf="selectableProduct.PasswordManager.hasAdditionalSeatsOption"
                       >
@@ -128,7 +128,7 @@
                     selectableProduct.PasswordManager.hasAdditionalSeatsOption
                   "
                 >
-                  <b class="tw-text-lg tw-font-semibold"
+                  <b class="tw-text-lg tw-font-medium"
                     >{{
                       "costPerMember"
                         | i18n
@@ -155,7 +155,7 @@
               "
             >
               <p
-                class="tw-text-xs tw-px-2 tw-font-semibold tw-mb-1"
+                class="tw-text-xs tw-px-2 tw-font-medium tw-mb-1"
                 *ngIf="organization.useSecretsManager"
               >
                 {{ "bitwardenPasswordManager" | i18n }}
@@ -182,7 +182,7 @@
               </ul>
 
               <p
-                class="tw-text-xs tw-px-2 tw-font-semibold tw-mb-1"
+                class="tw-text-xs tw-px-2 tw-font-medium tw-mb-1"
                 *ngIf="organization.useSecretsManager"
               >
                 {{ "bitwardenSecretsManager" | i18n }}
@@ -222,7 +222,7 @@
               </ng-container>
               <ng-template #fullFeatureList>
                 <p
-                  class="tw-text-xs tw-px-2 tw-font-semibold tw-mb-1"
+                  class="tw-text-xs tw-px-2 tw-font-medium tw-mb-1"
                   *ngIf="organization.useSecretsManager"
                 >
                   {{ "bitwardenPasswordManager" | i18n }}
@@ -274,7 +274,7 @@
                   </li>
                 </ul>
                 <p
-                  class="tw-text-xs tw-px-2 tw-font-semibold tw-mb-1"
+                  class="tw-text-xs tw-px-2 tw-font-medium tw-mb-1"
                   *ngIf="
                     organization.useSecretsManager &&
                     selectableProduct.productTier !== productTypes.Families
@@ -385,7 +385,7 @@
         </ng-container>
         <div class="tw-mt-4">
           <p class="tw-text-lg tw-mb-1">
-            <span class="tw-font-semibold"
+            <span class="tw-font-medium"
               >{{ "total" | i18n }}:
               {{ total - calculateTotalAppliedDiscount(total) | currency: "USD" : "$" }} USD</span
             >
@@ -402,7 +402,7 @@
         <!-- SM + PM and PM only cost summary -->
         <div *ngIf="totalOpened && !isSecretsManagerTrial()" class="tw-flex tw-flex-wrap tw-gap-4">
           <bit-hint class="tw-w-1/2" *ngIf="selectedInterval == planIntervals.Annually">
-            <p class="tw-font-semibold tw-mb-1" *ngIf="organization.useSecretsManager">
+            <p class="tw-font-medium tw-mb-1" *ngIf="organization.useSecretsManager">
               {{ "passwordManager" | i18n }}
             </p>
             <p
@@ -487,7 +487,7 @@
               </ng-container>
             </p>
             <!-- secrets manager summary for annual -->
-            <p class="tw-font-semibold tw-mt-3 tw-mb-1" *ngIf="organization.useSecretsManager">
+            <p class="tw-font-medium tw-mt-3 tw-mb-1" *ngIf="organization.useSecretsManager">
               {{ "secretsManager" | i18n }}
             </p>
             <p
@@ -569,7 +569,7 @@
             </p>
           </bit-hint>
           <bit-hint class="tw-w-1/2" *ngIf="selectedInterval == planIntervals.Monthly">
-            <p class="tw-font-semibold tw-mb-1" *ngIf="organization.useSecretsManager">
+            <p class="tw-font-medium tw-mb-1" *ngIf="organization.useSecretsManager">
               {{ "passwordManager" | i18n }}
             </p>
             <p
@@ -642,7 +642,7 @@
               </ng-container>
             </p>
             <!-- secrets manager summary for monthly -->
-            <p class="tw-font-semibold tw-mt-3 tw-mb-1" *ngIf="organization.useSecretsManager">
+            <p class="tw-font-medium tw-mt-3 tw-mb-1" *ngIf="organization.useSecretsManager">
               {{ "secretsManager" | i18n }}
             </p>
             <p
@@ -727,7 +727,7 @@
         <div *ngIf="totalOpened && isSecretsManagerTrial()" class="tw-flex tw-flex-wrap tw-gap-4">
           <bit-hint class="tw-w-1/2" *ngIf="selectedInterval == planIntervals.Annually">
             <!-- secrets manager summary for annual -->
-            <p class="tw-font-semibold tw-mt-2 tw-mb-0" *ngIf="organization.useSecretsManager">
+            <p class="tw-font-medium tw-mt-2 tw-mb-0" *ngIf="organization.useSecretsManager">
               {{ "secretsManager" | i18n }}
             </p>
             <p
@@ -788,7 +788,7 @@
               <span>{{ additionalServiceAccountTotal(selectedPlan) | currency: "$" }}</span>
             </p>
             <!-- password manager summary for annual -->
-            <p class="tw-font-semibold tw-mt-3 tw-mb-0" *ngIf="organization.useSecretsManager">
+            <p class="tw-font-medium tw-mt-3 tw-mb-0" *ngIf="organization.useSecretsManager">
               {{ "passwordManager" | i18n }}
             </p>
             <p
@@ -846,7 +846,7 @@
           </bit-hint>
           <bit-hint class="tw-w-1/2" *ngIf="selectedInterval == planIntervals.Monthly">
             <!-- secrets manager summary for monthly -->
-            <p class="tw-font-semibold tw-mt-2 tw-mb-0" *ngIf="organization.useSecretsManager">
+            <p class="tw-font-medium tw-mt-2 tw-mb-0" *ngIf="organization.useSecretsManager">
               {{ "secretsManager" | i18n }}
             </p>
             <p
@@ -903,7 +903,7 @@
               <span>{{ additionalServiceAccountTotal(selectedPlan) | currency: "$" }}</span>
             </p>
             <!-- password manager summary for monthly -->
-            <p class="tw-font-semibold tw-mt-3 tw-mb-0" *ngIf="organization.useSecretsManager">
+            <p class="tw-font-medium tw-mt-3 tw-mb-0" *ngIf="organization.useSecretsManager">
               {{ "passwordManager" | i18n }}
             </p>
             <p
@@ -972,7 +972,7 @@
             <p
               class="tw-flex tw-justify-between tw-border-0 tw-border-solid tw-border-t tw-border-secondary-300 tw-pt-2 tw-mb-0"
             >
-              <span class="tw-font-semibold">
+              <span class="tw-font-medium">
                 {{ "estimatedTax" | i18n }}
               </span>
               <span>
@@ -986,14 +986,12 @@
             <p
               class="tw-flex tw-justify-between tw-border-0 tw-border-solid tw-border-t tw-border-secondary-300 tw-pt-2 tw-mb-0"
             >
-              <span class="tw-font-semibold">
+              <span class="tw-font-medium">
                 {{ "total" | i18n }}
               </span>
               <span>
                 {{ total - calculateTotalAppliedDiscount(total) | currency: "USD" : "$" }}
-                <span class="tw-text-xs tw-font-semibold">
+                <span class="tw-text-xs tw-font-medium"> / {{ selectedPlanInterval | i18n }}</span>
-                  / {{ selectedPlanInterval | i18n }}</span
-                >
               </span>
             </p>
           </bit-hint>

apps/web/src/app/billing/organizations/organization-subscription-cloud.component.html

@@ -241,7 +241,7 @@
         <div class="tw-size-56 tw-content-center">
           <bit-icon [icon]="gearIcon" aria-hidden="true"></bit-icon>
         </div>
-        <p class="tw-font-bold">{{ "billingManagedByProvider" | i18n: userOrg.providerName }}</p>
+        <p class="tw-font-medium">{{ "billingManagedByProvider" | i18n: userOrg.providerName }}</p>
         <p>{{ "billingContactProviderForAssistance" | i18n }}</p>
       </div>
     </ng-template>

apps/web/src/app/billing/organizations/organization-subscription-selfhost.component.html

@@ -130,7 +130,7 @@
           <bit-label class="tw-mb-6 tw-block" *ngIf="!showAutomaticSyncAndManualUpload">
             {{ "licenseAndBillingManagementDesc" | i18n }}
           </bit-label>
-          <h3 *ngIf="showAutomaticSyncAndManualUpload" class="tw-font-semibold tw-mt-6">
+          <h3 *ngIf="showAutomaticSyncAndManualUpload" class="tw-font-medium tw-mt-6">
             {{ "uploadLicense" | i18n }}
           </h3>
           <app-update-license

apps/web/src/app/billing/organizations/subscription-hidden.component.ts

@@ -12,7 +12,7 @@ import { GearIcon } from "@bitwarden/assets/svg";
     <div class="tw-size-56 tw-content-center">
       <bit-icon [icon]="gearIcon" aria-hidden="true"></bit-icon>
     </div>
-    <p class="tw-font-bold">{{ "billingManagedByProvider" | i18n: providerName }}</p>
+    <p class="tw-font-medium">{{ "billingManagedByProvider" | i18n: providerName }}</p>
     <p>{{ "billingContactProviderForAssistance" | i18n }}</p>
   </div>`,
   standalone: false,

apps/web/src/app/billing/payment/components/add-account-credit-dialog.component.ts

@@ -58,7 +58,7 @@ const positiveNumberValidator =
   template: `
     <form [formGroup]="formGroup" [bitSubmit]="submit">
       <bit-dialog>
-        <span bitDialogTitle class="tw-font-semibold">
+        <span bitDialogTitle class="tw-font-medium">
           {{ "addCredit" | i18n }}
         </span>
         <div bitDialogContent>

apps/web/src/app/billing/payment/components/change-payment-method-dialog.component.ts

@@ -24,7 +24,7 @@ type DialogParams = {
   template: `
     <form [formGroup]="formGroup" [bitSubmit]="submit">
       <bit-dialog>
-        <span bitDialogTitle class="tw-font-semibold">
+        <span bitDialogTitle class="tw-font-medium">
           {{ "changePaymentMethod" | i18n }}
         </span>
         <div bitDialogContent>

apps/web/src/app/billing/payment/components/edit-billing-address-dialog.component.ts

@@ -41,7 +41,7 @@ type DialogResult =
   template: `
     <form [formGroup]="formGroup" [bitSubmit]="submit">
       <bit-dialog>
-        <span bitDialogTitle class="tw-font-semibold">
+        <span bitDialogTitle class="tw-font-medium">
           {{ "editBillingAddress" | i18n }}
         </span>
         <div bitDialogContent>

apps/web/src/app/billing/payment/components/require-payment-method-dialog.component.ts

@@ -35,7 +35,7 @@ type DialogParams = {
   template: `
     <form [formGroup]="formGroup" [bitSubmit]="submit">
       <bit-dialog>
-        <span bitDialogTitle class="tw-font-semibold">
+        <span bitDialogTitle class="tw-font-medium">
           {{ "addPaymentMethod" | i18n }}
         </span>
         <div bitDialogContent>

apps/web/src/app/billing/shared/offboarding-survey.component.html

@@ -1,6 +1,6 @@
 <form [formGroup]="formGroup" [bitSubmit]="submit">
   <bit-dialog>
-    <span bitDialogTitle class="tw-font-semibold">
+    <span bitDialogTitle class="tw-font-medium">
       {{ "cancelSubscription" | i18n }}
     </span>
     <div bitDialogContent>

apps/web/src/app/billing/shared/plan-card/plan-card.component.html

@@ -11,7 +11,7 @@
   <div class="tw-relative">
     @if (isRecommended) {
       <div
-        class="tw-bg-secondary-100 tw-text-center !tw-border-0 tw-text-sm tw-font-bold tw-py-1"
+        class="tw-bg-secondary-100 tw-text-center !tw-border-0 tw-text-sm tw-font-medium tw-py-1"
         [ngClass]="{
           'tw-bg-primary-700 !tw-text-contrast': plan().isSelected,
           'tw-bg-secondary-100': !plan().isSelected,
@@ -28,12 +28,12 @@
       }"
     >
       <h3
-        class="tw-text-[1.25rem] tw-mt-[6px] tw-font-bold tw-mb-0 tw-leading-[2rem] tw-flex tw-items-center"
+        class="tw-text-[1.25rem] tw-mt-[6px] tw-font-medium tw-mb-0 tw-leading-[2rem] tw-flex tw-items-center"
       >
         <span class="tw-capitalize tw-whitespace-nowrap">{{ plan().title }}</span>
       </h3>
       <span>
-        <b class="tw-text-lg tw-font-semibold">{{ plan().costPerMember | currency: "$" }} </b>
+        <b class="tw-text-lg tw-font-medium">{{ plan().costPerMember | currency: "$" }} </b>
         <span class="tw-text-xs tw-px-0"> /{{ "monthPerMember" | i18n }}</span>
       </span>
     </div>

apps/web/src/app/billing/shared/pricing-summary/pricing-summary.component.html

@@ -1,7 +1,7 @@
 <ng-container>
   <div class="tw-mt-4">
     <p class="tw-text-lg tw-mb-1">
-      <span class="tw-font-semibold"
+      <span class="tw-font-medium"
         >{{ "total" | i18n }}:
         {{ summaryData.total - summaryData.totalAppliedDiscount | currency: "USD" : "$" }} USD</span
       >
@@ -37,7 +37,7 @@
           <ng-container
             *ngIf="!summaryData.isSecretsManagerTrial || summaryData.organization.useSecretsManager"
           >
-            <p class="tw-font-semibold tw-mt-3 tw-mb-1">{{ "passwordManager" | i18n }}</p>
+            <p class="tw-font-medium tw-mt-3 tw-mb-1">{{ "passwordManager" | i18n }}</p>
 
             <!-- Base Price -->
             <ng-container *ngIf="summaryData.selectedPlan.PasswordManager.basePrice">
@@ -137,7 +137,7 @@
         <!-- Secrets Manager section -->
         <ng-template #secretsManagerSection>
           <ng-container *ngIf="summaryData.organization.useSecretsManager">
-            <p class="tw-font-semibold tw-mt-3 tw-mb-1">{{ "secretsManager" | i18n }}</p>
+            <p class="tw-font-medium tw-mt-3 tw-mb-1">{{ "secretsManager" | i18n }}</p>
 
             <!-- Base Price -->
             <ng-container *ngIf="summaryData.selectedPlan?.SecretsManager?.basePrice">
@@ -236,7 +236,7 @@
         <p
           class="tw-flex tw-justify-between tw-border-0 tw-border-solid tw-border-t tw-border-secondary-300 tw-pt-2 tw-mb-0"
         >
-          <span class="tw-font-semibold">{{ "estimatedTax" | i18n }}</span>
+          <span class="tw-font-medium">{{ "estimatedTax" | i18n }}</span>
           <span>{{ summaryData.estimatedTax | currency: "USD" : "$" }}</span>
         </p>
       </bit-hint>
@@ -247,10 +247,10 @@
         <p
           class="tw-flex tw-justify-between tw-border-0 tw-border-solid tw-border-t tw-border-secondary-300 tw-pt-2 tw-mb-0"
         >
-          <span class="tw-font-semibold">{{ "total" | i18n }}</span>
+          <span class="tw-font-medium">{{ "total" | i18n }}</span>
           <span>
             {{ summaryData.total - summaryData.totalAppliedDiscount | currency: "USD" : "$" }}
-            <span class="tw-text-xs tw-font-semibold"
+            <span class="tw-text-xs tw-font-medium"
               >/ {{ summaryData.selectedPlanInterval | i18n }}</span
             >
           </span>

apps/web/src/app/billing/shared/trial-payment-dialog/trial-payment-dialog.component.html

@@ -1,5 +1,5 @@
 <bit-dialog dialogSize="default">
-  <span bitDialogTitle class="tw-font-semibold">
+  <span bitDialogTitle class="tw-font-medium">
     {{ "subscribetoEnterprise" | i18n: currentPlanName }}
   </span>
 

apps/web/src/app/billing/trial-initiation/confirmation-details.component.html

@@ -9,7 +9,7 @@
     <li>
       <p>
         {{ "trialConfirmationEmail" | i18n }}
-        <span class="tw-font-bold">{{ email }}</span
+        <span class="tw-font-medium">{{ email }}</span
         >.
       </p>
     </li>

apps/web/src/app/billing/trial-initiation/trial-billing-step/trial-billing-step.component.html

@@ -6,7 +6,7 @@
     <div class="tw-container tw-mb-3">
       <!-- Cadence -->
       <div class="tw-mb-6">
-        <h2 class="tw-mb-3 tw-text-base tw-font-semibold">{{ "billingPlanLabel" | i18n }}</h2>
+        <h2 class="tw-mb-3 tw-text-base tw-font-medium">{{ "billingPlanLabel" | i18n }}</h2>
         <bit-radio-group [formControl]="formGroup.controls.cadence">
           <div class="tw-mb-1 tw-items-center">
             <bit-radio-button id="annual-cadence-button" [value]="'annually'">
@@ -32,7 +32,7 @@
       </div>
       <!-- Payment -->
       <div class="tw-mb-4">
-        <h2 class="tw-mb-3 tw-text-base tw-font-semibold">{{ "paymentType" | i18n }}</h2>
+        <h2 class="tw-mb-3 tw-text-base tw-font-medium">{{ "paymentType" | i18n }}</h2>
         <app-enter-payment-method
           [group]="formGroup.controls.paymentMethod"
         ></app-enter-payment-method>

apps/web/src/app/billing/trial-initiation/vertical-stepper/vertical-step-content.component.html

@@ -11,7 +11,7 @@
     [attr.aria-expanded]="selected"
   >
     <span
-      class="tw-mr-3.5 tw-w-9 tw-rounded-full tw-font-bold tw-leading-9"
+      class="tw-mr-3.5 tw-w-9 tw-rounded-full tw-font-medium tw-leading-9"
       *ngIf="!step.completed"
       [ngClass]="{
         'tw-bg-primary-600 tw-text-contrast': selected,
@@ -22,7 +22,7 @@
       {{ stepNumber }}
     </span>
     <span
-      class="tw-mr-3.5 tw-w-9 tw-rounded-full tw-bg-primary-600 tw-font-bold tw-leading-9 tw-text-contrast"
+      class="tw-mr-3.5 tw-w-9 tw-rounded-full tw-bg-primary-600 tw-font-medium tw-leading-9 tw-text-contrast"
       *ngIf="step.completed"
     >
       <i class="bwi bwi-fw bwi-check tw-p-1" aria-hidden="true"></i>
@@ -30,7 +30,7 @@
     <div
       class="tw-txt-main tw-mt-3.5 tw-h-12 tw-text-left tw-leading-snug"
       [ngClass]="{
-        'tw-font-bold': selected,
+        'tw-font-medium': selected,
       }"
     >
       <p

bitwarden_license/bit-web/src/app/billing/providers/subscription/provider-subscription.component.html

@@ -51,7 +51,7 @@
               <tr bitRow>
                 <td bitCell class="tw-pl-0 tw-py-3"></td>
                 <td bitCell class="tw-text-right">
-                  <span class="tw-font-bold">Total:</span> {{ totalCost | currency: "$" }} /
+                  <span class="tw-font-medium">Total:</span> {{ totalCost | currency: "$" }} /
                   {{
                     getBillingCadenceLabel(activePlans.length > 0 ? activePlans[0] : null) | i18n
                   }}

libs/angular/src/billing/components/premium-upgrade-dialog/premium-upgrade-dialog.component.html

@@ -36,7 +36,7 @@
         <!-- Price Section -->
         <div class="tw-mb-6">
           <div class="tw-flex tw-items-baseline tw-gap-1 tw-flex-wrap">
-            <span class="tw-text-3xl tw-font-bold tw-leading-none tw-m-0">{{
+            <span class="tw-text-3xl tw-font-medium tw-leading-none tw-m-0">{{
               cardDetails.price.amount | currency: "$"
             }}</span>
             <span bitTypography="helper" class="tw-text-muted">

libs/pricing/src/components/pricing-card/pricing-card.component.html

@@ -22,7 +22,7 @@
   @if (price(); as priceValue) {
     <div class="tw-mb-6">
       <div class="tw-flex tw-items-baseline tw-gap-1 tw-flex-wrap">
-        <span class="tw-text-3xl tw-font-bold tw-leading-none tw-m-0">{{
+        <span class="tw-text-3xl tw-font-medium tw-leading-none tw-m-0">{{
           priceValue.amount | currency: "$"
         }}</span>
         <span bitTypography="helper" class="tw-text-muted">