.fcm-wrapper{
    position:fixed;
    bottom:20px;
    right:25px;
    z-index:99999;
}

.fcm-items{
    display:none; /* ← به جای visibility */
    flex-direction:column;
    gap:10px;
    margin-bottom:12px;

    opacity:0;
    transform:translateY(15px);

    transition: opacity .25s ease, transform .25s ease;
}

.fcm-items.active{
    display:flex; /* ← فعال کردن */
    opacity:1;
    transform:translateY(0);
}

.fcm-item{
    display:flex;
    align-items:center;
    gap:10px;

    min-width:180px;

    padding:12px 16px;

    border-radius:50px;

    background:#ffffff;

    color:#333333;

    text-decoration:none;

    box-shadow:
        0 3px 10px rgba(0,0,0,.12);

    transition:all .2s ease;
}

.fcm-item:hover{
    transform:translateY(-2px);
}

.fcm-icon{
    font-size:18px;
    line-height:1;
}

.fcm-label{
    font-size:14px;
    font-weight:500;
}

.fcm-toggle{
    width:50px;
    height:50px;

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

    border:none;
    border-radius: 50% !important;
    cursor:pointer;
    box-shadow: 0 2px 10px rgba(0,0,0,0.3);
    transition: all 0.3s ease;
    animation: pulse 2s infinite;
}

.fcm-hamburger{
    color:#fff;
    font-size:24px;
    font-weight:700;
    line-height:1;
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
    }
    70% {
        box-shadow: 0 0 0 15px rgba(37, 211, 102, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
    }
}

.fcm-toggle:hover{
    transform:scale(1.05);
}

.fcm-toggle.active{
    transform:rotate(45deg);
}

.fcm-wrapper.left{
    left:25px;
    right:auto;
}

.fcm-wrapper.right{
    right:25px;
    left:auto;
}

@media (max-width:768px){

    .fcm-item{
        min-width:150px;
        padding:10px 14px;
    }

    .fcm-toggle{
        width:40px;
        height:40px;
    }
    
    .fcm-wrapper{
        bottom:65px;
        right:25px;
    }
}