/* 1. CORE STYLES AND TRANSITIONS */
.fab-trigger,
.fab-trigger .cta-icon,
.fab-trigger .cta-close-icon, /* <-- UPDATED */
.contact-menu,
.fab-pulse-ring,
.overlay-close-area {
    transition: all 250ms ease-out;
}

/* 2. DEFAULT "CLOSED" STATE */
.contact-menu {
    opacity: 0;
    transform: translateY(10px);
    pointer-events: none;
}

.fab-trigger .cta-icon {
    opacity: 1;
    display: block;
}

.fab-trigger .cta-close-icon { /* <-- UPDATED */
    opacity: 0;
    display: none;
}

.fab-pulse-ring {
    animation: pulse 1.7s linear infinite;
    opacity: 1;
}

.overlay-close-area {
    opacity: 0;
    pointer-events: none;
    /* Add this styling to make it cover the screen */
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9990; /* Must be below the menu (9999) */
}

/* 3. ".is-open" STATE (APPLIED BY JAVASCRIPT) */
.floating-contact-wrapper.is-open .contact-menu {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.floating-contact-wrapper.is-open .fab-trigger {
    background-color: #FFFFFF !important;
}

.floating-contact-wrapper.is-open .fab-trigger .cta-icon {
    opacity: 0;
    display: none;
}

.floating-contact-wrapper.is-open .fab-trigger .cta-close-icon { /* <-- UPDATED */
    opacity: 1;
    display: block;
}

.floating-contact-wrapper.is-open .fab-pulse-ring {
    animation: none;
    opacity: 0;
}

.floating-contact-wrapper.is-open .overlay-close-area {
    opacity: 1;
    pointer-events: auto;
}

/* 4. PULSE KEYFRAME ANIMATION */
@keyframes pulse {
    0% { transform: scale(1); opacity: 0.5; }
    100% { transform: scale(1.5); opacity: 0; }
}

/* 5. MOBILE TAP HIGHLIGHT FIX */
.fab-trigger, .channel-link {
    -webkit-tap-highlight-color: transparent;
}