/**
 * Shois Chat Button — Hover Animations
 *
 * 10 hover effect keyframes for mouse hover / touch start.
 * Applied via CSS classes toggled by JS on hover.
 *
 * @package ShoisChatButton
 */

/* ─── Grow ──────────────────────────────────────────── */
.shcb-hover-grow:hover {
    transform: scale(1.1);
    transition: transform 200ms ease;
}

/* ─── Shrink ────────────────────────────────────────── */
.shcb-hover-shrink:hover {
    transform: scale(0.92);
    transition: transform 150ms ease;
}

/* ─── Glow ──────────────────────────────────────────── */
.shcb-hover-glow:hover {
    box-shadow: 0 0 16px rgba(var(--scb-primary-rgb, 37, 211, 102), 0.6),
        0 0 32px rgba(var(--scb-primary-rgb, 37, 211, 102), 0.3);
    transition: box-shadow 200ms ease;
}

/* ─── Rotate Clockwise ──────────────────────────────── */
.shcb-hover-rotatecw:hover {
    transform: rotate(15deg);
    transition: transform 200ms ease;
}

/* ─── Rotate Counter-Clockwise ──────────────────────── */
.shcb-hover-rotateccw:hover {
    transform: rotate(-15deg);
    transition: transform 200ms ease;
}

/* ─── Wobble ────────────────────────────────────────── */
@keyframes scb-hover-wobble-kf {
    0% {
        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);
    }

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

.shcb-hover-wobble:hover {
    animation: scb-hover-wobble-kf 500ms ease-in-out;
}

/* ─── Lift ──────────────────────────────────────────── */
.shcb-hover-lift:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.2);
    transition: transform 200ms ease, box-shadow 200ms ease;
}

/* ─── Color Shift ───────────────────────────────────── */
.shcb-hover-color:hover {
    filter: brightness(1.15);
    transition: filter 200ms ease;
}

/* ─── Ripple Click ──────────────────────────────────── */
@keyframes scb-hover-ripple-kf {
    0% {
        transform: scale(0);
        opacity: 0.5;
    }

    100% {
        transform: scale(2.5);
        opacity: 0;
    }
}

.shcb-hover-ripple {
    position: relative;
    overflow: hidden;
}

.shcb-hover-ripple .shcb-ripple-effect {
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.4);
    pointer-events: none;
    animation: scb-hover-ripple-kf 600ms ease-out forwards;
}

/* ─── Icon Spin ─────────────────────────────────────── */
@keyframes scb-hover-iconspin-kf {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.shcb-hover-iconspin:hover .shcb-trigger-icon {
    animation: scb-hover-iconspin-kf 400ms ease-in-out;
}