/* 1: کانتینر اصلی */
.social-contact-container {
    position: fixed;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
}

/* 2: موقعیت‌ها */
.position-bottom-right { bottom: 20px; right: 20px; }
.position-bottom-left { bottom: 20px; left: 20px; }
.position-middle-right { top: 50%; right: 20px; transform: translateY(-50%); }
.position-middle-left { top: 50%; left: 20px; transform: translateY(-50%); }

/* 3: دکمه شناور پشتیبانی */
.plus-icon {
    width: 60px;
    height: 60px;
    background: url('assets/icons/support.svg') no-repeat center center;
    background-size: contain;
    border-radius: 50%;
    position: relative;
    animation: heartbeat 1.5s infinite;
    cursor: pointer;
    flex-shrink: 0;
}

/* 4: انیمیشن ضربان */
@keyframes heartbeat {
    0% { transform: scale(1); }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); }
}

/* 5: دایره سبز گوشه دکمه */
.plus-icon::after {
    content: '';
    width: 10px;
    height: 10px;
    background-color: #4CAF50;
    border-radius: 50%;
    position: absolute;
    bottom: -5px;
    right: -5px;
    border: 2px solid white;
    animation: pulse 1.5s infinite;
}

/* 6: انیمیشن دایره سبز */
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

/* 7: منوی پشتیبانی */
.social-menu {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 8px !important;
    background: white;
    padding: 10px;
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    position: absolute;
    bottom: 90px;
    right: 10px;
    opacity: 0;
    transform: scale(0.8);
    transition: opacity 0.3s ease, transform 0.3s ease;
    visibility: hidden;
    z-index: 10000;
    max-height: 320px;         /* ارتفاع مناسب */
    overflow-y: auto;          /* اسکرول عمودی */
    overflow-x: hidden;        /* حذف اسکرول افقی */
}

/* 8: حالت باز منو */
.social-menu.open {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
}

/* 9: آیکون‌های تکی */
.social-contact-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: white;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    cursor: pointer;
    transition: transform 0.2s ease-in-out;
    flex-shrink: 0;
}

/* 10: تصویر داخل آیکون */
.social-contact-icon img {
    width: 22px;
    height: 22px;
    display: block;
}

/* 11: افکت هاور */
.social-contact-icon:hover {
    transform: scale(1.1);
}

/* 12: استایل اسکرول زیبا */
.social-menu::-webkit-scrollbar {
    width: 6px;
}
.social-menu::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 3px;
}
.social-menu::-webkit-scrollbar-track {
    background: transparent;
}

/* 13: نسخه موبایل */
@media (max-width: 480px) {
    .social-menu {
        right: 5px;
        padding: 8px;
        border-radius: 8px;
        max-height: 240px;
    }

    .social-contact-icon {
        width: 36px;
        height: 36px;
    }

    .social-contact-icon img {
        width: 20px;
        height: 20px;
    }
}