/* Register Flow Styles */

input[type="email"],
input[type="password"],
input[type="text"],
input[type="tel"],
select {
  width: 100%;
  padding: 14px;
  border: 3px solid #000;
  font-size: 16px;
  width:100%;
  text-align:center;
  border-radius:0;
  color: #000;
text-align: center;
leading-trim: both;
text-edge: cap;
font-family: Satoshi;
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 0.5px;
}
input:focus{
    outline: none;
}
body.bricks-is-frontend :focus-visible {
    outline: none !important;
}
span.tos {
    color: #000;
    text-align: center;
    font-family: 'Satoshi';
    font-size: 17px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.tos a{
    font-size: 17px !important;
    font-weight: inherit !important;
}
span.price {
  color: #747474;
  text-decoration-line: line-through;
}
.bg-red-100.text-red-700.px-4.py-2.rounded.mb-4 {
    display: flex
;
    margin-top: 22px;
    font-family: 'Satoshi';
    font-size: 18px;
    color: red;
    justify-content: center;
}
.heading-container {
      display: flex;
    flex-direction: column;
    gap: 24px;
}
.step-1 .subheading {
font-size: 24px;
    color: #000;
    font-family: 'Satoshi';
    font-weight: 700;
    line-height: 1.2em;
}
.step-1 .text-blue-600 {
    color: #000;
    text-align: center;
    leading-trim: both;
    text-edge: cap;
    font-family: 'Satoshi';
    font-size: 12px;
    font-style: normal;
    font-weight: 900;
    line-height: normal;
    letter-spacing: 1px;
}
.step-1 .text-blue-600 a {
   text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
}
button {
  padding: 0.5rem 1rem;
  border: none;
  font-weight: bold;
  cursor: pointer;
  border-radius: 0;
}
button:disabled {
    min-width: 150px;
  text-align: center;
  border: 3px solid black;
      font-family: 'Satoshi';
    padding: 16px;
    text-decoration: none;
    font-weight: 900;
    line-height: 1em;
    border-radius: 0;
    letter-spacing: 2px;
}
.step-1 button {
  width:320px;
  background-color:#F4C400;
}

button:hover {
  opacity: 0.9;
}
.flex.gap-2.justify-center.mb-2 {
    display: flex
;
    gap: 24px;
}
.bg-blue-600 {
    display: inline-block;
    border: 3px solid #000;
    background: #FADF6F;
    color: #000;
    font-family:'Satoshi';
    padding: 16px;
    text-decoration: none;
    font-weight: 900;
    line-height:1em;
    border-radius:0;
    letter-spacing: 2px;
    font-size:14px;
    text-align:center;
    min-width:150px;
        justify-content: center;
}

.bg-green-600 {
  background-color: #16a34a;
}

.bg-gray-300 {
  background-color: #d1d5db;
}

.text-red-600 {
  color: #dc2626;
}

.text-sm {
  font-size: 0.875rem;
}

.text-xl {
color: #000;

text-align: center;
leading-trim: both;
text-edge: cap;
font-family: 'Fraunces';
font-size: 32px;
font-style: normal;
font-weight: 600 !important;
line-height: normal;
}
.gap-4 {
    display: flex;
    justify-content: center;
    gap: 24px;
}

.font-bold {
  font-weight: 700;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mt-4 {
  margin-top: 2rem;
}

.mb-2 {
  margin-bottom: 2rem;
  font-size: 28px;
  font-weight:600;
}
p.mb-2 {
  text-align:center;
}
.mb-4 {
  line-height:1em;
}
h2.text-xl.font-bold.mb-4 {
  margin-bottom:40px;
}
h2 {
  font-family:'Fraunces';
}

.rounded {
  border-radius: 0;
}

.space-y-6 > * + * {
}

.max-w-xl {
  max-width: 950px;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.p-6 {

}

.reg-container {
      width: 506px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
      gap:50px;
}
.reg-container .logo {
  width:118px;
}
.mb-2 {
  margin-bottom:0;
}
.reg-container .mb-2 {
      line-height: 1.4em;
}
.reg-container strong {
color: #000;

text-align: center;
leading-trim: both;

text-edge: cap;
font-family: 'Satoshi';
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: -1px;
}
.step-3 input {
      height: 67px;
    border: 5px solid #000;
    width: 58px;
    text-align: center;
    font-family: 'Satoshi';
    color: #000;
}
.step-3 button.bg-blue-600.text-white.px-4.py-2.rounded {
  background-color:#F4C400;
}
button.bg-gray-300.text-black.px-4.py-2.rounded {
    display: inline-block;
    border: 3px solid #000;
    background: #FADF6F;
    color: #000;
    font-family: 'Satoshi';
    padding: 16px;
    text-decoration: none;
    font-weight: 900;
    line-height: 1em;
    border-radius: 0;
    letter-spacing: 2px;
    font-size: 14px;
    text-align: center;
    min-width:150px;
}
.step-6 button.text-sm.text-gray-600.underline {
  margin-top:12px;
}

.mt-4 {
      display: flex
;
    gap: 19px;
    margin:0;
}
a.underline.text-blue-600 {
  color: #000;

text-align: center;
leading-trim: both;

text-edge: cap;
font-family: 'Satoshi';
font-size: 12px;
font-style: normal;
font-weight: 900;
line-height: normal;
letter-spacing: 1px;
text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-skip-ink: auto;
text-decoration-thickness: auto;
text-underline-offset: auto;
}
.reg-container.step-4 {
  gap:23px;
}
.reg-container.step-4 .mb-2 {
  margin:0;
}
.step-4 button.bg-blue-600.text-white.px-4.py-2.rounded {
  background:#F4C400;
}
p.text-red-600.text-sm.mt-2 {
    text-align: center;
    font-size: 16px;
    font-family: 'Satoshi';
    font-weight: 900;
    margin-top: 20px;
}

.iti--allow-dropdown {
  width:100%;
}
 
button.bg-green-600.text-white.px-4.py-2.rounded {
    display: inline-block;
    border: 3px solid #000;
    background: #FADF6F;
    color: #000;
    font-family:'Satoshi';
    padding: 16px;
    text-decoration: none;
    font-weight: 900;
    line-height:1em;
    border-radius:0;
    letter-spacing: 2px;
    font-size:14px;
    text-align:center;
    min-width:150px;
        justify-content: center;
}
.reg-container.step-5 {
  gap:24px;
}

.step-5 .flex.gap-2.mt-4 {
    margin-top: 20px;
}
.step-5 h2.text-xl.font-bold.mb-2 {
  margin-bottom:20px;
}
.reg-container.step-5 #phone {
    padding-left: 50px !important;
}

.checkbox-container {
      display: flex;
    gap: 12px;
    justify-content: center;
    align-items: center;
}
.checkbox-container input {
    width: 20px;
    height: 20px;
    accent-color: black;
}
.step-5 button.bg-green-600.text-white.px-4.py-2.rounded {
background-color:#F4C400;
}
.step-2 button.bg-green-600.text-white.px-4.py-2.rounded {
  background-color:#F4C400;
}
.iti--allow-dropdown input, .iti--allow-dropdown input[type=tel], .iti--allow-dropdown input[type=text], .iti--separate-dial-code input, .iti--separate-dial-code input[type=tel], .iti--separate-dial-code input[type=text] {
    padding-right: 49px;
}
@media only screen and (max-width: 768px) {
.reg-container {
    padding: 0 32px 0 32px;
    width: 100%;
    gap:30px;
}
.flex.gap-2.justify-center.mb-2 {
  gap:12px;
}
.step-3 input {
    height: 49px;
    border: 4px solid #000;
    width: 40px;
    text-align: center;
    font-family: 'Satoshi';
    color: #000;
    font-size: 18px;
    padding: 0 6px;
}
.reg-container button {
  font-size:12px !important;
}
.reg-container.step-5 {
  gap:15px;
}
.reg-container.step-4 {
  gap:15px;
}
.step-1 .heading-container h2 {
  display: flex;
  flex-direction: column;
}
.step-1 .heading-container {
    gap: 18px;
}
.step-1 .subheading {
  font-size:18px;
}
span.tos {
    font-size: 15px;
    text-align: left;
}
.tos a{
  font-size: 15px !important;
}
}