/* dichanho paso por aquí */

.footer-social-icons {
    width: 100%;
    display: block;
    margin: 0 auto;
    text-align: center;
}

.social-icons {
    padding: 0;
}

.social-icons li {
    display: inline-block;
    margin: 5px;
    /* Ajusta el margen entre los íconos si es necesario */
    vertical-align: top; /* Alinea los elementos en la parte superior */
}

.social-icons a {
    color: #fff;
    text-decoration: none;
    padding: 10px;
    -o-transition: .5s;
    -ms-transition: .5s;
    -moz-transition: .5s;
    -webkit-transition: .5s;
    transition: .5s;
    background-color: #322f30;
    display: inline-block;
    width: 25px;
    /* Ajusta el ancho fijo para todos los íconos en dispositivos móviles */
    height: 25px;
    /* Ajusta la altura fija para todos los íconos en dispositivos móviles */
    line-height: 25px;
    /* Centra verticalmente el texto (por si acaso) */
    text-align: center;
    /* Centra horizontalmente el texto (por si acaso) */
    box-sizing: content-box;
    /* Ajusta el modelo de caja para incluir el padding */
    position: relative;
    /* Añadido para posicionar correctamente el contenido absoluto */
}

.social-icons a:hover {
    background-color: #69c9d0;
}

.fa {
    font-size: 18px;
    /* Ajusta el tamaño de los íconos según tus necesidades */
}

/*.fa-kick::before {
  content: 'K';
}*/

/* Resto del código para los estilos de los íconos específicos */

.fa-tiktok,
.fa-threads,
.fa-twitch,
.fa-kick,
.fa-facebook,
.fa-twitter,
.fa-youtube,
.fa-instagram {
    display: inline-block;
    position: absolute;
    /* Añadido para superponer el icono sobre el cuadrado */
    top: 50%;
    /* Centra verticalmente el icono */
    left: 50%;
    /* Centra horizontalmente el icono */
    transform: translate(-50%, -50%);
    /* Centra perfectamente el icono */
}

.fa-tiktok:hover,
.fa-threads:hover,
.fa-twitch:hover,
.fa-kick:hover,
.fa-facebook:hover,
.fa-twitter:hover,
.fa-youtube:hover,
.fa-instagram:hover {
    background-color: #69c9d0;
}

.fa-facebook:hover {
    background-color: #3d5b99;
}

.fa-twitter:hover {
    background-color: #00aced;
}

.fa-youtube:hover {
    background-color: #e64a41;
}

.fa-instagram:hover {
    background-color: #bc2a8d;
}