/*
 * Premium Class Properties
 * Floating WhatsApp Button
 * Version 1.0.0
 */

.pcp-whatsapp-float {
    position: fixed;

    right: 22px;
    bottom: 22px;

    z-index: 99990;

    width: 60px;
    height: 60px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 2px solid rgba(255, 255, 255, 0.95);
    border-radius: 50%;

    background: #25d366;
    color: #ffffff !important;

    text-decoration: none !important;

    box-shadow:
        0 5px 18px rgba(0, 0, 0, 0.26),
        0 1px 4px rgba(0, 0, 0, 0.18);

    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease,
        background-color 0.18s ease;
}

.pcp-whatsapp-float:hover,
.pcp-whatsapp-float:focus {
    color: #ffffff !important;
    background: #20bd5a;

    transform: translateY(-2px) scale(1.04);

    box-shadow:
        0 8px 24px rgba(0, 0, 0, 0.30),
        0 2px 6px rgba(0, 0, 0, 0.20);

    outline: none;
}

.pcp-whatsapp-float:focus-visible {
    outline: 3px solid rgba(203, 178, 106, 0.95);
    outline-offset: 3px;
}

.pcp-whatsapp-icon {
    width: 34px;
    height: 34px;

    display: flex;
    align-items: center;
    justify-content: center;

    line-height: 0;
}

.pcp-whatsapp-icon svg {
    display: block;

    width: 34px;
    height: 34px;

    fill: currentColor;
}


/* Tablet */

@media (max-width: 1024px) {

    .pcp-whatsapp-float {
        right: 18px;
        bottom: 18px;

        width: 58px;
        height: 58px;
    }

}


/* Mobile */

@media (max-width: 767px) {

    .pcp-whatsapp-float {
        right: 16px;
        bottom: 16px;

        width: 56px;
        height: 56px;
    }

    .pcp-whatsapp-icon,
    .pcp-whatsapp-icon svg {
        width: 31px;
        height: 31px;
    }

}


/* iPhone / device safe areas */

@supports (bottom: env(safe-area-inset-bottom)) {

    @media (max-width: 767px) {

        .pcp-whatsapp-float {
            right: calc(16px + env(safe-area-inset-right));
            bottom: calc(16px + env(safe-area-inset-bottom));
        }

    }

}


/* Respect reduced-motion preference */

@media (prefers-reduced-motion: reduce) {

    .pcp-whatsapp-float {
        transition: none;
    }

    .pcp-whatsapp-float:hover,
    .pcp-whatsapp-float:focus {
        transform: none;
    }

}