diff --git a/.changeset/five-hounds-judge.md b/.changeset/five-hounds-judge.md
new file mode 100644
index 00000000000..6d7498821e8
--- /dev/null
+++ b/.changeset/five-hounds-judge.md
@@ -0,0 +1,6 @@
+---
+'@clerk/clerk-js': patch
+'@clerk/types': patch
+---
+
+Simplify plan card avatar badge container styling.
diff --git a/packages/clerk-js/src/ui/components/PricingTable/PlanCard.tsx b/packages/clerk-js/src/ui/components/PricingTable/PlanCard.tsx
index bc5aa512e21..a37a0db9012 100644
--- a/packages/clerk-js/src/ui/components/PricingTable/PlanCard.tsx
+++ b/packages/clerk-js/src/ui/components/PricingTable/PlanCard.tsx
@@ -168,17 +168,12 @@ export const PlanCardHeader = React.forwardRef<HTMLDivElement, PlanCardHeaderPro
           elementDescriptor={descriptors.planCardAvatarBadgeContainer}
           sx={t => ({
             marginBlockEnd: t.space.$3,
-            ...(!avatarUrl && !isActiveForPayer
-              ? {
-                  float: 'right',
-                }
-              : {
-                  display: 'grid',
-                  gridTemplateColumns: 'repeat(2, minmax(0,1fr))',
-                  alignItems: 'start',
-                  justifyContent: 'space-between',
-                  gap: t.space.$3,
-                }),
+            display: 'flex',
+            alignItems: 'flex-start',
+            justifyContent: 'space-between',
+            flexWrap: 'wrap',
+            gap: t.space.$3,
+            float: !avatarUrl && !isActiveForPayer ? 'right' : undefined,
           })}
         >
           {avatarUrl ? (
@@ -189,28 +184,24 @@ export const PlanCardHeader = React.forwardRef<HTMLDivElement, PlanCardHeaderPro
               initials={name[0]}
               rounded={false}
               imageUrl={avatarUrl}
-              sx={{
-                gridRowStart: 1,
-              }}
             />
           ) : null}
-          <ReversibleContainer reverse={avatarUrl && closeSlot ? true : false}>
+          <ReversibleContainer reverse={!avatarUrl}>
+            {closeSlot}
             {isActiveForPayer ? (
-              <Badge
-                localizationKey={localizationKeys('badge__currentPlan')}
-                colorScheme='secondary'
-                sx={
-                  !avatarUrl
-                    ? {
-                        justifySelf: 'start',
-                      }
-                    : {
-                        justifySelf: avatarUrl && closeSlot ? 'start' : 'end',
-                      }
-                }
-              />
+              <Span
+                elementDescriptor={descriptors.planCardBadgeContainer}
+                sx={{
+                  flexBasis: closeSlot && avatarUrl ? '100%' : undefined,
+                }}
+              >
+                <Badge
+                  elementDescriptor={descriptors.planCardBadge}
+                  localizationKey={localizationKeys('badge__currentPlan')}
+                  colorScheme='secondary'
+                />
+              </Span>
             ) : null}
-            {closeSlot}
           </ReversibleContainer>
         </Box>
       ) : null}
diff --git a/packages/clerk-js/src/ui/customizables/elementDescriptors.ts b/packages/clerk-js/src/ui/customizables/elementDescriptors.ts
index 4a4883ab9eb..c6ac9d01884 100644
--- a/packages/clerk-js/src/ui/customizables/elementDescriptors.ts
+++ b/packages/clerk-js/src/ui/customizables/elementDescriptors.ts
@@ -229,6 +229,7 @@ export const APPEARANCE_KEYS = containsAllElementsConfigKeys([
   'planCardDescription',
   'planCardAvatarBadgeContainer',
   'planCardAvatar',
+  'planCardBadgeContainer',
   'planCardBadge',
   'planCardFeatures',
   'planCardFeaturesList',
diff --git a/packages/types/src/appearance.ts b/packages/types/src/appearance.ts
index 76315ac4b32..49bfe60287f 100644
--- a/packages/types/src/appearance.ts
+++ b/packages/types/src/appearance.ts
@@ -355,6 +355,7 @@ export type ElementsConfig = {
   planCardHeader: WithOptions;
   planCardAvatarBadgeContainer: WithOptions;
   planCardAvatar: WithOptions;
+  planCardBadgeContainer: WithOptions;
   planCardBadge: WithOptions;
   planCardTitle: WithOptions;
   planCardDescription: WithOptions;