/* Custom Icon Fallbacks for Paradigm Minds */
/* This ensures icons work even if Font Awesome fails to load */

.service-icon, .method-icon, .credential-icon {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Fallback icons using CSS and Unicode symbols */
.service-icon i:after,
.method-icon i:after,
.credential-icon i:after {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-style: normal;
    font-weight: normal;
    font-size: 2rem;
    line-height: 1;
}

/* Service Icons Fallbacks */
.fa-lightbulb:after { content: "💡"; }
.fa-sun:after { content: "☀️"; }
.fa-shield-alt:after { content: "🛡️"; }
.fa-user:after { content: "👤"; }
.fa-heart:after { content: "❤️"; }
.fa-users:after { content: "👥"; }

/* Method Icons Fallbacks */
.fa-brain:after { content: "🧠"; }
.fa-yin-yang:after { content: "☯️"; }
.fa-leaf:after { content: "🍃"; }

/* Credential Icons Fallbacks */
.fa-graduation-cap:after { content: "🎓"; }
.fa-certificate:after { content: "📜"; }
.fa-clock:after { content: "⏰"; }

/* Navigation and other icons */
.fa-phone:after { content: "📞"; }
.fa-envelope:after { content: "✉️"; }
.fa-arrow-up:after { content: "⬆️"; }

/* Hide Font Awesome icon if it doesn't load, show fallback */
.service-icon i,
.method-icon i,
.credential-icon i {
    font-size: 0; /* Hide the broken Font Awesome icon */
}

.service-icon i:after,
.method-icon i:after,
.credential-icon i:after {
    font-size: 2rem; /* Show the emoji fallback */
}

/* If Font Awesome loads successfully, hide fallbacks and show FA icons */
.fa-lightbulb:before,
.fa-sun:before,
.fa-shield-alt:before,
.fa-user:before,
.fa-heart:before,
.fa-users:before,
.fa-brain:before,
.fa-yin-yang:before,
.fa-leaf:before,
.fa-graduation-cap:before,
.fa-certificate:before,
.fa-clock:before,
.fa-phone:before,
.fa-envelope:before,
.fa-arrow-up:before {
    font-size: 2rem;
}

/* When FA loads, hide emoji fallbacks */
.fa-lightbulb:not(.fa-failed):after,
.fa-sun:not(.fa-failed):after,
.fa-shield-alt:not(.fa-failed):after,
.fa-user:not(.fa-failed):after,
.fa-heart:not(.fa-failed):after,
.fa-users:not(.fa-failed):after,
.fa-brain:not(.fa-failed):after,
.fa-yin-yang:not(.fa-failed):after,
.fa-leaf:not(.fa-failed):after,
.fa-graduation-cap:not(.fa-failed):after,
.fa-certificate:not(.fa-failed):after,
.fa-clock:not(.fa-failed):after,
.fa-phone:not(.fa-failed):after,
.fa-envelope:not(.fa-failed):after,
.fa-arrow-up:not(.fa-failed):after {
    content: "";
    font-size: 0;
}

/* Navigation phone icon specific styling */
.nav-phone i:after {
    content: "📞";
    font-size: 1rem;
}

.nav-phone .fa-phone:not(.fa-failed):after {
    content: "";
    font-size: 0;
}