import { css } from "@emotion/react";
import styled from "@emotion/styled";
import { classes, tokens } from "./CodeField.tokens";
export var base = /*#__PURE__*/ css("display:flex;flex-direction:column;justify-content:center;width:min-content;align-items:center;&.", classes.captionAlignLeft, "{align-items:flex-start;}", "base");
export var CodeWrapper = /*#__PURE__*/ styled("div", {
    target: "eh6ghy40",
    label: "CodeWrapper"
})("display:flex;align-items:center;");
export var CodeGroup = /*#__PURE__*/ styled("div", {
    target: "eh6ghy41",
    label: "CodeGroup"
})("display:flex;align-items:center;");
export var Separator = /*#__PURE__*/ styled("div", {
    target: "eh6ghy42",
    label: "Separator"
})("width:var(", tokens.separatorWidth, ");");
export var ItemInput = /*#__PURE__*/ styled("input", {
    target: "eh6ghy43",
    label: "ItemInput"
})("box-sizing:border-box;appearance:none;border:0;padding:0;outline:none;pointer-events:none;text-align:center;");
export var CaptionWrapper = /*#__PURE__*/ styled("div", {
    target: "eh6ghy44",
    label: "CaptionWrapper"
})("text-align:", function(param) {
    var captionAlign = param.captionAlign;
    return captionAlign;
}, ";align-self:", function(param) {
    var captionAlign = param.captionAlign;
    return captionAlign;
}, ";width:", function(param) {
    var widthValue = param.widthValue;
    return widthValue || 'auto';
}, ";white-space:pre-line;");
export var HiddenInput = /*#__PURE__*/ styled("input", {
    target: "eh6ghy45",
    label: "HiddenInput"
})("display:none;");
