#fakenumber {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    top: 8px;
    z-index: 9999;
    transition: all 0.3s ease-in-out;
}

#fakenumber .ant-message-notice-wrapper {
    animation: slideDown 0.3s ease-out;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

#confirmdata {
    animation: fadeIn 0.3s ease-out;
}

#confirmdata .ant-modal {
    animation: scaleIn 0.3s ease-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

#errors_phone {
    transition: opacity 0.3s ease-in-out;
}

.disabledCodeBtn___ZPcKH {
    opacity: 0.6;
    cursor: not-allowed !important;
}

.ant-btn-disabled {
    opacity: 0.6;
    cursor: not-allowed !important;
}

.ant-checkbox {
    transition: all 0.3s ease;
}

.btn-loading::after {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    top: 50%;
    left: 50%;
    margin-left: -8px;
    margin-top: -8px;
    border: 2px solid #fff;
    border-radius: 50%;
    border-top-color: transparent;
    animation: spinner 0.6s linear infinite;
}

@keyframes spinner {
    to {
        transform: rotate(360deg);
    }
}

.code-success {
    animation: successPulse 0.5s ease;
}

@keyframes successPulse {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
}

.input-error {
    animation: shake 0.5s ease;
}

@keyframes shake {
    0%, 100% {
        transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        transform: translateX(-5px);
    }
    20%, 40%, 60%, 80% {
        transform: translateX(5px);
    }
}

.countdown-active {
    animation: countdownPulse 1s ease infinite;
}

@keyframes countdownPulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.7;
    }
}

@keyframes modalFadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes modalFadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

@keyframes modalSlideUp {
    from {
        opacity: 0;
        transform: translateY(50px) scale(0.8);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes modalSlideDown {
    from {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
    to {
        opacity: 0;
        transform: translateY(50px) scale(0.8);
    }
}

.modal-mask-enter {
    animation: modalFadeIn 0.3s ease-out !important;
}

.modal-mask-exit {
    animation: modalFadeOut 0.3s ease-out forwards !important;
}

.modal-content-enter {
    animation: modalSlideUp 0.4s cubic-bezier(0.23, 1, 0.32, 1) !important;
}

.modal-content-exit {
    animation: modalSlideDown 0.4s cubic-bezier(0.23, 1, 0.32, 1) forwards !important;
}

.ant-modal.modal-content-enter {
    animation: modalSlideUp 0.4s cubic-bezier(0.23, 1, 0.32, 1) !important;
}

.ant-modal.modal-content-exit {
    animation: modalSlideDown 0.4s cubic-bezier(0.23, 1, 0.32, 1) forwards !important;
}

.ant-modal-mask.modal-mask-enter {
    animation: modalFadeIn 0.3s ease-out !important;
}

.ant-modal-mask.modal-mask-exit {
    animation: modalFadeOut 0.3s ease-out forwards !important;
}