.container.container--wide { max-width: 860px; padding: 1.25rem; margin: 0 auto; }
@media (max-width: 680px){ .container.container--wide { max-width: 100%; padding: 1rem; } }

.card.signup-step1,
.card.signup-step2,
.card.signup-step3,
.card.signup-step4{
  max-width: 780px; width: 100%;
  margin: 0 auto; padding: 1.75rem 2rem;
  box-sizing: border-box; overflow: hidden;
  border-radius: 5px; background: #fff;
}
@media (max-width: 680px){
  .card.signup-step1, .card.signup-step2, .card.signup-step3, .card.signup-step4 { max-width: 100%; padding: 1.25rem; }
}

.step-indicator{ font-size:.9rem; color:#666; margin-bottom:.5rem; }
.step-title{ margin:0 0 .25rem; }
.step-subtitle{ margin:0 0 1rem; color:#666; font-size:.95rem; }
.consent{ margin-top:.9rem; font-size:.75rem; color:#666; line-height:1.45; }
.consent a{ color:var(--primary); text-decoration:underline; }

.form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:1.1rem; row-gap:1.1rem;
  align-items:start;  
}
@media (max-width:680px){ .form-grid{ grid-template-columns:1fr; } }

.input-wrapper{ position:relative; min-width:0; }
.input-wrapper input,
.input-wrapper select,
.input-wrapper textarea{ width:100%; box-sizing:border-box; }

.input-wrapper.with-icon .input-icon{
  position:absolute; top:60%; transform:translateY(-50%);
  font-size:20px; color:#9aa0a6; pointer-events:none;
}
.input-wrapper.with-icon input{ padding-left:30px; }
.input-wrapper.with-icon .floating-label{ left:30px; }

.role-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:.5rem; }
@media (max-width:680px){ .role-grid{ grid-template-columns:1fr; } }
.role-card{
  position:relative; display:flex; gap:.9rem; align-items:center;
  padding:1rem; border:1px solid #e2e2e2; border-radius:5px; background:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.05); cursor:pointer;
  transition:border-color .2s, box-shadow .2s, transform .06s;
}
.role-card:hover{ border-color:var(--primary); box-shadow:0 12px 34px rgba(0,0,0,.07); }
.role-card:active{ transform:translateY(1px); }
.role-card.selected{ border-color:var(--primary); box-shadow:0 12px 34px rgba(254,154,0,.15); }
.role-card .material-icons{ font-size:28px; color:var(--primary); }
.role-radio{ position:absolute; inset:0; opacity:0; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.error-text{ display:none; color:#cc1f1a; font-size:.85rem; margin-top:.5rem; }
.error-text.show{ display:block; }

#phone-field{ position:relative; overflow:visible; }
#phone-field .iti{ width:100%; }
#phone-field .iti__country-list{ max-height:280px; overflow:auto; }

#phone-field .floating-label{ left:10px; }  
#phone-field .iti__flag-container,
#phone-field .iti__selected-country,
#phone-field .iti__selected-country-primary{
  height:55px; display:flex; align-items:center;
}
.iti{
  --iti-path-flags-1x: url('../vendor/intl-tel-input/img/flags.webp');
  --iti-path-flags-2x: url('../vendor/intl-tel-input/img/flags@2x.webp');
  --iti-path-globe-1x: url('../vendor/intl-tel-input/img/globe.webp');
  --iti-path-globe-2x: url('../vendor/intl-tel-input/img/globe@2x.webp');
}
.input-wrapper input[type="tel"] + .floating-label{ left:12px; }
#phone-field input[type="tel"] + .floating-label{ left:10px; }  

#license_plate{ text-transform: uppercase; }

.input-wrapper.select-field{
  position: relative;
  display: block;
  width: 100%;
  border-bottom: 2px solid #e2e2e2;        
  --field-left: 12px;                       
  --arrow-size: 18px;
  --arrow-gap: 8px;
}
.input-wrapper.with-icon.select-field{ --field-left: 44px; }

.input-wrapper.select-field select{
  -webkit-appearance:none; -moz-appearance:none; appearance:none;
  display:block; width:100%;
  height:44px; line-height:1;
  border:none !important; outline:0; box-shadow:none; background:transparent !important;
  padding:18px calc(var(--arrow-size) + var(--arrow-gap)) 6px var(--field-left);   
  color:#222; font:inherit; box-sizing:border-box;
}

.input-wrapper.select-field::after{
  content:"";
  position:absolute; right:0; top:50%;
  width:var(--arrow-size); height:var(--arrow-size); transform:translateY(-50%);
  pointer-events:none;
  background:no-repeat center/contain
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239aa0a6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
}

.input-wrapper.select-field .floating-label{
  position:absolute; left:var(--field-left);
  top:50%; transform:translateY(-50%);
  background:#fff; padding:0 4px; color:#777; pointer-events:none;
  transition:top .15s, transform .15s, font-size .15s, color .15s;
}

.input-wrapper.select-field select:focus + .floating-label,
.input-wrapper.select-field select:valid + .floating-label,
.input-wrapper.select-field.has-value .floating-label{
  top:-8px; transform:none; font-size:12px; color:#666;
}

.input-wrapper.select-field select:invalid:not(:focus){ color:transparent; }
.input-wrapper.select-field select option{ color:#222; background:#fff; }
.input-wrapper.select-field select option[disabled]{ color:#9aa0a6; }

.input-wrapper.select-field:focus-within{ border-bottom-color: var(--primary, #fe9a00); }

.signup-step3 #lookupRow{ margin-bottom:.75rem; }
.signup-step3 #rdwFields{ margin-top:.75rem; row-gap:1.25rem; }

a.submitBtn{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.65rem 1rem; border-radius:5px; text-decoration:none;
  background:var(--primary); color:#fff;
}
a.submitBtn.secondary{ background:#eef2f7; color:#1f2937; }
a.submitBtn .material-icons{ font-size:18px; }

#phone-field .iti{ width:100%; }

#phone-field .floating-label{ left:10px; }             
.input-wrapper input[type="tel"] + .floating-label{ left:12px; }  
.input-group.error .input-wrapper { border-bottom-color: #cc1f1a; }
.error-message { color:#e74c3c; font-size:.75rem; margin-top:.3rem; font-weight: 500;  }

.hint-message{
  margin-top:.35rem;
  font-size:.75rem;
  color:#6b7280;         
  display:none;
}

.input-group.error .floating-label{ color:#b91c1c; }

#phone-field .iti{ width:100%; }
#phone-field input[type="tel"]{
  height:42px; padding-top:20px; padding-bottom:4px; padding-left:88px;  
  text-align:left;
}


.input-wrapper input:focus::placeholder,
.input-wrapper textarea:focus::placeholder {
  color: transparent;             
  opacity: 0;
}

.input-wrapper input:-webkit-autofill + .floating-label {

  opacity: .9;
}
.input-wrapper input:-webkit-autofill::first-line {
  color: inherit;
}

.iti .iti__tel-input:focus::placeholder {
  color: transparent;
  opacity: 0;
}