"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_css_responsiveStyle_cjs = require("../../css/responsiveStyle.cjs");
const styles_lib_themes_vars_css_cjs = require("../../themes/vars.css.cjs");
__vanilla_filescope__.setFileScope("src/lib/components/Autosuggest/Autosuggest.css.ts", "braid-design-system");
const backdrop = css.style({
  width: "100vw",
  height: "100vh",
  background: "black"
}, "backdrop");
const backdropVisible = css.style({
  opacity: 0.4
}, "backdropVisible");
const calcMenuHeight = (numSuggestions) => cssUtils.calc(styles_lib_themes_vars_css_cjs.vars.touchableSize).multiply(numSuggestions).add(styles_lib_themes_vars_css_cjs.vars.space.xxsmall).toString();
const menu = css.style(styles_lib_css_responsiveStyle_cjs.responsiveStyle({
  mobile: {
    maxHeight: calcMenuHeight(6),
    overflowY: "auto"
  },
  tablet: {
    maxHeight: calcMenuHeight(8)
  }
}), "menu");
const groupHeading = css.style({
  textTransform: "uppercase"
}, "groupHeading");
__vanilla_filescope__.endFileScope();
exports.backdrop = backdrop;
exports.backdropVisible = backdropVisible;
exports.groupHeading = groupHeading;
exports.menu = menu;
