Modify layout and improve subscription fetching

The layout for responsive designs has been updated in plan-picker component. Subscription type has been removed from billing/page.tsx and subscription fetching has been improved with additional query parameters in both billing/page.tsx and current-plan-card.tsx. Errors were also corrected in i18n translation keys in team-account-checkout-form.tsx. CurrentPlanCard's component props now includes line items in the subscription object. Changes in billing/page.tsx include adaptation of container width to be fully responsive.

apps/web/app/(dashboard)/home/(user)/billing/page.tsx

@@ -18,8 +18,6 @@ import { withI18n } from '~/lib/i18n/with-i18n';
 
 import { PersonalAccountCheckoutForm } from './_components/personal-account-checkout-form';
 
-type Subscription = Database['public']['Tables']['subscriptions']['Row'];
-
 export const generateMetadata = async () => {
   const i18n = await createI18nServerInstance();
   const title = i18n.t('account:billingTab');
@@ -78,7 +76,7 @@ async function loadData(client: SupabaseClient<Database>) {
 
   const subscription = client
     .from('subscriptions')
-    .select<string, Subscription>('*')
+    .select('*, items: subscription_items !inner (*)')
     .eq('account_id', user.id)
     .maybeSingle()
     .then(({ data }) => data);