"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "base", {
    enumerable: true,
    get: function() {
        return base;
    }
});
const _styledcomponents = require("styled-components");
const _mixins = require("../../../../mixins");
const _CodeInputstyles = require("../../CodeInput.styles");
const _CodeInputtokens = require("../../CodeInput.tokens");
const base = (0, _styledcomponents.css)([
    ``,
    `{color:var(`,
    `);&.`,
    `{color:var(`,
    `);}}`,
    `{color:var(`,
    `);background-color:var(`,
    `);box-shadow:inset 0 0 0 var(`,
    `) var(`,
    `);}`,
    `{border:var(`,
    `) solid var(`,
    `);background-color:'transparent';&.`,
    `{background-color:var(`,
    `);}&.`,
    `{animation:shakingError 0.3s forwards;}&.`,
    `{background-color:var(`,
    `);border:var(`,
    `) solid var(`,
    `);}&:focus-visible{outline:none;}&[data-focus-visible-added]{`,
    ` border:none;position:absolute;}}&:hover{.`,
    `{background-color:var(`,
    `);box-shadow:inset 0 0 0 var(`,
    `) var(`,
    `);}}&:focus-within{`,
    `:focus-within{box-shadow:inset 0 0 0 var(`,
    `) var(`,
    `);}}&& .`,
    `{animation:shakingError 0.3s forwards;}&& .`,
    `{`,
    `{color:var(`,
    `);background-color:var(`,
    `);box-shadow:inset 0 0 0 var(`,
    `) var(`,
    `);}`,
    `{border:var(`,
    `) solid var(`,
    `);&.`,
    `{background-color:var(`,
    `);}}&:focus-within{`,
    `{background-color:var(`,
    `);box-shadow:inset 0 0 0 var(`,
    `) var(`,
    `);}}&.`,
    `{`,
    `{animation:fadeError 0.3s forwards;}}}&& .`,
    `{animation:shakingError 0.3s forwards;}&& .`,
    `,&& .`,
    `:focus-within{color:var(`,
    `);background-color:var(`,
    `);box-shadow:inset 0 0 0 var(`,
    `) var(`,
    `);&.`,
    `{animation:shakingError 0.3s forwards fadeError 0.3s forwards;}}@keyframes shakingError{14%{transform:translateX(-0.125rem);}28%{transform:translateX(0.125rem);}42%{transform:translateX(-0.125rem);}57%{transform:translateX(0.125rem);}71%{transform:translateX(-0.125rem);}85%{transform:translateX(0.125rem);}100%{transform:translateX(-0.125rem);}}@keyframes fadeError{50%{color:var(`,
    `);}100%{color:transparent;}}`
], _CodeInputstyles.CaptionWrapper, _CodeInputtokens.tokens.captionColor, _CodeInputtokens.classes.captionError, _CodeInputtokens.tokens.captionColorError, _CodeInputstyles.ItemInput, _CodeInputtokens.tokens.codeColor, _CodeInputtokens.tokens.backgroundColor, _CodeInputtokens.tokens.borderWidth, _CodeInputtokens.tokens.borderColor, _CodeInputstyles.ItemCircle, _CodeInputtokens.tokens.codeItemCircleBorderWidth, _CodeInputtokens.tokens.codeColor, _CodeInputtokens.classes.itemCirlceFilled, _CodeInputtokens.tokens.codeColor, _CodeInputtokens.classes.itemCircleErrorAnimation, _CodeInputtokens.classes.itemCircleError, _CodeInputtokens.tokens.codeColorError, _CodeInputtokens.tokens.codeItemCircleBorderWidth, _CodeInputtokens.tokens.codeColorError, (0, _mixins.addFocus)({
    outlineOffset: '0',
    outlineSize: '0.125rem',
    outlineRadius: '1rem',
    outlineColor: `var(${_CodeInputtokens.tokens.borderColorFocus})`
}), _CodeInputtokens.classes.hoverEnabled, _CodeInputtokens.tokens.backgroundColorHover, _CodeInputtokens.tokens.borderWidth, _CodeInputtokens.tokens.borderColorHover, _CodeInputstyles.ItemInput, _CodeInputtokens.tokens.borderWidth, _CodeInputtokens.tokens.borderColorFocus, _CodeInputtokens.classes.codeErrorAnimation, _CodeInputtokens.classes.codeError, _CodeInputstyles.ItemInput, _CodeInputtokens.tokens.codeColorError, _CodeInputtokens.tokens.backgroundErrorColor, _CodeInputtokens.tokens.borderWidth, _CodeInputtokens.tokens.borderErrorColor, _CodeInputstyles.ItemCircle, _CodeInputtokens.tokens.codeItemCircleBorderWidth, _CodeInputtokens.tokens.codeColorError, _CodeInputtokens.classes.itemCirlceFilled, _CodeInputtokens.tokens.codeColorError, _CodeInputstyles.ItemInput, _CodeInputtokens.tokens.backgroundErrorColor, _CodeInputtokens.tokens.borderWidth, _CodeInputtokens.tokens.borderErrorColor, _CodeInputtokens.classes.codeErrorFade, _CodeInputstyles.ItemInput, _CodeInputtokens.classes.itemErrorAnimation, _CodeInputtokens.classes.itemError, _CodeInputtokens.classes.itemError, _CodeInputtokens.tokens.codeColorError, _CodeInputtokens.tokens.backgroundErrorColor, _CodeInputtokens.tokens.borderWidth, _CodeInputtokens.tokens.borderErrorColor, _CodeInputtokens.classes.codeErrorFade, _CodeInputtokens.tokens.codeColorError);
