/**
 * Footer Social Icons Fix
 * Fixes Facebook icon alignment and improves overall social media layout
 */

/* ===== FOOTER SOCIAL ICONS FIXES ===== */

/* General social icons improvements - ULTRA AGGRESSIVE */
.footer-social .social,
.social-connect-icon,
#footer_newsletter_block .social-connect-icon,
.footer-social,
.social {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    margin-bottom: 18px !important;
    padding: 0 !important;
    list-style: none !important;
}

.footer-social .social li,
.social-connect-icon li,
#footer_newsletter_block .social-connect-icon li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* ULTRA SPECIFIC TARGETING FOR SOCIAL LINKS */
.footer-social .social a,
.social-connect-icon a,
#footer_newsletter_block .social-connect-icon a,
.footer-social a,
.social a,
a[href*="facebook.com"],
a[href*="instagram.com"],
a[href*="twitter.com"],
a[href*="x.com"],
a[href*="youtube.com"],
a[href*="linkedin.com"],
a[href*="whatsapp"],
a[href*="wa.me"] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    border: 1px solid #ededed !important;
    border-radius: 50% !important;
    color: #a7a7a7 !important;
    font-size: 18px !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

/* Remove any conflicting inline styles */
.footer-social .social a[style],
.social-connect-icon a[style],
#footer_newsletter_block .social-connect-icon a[style] {
    width: 36px !important;
    height: 36px !important;
    line-height: 1 !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Facebook icon specific fixes */
.footer-social .social a[href*="facebook"],
.social-connect-icon a[href*="facebook"] {
    background: #3b5998 !important;
    border-color: #3b5998 !important;
    color: #fff !important;
}

.footer-social .social a[href*="facebook"]:hover,
.social-connect-icon a[href*="facebook"]:hover {
    background: #2d4373 !important;
    border-color: #2d4373 !important;
    color: #fff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 8px rgba(59, 89, 152, 0.3) !important;
}

/* Instagram icon */
.footer-social .social a[href*="instagram"],
.social-connect-icon a[href*="instagram"] {
    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%) !important;
    border-color: #e6683c !important;
    color: #fff !important;
}

.footer-social .social a[href*="instagram"]:hover,
.social-connect-icon a[href*="instagram"]:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 8px rgba(230, 104, 60, 0.3) !important;
}

/* Twitter/X icon */
.footer-social .social a[href*="twitter"],
.footer-social .social a[href*="x.com"],
.social-connect-icon a[href*="twitter"],
.social-connect-icon a[href*="x.com"] {
    background: #1da1f2 !important;
    border-color: #1da1f2 !important;
    color: #fff !important;
}

.footer-social .social a[href*="twitter"]:hover,
.footer-social .social a[href*="x.com"]:hover,
.social-connect-icon a[href*="twitter"]:hover,
.social-connect-icon a[href*="x.com"]:hover {
    background: #0d8bd9 !important;
    border-color: #0d8bd9 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 8px rgba(29, 161, 242, 0.3) !important;
}

/* YouTube icon */
.footer-social .social a[href*="youtube"],
.social-connect-icon a[href*="youtube"] {
    background: #ff0000 !important;
    border-color: #ff0000 !important;
    color: #fff !important;
}

.footer-social .social a[href*="youtube"]:hover,
.social-connect-icon a[href*="youtube"]:hover {
    background: #cc0000 !important;
    border-color: #cc0000 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 8px rgba(255, 0, 0, 0.3) !important;
}

/* LinkedIn icon */
.footer-social .social a[href*="linkedin"],
.social-connect-icon a[href*="linkedin"] {
    background: #0077b5 !important;
    border-color: #0077b5 !important;
    color: #fff !important;
}

.footer-social .social a[href*="linkedin"]:hover,
.social-connect-icon a[href*="linkedin"]:hover {
    background: #005885 !important;
    border-color: #005885 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 8px rgba(0, 119, 181, 0.3) !important;
}

/* WhatsApp icon */
.footer-social .social a[href*="whatsapp"],
.footer-social .social a[href*="wa.me"],
.social-connect-icon a[href*="whatsapp"],
.social-connect-icon a[href*="wa.me"] {
    background: #25d366 !important;
    border-color: #25d366 !important;
    color: #fff !important;
}

.footer-social .social a[href*="whatsapp"]:hover,
.footer-social .social a[href*="wa.me"]:hover,
.social-connect-icon a[href*="whatsapp"]:hover,
.social-connect-icon a[href*="wa.me"]:hover {
    background: #1ebe57 !important;
    border-color: #1ebe57 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 8px rgba(37, 211, 102, 0.3) !important;
}

/* Generic social icon hover (fallback) */
.footer-social .social a:hover,
.social-connect-icon a:hover {
    border-color: #D4AF37 !important;
    background: #D4AF37 !important;
    color: #fff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 8px rgba(212, 175, 55, 0.3) !important;
}

/* Icon font fixes */
.footer-social .social a i,
.social-connect-icon a i {
    font-size: 16px !important;
    line-height: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
}

/* Font Awesome specific fixes */
.footer-social .social a i.fa,
.social-connect-icon a i.fa {
    font-family: "FontAwesome" !important;
}

.footer-social .social a i.fab,
.social-connect-icon a i.fab {
    font-family: "Font Awesome 5 Brands" !important;
}

/* Ensure proper spacing in footer */
.footer-social {
    margin-bottom: 20px !important;
}

.footer-social h4,
.footer-social .footer-block h4 {
    margin-bottom: 15px !important;
    color: #222 !important;
    font-size: 18px !important;
    font-weight: 600 !important;
}

/* Mobile responsiveness for social icons */
@media (max-width: 767px) {
    .footer-social .social {
        justify-content: center !important;
        gap: 12px !important;
        margin-bottom: 20px !important;
    }
    
    .footer-social .social a,
    .social-connect-icon a {
        width: 40px !important;
        height: 40px !important;
        font-size: 20px !important;
    }
    
    .footer-social .social a i,
    .social-connect-icon a i {
        font-size: 18px !important;
    }
}

@media (max-width: 480px) {
    .footer-social .social {
        gap: 8px !important;
    }
    
    .footer-social .social a,
    .social-connect-icon a {
        width: 36px !important;
        height: 36px !important;
        font-size: 16px !important;
    }
    
    .footer-social .social a i,
    .social-connect-icon a i {
        font-size: 14px !important;
    }
}

/* Fix for newsletter social icons */
#footer_newsletter_block .social-connect-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin-top: 15px !important;
}

#footer_newsletter_block .social-connect-icon a {
    margin: 0 !important;
    border: 1px solid #4d4d4d !important;
}

#footer_newsletter_block .social-connect-icon a i::before {
    color: inherit !important;
    font-size: inherit !important;
}

/* Override any conflicting styles */
.social a[style],
.social-connect-icon a[style] {
    width: 36px !important;
    height: 36px !important;
    line-height: 36px !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}