import { createGlobalStyle } from "styled-components";
import type { Theme } from "constants/DefaultTheme";
import { Classes } from "@blueprintjs/core";
export const GLOBAL_STYLE_TOOLTIP_CLASSNAME = "ads-global-tooltip";
export const TooltipStyles = createGlobalStyle<{
theme: Theme;
}>`
.${Classes.PORTAL} .${Classes.TOOLTIP}.${GLOBAL_STYLE_TOOLTIP_CLASSNAME}, .${Classes.TOOLTIP}.${GLOBAL_STYLE_TOOLTIP_CLASSNAME} {
max-width: 350px;
overflow-wrap: anywhere;
.${Classes.POPOVER_CONTENT} {
padding: var(--ads-v2-spaces-3) var(--ads-v2-spaces-4);
font-family: var(--ads-v2-font-family);
color: var(--ads-v2-color-fg-on-emphasis-max);
border-radius: var(--ads-v2-border-radius);
background-color: var(--ads-v2-color-bg-emphasis-max);
min-height: unset;
box-shadow: 0 2px 4px -2px rgba(0, 0, 0, 0.06), 0 4px 8px -2px rgba(0, 0, 0, 0.1);
font-size: var(--ads-v2-font-size-2);
font-weight: var(--ads-v2-p-font-weight);
margin: 0;
letter-spacing: var(--ads-v2-p-letter-spacing);
}
div.${Classes.POPOVER_ARROW} {
display: block;
svg {
path {
fill: var(--ads-v2-color-bg-emphasis-max)
&:before {
`;