/* =========================================
   SIDEBAR MODULAIRE - INTELLIGENTE
   ========================================= */

.social-sidebar { 
    position: fixed; 
    right: 15px; 
    top: 50%; 
    transform: translateY(-50%); 
    display: flex; 
    flex-direction: column; 
    align-items: center; 
    gap: 20px; 
    z-index: 9999; 
    transition: all 0.3s ease; 
}

.social-icons { display: flex; flex-direction: column; gap: 15px; }

/* --- NOIR PAR DÉFAUT (Sur tout le site) --- */
.social-icons a { 
    color: #0F172A; 
    font-size: 18px; 
    transition: all 0.3s ease; 
    display: flex; justify-content: center; align-items: center; 
    width: 30px; height: 30px; 
    text-decoration: none;
}

.sidebar-line { 
    width: 1px; height: 40px; 
    background-color: #0F172A; 
    opacity: 0.3; 
    transition: 0.3s; 
}

.sidebar-text { 
    writing-mode: vertical-rl; 
    transform: rotate(180deg); 
    font-size: 12px; font-weight: 700; 
    text-transform: uppercase; 
    color: #0F172A; 
    white-space: nowrap; 
    transition: 0.3s; 
}

/* --- BLANC LORSQU'UNE ICÔNE TOUCHE LE FOOTER --- */
.smart-element.light-skin { color: #ffffff !important; }
div.sidebar-line.smart-element.light-skin { background-color: #ffffff !important; opacity: 0.6; }

/* --- LES COULEURS DES RÉSEAUX AU SURVOL --- */
.social-icons a:hover { transform: translateY(-3px) scale(1.1); }
.social-icons a:hover i.fa-youtube { color: #FF0000 !important; }
.social-icons a:hover i.fa-instagram { color: #E1306C !important; }
.social-icons a:hover i.fa-linkedin-in { color: #0077b5 !important; }
.social-icons a:hover i.fa-facebook-f { color: #1877f2 !important; }
.social-icons a:hover i.fa-envelope { color: #C7D629 !important; }

@media (max-width: 768px) {
    .social-sidebar { display: none; }
}