.bwf-whatsapp {
    --bwf-petroleo: var(--siyg-petroleo, var(--color-petroleo, #031C2C));
    --bwf-acento: var(--siyg-accent, var(--siyg-acento, var(--color-accent, var(--color-acento, var(--wp--preset--color--accent, #B38C75)))));
    --bwf-blanco: #ffffff;
    position: fixed;
    left: 24px;
    bottom: 24px;
    z-index: 9999;
    width: 54px;
    height: 54px;
    border-radius: 999px;
    background: var(--bwf-petroleo) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 0;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(33, 47, 54, .12);
    text-decoration: none;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: scale(.7);
    transition: transform .2s ease, filter .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.bwf-whatsapp.bwf-whatsapp--visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: scale(1);
    animation:
        bwf-whatsapp-entrada .85s cubic-bezier(.2, .7, .2, 1) both,
        bwf-whatsapp-brillo 30s ease-in-out 1.4s infinite;
}

.bwf-whatsapp::before {
    content: "";
    position: absolute;
    inset: -5px;
    border-radius: 999px;
    border: 2px solid rgba(179, 140, 117, .48);
    opacity: 0;
    transform: scale(.86);
    pointer-events: none;
}

.bwf-whatsapp.bwf-whatsapp--visible::before {
    animation:
        bwf-whatsapp-onda-entrada .85s ease-out both,
        bwf-whatsapp-onda 30s ease-in-out 1.4s infinite;
}

.bwf-whatsapp:hover,
.bwf-whatsapp:focus,
.bwf-whatsapp:focus-visible {
    background: var(--bwf-acento) !important;
    transform: translateY(-2px) scale(1.04);
    filter: none;
    box-shadow: 0 12px 30px rgba(33, 47, 54, .18);
    outline: none;
}

.bwf-whatsapp svg {
    position: relative;
    width: 30px;
    height: 30px;
    display: block;
    fill: var(--bwf-blanco) !important;
    color: var(--bwf-blanco) !important;
}

.bwf-whatsapp svg path {
    fill: var(--bwf-blanco) !important;
}

@keyframes bwf-whatsapp-entrada {
    0% {
        opacity: 0;
        transform: scale(.7) rotate(0deg);
        box-shadow: 0 0 0 0 rgba(33, 47, 54, 0);
    }

    18% {
        opacity: 1;
        transform: scale(1.12) rotate(-8deg);
    }

    34% {
        transform: scale(1.06) rotate(8deg);
    }

    50% {
        transform: scale(1.08) rotate(-6deg);
    }

    66% {
        transform: scale(1.03) rotate(4deg);
        box-shadow: 0 0 0 8px rgba(179, 140, 117, .10), 0 14px 34px rgba(33, 47, 54, .24);
    }

    82% {
        transform: scale(1.02) rotate(-2deg);
    }

    100% {
        opacity: 1;
        transform: scale(1) rotate(0deg);
        box-shadow: 0 8px 24px rgba(33, 47, 54, .12);
    }
}

@keyframes bwf-whatsapp-onda-entrada {
    0% {
        opacity: 0;
        transform: scale(.8);
    }

    45% {
        opacity: .65;
        transform: scale(1.16);
    }

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

@keyframes bwf-whatsapp-brillo {
    0%, 89%, 100% {
        transform: scale(1);
        box-shadow: 0 8px 24px rgba(33, 47, 54, .12);
        filter: brightness(1);
    }

    92% {
        transform: scale(1.08);
        box-shadow: 0 0 0 7px rgba(179, 140, 117, .14), 0 14px 34px rgba(33, 47, 54, .24);
        filter: brightness(1.08);
    }

    94% {
        transform: scale(1);
        box-shadow: 0 8px 24px rgba(33, 47, 54, .12);
        filter: brightness(1);
    }

    96% {
        transform: scale(1.06);
        box-shadow: 0 0 0 6px rgba(179, 140, 117, .12), 0 14px 34px rgba(33, 47, 54, .22);
        filter: brightness(1.06);
    }

    98% {
        transform: scale(1);
        box-shadow: 0 8px 24px rgba(33, 47, 54, .12);
        filter: brightness(1);
    }
}

@keyframes bwf-whatsapp-onda {
    0%, 89%, 100% {
        opacity: 0;
        transform: scale(.86);
    }

    92% {
        opacity: .55;
        transform: scale(1.16);
    }

    96% {
        opacity: .28;
        transform: scale(1.24);
    }

    98% {
        opacity: 0;
        transform: scale(1.3);
    }
}

@media (max-width: 768px) {
    .bwf-whatsapp {
        left: 16px;
        bottom: 14px;
        width: 52px;
        height: 52px;
    }

    .bwf-whatsapp svg {
        width: 29px;
        height: 29px;
    }
}

@media (max-width: 380px) {
    .bwf-whatsapp {
        bottom: 10px;
        left: 14px;
        width: 50px;
        height: 50px;
    }

    .bwf-whatsapp svg {
        width: 28px;
        height: 28px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .bwf-whatsapp.bwf-whatsapp--visible,
    .bwf-whatsapp.bwf-whatsapp--visible::before {
        animation: none;
    }

    .bwf-whatsapp.bwf-whatsapp--visible {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: scale(1);
    }
}
