/* css/pagos.css */
input.invalid {
    border-color: var(--color-red-base) !important;
    background-color: #fff0f0;
    transition: border-color 0.3s ease, background-color 0.3s ease;
}

input {
    transition: border-color 0.3s ease, background-color 0.3s ease;
}

@keyframes shake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-4px); }
    40%, 80% { transform: translateX(4px); }
}

.shake {
    animation: shake 0.4s ease-in-out;
}