@keyframes checkmark {
    0% {
        stroke-dashoffset: 100;
    }
    100% {
        stroke-dashoffset: 0;
    }
}
.checkmark-circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    animation: checkmark 0.6s ease-in-out forwards;
}
.checkmark-check {
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: checkmark 0.3s 0.4s ease-in-out forwards;
}

@keyframes error-pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.8;
    }
}
.error-icon {
    animation: error-pulse 2s ease-in-out infinite;
}
@keyframes draw-x {
    0% {
        stroke-dashoffset: 60;
    }
    100% {
        stroke-dashoffset: 0;
    }
}
.error-circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    animation: draw-x 0.6s ease-in-out forwards;
}
.error-x-left {
    stroke-dasharray: 30;
    stroke-dashoffset: 30;
    animation: draw-x 0.3s 0.4s ease-in-out forwards;
}
.error-x-right {
    stroke-dasharray: 30;
    stroke-dashoffset: 30;
    animation: draw-x 0.3s 0.5s ease-in-out forwards;
}




@keyframes fade-in {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
.fade-in {
    animation: fade-in 0.6s ease-out;
}
@keyframes clock-rotate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
.clock-icon {
    animation: clock-rotate 2s linear 1;
}




@keyframes fade-in {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
.fade-in {
    animation: fade-in 0.6s ease-out;
}
@keyframes search-bounce {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-5px);
    }
}
.search-icon {
    animation: search-bounce 2s ease-in-out infinite;
}