/* Icon Fallback CSS - Custom icons when Font Awesome fails */

/* Define icon font fallback */
.icon-fallback {
    display: inline-block;
    width: 1em;
    height: 1em;
    text-align: center;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: 1;
}

/* Fallback icons using Unicode symbols */
.fas.fa-phone::before,
.fa-phone::before {
    content: "📞";
}

.fas.fa-envelope::before,
.fa-envelope::before {
    content: "✉️";
}

.fas.fa-map-marker-alt::before,
.fa-map-marker-alt::before {
    content: "📍";
}

.fas.fa-home::before,
.fa-home::before {
    content: "🏠";
}

.fas.fa-calendar::before,
.fa-calendar::before {
    content: "📅";
}

.fas.fa-clock::before,
.fa-clock::before {
    content: "🕐";
}

.fas.fa-user::before,
.fa-user::before {
    content: "👤";
}

.fas.fa-users::before,
.fa-users::before {
    content: "👥";
}

.fas.fa-heart::before,
.fa-heart::before {
    content: "❤️";
}

.fas.fa-star::before,
.fa-star::before {
    content: "⭐";
}

.fas.fa-lotus::before,
.fa-lotus::before,
.fas.fa-leaf::before,
.fa-leaf::before {
    content: "🍃";
}

.fas.fa-om::before,
.fa-om::before {
    content: "🕉️";
}

.fas.fa-meditation::before,
.fa-meditation::before {
    content: "🧘";
}

.fas.fa-hands::before,
.fa-hands::before {
    content: "🙏";
}

.fas.fa-spa::before,
.fa-spa::before {
    content: "💆";
}

.fab.fa-facebook::before,
.fa-facebook::before {
    content: "📘";
}

.fab.fa-instagram::before,
.fa-instagram::before {
    content: "📷";
}

.fab.fa-twitter::before,
.fa-twitter::before {
    content: "🐦";
}

.fab.fa-youtube::before,
.fa-youtube::before {
    content: "📺";
}

.fas.fa-bars::before,
.fa-bars::before {
    content: "☰";
}

.fas.fa-times::before,
.fa-times::before {
    content: "✕";
}

.fas.fa-arrow-up::before,
.fa-arrow-up::before {
    content: "⬆️";
}

.fas.fa-arrow-down::before,
.fa-arrow-down::before {
    content: "⬇️";
}

.fas.fa-arrow-left::before,
.fa-arrow-left::before {
    content: "⬅️";
}

.fas.fa-arrow-right::before,
.fa-arrow-right::before {
    content: "➡️";
}

.fas.fa-check::before,
.fa-check::before {
    content: "✓";
}

.fas.fa-plus::before,
.fa-plus::before {
    content: "+";
}

.fas.fa-minus::before,
.fa-minus::before {
    content: "−";
}

.fas.fa-search::before,
.fa-search::before {
    content: "🔍";
}

.fas.fa-quote-left::before,
.fa-quote-left::before {
    content: """;
}

.fas.fa-quote-right::before,
.fa-quote-right::before {
    content: """;
}

.fas.fa-money-bill::before,
.fa-money-bill::before,
.fas.fa-dollar-sign::before,
.fa-dollar-sign::before {
    content: "💰";
}

.fas.fa-gift::before,
.fa-gift::before {
    content: "🎁";
}

.fas.fa-award::before,
.fa-award::before {
    content: "🏆";
}

.fas.fa-certificate::before,
.fa-certificate::before {
    content: "🏅";
}

.fas.fa-graduation-cap::before,
.fa-graduation-cap::before {
    content: "🎓";
}

.fas.fa-book::before,
.fa-book::before {
    content: "📚";
}

.fas.fa-blog::before,
.fa-blog::before {
    content: "📝";
}

.fas.fa-comment::before,
.fa-comment::before {
    content: "💬";
}

.fas.fa-share::before,
.fa-share::before {
    content: "📤";
}

.fas.fa-link::before,
.fa-link::before {
    content: "🔗";
}

.fas.fa-info::before,
.fa-info::before {
    content: "ℹ️";
}

.fas.fa-exclamation::before,
.fa-exclamation::before {
    content: "❗";
}

.fas.fa-question::before,
.fa-question::before {
    content: "❓";
}

.fas.fa-shield-alt::before,
.fa-shield-alt::before {
    content: "🛡️";
}

.fas.fa-lock::before,
.fa-lock::before {
    content: "🔒";
}

.fas.fa-eye::before,
.fa-eye::before {
    content: "👁️";
}

.fas.fa-refresh::before,
.fa-refresh::before {
    content: "🔄";
}

.fas.fa-spinner::before,
.fa-spinner::before {
    content: "⏳";
}

.fas.fa-download::before,
.fa-download::before {
    content: "⬇️";
}

.fas.fa-upload::before,
.fa-upload::before {
    content: "⬆️";
}

.fas.fa-print::before,
.fa-print::before {
    content: "🖨️";
}

.fas.fa-save::before,
.fa-save::before {
    content: "💾";
}

.fas.fa-edit::before,
.fa-edit::before {
    content: "✏️";
}

.fas.fa-trash::before,
.fa-trash::before {
    content: "🗑️";
}

.fas.fa-cog::before,
.fa-cog::before {
    content: "⚙️";
}

/* Ensure icons are properly sized */
.fas, .fab, .far, .fal, .fad, .fass, .fasr, .fasl, .fast {
    font-family: 'Font Awesome 6 Free', 'Font Awesome 6 Brands', 'Font Awesome 6 Pro', 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', sans-serif !important;
    font-weight: 900;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    display: inline-block;
    font-size: inherit;
}

.fab {
    font-weight: 400;
}

/* Make sure icons are visible */
i[class*="fa-"]:before {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Spinner animation for loading icons */
.fa-spin {
    animation: fa-spin 2s infinite linear;
}

@keyframes fa-spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* Pulse animation */
.fa-pulse {
    animation: fa-pulse 2s infinite;
}

@keyframes fa-pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

/* Icon sizing utilities */
.fa-xs { font-size: 0.75em; }
.fa-sm { font-size: 0.875em; }
.fa-lg { font-size: 1.33333em; line-height: 0.75em; vertical-align: -0.0667em; }
.fa-xl { font-size: 1.5em; line-height: 0.66667em; vertical-align: -0.075em; }
.fa-2x { font-size: 2em; }
.fa-3x { font-size: 3em; }
.fa-4x { font-size: 4em; }
.fa-5x { font-size: 5em; }

/* Fix for boxes showing instead of icons */
[class*="fa-"]::before {
    font-family: 'Font Awesome 6 Free', 'Font Awesome 6 Brands', 'Apple Color Emoji', 'Segoe UI Emoji', sans-serif !important;
}

/* Fallback for when Font Awesome completely fails */
.no-fontawesome .fas::before,
.no-fontawesome .fab::before,
.no-fontawesome .far::before {
    font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', sans-serif !important;
}

/* Auto-detect Font Awesome failure and apply fallback */
@supports not (font-family: 'Font Awesome 6 Free') {
    .fas::before, .fab::before, .far::before {
        font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', sans-serif !important;
    }
}

/* Force emoji fallback if boxes are showing */
.fa-fallback .fas::before,
.fa-fallback .fab::before,
.fa-fallback .far::before,
.no-fontawesome .fas::before,
.no-fontawesome .fab::before,
.no-fontawesome .far::before {
    font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', sans-serif !important;
    font-size: 1em;
}

/* Immediate fallback - if Font Awesome CSS fails to load */
@media screen {
    i[class*="fa-"] {
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}
