.email-verification-field {
  min-width: 0;
  margin-bottom: 18px;
}
.email-verification-field > label { margin-bottom: 8px; }
.email-verify-button {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(11,111,62,.18);
  border-radius: 11px;
  padding: 10px 14px;
  background: linear-gradient(135deg, rgba(238,231,64,.18), rgba(215,211,0,.28));
  color: #0b5733;
  font-weight: 800;
  font-size: 12px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 8px 18px rgba(16,63,38,.06);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.email-verify-button:hover {
  transform: translateY(-1px);
  background: linear-gradient(135deg, rgba(238,231,64,.28), rgba(215,211,0,.38));
  box-shadow: 0 10px 22px rgba(16,63,38,.10);
}
.email-verify-button:disabled { opacity: .62; cursor: wait; transform: none; }
.email-verify-button.secondary {
  margin-top: 9px;
  background: linear-gradient(135deg, #0a7742, #139657);
  color: #fff;
  border-color: rgba(8,95,53,.34);
}
.email-verification-status {
  min-height: 18px;
  margin-top: 7px;
  font-size: 11px;
  line-height: 1.45;
  color: #65756b;
}
.email-verification-status.success {
  color: #0b6f3e;
  font-weight: 800;
}
.email-verification-status.error {
  color: #9f2d28;
  font-weight: 700;
}
.email-code-panel {
  margin-top: 10px;
  padding: 13px;
  border: 1px solid rgba(11,111,62,.14);
  border-radius: 13px;
  background: rgba(255,255,255,.64);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.62);
}
.email-code-panel label { margin-bottom: 0; }
.email-code-panel input {
  text-align: center;
  letter-spacing: .26em;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.email-code-panel small {
  display: block;
  margin-top: 9px;
  text-align: center;
  font-size: 10px;
  line-height: 1.45;
  color: #718078;
}
.email-verification-field.is-verified #emailInput {
  border-color: rgba(11,111,62,.48);
  background: rgba(238,248,239,.95);
  box-shadow: 0 0 0 3px rgba(18,139,80,.08);
}
.email-verification-field.is-verified .email-verify-button:not(.secondary) {
  background: rgba(11,111,62,.09);
  color: #0b6f3e;
}
@media (max-width: 620px) {
  .email-verification-field { margin-bottom: 14px; }
  .email-code-panel input { letter-spacing: .18em; }
}

@media (min-width: 621px) {
  select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 44px;
    background: rgba(255,255,255,.90) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23173123' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 16px center / 12px 8px;
  }
  select:focus {
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23173123' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 16px center / 12px 8px;
  }
}

.success-dialog .eyebrow {
  color: #139657;
}

.success-icon {
  background: linear-gradient(135deg, #0a7742 0%, #139657 56%, #1ead66 100%);
  color: #fff;
  box-shadow: 0 8px 18px rgba(16,93,53,.20), inset 0 1px 0 rgba(255,255,255,.18);
}
