/* ----- Favorite icon animations ----- */
.fav-pop-on {               /* přidáno do oblíbených */
    animation: fav-pop-on 300ms ease-out;
}
@keyframes fav-pop-on {
    0%   { transform: scale(1); }
    50%  { transform: scale(1.28); }
    100% { transform: scale(1); }
}

.fav-pop-off {              /* odebráno z oblíbených */
    animation: fav-pop-off 320ms ease-in-out;
}
@keyframes fav-pop-off {
    0%   { transform: scale(1); }
    40%  { transform: scale(0.86); }
    100% { transform: scale(1); }
}

.fav-shake {
    animation: fav-shake 400ms ease;
}
@keyframes fav-shake {
    10%, 90% { transform: translateX(-1px); }
    20%, 80% { transform: translateX(2px); }
    30%, 50%, 70% { transform: translateX(-4px); }
    40%, 60% { transform: translateX(4px); }
}

.slow-bounce {
    animation: slow-bounce 2s ease;
}
@keyframes slow-bounce {
    70% { transform:translateY(0%); }
    80% { transform:translateY(-15%); }
    90% { transform:translateY(0%); }
    95% { transform:translateY(-7%); }
    97% { transform:translateY(0%); }
    99% { transform:translateY(-3%); }
    100% { transform:translateY(0); }
}

.bounce {
    animation: bounce 2s ease;
}
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
    40% {transform: translateY(-10px);}
    60% {transform: translateY(-5px);}
}

.fast-shake {
    animation: fast-shake 2s ease;
}
.fast-shake-infinite {
    animation: fast-shake 5s infinite ease;
}

@keyframes fast-shake {
    30% { transform: scale(1.2); }
    40%, 60% { transform: rotate(-20deg) scale(1.2); }
    50% { transform: rotate(20deg) scale(1.2); }
    70% { transform: rotate(0deg) scale(1.2); }
    100% { transform: scale(1); }
}

.pulse-mint {
    animation: pulseMint 4s ease-in-out infinite;
}

.pulse-red {
    animation: pulseRed 4s ease-in-out infinite;
}

.pulse-orange {
    animation: pulseOrange 4s ease-in-out infinite;
}

@keyframes pulseMint {
    0% {
        color: #ffffff;
    }
    50% {
        color: #4BE1AB;
    }
    100% {
        color: #ffffff;
    }
}

@keyframes pulseRed {
    0% {
        color: #ffffff;
    }
    50% {
        color: #dc3545;
    }
    100% {
        color: #ffffff;
    }
}

@keyframes pulseOrange {
    0% {
        color: #ffffff;
    }
    50% {
        color: #fd7e14;
    }
    100% {
        color: #ffffff;
    }
}

@keyframes spin {
    /* Usage: loader */
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}