improve social media icons

css/styles.css

@@ -181,11 +181,23 @@ img {
     background: none;
     border: none;
     font-size: 24px;
-    color: var(--text-color);
     margin-left: 15px;
     cursor: pointer;
 }
 
+.icon-button i {
+    color: var(--text-color);
+}
+
+/* Priorité plus élevée pour les couleurs des réseaux sociaux */
+.icon-button i.icon-facebook,
+.icon-button i.icon-youtube,
+.icon-button i.icon-instagram,
+.icon-button i.icon-tiktok,
+.icon-button i.icon-twitter {
+    color: inherit;
+}
+
 /* Hero Section */
 .hero-mastodon-wrapper {
     display: flex;
@@ -827,13 +839,61 @@ img {
 .more-social-item i {
     margin-right: 10px;
     font-size: 18px;
-    color: var(--primary-red);
     width: 20px;
     text-align: center;
+    color: inherit;
 }
 
 @media (max-width: 1000px) {
     .more-social-dropdown {
         right: -15px;
     }
+}
+
+/* Styles pour les icônes des réseaux sociaux avec leurs couleurs officielles */
+i.icon-facebook, 
+.fab.fa-facebook.icon-facebook {
+    color: #1877F2 !important; /* Bleu Facebook */
+}
+
+i.icon-youtube,
+.fab.fa-youtube.icon-youtube {
+    color: #FF0000 !important; /* Rouge YouTube */
+}
+
+i.icon-instagram,
+.fab.fa-instagram.icon-instagram {
+    /* Imiter le dégradé Instagram avec une couleur principale */
+    color: #E1306C !important; /* Rose/magenta Instagram */
+}
+
+i.icon-tiktok,
+.fab.fa-tiktok.icon-tiktok {
+    color: #000000 !important; /* Noir TikTok */
+}
+
+i.icon-tiktok-accent {
+    color: #EE1D52 !important; /* Rouge TikTok */
+}
+
+i.icon-twitter,
+.fab.fa-twitter.icon-twitter {
+    color: #1DA1F2 !important; /* Bleu Twitter */
+}
+
+/* Maintenir la couleur par défaut pour les icônes dans le footer */
+.footer-social a {
+    margin: 0 10px;
+    font-size: 24px;
+    color: var(--text-color);
+}
+
+/* Ajustements pour le menu déroulant des réseaux sociaux */
+.more-social-item i {
+    margin-right: 10px;
+    font-size: 18px;
+    width: 20px;
+    text-align: center;
+    /* Supprimer la couleur rouge par défaut pour utiliser les classes spécifiques */
+    color: inherit;
 }