/* Font Awesome Fix for Production Issues */

/* Ensure Font Awesome fonts load properly */
@font-face {
  font-family: 'Font Awesome 6 Free';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/webfonts/fa-solid-900.woff2') format('woff2'),
       url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/webfonts/fa-solid-900.woff') format('woff');
}

@font-face {
  font-family: 'Font Awesome 6 Brands';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/webfonts/fa-brands-400.woff2') format('woff2'),
       url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/webfonts/fa-brands-400.woff') format('woff');
}

/* Force Font Awesome classes to use correct fonts */
.fa, .fas, .far, .fal, .fad, .fab, .fat {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
}

.fas, .fa-solid {
  font-family: 'Font Awesome 6 Free' !important;
  font-weight: 900 !important;
}

.fab, .fa-brands {
  font-family: 'Font Awesome 6 Brands' !important;
  font-weight: 400 !important;
}

/* Specific icon fixes with Unicode fallbacks */
.fa-facebook-f:before {
  content: "\f39e";
}

.fa-twitter:before {
  content: "\f099";
}

.fa-linkedin-in:before {
  content: "\f0e1";
}

.fa-instagram:before {
  content: "\f16d";
}

.fa-whatsapp:before {
  content: "\f232";
}

.fa-home:before {
  content: "\f015";
}

.fa-envelope:before {
  content: "\f0e0";
}

.fa-phone:before {
  content: "\f095";
}

.fa-bolt:before {
  content: "\f0e7";
}

.fa-rocket:before {
  content: "\f135";
}

/* Social icon specific fixes */
.social-icon i,
.floating-btn i {
  font-family: 'Font Awesome 6 Brands', 'Font Awesome 6 Free' !important;
  font-weight: 900 !important;
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: auto !important;
  height: auto !important;
  line-height: inherit !important;
}

/* Fallback for when Font Awesome completely fails */
.fa-fallback {
  font-family: Arial, sans-serif !important;
  font-weight: bold !important;
  font-size: 0.9em !important;
}

/* Brand icon fallbacks using Unicode symbols */
.fa-facebook-f.fa-fallback:before { content: "f" !important; }
.fa-twitter.fa-fallback:before { content: "𝕏" !important; }
.fa-linkedin-in.fa-fallback:before { content: "in" !important; }
.fa-instagram.fa-fallback:before { content: "📷" !important; }
.fa-whatsapp.fa-fallback:before { content: "💬" !important; }

/* Regular icon fallbacks */
.fa-home.fa-fallback:before { content: "🏠" !important; }
.fa-envelope.fa-fallback:before { content: "✉️" !important; }
.fa-phone.fa-fallback:before { content: "📞" !important; }
.fa-bolt.fa-fallback:before { content: "⚡" !important; }
.fa-rocket.fa-fallback:before { content: "🚀" !important; }

/* Ensure icons are visible in all contexts */
.social-link i,
.nav-link i,
.footer-heading i,
.contact-icon i,
.logo-icon i {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Animation to indicate loading */
@keyframes iconPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

.icon-loading {
  animation: iconPulse 1s infinite;
}