/**
 * Font Awesome Fix CSS
 * Garante que os ícones sejam exibidos corretamente
 * e fornece fallbacks para compatibilidade
 */

/* Ensure Font Awesome icons are displayed correctly */
.fa,
.fas,
.far,
.fal,
.fad,
.fab {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}

/* Compatibility layer for Font Awesome 4 classes */
.fa:before {
    font-weight: 900;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome";
}

/* Brand icons should use brand font */
.fa-facebook:before,
.fa-twitter:before,
.fa-instagram:before,
.fa-vimeo:before,
.fa-behance:before,
.fa-dribbble:before {
    font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands";
    font-weight: 400;
}

/* Fix for common icons that might not display */
.fa-map-marker:before {
    content: "\f3c5";
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome";
    font-weight: 900;
}

.fa-facebook:before {
    content: "\f39e";
}

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

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

.fa-vimeo:before {
    content: "\f27d";
}

.fa-behance:before {
    content: "\f1b4";
}

.fa-dribbble:before {
    content: "\f17d";
}

/* Fallback: if Font Awesome 6 fails, ensure basic styling */
.fa {
    font-size: inherit;
    display: inline-block;
    text-decoration: none;
    min-width: 1em;
    text-align: center;
}

/* Fix for broken icons - hide content that shows as squares */
.fa:before {
    content: attr(data-fallback-content);
}

/* Alternative: Use Unicode symbols as last resort */
.fa-fallback.fa-facebook:before {
    content: "📘";
    font-family: Arial, sans-serif;
}

.fa-fallback.fa-twitter:before {
    content: "🐦";
    font-family: Arial, sans-serif;
}

.fa-fallback.fa-instagram:before {
    content: "📷";
    font-family: Arial, sans-serif;
}

.fa-fallback.fa-map-marker:before {
    content: "📍";
    font-family: Arial, sans-serif;
}

.fa-fallback.fa-vimeo:before {
    content: "🎬";
    font-family: Arial, sans-serif;
}

.fa-fallback.fa-behance:before {
    content: "🎨";
    font-family: Arial, sans-serif;
}

.fa-fallback.fa-dribbble:before {
    content: "🏀";
    font-family: Arial, sans-serif;
}

/* Emergency fallback - if everything else fails */
.fa-emergency-fallback:before {
    content: "•";
    font-family: Arial, sans-serif;
    font-weight: bold;
}

/* Ensure icons have proper spacing */
.fa + * {
    margin-left: 0.25em;
}

* + .fa {
    margin-left: 0.25em;
}

/* Debug mode - shows icon class names when needed */
body.debug-icons .fa:after {
    content: attr(class);
    font-size: 0.7em;
    color: red;
    margin-left: 0.5em;
    font-family: monospace;
}
