"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
}) : (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
    Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
    o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
    __setModuleDefault(result, mod);
    return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.SimpleButton = exports.SimpleError = exports.SimpleLabel = exports.SimpleField = exports.SimpleInput = exports.buttonClass = exports.outputClass = exports.inputClass = exports.errorClass = exports.labelClass = exports.fieldClass = exports.fieldGroupClass = void 0;
// eslint-disable-next-line import/named
const styled_components_1 = __importStar(require("styled-components"));
exports.fieldGroupClass = styled_components_1.css `
  box-sizing: border-box;
  padding-top: 24px;
  padding-bottom: 24px;
  padding-left: 24px;
`;
exports.fieldClass = styled_components_1.css `
  display: block;
  margin-bottom: 24px;
`;
exports.labelClass = styled_components_1.css `
  display: block;
  color: #848484;
  margin-bottom: 6px;
`;
exports.errorClass = styled_components_1.css `
  color: var(--error-color);
  margin-top: 6px;
`;
exports.inputClass = styled_components_1.css `
  background: #fff;
  border-radius: 4px;
  width: 100%;
  box-sizing: border-box;
  font-size: inherit;
  border: 1px solid rgba(0, 0, 0, 0.16);
  padding: 10px;
  outline: none;
  transition: box-shadow 0.1s ease, width 0.1s ease;
  min-height: var(--input-min-height);
  :focus,
  :active {
    border-color: var(--accent-color);
    box-shadow: 0 0 0 3px var(--semi-transparent-accent-color);
  }
`;
exports.outputClass = styled_components_1.css `
  width: 100%;
  box-sizing: border-box;
  font-size: inherit;
  outline: none;
  min-height: var(--input-min-height);
  background: #fff;
  padding: 10px;
  border-radius: 4px;
`;
exports.buttonClass = styled_components_1.css `
  background: var(--primary-color);
  font-size: 1.5em;
  color: #fff;
  border: none;
  border-radius: 3px;
  padding: 0.5em 2em;
`;
exports.SimpleInput = styled_components_1.default.input `
  ${exports.inputClass}
`;
exports.SimpleField = styled_components_1.default.label `
  ${exports.fieldClass}
`;
exports.SimpleLabel = styled_components_1.default.div `
  ${exports.labelClass}
`;
exports.SimpleError = styled_components_1.default.div `
  ${exports.errorClass}
`;
exports.SimpleButton = styled_components_1.default.button `
  ${exports.buttonClass}
`;
//# sourceMappingURL=index.js.map