import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
import { style } from "@vanilla-extract/css";
import { calc } from "@vanilla-extract/css-utils";
import { vars } from "../../themes/vars.css.mjs";
import { virtualTouchableRules } from "../private/touchable/virtualTouchableRules.mjs";
setFileScope("src/lib/components/TextDropdown/TextDropdown.css.ts", "braid-design-system");
const select = style({
  ...virtualTouchableRules
}, "select");
const focusOverlay = [style({
  selectors: {
    [`${select}:focus ~ &`]: {
      opacity: 1
    }
  }
}, "focusOverlay"), style({
  top: calc.negate(vars.space.xxsmall),
  bottom: calc.negate(vars.space.xxsmall),
  left: calc.negate(vars.space.xxsmall),
  right: calc.negate(vars.space.xxsmall)
}, "focusOverlay")];
endFileScope();
export {
  focusOverlay,
  select
};
