import styled from "@emotion/styled";
import { DEFAULT_Z_INDEX } from "../Popup/utils";
import { classes, tokens } from "./Popover.tokens";
export const StyledRoot = /*#__PURE__*/ styled("div", {
    target: "e1e0c0gn0",
    label: "StyledRoot"
})("display:inline-flex;box-sizing:border-box;position:relative;");
export const StyledWrapper = /*#__PURE__*/ styled("div", {
    target: "e1e0c0gn1",
    label: "StyledWrapper"
})("display:inline-flex;&.", classes.targetAsRef, "{position:absolute;top:0;left:0;width:100%;height:100%;", StyledRoot, "{width:100%;height:100%;display:block;}}");
export const StyledArrow = /*#__PURE__*/ styled("div", {
    target: "e1e0c0gn2",
    label: "StyledArrow"
})("width:var(", tokens.arrowMaskWidth, ");height:var(", tokens.arrowMaskHeight, ");&::before{position:absolute;width:var(", tokens.arrowMaskWidth, ");height:var(", tokens.arrowMaskHeight, ");mask-image:var(", tokens.arrowMaskImage, ");background:var(", tokens.arrowBackground, ");content:'';transform:rotate(0deg);}");
export const StyledPopover = /*#__PURE__*/ styled("div", {
    target: "e1e0c0gn3",
    label: "StyledPopover"
})("position:absolute;z-index:", ({ zIndex })=>zIndex || DEFAULT_Z_INDEX, ";opacity:0;visibility:hidden;box-shadow:var(", tokens.boxShadow, ");border-radius:inherit;&.", classes.animate, "{transition:opacity 0.3s ease-in-out,visibility 0.3s;}&.", classes.open, "{opacity:1;visibility:visible;}&:before{content:'';display:block;position:absolute;background:transparent;}&[data-popper-placement^='top'] > .", classes.arrow, "{bottom:calc(0px - var(", tokens.arrowHeight, "));}&[data-popper-placement^='bottom'] > .", classes.arrow, "{top:calc(0px - var(", tokens.arrowHeight, "));&::before{transform:rotate(180deg);}}&[data-popper-placement^='left'] > .", classes.arrow, "{right:calc(0px - var(", tokens.arrowHeight, "));&::before{transform:rotate(-90deg);}}&[data-popper-placement^='right'] > .", classes.arrow, "{left:calc(0px - var(", tokens.arrowHeight, "));&::before{transform:rotate(90deg);}}&[data-popper-placement^='top-start'] > .", classes.arrow, "{bottom:calc(0px - var(", tokens.arrowHeight, "));left:var(", tokens.arrowEdgeMargin, ") !important;transform:unset !important;}&[data-popper-placement^='top-end'] > .", classes.arrow, "{bottom:calc(0px - var(", tokens.arrowHeight, "));left:unset !important;right:var(", tokens.arrowEdgeMargin, ") !important;transform:unset !important;}&[data-popper-placement^='bottom-start'] > .", classes.arrow, "{top:calc(0px - var(", tokens.arrowHeight, "));left:var(", tokens.arrowEdgeMargin, ") !important;transform:unset !important;&::before{transform:rotate(180deg);}}&[data-popper-placement^='bottom-end'] > .", classes.arrow, "{top:calc(0px - var(", tokens.arrowHeight, "));left:unset !important;right:var(", tokens.arrowEdgeMargin, ") !important;transform:unset !important;&::before{transform:rotate(180deg);}}&[data-popper-placement^='left-start']\n        > .", classes.arrow, ",&[data-popper-placement^='right-start']\n        > .", classes.arrow, "{top:var(", tokens.arrowEdgeMargin, ") !important;transform:unset !important;}&[data-popper-placement^='left-end']\n        > .", classes.arrow, ",&[data-popper-placement^='right-end']\n        > .", classes.arrow, "{top:unset !important;bottom:var(", tokens.arrowEdgeMargin, ") !important;transform:unset !important;}&[data-popper-placement^='top'],&[data-popper-placement^='top-start'],&[data-popper-placement^='top-end']{&:before{top:unset;left:0;right:0;height:var(", tokens.arrowHeight, ");bottom:calc(-1 * var(", tokens.arrowHeight, "));}}&[data-popper-placement^='bottom'],&[data-popper-placement^='bottom-start'],&[data-popper-placement^='bottom-end']{&:before{top:calc(-1 * var(", tokens.arrowHeight, "));left:0;right:0;bottom:var(", tokens.arrowHeight, ");height:var(", tokens.arrowHeight, ");}}&[data-popper-placement^='left'],&[data-popper-placement^='left-start'],&[data-popper-placement^='left-end']{&:before{width:var(", tokens.arrowHeight, ");height:100%;top:0;right:calc(-1 * var(", tokens.arrowHeight, "));bottom:0;}}&[data-popper-placement^='right'],&[data-popper-placement^='right-start'],&[data-popper-placement^='right-end']{&:before{width:var(", tokens.arrowHeight, ");height:100%;top:0;left:calc(-1 * var(", tokens.arrowHeight, "));bottom:0;}}");
