/* Modern Icon System - Global Styles */
/* Replace FontAwesome with clean SVG icons */

.modern-icon {
    color: #4f46e5;
    stroke-width: 2;
    transition: all 0.2s ease;
    vertical-align: middle;
    margin-right: 0.5rem;
}

.modern-icon-sm {
    color: currentColor;
    stroke-width: 2;
    width: 16px;
    height: 16px;
    vertical-align: middle;
}

.modern-icon-xs {
    color: currentColor;
    stroke-width: 2;
    width: 12px;
    height: 12px;
    vertical-align: middle;
    margin-left: 4px;
}

/* Navigation icons */
.nav-link .modern-icon {
    color: #6b7280;
}

.nav-link.active .modern-icon,
.nav-link:hover .modern-icon {
    color: #4f46e5;
}

/* Button icons */
.btn .modern-icon,
.btn .modern-icon-sm {
    color: currentColor;
    margin-right: 0.5rem;
}

/* Card header icons */
.card-header .modern-icon {
    color: currentColor;
    margin-right: 0.5rem;
}

/* Alert icons */
.alert .modern-icon {
    color: currentColor;
    margin-right: 0.5rem;
    flex-shrink: 0;
}

/* Status icons */
.text-success .modern-icon {
    color: #059669;
}

.text-danger .modern-icon {
    color: #dc2626;
}

.text-warning .modern-icon {
    color: #d97706;
}

.text-info .modern-icon {
    color: #0891b2;
}

/* Hover effects */
.modern-icon:hover,
.btn:hover .modern-icon,
a:hover .modern-icon {
    transform: translateY(-1px);
}

/* Animation for external link icons */
.modern-icon-xs {
    transition: transform 0.2s ease;
}

a:hover .modern-icon-xs {
    transform: translateX(2px);
}

/* Clean up FontAwesome conflicts */
.no-fa .fas,
.no-fa .far,
.no-fa .fab {
    display: none !important;
}

/* Responsive icon sizes */
@media (max-width: 768px) {
    .modern-icon {
        width: 18px;
        height: 18px;
    }
    
    .modern-icon-sm {
        width: 14px;
        height: 14px;
    }
}