/* Unicode Icon Fallback - Works without external fonts */
.icon-fallback {
    display: inline-block;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    text-align: center;
    width: 1.25em;
}

/* Unicode equivalents for Font Awesome icons */
.icon-home:before { content: "🏠"; }
.icon-user:before { content: "👤"; }
.icon-cog:before { content: "⚙️"; }
.icon-sync:before { content: "🔄"; }
.icon-download:before { content: "⬇️"; }
.icon-upload:before { content: "⬆️"; }
.icon-users:before { content: "👥"; }
.icon-coins:before { content: "🪙"; }
.icon-play:before { content: "▶️"; }
.icon-trophy:before { content: "🏆"; }
.icon-history:before { content: "📜"; }
.icon-clock:before { content: "⏰"; }
.icon-check:before { content: "✅"; }
.icon-times:before { content: "❌"; }
.icon-redo:before { content: "🔄"; }
.icon-trash:before { content: "🗑️"; }
.icon-play-circle:before { content: "▶️"; }
.icon-money:before { content: "💰"; }
.icon-check-circle:before { content: "✅"; }
.icon-spinner:before { content: "⏳"; }
.icon-gift:before { content: "🎁"; }
.icon-qrcode:before { content: "📱"; }
.icon-chart:before { content: "📊"; }
.icon-sign-out:before { content: "🚪"; }

/* Size variations */
.icon-xs { font-size: 0.75em; }
.icon-sm { font-size: 0.875em; }
.icon-lg { font-size: 1.33333em; }
.icon-xl { font-size: 1.5em; }
.icon-2x { font-size: 2em; }
.icon-3x { font-size: 3em; }

/* Animation */
.icon-spin {
    animation: icon-spin 2s infinite linear;
    display: inline-block;
}
@keyframes icon-spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Color variations */
.icon-blue { color: #3b82f6; }
.icon-green { color: #10b981; }
.icon-red { color: #ef4444; }
.icon-yellow { color: #f59e0b; }
.icon-purple { color: #8b5cf6; }
.icon-white { color: #ffffff; }

/* Button styling */
.btn-icon {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.btn-icon .icon-fallback {
    margin: 0;
}