@import '@alfalab/core-components-vars/src/index.css';

.enter {
    opacity: 0;
    width: 0;
    height: 0;
    margin: var(--gap-0);
}

.enterActive {
    opacity: 1;
    width: 12px;
    height: 12px;
    margin: var(--gap-0) var(--gap-6);
    transition: all 0.15s ease-in;
}

.exit {
    opacity: 1;
    width: 12px;
    height: 12px;
    margin: var(--gap-0) var(--gap-6);
}

.exitActive {
    opacity: 0;
    width: 0;
    height: 0;
    margin: var(--gap-0);
    transition: all 0.15s ease-in;
}

@keyframes shake {
    0% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(-2px);
    }

    75% {
        transform: translateX(2px);
    }

    100% {
        transform: translateX(0);
    }
}

.shake {
    animation: shake 0.15s linear 25ms 3;
}