.email-code-field {
  grid-column: 1 / -1;
  width: 100%;
  max-width: 520px;
  margin: 8px auto 0;
  text-align: center;
}

.email-code {
  height: 72px;
  text-align: center;
  text-transform: uppercase;
  font-size: 30px;
  font-weight: 800;
  letter-spacing: 7px;
  border: 2px solid #6e4b82;
  background: linear-gradient(145deg, #15111c, #0d0c12);
  box-shadow: inset 0 0 24px rgba(164, 59, 230, .08);
}

.email-code:focus {
  outline: 0;
  border-color: #c65eff;
  box-shadow: 0 0 0 4px rgba(163, 59, 230, .2), inset 0 0 24px rgba(239, 113, 44, .08);
}

.email-code::placeholder {
  color: #777080;
  opacity: .75;
}

.code-sending {
  display: flex;
  align-items: center;
  gap: 14px;
  max-width: 520px;
  margin: 28px auto;
  padding: 18px 20px;
  border: 1px solid #624274;
  border-radius: 13px;
  background: linear-gradient(145deg, #18131f, #100e16);
}
.code-sending i { width: 25px; height: 25px; flex: 0 0 25px; border: 3px solid #4b4054; border-top-color: #c65eff; border-right-color: #ef712c; border-radius: 50%; animation: code-spin .8s linear infinite; }
.code-sending strong { color: #fff; font-size: 16px; }
.code-sending span { margin-left: auto; color: #aaa2b5; font-size: 13px; }
@keyframes code-spin { to { transform: rotate(360deg); } }

@media (max-width: 650px) {
  .email-code { height: 64px; font-size: 25px; letter-spacing: 5px; }
}

/* Mantém Cliente/Provedor compactos e impede a altura global dos inputs no rádio. */
.types .type {
  display: flex;
  align-items: center;
  min-height: 58px;
  padding: 10px 14px;
}

.types .type input[type="radio"] {
  display: inline-block;
  width: auto;
  height: auto;
  margin: 0 10px 0 0;
}