Fixed command menu and main container layout (#16665)

This PR fixes https://github.com/twentyhq/twenty/issues/16645

It solves two problems : 
- Command menu for mobile was outside of its proper place, it should
have been portaled instead of lifted that high in the hierarchy, which
is done here, thus avoiding context issues.
- CSS was odd due to a code path removing main container styling for
mobile display, everything has been cleaned with explicit and durable
naming. I used "main container layout" instead of "page layout" to
disambiguate from page layout feature.

## Before 

<img width="567" height="907" alt="image"
src="https://github.com/user-attachments/assets/73a335f6-d5b6-4e8a-a33f-73aa624c7ca5"
/>


## After 

<img width="566" height="907" alt="image"
src="https://github.com/user-attachments/assets/0433b7d8-c8de-4b2b-b3fd-0d8d45b92d75"
/>

packages/twenty-front/src/modules/object-record/components/CommandMenuPageLayout.tsx

@@ -1,45 +0,0 @@
-import { CommandMenuSidePanel } from '@/command-menu/components/CommandMenuSidePanel';
-import { useCommandMenuHotKeys } from '@/command-menu/hooks/useCommandMenuHotKeys';
-import { PageBody } from '@/ui/layout/page/components/PageBody';
-import styled from '@emotion/styled';
-import { type ReactNode } from 'react';
-import { useIsMobile } from 'twenty-ui/utilities';
-
-type CommandMenuPageLayoutProps = {
-  children: ReactNode;
-};
-
-const StyledLayout = styled.div`
-  display: flex;
-  flex: 1;
-  min-height: 0;
-  padding-bottom: ${({ theme }) => theme.spacing(3)};
-  padding-right: ${({ theme }) => theme.spacing(3)};
-`;
-
-const StyledPageBody = styled(PageBody)`
-  flex: 1 1 0;
-  min-width: 0;
-  width: 0;
-  padding-bottom: 0;
-  padding-right: 0;
-`;
-
-export const CommandMenuPageLayout = ({
-  children,
-}: CommandMenuPageLayoutProps) => {
-  const isMobile = useIsMobile();
-
-  useCommandMenuHotKeys();
-
-  if (isMobile) {
-    return <>{children}</>;
-  }
-
-  return (
-    <StyledLayout>
-      <StyledPageBody>{children}</StyledPageBody>
-      <CommandMenuSidePanel />
-    </StyledLayout>
-  );
-};

packages/twenty-front/src/modules/object-record/components/MainContainerLayoutWithCommandMenu.tsx

@@ -0,0 +1,65 @@
+import { CommandMenuForMobile } from '@/command-menu/components/CommandMenuForMobile';
+import { CommandMenuSidePanelForDesktop } from '@/command-menu/components/CommandMenuSidePanelForDesktop';
+import { useCommandMenuHotKeys } from '@/command-menu/hooks/useCommandMenuHotKeys';
+import { PageBody } from '@/ui/layout/page/components/PageBody';
+import styled from '@emotion/styled';
+import { type ReactNode } from 'react';
+import { useIsMobile } from 'twenty-ui/utilities';
+
+type MainContainerLayoutWithCommandMenuProps = {
+  children: ReactNode;
+};
+
+const StyledMainContainerLayoutForDesktop = styled.div`
+  display: flex;
+  flex: 1;
+  min-height: 0;
+  padding-bottom: ${({ theme }) => theme.spacing(3)};
+  padding-right: ${({ theme }) => theme.spacing(3)};
+`;
+
+const StyledPageBodyForDesktop = styled(PageBody)`
+  flex: 1 1 0;
+  min-width: 0;
+  width: 0;
+  padding-bottom: 0;
+  padding-right: 0;
+`;
+
+const StyledMainContainerLayoutForMobile = styled.div`
+  display: flex;
+  flex: 1;
+  min-height: 0;
+  padding: 0;
+`;
+
+const StyledPageBodyForMobile = styled(PageBody)`
+  padding-bottom: 0;
+  padding-left: ${({ theme }) => theme.spacing(1)};
+
+  padding-right: ${({ theme }) => theme.spacing(1.5)};
+`;
+
+export const MainContainerLayoutWithCommandMenu = ({
+  children,
+}: MainContainerLayoutWithCommandMenuProps) => {
+  const isMobile = useIsMobile();
+
+  useCommandMenuHotKeys();
+
+  if (isMobile) {
+    return (
+      <StyledMainContainerLayoutForMobile>
+        <StyledPageBodyForMobile>{children}</StyledPageBodyForMobile>
+        <CommandMenuForMobile />
+      </StyledMainContainerLayoutForMobile>
+    );
+  }
+
+  return (
+    <StyledMainContainerLayoutForDesktop>
+      <StyledPageBodyForDesktop>{children}</StyledPageBodyForDesktop>
+      <CommandMenuSidePanelForDesktop />
+    </StyledMainContainerLayoutForDesktop>
+  );
+};