"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

const styleh_components_1 = require("styleh-components");

const TextBox_1 = require("../../../../inputs/TextBox");

const Text_1 = require("../../../../components/atoms/Text");

const styles_1 = require("../../../../styles");

const Buttons_1 = require("../../../../components/presets/Buttons");

const StyledButton = styleh_components_1.styled.withComponent(Buttons_1.PrimaryButton)`height:2.75rem;border-radius:0.25rem;color:var(--color-pure-white);font-weight:500;font-size:1.125rem;text-transform:capitalize;`;
const StyledCancel = styleh_components_1.styled.withComponent(StyledButton)`background-color:var(--color-light-grey);width:10.125rem;@media (max-width:1023px){width:9.375rem;}@media (max-width:767px){width:50%;}`;
exports.StyledCancel = StyledCancel;
const StyledSubmitButton = styleh_components_1.styled.withComponent(StyledButton)`background-color:var(--color-blue);width:16.5rem;${props => props.isValidForm === false && styleh_components_1.styled.css`background-color:var(--color-pure-white);border:1px solid var(--color-blue);color:var(--color-light-grey);cursor:not-allowed;`} @media (max-width:1023px){width:9.375rem;}@media (max-width:767px){width:50%;margin-right:0.625rem;}`;
exports.StyledSubmitButton = StyledSubmitButton;
const Wrapper = styleh_components_1.styled.section`.form-wrapper{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;align-items:stretch;margin-left:-0.25rem;margin-right:-0.25rem;.button-group{display:flex;flex:1;justify-content:space-between;padding:0 0.25rem;}.billing-address-wrapper{width:100%;display:flex;flex-direction:row;flex-wrap:wrap;.form-item-wrapper{flex:0 0 50%;padding:0 0.25rem;input::placeholder{font-style:italic;}@media (max-width:1023px){flex:0 0 100%;}&.billing-address-heading{margin-bottom:1rem;flex:0 0 100%;font-size:1.5rem;font-weight:500;text-transform:capitalize;}&.state{flex:0 0 30%;@media (max-width:1023px){flex:0 0 70%;}}&.zip-code{flex:0 0 20%;@media (max-width:1023px){flex:0 0 30%;}}}}.form-item-wrapper{flex:0 0 50%;padding:0 0.25rem;input::placeholder{font-style:italic;}@media (max-width:1023px){flex:0 0 100%;}&.checkbox-label{${Text_1.LabelElement}{font-weight:600;}}.input-show-password-icon{display:none;}&.card-number{flex:0 0 30%;@media (max-width:1023px){flex:0 0 68%;}@media (max-width:767px){flex:0 0 100%;}}&.card-month{flex:0 0 10%;@media (max-width:1023px){flex:0 0 16%;}@media (max-width:767px){flex:0 0 50%;}}&.card-expire-year{flex:0 0 10%;@media (max-width:1023px){flex:0 0 16%;}@media (max-width:767px){flex:0 0 50%;}}&.default-address{flex:0 0 100%;width:100%;margin:0.5rem 0 1.125rem;align-items:baseline;label{font-size:1rem;color:var(--color-black);user-select:none;align-self:flex-start;}svg{width:1.125rem;height:auto;border-radius:0.125rem;${styles_1.userSelect('none')};.checkbox-tickfill{transform:scale(1.4,1.4) translate(1.25rem,1.875rem);}}}${TextBox_1.StyledLabel}{display:flex;position:relative;margin-bottom:0.5rem;top:0;text-transform:capitalize;font-size:1rem;font-weight:400;overflow:visible;}}}`;
exports.Wrapper = Wrapper; //# sourceMappingURL=styled.js.map