@media only screen and (min-width: 1024px) {

/* Estilos generales del social bar */
.social-bar {
position: fixed;
top: 50%;
left: 0;
transform: translateY(-50%);
display: flex;
flex-direction: column;
gap: 0px;
}

.social-icon {
text-decoration: none;
color: white;
padding: 10%;
border-radius: 5px;
background-color: #333;
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
font-size: 20px;
}

/* Colores para cada red social */
.whatsapp { background-color: #47cf73; }
.facebook { background-color: #3b5998; }
.twitter { background-color: #1da1f2; }
.instagram { background-color: #c32aa3; }
.linkedin { background-color: #0077b5; }
.youtube { background-color: red; }
.pinterest { background-color: #f72c33; }
.tiktok { background-color: black; }
.x { background-color: black; }

.wp {
font-size: 0;
}
.ins {
font-size: 0;
}
.fac {
font-size: 0;
}
.you {
font-size: 0;
}
.pin {
font-size: 0;
}
.tik {
font-size: 0;
}
.x {
font-size: 0;
}
svg {
fill: white;
width: 24px;
height: 24px;
}

}

/* Responsive para móvil */
@media (max-width: 768px) {
.social-bar {
background-color: #191C24; 
position: sticky;
display: flex;
flex-direction: row;
justify-content: center;
bottom: 0;
top: unset;
transform: none;
left: unset;
gap: 0;
width: 100%;
}

.social-bar a {
text-align: center;
}

.social-icon {
width: -webkit-fill-available;
height: 20px;
font-size: 20px;
padding: 3%;
}

/* Colores para cada red social */
.whatsapp { background-color: #47cf73; }
.facebook { background-color: #3b5998; }
.twitter { background-color: #1da1f2; }
.instagram { background-color: #c32aa3; }
.linkedin { background-color: #0077b5; }
.youtube { background-color: red; }
.pinterest { background-color: #f72c33; }
.tiktok { background-color: black; }
.x { background-color: black; }

.social-bar.fixed-bottom {
position: static;
background-color: #191C24;
}

.wp {
font-size: 0;
}
.ins {
font-size: 0;
}
.fac {
font-size: 0;
}
.you {
font-size: 0;
}
.pin {
font-size: 0;
}
.tik {
font-size: 0;
}
.x {
font-size: 0;
}
svg {
fill: white;
width: 24px;
height: 24px;
}

}