Refactor MacOS Vibrancy CSS for Main Content Layout

- Simplified CSS rules for light and dark modes in the MacOS vibrancy styles by removing unnecessary selectors related to the dashboard splitter.
- Enhanced clarity and maintainability of styles for the ant-layout main content layout, ensuring consistent background appearance across both modes.

assets/stylesheets/App.css

@@ -143,21 +143,11 @@ html.macos-vibrancy .main-layout {
   background: transparent !important;
 }
 
-html.macos-vibrancy .light-mode .ant-layout.main-content-layout,
-html.macos-vibrancy
-  .light-mode
-  .dashboard-splitter.farmcontrol-splitter
-  > .ant-splitter-bar
-  .ant-splitter-bar-dragger:before {
+html.macos-vibrancy .light-mode .ant-layout.main-content-layout {
   background: rgba(255, 255, 255, 0.88) !important;
 }
 
-html.macos-vibrancy .dark-mode .ant-layout.main-content-layout,
-html.macos-vibrancy
-  .dark-mode
-  .dashboard-splitter.farmcontrol-splitter
-  > .ant-splitter-bar
-  .ant-splitter-bar-dragger:before {
+html.macos-vibrancy .dark-mode .ant-layout.main-content-layout {
   background: rgba(0, 0, 0, 0.88) !important;
 }
 
@@ -1568,6 +1558,10 @@ span.ant-skeleton-input.ant-skeleton-input-sm.text-skeleton {
   margin: 0;
 }
 
+.dashboard-splitter.farmcontrol-splitter > .ant-splitter-panel {
+  padding: 0;
+}
+
 .dashboard-splitter.farmcontrol-splitter
   > .ant-splitter-bar
   .ant-splitter-bar-dragger::before {

src/components/Dashboard/Layout.jsx

@@ -51,7 +51,10 @@ const DashboardLayout = ({ children }) => {
       >
         <DashboardNavigation />
         <DashboardSidebarSplitter sidebar={sidebar}>
-          <Layout style={{ padding: '24px' }} className='main-content-layout'>
+          <Layout
+            style={{ padding: '24px', height: '100%' }}
+            className='main-content-layout'
+          >
             <Content>
               <Flex vertical style={{ height: '100%' }} gap='20px'>
                 <Flex justify='space-between'>