/* Make card a positioning container */
.social-card {
    position: relative;
}

/* Floating menu inside card */
.floating-social.inside-card {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 10;
}

/* Toggle button */
.social-toggle {
    width: 45px;
    height: 45px;
    background: #333;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 18px;
}

/* Social buttons */
.social-btn {
    width: 40px;
    height: 40px;
    margin-top: 8px;
    border-radius: 50%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transform: scale(0);
    transition: 0.3s;
}

/* Expand */
.floating-social.active .social-btn {
    transform: scale(1);
}

/* X (Twitter) කළු පැහැය */
.social-btn.x-twitter {
    background-color: #000000;
    color: #ffffff;
}

/* පැරණි Twitter නිල් පැහැය */
.social-btn.twitter {
    background-color: #1DA1F2;
    color: #ffffff;
}

/* Colors */
.facebook { background: #1877F2; }
.linkedin { background: #0077B5; }
.youtube  { background: #FF0000; }
.tiktok   { background: #000; }
.whatsapp { background: #25D366; }