Fixes 29044: UI bug due to missing style for tooltip. (#29556)

For #29044 

Fixed styling issues with 'Observers can run this query' tooltip on the queries page.

changes/29044-add-missing-tooltip-styles

@@ -0,0 +1 @@
+* Fixed bug with the 'Observers can run this query' tooltip due to missing styling rules.

frontend/pages/queries/ManageQueriesPage/_styles.scss

@@ -105,9 +105,6 @@
               .inherited-badge {
                 overflow: initial;
               }
-              .observer-can-run-badge {
-                @include tooltip5-arrow-styles;
-              }
             }
 
             @media (max-width: $break-md) {

frontend/pages/queries/ManageQueriesPage/components/QueriesTable/QueriesTableConfig.tsx

@@ -154,30 +154,19 @@ const generateColumnConfigs = ({
             suffix={
               <>
                 {!isCurrentTeamObserverOrGlobalObserver && observer_can_run && (
-                  <div className="observer-can-run-badge">
-                    <span
-                      className="observer-can-run-icon"
-                      data-tooltip-id={`observer-can-run-tooltip-${id}`}
-                    >
-                      <Icon
-                        className="observer-can-run-query-icon"
-                        name="query"
-                        size="small"
-                        color="core-fleet-blue"
-                      />
-                    </span>
-                    <ReactTooltip5
-                      className="observer-can-run-tooltip"
-                      disableStyleInjection
-                      place="top"
-                      opacity={1}
-                      id={`observer-can-run-tooltip-${id}`}
-                      offset={8}
-                      positionStrategy="fixed"
-                    >
-                      Observers can run this query.
-                    </ReactTooltip5>
-                  </div>
+                  <TooltipWrapper
+                    tipContent="Observers can run this query."
+                    underline={false}
+                    showArrow
+                    position="top"
+                  >
+                    <Icon
+                      className="observer-can-run-query-icon"
+                      name="query"
+                      size="small"
+                      color="ui-fleet-black-50"
+                    />
+                  </TooltipWrapper>
                 )}
                 {viewingTeamScope &&
                   // inherited