/* styles.css */

/* Floating Social Icons Bar */
.social-icons-bar {
    position: fixed;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    z-index: 1000; /* Make sure the bar stays on top of other content */
}

.social-icons-bar .social-icon {
    display: block;
    margin: 10px 0;
    width: 40px;
    height: 40px;
    background-color: #333; /* Default background color */
    color: white;
    text-align: center;
    line-height: 40px;
    font-size: 20px;
    border-radius: 50%;
    transition: background-color 0.3s;
}

.social-icons-bar .social-icon:hover {
    background-color: #555; /* Change background color on hover */
}

/* Specific social media colors */
.social-icons-bar .facebook { background-color: #3b5998; }
.social-icons-bar .twitter { background-color: #55acee; }
.social-icons-bar .linkedin { background-color: #0077b5; }
.social-icons-bar .instagram { background-color: #e4405f; }
.social-icons-bar .youtube { background-color: #cd201f; }
.social-icons-bar .vk { background-color: #4c75a3; }
.social-icons-bar .google-play { background-color: #3ddc84; }
.social-icons-bar .telegram { background-color: #0088cc; }
.social-icons-bar .tinkoff-pulse { background-color: #ffdd2d; }
.social-icons-bar .steam { background-color: #00adee; }
.social-icons-bar .playstation-store { background-color: #003087; }
.social-icons-bar .facebook { background-color: #3b5998; }
.social-icons-bar .x { background-color: #1DA1F2; } /* X (formerly Twitter) */
.social-icons-bar .twitch { background-color: #6441A4; }

/* Hover effects for specific social media colors */
.social-icons-bar .facebook:hover { background-color: #334d84; }
.social-icons-bar .twitter:hover { background-color: #3ea1ec; }
.social-icons-bar .linkedin:hover { background-color: #006499; }
.social-icons-bar .instagram:hover { background-color: #d73354; }
.social-icons-bar .youtube:hover { background-color: #b91d18; }
.social-icons-bar .vk:hover { background-color: #3a5d81; }
.social-icons-bar .google-play:hover { background-color: #34b76c; }
.social-icons-bar .telegram:hover { background-color: #0078b4; }
.social-icons-bar .tinkoff-pulse:hover { background-color: #e6c61c; }
.social-icons-bar .steam:hover { background-color: #0085ba; }
.social-icons-bar .playstation-store:hover { background-color: #002070; }
.social-icons-bar .facebook:hover { background-color: #334d84; }
.social-icons-bar .x:hover { background-color: #0d95e8; } /* X (formerly Twitter) */
.social-icons-bar .twitch:hover { background-color: #4b367c; }