/**
 * Email Verification Field Styles
 */

.mse-email-verify {
    position: relative;
}

/* Input + button row */
.mse-ev-input-wrap {
    display: flex;
    gap: 8px;
    align-items: stretch;
}

.mse-ev-input-wrap input {
    flex: 1;
    min-width: 0;
}

.mse-ev-input-wrap .gform_button {
    white-space: nowrap;
    flex-shrink: 0;
}

/* Code input — fixed width for 6 digits */
.mse-ev-code-input {
    max-width: 180px !important;
    text-align: center;
    letter-spacing: 4px;
    font-size: 1.1em;
    font-variant-numeric: tabular-nums;
}

/* Sent-to label */
.mse-ev-sent-to {
    font-size: 0.9em;
    color: #666;
    margin-bottom: 8px;
}

/* Code actions (resend / change email) */
.mse-ev-code-actions {
    margin-top: 8px;
    font-size: 0.85em;
}

.mse-ev-code-actions .gform_button_link {
    background: none;
    border: none;
    color: #2271b1;
    cursor: pointer;
    padding: 0;
    font-size: inherit;
    text-decoration: underline;
}

.mse-ev-code-actions .gform_button_link:hover {
    color: #135e96;
}

.mse-ev-separator {
    margin: 0 6px;
    color: #999;
}

/* Messages */
.mse-ev-message {
    margin-top: 6px;
    font-size: 0.9em;
    min-height: 1.2em;
}

.mse-ev-message:empty {
    display: none;
}

.mse-ev-message.mse-ev-error {
    color: #b32d2e;
}

.mse-ev-message.mse-ev-success {
    color: #00a32a;
}

/* Verified state */
.mse-ev-verified-display {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 4px;
}

.mse-ev-check {
    color: #16a34a;
    font-size: 1.3em;
    font-weight: bold;
    line-height: 1;
}

.mse-ev-verified-email {
    flex: 1;
    font-weight: 500;
}

.mse-ev-verified-display .mse-ev-change-btn {
    background: none;
    border: none;
    color: #2271b1;
    cursor: pointer;
    font-size: 0.85em;
    text-decoration: underline;
    padding: 0;
}

/* Form editor preview */
.mse-email-verify-preview {
    padding: 12px;
    background: #f6f7f7;
    border: 1px dashed #c3c4c7;
    border-radius: 4px;
    color: #646970;
    text-align: center;
}
