{"version":3,"file":"./style-index.css","mappings":";;;AAAA;;;CAAA;AAIA;EAEC;EACA;EACA;EACA;EACA;EACA;AAAD;AAEC;EACC;EACA;EACA;AAAF;AAEE;EACC;EACA;EACA;EACA;AAAH;AAME;EACC;EACA;EACA;AAJH;AAMG;EACC;EACA;EACA;EACA;AAJJ;AAMI;EACC;EACA;AAJL;AASE;EACC;EACA;EACA;EACA;EACA;AAPH;AAUE;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AARH;AAUG;EACC;EACA;EACA;AARJ;AAWG;EACC;AATJ;AAYG;EACC;AAVJ;AAaG;EACC;AAXJ;AAeE;EACC;EACA;AAbH;AAeG;EACC;EACA;AAbJ;AAgBG;EACC;EACA;EAEA;EACA;AAfJ;AAoBC;EACC;EACA;EACA;EACA;AAlBF;AAoBE;EACC;AAlBH;AAqBE;EACC;EACA;EACA;EACA;EACA;EAEA;AAnBH;AAsBE;EAEC;IACC;EArBF;AACF;AA0BC;EACC;EACA;EACA;AAxBF;AA0BE;EAEC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAzBH;AA2BG;EACC;EACA;AAzBJ;AA4BG;EACC;EACA;EACA;AA1BJ,C","sources":["webpack://wr-boilerplate/./src/style.scss"],"sourcesContent":["/**\n* The following styles get applied both on the front of your site\n* and in the editor.\n*/\n.wp-block-interaction-boilerplate-creator-form {\n\n\t/* wrcb color palette */\n\t--wrcb-color-green: #44af69;\n\t--wrcb-color-red: #f8333c;\n\t--wrcb-color-orange: #fcab10;\n\t--wrcb-color-blue: #2b9eb3;\n\t--wrcb-color-gray: #dbd5b5;\n\n\t.creator-message {\n\t\tfont-size: 1.4rem;\n\t\tborder: 1px solid var(--wrcb-color-gray);\n\t\tpadding: 0.2rem;\n\n\t\t&::before {\n\t\t\tcontent: \"..\";\n\t\t\tbackground-color: var(--wrcb-color-orange);\n\t\t\tcolor: var(--wrcb-color-orange);\n\t\t\tmargin-right: 0.4rem;\n\t\t}\n\t}\n\n\t.creator-form {\n\n\t\t&__field {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\tmargin-bottom: 1.4rem;\n\n\t\t\t&--selection {\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: flex-start;\n\t\t\t\tgap: 1rem;\n\n\t\t\t\tselect {\n\t\t\t\t\tfont-size: 1.2rem;\n\t\t\t\t\tpadding: 0.6rem 1rem;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&__label {\n\t\t\tfont-size: 1.2rem;\n\t\t\tfont-weight: 500;\n\t\t\tmargin: 0.4rem 0;\n\t\t\tdisplay: block;\n\t\t\ttransition: all 0.3s;\n\t\t}\n\n\t\t&__input {\n\t\t\tfont-size: 1.4rem;\n\t\t\tpadding: 0.8rem;\n\t\t\tborder-radius: 2px;\n\t\t\tbackground-color: rgba(82, 88, 90, 0.15);\n\t\t\tborder: none;\n\t\t\tborder-bottom: 3px solid var(--wrcb-color-gray);\n\t\t\twidth: 90%;\n\t\t\tdisplay: block;\n\t\t\ttransition: all 0.3s;\n\n\t\t\t&:focus {\n\t\t\t\toutline: none;\n\t\t\t\tbox-shadow: 0 1rem 2rem var(--wp--preset--shadow--natural);\n\t\t\t\tborder-bottom: 3px solid var(--wrcb-color-gray);\n\t\t\t}\n\n\t\t\t&:invalid {\n\t\t\t\tborder-bottom: 3px solid var(--wrcb-color-red);\n\t\t\t}\n\n\t\t\t&:focus:invalid {\n\t\t\t\tborder-bottom: 3px solid var(--wrcb-color-orange);\n\t\t\t}\n\n\t\t\t&:focus:valid {\n\t\t\t\tborder-bottom: 3px solid var(--wrcb-color-green);\n\t\t\t}\n\t\t}\n\n\t\t&__selection {\n\t\t\tdisplay: flex;\n\t\t\tgap: 1rem;\n\n\t\t\t&--type {\n\t\t\t\tpadding: 0.6rem;\n\t\t\t\tfont-size: 1.2rem;\n\t\t\t}\n\n\t\t\t&--link {\n\t\t\t\tdisplay: block;\n\t\t\t\ttext-align: center;\n\n\t\t\t\t/* color: #ffffff; */\n\t\t\t\ttext-decoration: none;\n\t\t\t}\n\t\t}\n\t}\n\n\t.form-submitted {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\n\t\t&__text {\n\t\t\ttext-align: center;\n\t\t}\n\n\t\t&__spinner {\n\t\t\theight: 5rem;\n\t\t\twidth: 5rem;\n\t\t\tborder: 6px solid var(--wrcb-color-blue);\n\t\t\tborder-color: var(--wrcb-color-blue) transparent var(--wrcb-color-blue) transparent;\n\t\t\tborder-radius: 50%;\n\t\t\t-webkit-animation: spin 1.3s ease infinite;\n\t\t\tanimation: spin 1.3s ease infinite;\n\t\t}\n\n\t\t@keyframes spin {\n\n\t\t\tto {\n\t\t\t\ttransform: rotate(360deg);\n\t\t\t}\n\t\t}\n\n\t}\n\n\t.button__field {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\n\t\t&--button {\n\n\t\t\t/* width: 15rem;  */\n\t\t\tpadding: 1rem 1.6rem;\n\t\t\tbackground-color: var(--wrcb-color-green);\n\t\t\tborder-radius: 1rem;\n\t\t\tcursor: pointer;\n\t\t\tcolor: #fff;\n\t\t\tfont-weight: 700;\n\t\t\tfont-size: 1.4rem;\n\t\t\ttransition: all 0.3s ease-in-out;\n\t\t\tbox-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);\n\t\t\ttext-decoration: none;\n\n\t\t\t&:hover {\n\t\t\t\ttransform: scale(1.1);\n\t\t\t\tbox-shadow: 6px 6px 9px rgba(0, 0, 0, 0.2);\n\t\t\t}\n\n\t\t\t&:active {\n\t\t\t\ttransform: scale(0.9);\n\t\t\t\tborder: none;\n\t\t\t\tbox-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);\n\t\t\t}\n\t\t}\n\t}\n}\n"],"names":[],"ignoreList":[],"sourceRoot":""}