"use strict";
const __vanilla_filescope__ = require("@vanilla-extract/css/fileScope");
const css = require("@vanilla-extract/css");
const cssUtils = require("@vanilla-extract/css-utils");
const styles_lib_themes_vars_css_cjs = require("../../themes/vars.css.cjs");
__vanilla_filescope__.setFileScope("src/lib/components/TooltipRenderer/TooltipRenderer.css.ts", "braid-design-system");
const constants = {
  maxWidth: "260px",
  arrowSize: "12px"
};
const maxWidth = css.style({
  maxWidth: constants.maxWidth
}, "maxWidth");
const verticalOffsetBeforeEntrance = css.style({
  transform: "translateZ(0) translateY(4px)",
  selectors: {
    "[data-popper-placement^=bottom] &": {
      transform: "translateZ(0) translateY(-4px)"
    }
  }
}, "verticalOffsetBeforeEntrance");
const translateZ0 = css.style({
  transform: "translateZ(0)"
}, "translateZ0");
const borderRadius = styles_lib_themes_vars_css_cjs.vars.borderRadius.small;
const offset = cssUtils.calc(constants.arrowSize).divide(2).negate().toString();
const arrow = css.style({
  visibility: "hidden",
  ":before": {
    visibility: "visible",
    content: "''",
    transform: "rotate(45deg)"
  },
  selectors: {
    "&, &::before": {
      width: cssUtils.calc.add(constants.arrowSize, cssUtils.calc.multiply(borderRadius, 2)),
      height: cssUtils.calc.add(constants.arrowSize, cssUtils.calc.multiply(borderRadius, 2)),
      position: "absolute",
      background: "inherit",
      borderRadius
    },
    "[data-popper-placement^=top] &": {
      bottom: offset
    },
    "[data-popper-placement^=bottom] &": {
      top: offset
    },
    "[data-popper-placement^=left] &": {
      right: offset
    },
    "[data-popper-placement^=right] &": {
      left: offset
    }
  }
}, "arrow");
__vanilla_filescope__.endFileScope();
exports.arrow = arrow;
exports.maxWidth = maxWidth;
exports.translateZ0 = translateZ0;
exports.verticalOffsetBeforeEntrance = verticalOffsetBeforeEntrance;
