Remove some styled components in Summarize (#49836)

frontend/src/metabase/common/components/AggregationPicker/AggregationPicker.styled.tsx

 import styled from "@emotion/styled";
 
-export const ColumnPickerContainer = styled.div`
-  min-width: 300px;
-`;
-
 export const ColumnPickerHeaderContainer = styled.div`
   display: flex;
   align-items: center;

frontend/src/metabase/common/components/AggregationPicker/AggregationPicker.tsx

@@ -26,7 +26,6 @@ import * as Lib from "metabase-lib";
 import { QueryColumnPicker } from "../QueryColumnPicker";
 
 import {
-  ColumnPickerContainer,
   ColumnPickerHeaderContainer,
   ColumnPickerHeaderTitle,
   ColumnPickerHeaderTitleContainer,
@@ -329,9 +328,11 @@ export function AggregationPicker({
     const columns = Lib.aggregationOperatorColumns(operator);
     const columnGroups = Lib.groupColumns(columns);
     return (
-      <ColumnPickerContainer
+      <Box
         className={className}
+        mih="18.75rem"
         data-testid="aggregation-column-picker"
+        c="summarize"
       >
         <ColumnPickerHeader onClick={handleResetOperator}>
           {operatorInfo.displayName}
@@ -346,7 +347,7 @@ export function AggregationPicker({
           onSelect={handleColumnSelect}
           onClose={onClose}
         />
-      </ColumnPickerContainer>
+      </Box>
     );
   }
 

frontend/src/metabase/query_builder/components/view/sidebars/SummarizeSidebar/AddAggregationButton/AddAggregationButton.tsx

@@ -2,11 +2,10 @@ import type { ReactNode } from "react";
 import { useState } from "react";
 import { t } from "ttag";
 
+import { AggregationPicker } from "metabase/common/components/AggregationPicker";
 import { Popover, Tooltip } from "metabase/ui";
 import * as Lib from "metabase-lib";
 
-import { AggregationPicker } from "../SummarizeSidebar.styled";
-
 import { AddAggregationButtonRoot } from "./AddAggregationButton.styled";
 
 interface AddAggregationButtonProps {

frontend/src/metabase/query_builder/components/view/sidebars/SummarizeSidebar/AggregationItem/AggregationItem.tsx

 import { useCallback, useState } from "react";
 
+import { AggregationPicker } from "metabase/common/components/AggregationPicker";
 import { Popover } from "metabase/ui";
 import * as Lib from "metabase-lib";
 
-import { AggregationPicker } from "../SummarizeSidebar.styled";
-
 import { AggregationName, RemoveIcon, Root } from "./AggregationItem.styled";
 
 interface AggregationItemProps {

frontend/src/metabase/query_builder/components/view/sidebars/SummarizeSidebar/SummarizeContent/SummarizeBreakoutColumnList.tsx

 import { t } from "ttag";
 
-import { Stack, type StackProps } from "metabase/ui";
+import { Space, Stack, type StackProps, Title } from "metabase/ui";
 import type * as Lib from "metabase-lib";
 
 import { BreakoutColumnList } from "../BreakoutColumnList";
-import { SectionTitle } from "../SummarizeSidebar.styled";
 
 type SummarizeBreakoutColumnListProps = {
   query: Lib.Query;
@@ -33,7 +32,8 @@ export const SummarizeBreakoutColumnList = ({
     spacing="0"
     {...containerProps}
   >
-    <SectionTitle>{t`Group by`}</SectionTitle>
+    <Title order={5} fw={900}>{t`Group by`}</Title>
+    <Space my="sm" />
     <BreakoutColumnList
       query={query}
       stageIndex={stageIndex}

frontend/src/metabase/query_builder/components/view/sidebars/SummarizeSidebar/SummarizeSidebar.styled.tsx

 import styled from "@emotion/styled";
 
-import { AggregationPicker as BaseAggregationPicker } from "metabase/common/components/AggregationPicker";
 import SidebarContent from "metabase/query_builder/components/SidebarContent";
 
 export const SidebarView = styled(SidebarContent)`
@@ -10,27 +9,3 @@ export const SidebarView = styled(SidebarContent)`
   right: 0;
   bottom: 0;
 `;
-
-const Section = styled.section`
-  padding: 1.5rem;
-`;
-
-export const SectionTitle = styled.h3`
-  font-weight: 900;
-  margin-bottom: 1rem;
-`;
-
-export const AggregationsContainer = styled(Section)`
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.5rem;
-  padding-top: 0;
-`;
-
-export const AggregationPicker = styled(BaseAggregationPicker)`
-  color: var(--mb-color-summarize);
-`;
-
-export const ColumnListContainer = styled(Section)`
-  border-top: 1px solid var(--mb-color-border);
-`;