From 8507afedd60d2dd82234df8b4712b0b933a122cc Mon Sep 17 00:00:00 2001
From: "2569718930@qq.com" <2569718930@qq.com>
Date: Fri, 29 May 2026 21:34:36 +0800
Subject: [PATCH] Fix account payment layout responsiveness

---
 frontend/components/account/AccountCenter.tsx            | 9 +++++++--
 .../components/account/__tests__/paymentShell.test.ts    | 7 ++++---
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/frontend/components/account/AccountCenter.tsx b/frontend/components/account/AccountCenter.tsx
index d2faa2ff..65642644 100644
--- a/frontend/components/account/AccountCenter.tsx
+++ b/frontend/components/account/AccountCenter.tsx
@@ -1046,7 +1046,9 @@ export function AccountCenter() {
                 ) : null}
                 <div
                   data-testid="payment-management-grid"
-                  className="grid gap-6 lg:grid-cols-[minmax(0,1fr)_minmax(320px,380px)] lg:items-start"
+                  className={`grid gap-6 lg:items-start ${
+                    hasTelegramPanel ? "" : "lg:grid-cols-[minmax(0,1fr)_minmax(320px,380px)]"
+                  }`}
                 >
                   <div className="space-y-5">
                     <div>
@@ -1153,7 +1155,10 @@ export function AccountCenter() {
                         </div>
                       </div>
                     </div>
-                    <div data-testid="payment-guard-grid" className="grid gap-3 sm:grid-cols-2">
+                    <div
+                      data-testid="payment-guard-grid"
+                      className={`grid gap-3 ${hasTelegramPanel ? "" : "sm:grid-cols-2"}`}
+                    >
                       <InfoRow
                         icon={Mail}
                         label={copy.paymentAccount}
diff --git a/frontend/components/account/__tests__/paymentShell.test.ts b/frontend/components/account/__tests__/paymentShell.test.ts
index 0af3e062..26f8bbe5 100644
--- a/frontend/components/account/__tests__/paymentShell.test.ts
+++ b/frontend/components/account/__tests__/paymentShell.test.ts
@@ -184,9 +184,10 @@ export function runTests() {
   );
   assert(
     accountCenterSource.includes("data-testid=\"payment-management-grid\"") &&
-      accountCenterSource.includes("lg:grid-cols-[minmax(0,1fr)_minmax(320px,380px)]") &&
-      accountCenterSource.includes("data-testid=\"payment-guard-grid\""),
-    "payment management must split plans/referrals from payment controls and compact guard details into grids",
+      accountCenterSource.includes('hasTelegramPanel ? "" : "lg:grid-cols-[minmax(0,1fr)_minmax(320px,380px)]"') &&
+      accountCenterSource.includes("data-testid=\"payment-guard-grid\"") &&
+      accountCenterSource.includes('hasTelegramPanel ? "" : "sm:grid-cols-2"'),
+    "payment management must only split into internal columns when it is not already sharing the row with a Telegram panel",
   );
   assert(
     !appAnalyticsSource.includes('NEXT_PUBLIC_POLYWEATHER_APP_ANALYTICS === "true"') &&