.ffp-like-image-host{
    position:relative!important;
    overflow:visible!important;
}

/* The whole widget is anchored to the WooCommerce product-image block. */
.ffp-lure-like-widget{
    position:absolute!important;
    inset:0!important;
    z-index:8;
    pointer-events:none;
    font:600 12px/1.1 inherit;
}

/* The Fang/Like button never moves when tooltip position changes. */
.ffp-lure-like-button{
    position:absolute!important;
    right:8px!important;
    bottom:8px!important;
    width:46px;
    min-height:50px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:3px 3px 4px!important;
    margin:0!important;
    border:0!important;
    border-radius:9px!important;
    background:rgba(255,255,255,.90)!important;
    box-shadow:0 1px 6px rgba(0,0,0,.20)!important;
    cursor:pointer;
    backdrop-filter:blur(3px);
    pointer-events:auto;
}

.ffp-lure-like-button img{
    display:block!important;
    width:34px!important;
    height:34px!important;
    object-fit:contain!important;
    margin:0!important;
    padding:0!important;
}

.ffp-lure-like-label{
    display:block;
    margin-top:-1px;
    color:#111;
    font-family:inherit;
    font-size:9px;
    font-weight:700;
    line-height:1;
    pointer-events:none;
}

.ffp-lure-like-button:hover img{
    transform:scale(1.08);
}

.ffp-lure-like-button.ffp-liked{
    cursor:default;
}

.ffp-lure-like-button.ffp-liked img{
    filter:drop-shadow(0 0 3px rgba(103,55,150,.75));
}

/* Shared tooltip styling */
.ffp-lure-like-tooltip{
    position:absolute!important;
    min-width:max-content;
    padding:7px 10px;
    border-radius:6px;
    background:rgba(17,17,17,.94);
    color:#fff;
    font-size:12px;
    font-weight:600;
    line-height:1.2;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    white-space:nowrap;
    box-shadow:0 2px 8px rgba(0,0,0,.22);
    transition:opacity .16s ease,transform .16s ease,visibility .16s ease;
    z-index:9;
}

.ffp-lure-like-widget.ffp-show-tooltip .ffp-lure-like-tooltip{
    opacity:1;
    visibility:visible;
}

/* RIGHT: message originates at the image's right edge. */
.ffp-tooltip-right .ffp-lure-like-tooltip{
    right:12px!important;
    top:50%!important;
    left:auto!important;
    bottom:auto!important;
    transform:translate(10px,-50%)!important;
}
.ffp-tooltip-right.ffp-show-tooltip .ffp-lure-like-tooltip{
    transform:translate(0,-50%)!important;
}

/* LEFT: message originates at the image's left edge. */
.ffp-tooltip-left .ffp-lure-like-tooltip{
    left:12px!important;
    top:50%!important;
    right:auto!important;
    bottom:auto!important;
    transform:translate(-10px,-50%)!important;
}
.ffp-tooltip-left.ffp-show-tooltip .ffp-lure-like-tooltip{
    transform:translate(0,-50%)!important;
}

/* TOP: message drops down from the top-center of the image. */
.ffp-tooltip-top .ffp-lure-like-tooltip{
    left:50%!important;
    top:12px!important;
    right:auto!important;
    bottom:auto!important;
    transform:translate(-50%,-10px)!important;
}
.ffp-tooltip-top.ffp-show-tooltip .ffp-lure-like-tooltip{
    transform:translate(-50%,0)!important;
}

.ffp-lure-like-widget.ffp-loading .ffp-lure-like-tooltip{
    display:none!important;
}

.ffp-lure-like-widget.ffp-loading{
    opacity:.55;
}

.ffp-lure-like-widget.ffp-saving{
    opacity:.7;
}

.ffp-lure-like-widget.ffp-pop{
    animation:ffp-like-pop .25s ease-out;
}

@keyframes ffp-like-pop{
    0%{transform:scale(1)}
    45%{transform:scale(1.08)}
    100%{transform:scale(1)}
}

@media(max-width:600px){
    .ffp-lure-like-button{
        right:6px!important;
        bottom:6px!important;
        width:48px;
        min-height:52px;
    }

    .ffp-lure-like-button img{
        width:35px!important;
        height:35px!important;
    }

    .ffp-tooltip-right .ffp-lure-like-tooltip{
        right:8px!important;
    }

    .ffp-tooltip-left .ffp-lure-like-tooltip{
        left:8px!important;
    }

    .ffp-tooltip-top .ffp-lure-like-tooltip{
        top:8px!important;
    }
}
