diff --git a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/components/empty_view.tsx b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/components/empty_view.tsx
index cf4d3dc1e6e15..3f198f99a7872 100644
--- a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/components/empty_view.tsx
+++ b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/components/empty_view.tsx
@@ -8,7 +8,7 @@
 import React from 'react';
 import { isEmpty } from 'lodash';
 import { EuiFlexGroup, EuiFlexItem, EuiProgress, EuiSpacer, EuiText } from '@elastic/eui';
-import styled from 'styled-components';
+import styled from '@emotion/styled';
 import { i18n } from '@kbn/i18n';
 import { LOADING_VIEW } from '../series_editor/series_editor';
 import { ReportViewType, SeriesUrl } from '../types';
diff --git a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/embeddable/embeddable.tsx b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/embeddable/embeddable.tsx
index 1b3028a0283ed..a7331e32d613d 100644
--- a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/embeddable/embeddable.tsx
+++ b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/embeddable/embeddable.tsx
@@ -17,7 +17,7 @@ import {
 } from '@kbn/lens-plugin/public';
 import { ViewMode } from '@kbn/embeddable-plugin/common';
 import { observabilityFeatureId } from '@kbn/observability-shared-plugin/public';
-import styled from 'styled-components';
+import styled from '@emotion/styled';
 import { AnalyticsServiceSetup } from '@kbn/core-analytics-browser';
 import { QueryDslQueryContainer } from '@elastic/elasticsearch/lib/api/types';
 import { useEBTTelemetry } from '../hooks/use_ebt_telemetry';
diff --git a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/embeddable/index.tsx b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/embeddable/index.tsx
index f67c48bb4e0c2..1695a72d53bbd 100644
--- a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/embeddable/index.tsx
+++ b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/embeddable/index.tsx
@@ -11,7 +11,7 @@ import { EuiThemeProvider } from '@kbn/kibana-react-plugin/common';
 import type { AnalyticsServiceSetup, CoreStart } from '@kbn/core/public';
 import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public';
 import { EuiErrorBoundary } from '@elastic/eui';
-import styled from 'styled-components';
+import styled from '@emotion/styled';
 import { DataView } from '@kbn/data-views-plugin/common';
 import { FormulaPublicApi } from '@kbn/lens-plugin/public';
 import { i18n } from '@kbn/i18n';
diff --git a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/exploratory_view.tsx b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/exploratory_view.tsx
index 9b5fadb9c1bf8..8db137c94839f 100644
--- a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/exploratory_view.tsx
+++ b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/exploratory_view.tsx
@@ -7,7 +7,7 @@
 
 import { i18n } from '@kbn/i18n';
 import React, { useEffect, useRef, useState } from 'react';
-import styled from 'styled-components';
+import styled from '@emotion/styled';
 import {
   EuiButtonEmpty,
   EuiResizableContainer,
diff --git a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/header/last_updated.tsx b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/header/last_updated.tsx
index f3d8f4cfdec00..3310a03ceca74 100644
--- a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/header/last_updated.tsx
+++ b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/header/last_updated.tsx
@@ -7,7 +7,7 @@
 
 import React, { useEffect, useState } from 'react';
 import moment from 'moment';
-import styled from 'styled-components';
+import styled from '@emotion/styled';
 import { EuiIcon, EuiText, EuiToolTip } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n-react';
 import { ChartCreationInfo } from './chart_creation_info';
diff --git a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/lens_embeddable.tsx b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/lens_embeddable.tsx
index 6512e2b190d78..c6b0affe09765 100644
--- a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/lens_embeddable.tsx
+++ b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/lens_embeddable.tsx
@@ -7,7 +7,7 @@
 
 import { i18n } from '@kbn/i18n';
 import React, { Dispatch, SetStateAction, useCallback, useState } from 'react';
-import styled from 'styled-components';
+import styled from '@emotion/styled';
 import { LensEmbeddableInput, TypedLensByValueInput } from '@kbn/lens-plugin/public';
 import { useUiTracker } from '@kbn/observability-shared-plugin/public';
 import { useSeriesStorage } from './hooks/use_series_storage';
diff --git a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/breakdown/breakdowns.tsx b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/breakdown/breakdowns.tsx
index f654870499742..0a0b2847af279 100644
--- a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/breakdown/breakdowns.tsx
+++ b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/breakdown/breakdowns.tsx
@@ -6,7 +6,7 @@
  */
 
 import React, { useEffect } from 'react';
-import styled from 'styled-components';
+import styled from '@emotion/styled';
 import { EuiSuperSelect, EuiToolTip } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import { useSeriesStorage } from '../../hooks/use_series_storage';
diff --git a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/columns/date_picker_col.tsx b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/columns/date_picker_col.tsx
index 29e06150f8a8a..4ba38171e90e1 100644
--- a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/columns/date_picker_col.tsx
+++ b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/columns/date_picker_col.tsx
@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import styled from 'styled-components';
+import styled from '@emotion/styled';
 import { i18n } from '@kbn/i18n';
 import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
 import { useSeriesStorage } from '../../hooks/use_series_storage';
diff --git a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/columns/filter_value_btn.tsx b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/columns/filter_value_btn.tsx
index 8ab4f791f785e..75da0926440ac 100644
--- a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/columns/filter_value_btn.tsx
+++ b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/columns/filter_value_btn.tsx
@@ -7,7 +7,7 @@
 import { i18n } from '@kbn/i18n';
 import React, { useMemo } from 'react';
 import { EuiFilterButton, hexToRgb } from '@elastic/eui';
-import { euiStyled } from '@kbn/kibana-react-plugin/common';
+import styled from '@emotion/styled';
 import { FieldValueSuggestions } from '@kbn/observability-shared-plugin/public';
 import { useAppDataViewContext } from '../../hooks/use_app_data_view';
 import { useSeriesFilters } from '../../hooks/use_series_filters';
@@ -112,13 +112,15 @@ export function FilterValueButton({
   );
 }
 
-const FilterButton = euiStyled(EuiFilterButton)`
-  background-color: rgba(${(props) => {
-    const color = props.hasActiveFilters
-      ? props.color === 'danger'
-        ? hexToRgb(props.theme.eui.euiColorDanger)
-        : hexToRgb(props.theme.eui.euiColorPrimary)
-      : 'initial';
-    return `${color[0]}, ${color[1]}, ${color[2]}, 0.1`;
-  }});
+const FilterButton = styled(EuiFilterButton)`
+  background-color: rgba(
+    ${(props) => {
+      const color = props.hasActiveFilters
+        ? props.color === 'danger'
+          ? hexToRgb(props.theme.euiTheme.colors.danger)
+          : hexToRgb(props.theme.euiTheme.colors.primary)
+        : 'initial';
+      return `${color[0]}, ${color[1]}, ${color[2]}, 0.1`;
+    }}
+  );
 `;
diff --git a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/columns/series_name.tsx b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/columns/series_name.tsx
index 1d5c9892c4db1..178dd352d2443 100644
--- a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/columns/series_name.tsx
+++ b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/columns/series_name.tsx
@@ -6,7 +6,7 @@
  */
 
 import React, { useState, ChangeEvent, useEffect, useRef, KeyboardEventHandler } from 'react';
-import styled from 'styled-components';
+import styled from '@emotion/styled';
 import { i18n } from '@kbn/i18n';
 import {
   EuiFieldText,
diff --git a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/series.tsx b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/series.tsx
index 08810e673a0e6..9aa135abcc529 100644
--- a/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/series.tsx
+++ b/x-pack/solutions/observability/plugins/exploratory_view/public/components/shared/exploratory_view/series_editor/series.tsx
@@ -6,7 +6,7 @@
  */
 
 import React, { useEffect, useState } from 'react';
-import styled from 'styled-components';
+import styled from '@emotion/styled';
 import { i18n } from '@kbn/i18n';
 import { EuiFlexItem, EuiFlexGroup, EuiPanel, EuiAccordion, EuiSpacer } from '@elastic/eui';
 import { BuilderItem } from '../types';