/**
 * ICON VISIBILITY FIX
 * Ensures all Font Awesome icons are perfectly visible and styled
 * Fixes icon sizing, visibility, and appearance across all browsers
 */

/* ====== FONT AWESOME ICON FIXES ====== */
/* Ensure all Font Awesome icons are visible */
.fas,
.far,
.fab,
.fal,
.fa-solid,
.fa-regular,
.fa-brands,
.fa-light {
    display: inline-block !important; font-style: normal !important; font-variant: normal !important; text-rendering: auto !important; line-height: 1 !important; visibility: visible !important; opacity: 1 !important; font-size: inherit !important; width: auto !important; height: auto !important; color: inherit !important; }

/* Fix icon sizing in navigation */
.navbar .fas,
.navbar .far,
.navbar .fab,
.navbar i {
    vertical-align: middle !important; }

/* Fix icon sizing in buttons */
.btn i,
button i,
.menu-btn i,
.theme-toggle i {
    margin: 0 !important; padding: 0 !important; }

/* Fix icon sizing in sidebar */
.sidebar i,
.sidebar .fas,
.sidebar .far,
.sidebar .fab {
    margin-right: 12px !important; text-align: center !important; flex-shrink: 0 !important; }

/* Ensure social media icons are always visible */
.social-links .fab,
.profile-social .fab,
.contact-social .fab {
    font-family: "Font Awesome 6 Brands" !important; font-weight: 400 !important; }

/* Ensure icons don't break layout */
i[class*="fa-"] {
    -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important; }

/* Fix icon alignment in flex containers */
.flex i,
.d-flex i {
    align-self: center !important; }