/* Hover animations via body[data-button-anim="…"] or body.button-anim-*
 * Targets: .btn-hover, button.btn-hover, a.btn-hover, .button
 */

body[data-button-anim]:not([data-button-anim="none"]) .btn-hover,
body[data-button-anim]:not([data-button-anim="none"]) button.btn-hover,
body[data-button-anim]:not([data-button-anim="none"]) a.btn-hover,
body[data-button-anim]:not([data-button-anim="none"]) .button,
body[class*="button-anim-"]:not(.button-anim-none) .btn-hover,
body[class*="button-anim-"]:not(.button-anim-none) button.btn-hover,
body[class*="button-anim-"]:not(.button-anim-none) a.btn-hover,
body[class*="button-anim-"]:not(.button-anim-none) .button {
    transition: transform 0.28s ease, background 0.3s ease, color 0.3s ease;
}

body[data-button-anim="lift"] .btn-hover,
body[data-button-anim="lift"] button.btn-hover,
body[data-button-anim="lift"] a.btn-hover,
body[data-button-anim="lift"] .button,
body.button-anim-lift .btn-hover,
body.button-anim-lift button.btn-hover,
body.button-anim-lift a.btn-hover,
body.button-anim-lift .button {
    transition: transform 0.25s ease, background 0.3s ease, color 0.3s ease;
    will-change: transform;
}

body[data-button-anim="lift"] .btn-hover:hover,
body[data-button-anim="lift"] button.btn-hover:hover,
body[data-button-anim="lift"] a.btn-hover:hover,
body[data-button-anim="lift"] .button:hover,
body.button-anim-lift .btn-hover:hover,
body.button-anim-lift button.btn-hover:hover,
body.button-anim-lift a.btn-hover:hover,
body.button-anim-lift .button:hover {
    transform: translateY(-3px);
}

body[data-button-anim="lift"] .btn-hover:active,
body[data-button-anim="lift"] button.btn-hover:active,
body[data-button-anim="lift"] a.btn-hover:active,
body[data-button-anim="lift"] .button:active,
body.button-anim-lift .btn-hover:active,
body.button-anim-lift button.btn-hover:active,
body.button-anim-lift a.btn-hover:active,
body.button-anim-lift .button:active {
    transform: translateY(-1px);
}

/* scale */
body[data-button-anim="scale"] .btn-hover,
body[data-button-anim="scale"] button.btn-hover,
body[data-button-anim="scale"] a.btn-hover,
body[data-button-anim="scale"] .button,
body.button-anim-scale .btn-hover,
body.button-anim-scale button.btn-hover,
body.button-anim-scale a.btn-hover,
body.button-anim-scale .button {
    transition: transform 0.25s ease, background 0.3s ease, color 0.3s ease;
    will-change: transform;
}

body[data-button-anim="scale"] .btn-hover:hover,
body[data-button-anim="scale"] button.btn-hover:hover,
body[data-button-anim="scale"] a.btn-hover:hover,
body[data-button-anim="scale"] .button:hover,
body.button-anim-scale .btn-hover:hover,
body.button-anim-scale button.btn-hover:hover,
body.button-anim-scale a.btn-hover:hover,
body.button-anim-scale .button:hover {
    transform: scale(1.05);
}

body[data-button-anim="scale"] .btn-hover:active,
body[data-button-anim="scale"] button.btn-hover:active,
body[data-button-anim="scale"] a.btn-hover:active,
body[data-button-anim="scale"] .button:active,
body.button-anim-scale .btn-hover:active,
body.button-anim-scale button.btn-hover:active,
body.button-anim-scale a.btn-hover:active,
body.button-anim-scale .button:active {
    transform: scale(0.98);
}

/* pop */
body[data-button-anim="pop"] .btn-hover,
body[data-button-anim="pop"] button.btn-hover,
body[data-button-anim="pop"] a.btn-hover,
body[data-button-anim="pop"] .button,
body.button-anim-pop .btn-hover,
body.button-anim-pop button.btn-hover,
body.button-anim-pop a.btn-hover,
body.button-anim-pop .button {
    transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), background 0.3s ease, color 0.3s ease;
    will-change: transform;
}

body[data-button-anim="pop"] .btn-hover:hover,
body[data-button-anim="pop"] button.btn-hover:hover,
body[data-button-anim="pop"] a.btn-hover:hover,
body[data-button-anim="pop"] .button:hover,
body.button-anim-pop .btn-hover:hover,
body.button-anim-pop button.btn-hover:hover,
body.button-anim-pop a.btn-hover:hover,
body.button-anim-pop .button:hover {
    transform: scale(1.08) translateY(-2px);
}

body[data-button-anim="pop"] .btn-hover:active,
body[data-button-anim="pop"] button.btn-hover:active,
body[data-button-anim="pop"] a.btn-hover:active,
body[data-button-anim="pop"] .button:active,
body.button-anim-pop .btn-hover:active,
body.button-anim-pop button.btn-hover:active,
body.button-anim-pop a.btn-hover:active,
body.button-anim-pop .button:active {
    transform: scale(0.96);
}

/* shine */
@keyframes button-shine {
    to {
        transform: translateX(220%) skewX(-20deg);
    }
}

body[data-button-anim="shine"] .btn-hover,
body[data-button-anim="shine"] button.btn-hover,
body[data-button-anim="shine"] a.btn-hover,
body[data-button-anim="shine"] .button,
body.button-anim-shine .btn-hover,
body.button-anim-shine button.btn-hover,
body.button-anim-shine a.btn-hover,
body.button-anim-shine .button {
    position: relative;
    overflow: hidden;
    transition: background 0.3s ease, color 0.3s ease;
}

body[data-button-anim="shine"] .btn-hover::after,
body[data-button-anim="shine"] button.btn-hover::after,
body[data-button-anim="shine"] a.btn-hover::after,
body[data-button-anim="shine"] .button::after,
body.button-anim-shine .btn-hover::after,
body.button-anim-shine button.btn-hover::after,
body.button-anim-shine a.btn-hover::after,
body.button-anim-shine .button::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 45%;
    height: 100%;
    background: linear-gradient(
        120deg,
        transparent 0%,
        rgba(255, 255, 255, 0.5) 50%,
        transparent 100%
    );
    transform: translateX(-180%) skewX(-20deg);
    pointer-events: none;
}

body[data-button-anim="shine"] .btn-hover:not(:disabled):not(.hero-calc__submit-disabled):hover::after,
body[data-button-anim="shine"] button.btn-hover:not(:disabled):not(.hero-calc__submit-disabled):hover::after,
body[data-button-anim="shine"] a.btn-hover:not(.hero-calc__submit-disabled):hover::after,
body[data-button-anim="shine"] .button:not(:disabled):hover::after,
body.button-anim-shine .btn-hover:not(:disabled):not(.hero-calc__submit-disabled):hover::after,
body.button-anim-shine button.btn-hover:not(:disabled):not(.hero-calc__submit-disabled):hover::after,
body.button-anim-shine a.btn-hover:not(.hero-calc__submit-disabled):hover::after,
body.button-anim-shine .button:not(:disabled):hover::after {
    animation: button-shine 0.65s ease;
}