/*
 * RKR Deadline Offers - animations of the timers
 *
 * The effect is chosen in the back office (General panel or campaign) and applied
 * by views/js/rkrdo-timer.js through the .rkrdo-fx-* classes. The duration comes
 * from the generated --rkrdo-effect-speed variable.
 *
 * @author    Achegatec S.L. (Rekire.com) <info@rekire.com>
 * @copyright 2006-2026 Achegatec S.L.
 * @license   Commercial proprietary license - https://rekire.com/licencia
 */

.rkrdo-fx-pulse { animation: rkrdo-pulse var(--rkrdo-effect-speed, 1.4s) ease-in-out infinite; }
.rkrdo-fx-zoom { animation: rkrdo-zoom var(--rkrdo-effect-speed, 1.4s) ease-in-out infinite; }
.rkrdo-fx-shake { animation: rkrdo-shake var(--rkrdo-effect-speed, 1.4s) ease-in-out infinite; }
.rkrdo-fx-glow { animation: rkrdo-glow var(--rkrdo-effect-speed, 1.4s) ease-in-out infinite; }
.rkrdo-fx-flip { animation: rkrdo-flip var(--rkrdo-effect-speed, 1.4s) ease-in-out infinite; perspective: 600px; }
.rkrdo-fx-bounce { animation: rkrdo-bounce var(--rkrdo-effect-speed, 1.4s) ease-in-out infinite; }
.rkrdo-fx-heartbeat { animation: rkrdo-heartbeat var(--rkrdo-effect-speed, 1.4s) ease-in-out infinite; }
.rkrdo-fx-flash { animation: rkrdo-flash var(--rkrdo-effect-speed, 1.4s) ease-in-out infinite; }
.rkrdo-fx-swing { animation: rkrdo-swing var(--rkrdo-effect-speed, 1.4s) ease-in-out infinite; transform-origin: top center; }
.rkrdo-fx-slide { animation: rkrdo-slide var(--rkrdo-effect-speed, 1.4s) ease-in-out infinite; }
.rkrdo-fx-fade { animation: rkrdo-fade var(--rkrdo-effect-speed, 1.4s) ease-in-out infinite; }
.rkrdo-fx-wobble { animation: rkrdo-wobble var(--rkrdo-effect-speed, 1.4s) ease-in-out infinite; }
.rkrdo-fx-ticker { animation: rkrdo-ticker var(--rkrdo-effect-speed, 1.4s) steps(1, end) infinite; }
.rkrdo-fx-neon { animation: rkrdo-neon var(--rkrdo-effect-speed, 1.4s) ease-in-out infinite; }

/* digits */
.rkrdo-fx-digit .rkrdo-unit__value {
    animation: rkrdo-digit-flip 0.42s cubic-bezier(0.2, 0.9, 0.3, 1.25);
}

.rkrdo-fx-urgent .rkrdo-timer__urgent {
    animation: rkrdo-pulse calc(var(--rkrdo-effect-speed, 1.4s) * 0.6) ease-in-out infinite;
}

.rkrdo-fx-bar .rkrdo-timer__bar {
    transition: width 1s linear;
}

.rkrdo-fx-in {
    animation: rkrdo-in 0.4s ease both;
}

@keyframes rkrdo-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.035); }
}

@keyframes rkrdo-zoom {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.08); opacity: 0.94; }
}

@keyframes rkrdo-shake {
    0%, 100% { transform: translateX(0); }
    15% { transform: translateX(-5px); }
    30% { transform: translateX(5px); }
    45% { transform: translateX(-4px); }
    60% { transform: translateX(4px); }
    75% { transform: translateX(-2px); }
    90% { transform: translateX(2px); }
}

@keyframes rkrdo-glow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(119, 166, 50, 0); }
    50% { box-shadow: 0 0 22px 4px rgba(119, 166, 50, 0.45); }
}

@keyframes rkrdo-flip {
    0%, 100% { transform: rotateX(0deg); }
    50% { transform: rotateX(12deg); }
}

@keyframes rkrdo-bounce {
    0%, 100% { transform: translateY(0); }
    40% { transform: translateY(-7px); }
    60% { transform: translateY(-3px); }
}

@keyframes rkrdo-heartbeat {
    0%, 100% { transform: scale(1); }
    14% { transform: scale(1.07); }
    28% { transform: scale(1); }
    42% { transform: scale(1.07); }
    70% { transform: scale(1); }
}

@keyframes rkrdo-flash {
    0%, 50%, 100% { opacity: 1; }
    25%, 75% { opacity: 0.45; }
}

@keyframes rkrdo-swing {
    0%, 100% { transform: rotate(0deg); }
    20% { transform: rotate(5deg); }
    40% { transform: rotate(-4deg); }
    60% { transform: rotate(2.5deg); }
    80% { transform: rotate(-1.5deg); }
}

@keyframes rkrdo-slide {
    0% { transform: translateX(-14px); opacity: 0; }
    35%, 100% { transform: translateX(0); opacity: 1; }
}

@keyframes rkrdo-fade {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

@keyframes rkrdo-wobble {
    0%, 100% { transform: translateX(0) rotate(0deg); }
    15% { transform: translateX(-6px) rotate(-3deg); }
    30% { transform: translateX(5px) rotate(2.5deg); }
    45% { transform: translateX(-4px) rotate(-2deg); }
    60% { transform: translateX(3px) rotate(1.5deg); }
    75% { transform: translateX(-2px) rotate(-1deg); }
}

@keyframes rkrdo-ticker {
    0%, 49% { transform: translateY(0); }
    50%, 100% { transform: translateY(-2px); }
}

@keyframes rkrdo-neon {
    0%, 100% {
        box-shadow: 0 0 6px rgba(0, 255, 157, 0.5), 0 0 18px rgba(0, 255, 157, 0.28);
        text-shadow: 0 0 6px rgba(0, 255, 157, 0.45);
    }
    50% {
        box-shadow: 0 0 16px rgba(255, 0, 229, 0.55), 0 0 34px rgba(255, 0, 229, 0.3);
        text-shadow: 0 0 12px rgba(255, 0, 229, 0.5);
    }
}

@keyframes rkrdo-digit-flip {
    from {
        opacity: 0.25;
        transform: translateY(-40%) scale(0.94);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes rkrdo-in {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

/* Urgency states */
.rkrdo-timer.is-urgent .rkrdo-unit__value {
    color: #ffffff;
}

.rkrdo-timer.is-urgent .rkrdo-coupon {
    border-color: var(--rkrdo-urgent, #d94f4f);
}

.rkrdo-timer.is-urgent .rkrdo-coupon__code {
    color: var(--rkrdo-urgent, #d94f4f);
}

.rkrdo-timer.is-expired .rkrdo-unit {
    opacity: 0.55;
}

/* Accessibility: no animation when the user asks for reduced motion */
@media (prefers-reduced-motion: reduce) {
    [class*="rkrdo-fx-"] {
        animation: none !important;
    }
}