/* Original verification-dialog geometry, scoped to the owned Laravel login handoff. */
.agent-otp-overlay {
    position: fixed;
    inset: 0;
    z-index: 3000;
    background: rgba(0, 0, 0, .5);
    overflow: auto;
}
.agent-otp-dialog {
    width: 420px;
    max-width: calc(100vw - 24px);
    margin: 15vh auto 50px;
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
}
.agent-otp-dialog .verification-dialog { padding: 10px 0; }
.agent-otp-dialog .title {
    width: 100%;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    position: relative;
    top: -15px;
    color: #6c64de;
}
.agent-otp-dialog .verification-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}
.agent-otp-dialog .input-container {
    display: flex;
    gap: 12px;
    position: relative;
    justify-content: center;
}
.agent-otp-dialog .digit-input {
    width: 48px;
    height: 56px;
    border: 2px solid #dcdfe6;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 600;
    background: #fff;
    color: #303133;
    box-sizing: border-box;
}
.agent-otp-dialog .digit-input.active,
.agent-otp-dialog .digit-input.filled { border-color: #409eff; }
.agent-otp-dialog .digit-input.active { box-shadow: 0 0 0 2px rgba(64, 158, 255, .2); }
.agent-otp-dialog .digit-input.error { border-color: #f56c6c; background: #fef0f0; color: #f56c6c; }
.agent-otp-dialog .hidden-input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: text;
}
.agent-otp-dialog .error-message { color: #e84b3e; font-size: 14px; text-align: center; }
.agent-otp-dialog .error-message:empty { display: none; }
.agent-otp-dialog .action-buttons { display: flex; justify-content: center; }
@media (max-width: 480px) {
    .agent-otp-dialog .input-container { gap: 8px; }
    .agent-otp-dialog .digit-input { width: 40px; height: 48px; font-size: 18px; }
}
