Complete Implemenation of tenancy

frontend/src/layout/AppLayout.tsx

@@ -11,6 +11,7 @@ import { useHeaderMetrics } from "../context/HeaderMetricsContext";
 import { useErrorHandler } from "../hooks/useErrorHandler";
 import { trackLoading } from "../components/common/LoadingStateMonitor";
 import ResourceDebugOverlay from "../components/debug/ResourceDebugOverlay";
+import PendingPaymentBanner from "../components/billing/PendingPaymentBanner";
 
 const LayoutContent: React.FC = () => {
   const { isExpanded, isHovered, isMobileOpen } = useSidebar();
@@ -266,6 +267,8 @@ const LayoutContent: React.FC = () => {
         } ${isMobileOpen ? "ml-0" : ""} w-full max-w-full min-[1440px]:max-w-[90%]`}
       >
         <AppHeader />
+        {/* Pending Payment Banner - Shows when account status is 'pending_payment' */}
+        <PendingPaymentBanner className="mx-4 mt-4 md:mx-6 md:mt-6" />
         <div className="p-4 pb-20 md:p-6 md:pb-24">
           <Outlet />
         </div>