/**
 * PURPLE ICON STYLING
 * Alle Font Awesome icons krijgen de paarse kleur
 */

/* Global icon color */
.fas, .far, .fab, .fa,
i[class*="fa-"] {
    color: #d678ff !important;
}

/* Feature & UI icons */
.feature-icon,
.feature-icon i,
.window-icon,
.window-icon i,
.stat-icon,
.stat-icon i,
.login-icon,
.login-icon i {
    color: #d678ff !important;
}

/* Navigation icons */
.nav-icon,
.nav-icon i,
.nav-item i {
    color: #d678ff;
}

.nav-item:not(.active) .nav-icon i {
    color: #8b92a8;
    transition: color 0.2s ease;
}

.nav-item:hover .nav-icon i,
.nav-item.active .nav-icon i {
    color: #d678ff;
}

/* Title icons */
.nav-title i,
.logo-icon i,
h1 i, h2 i, h3 i, h4 i {
    color: #d678ff;
}

/* Server stats icons */
.server-stats i {
    color: #d678ff;
}

/* Button icons */
.btn i,
button i {
    color: inherit;
}

/* Specific color overrides - these should keep their colors */
.text-danger i,
.badge-danger i { 
    color: #ef4444 !important; 
}

.text-success i,
.badge-success i { 
    color: #10b981 !important; 
}

.text-warning i,
.badge-warning i { 
    color: #f59e0b !important; 
}

.text-info i { 
    color: #3b82f6 !important; 
}

/* Status circle colors */
.fa-circle.text-danger { 
    color: #ef4444 !important; 
}

.fa-circle.text-success { 
    color: #10b981 !important; 
}

.fa-circle.text-warning { 
    color: #f59e0b !important; 
}

/* Medal colors */
.fa-medal.gold { 
    color: #FFD700 !important; 
}

.fa-medal.silver { 
    color: #C0C0C0 !important; 
}

.fa-medal.bronze { 
    color: #CD7F32 !important; 
}

/* Logout button - keep orange */
.nav-item.logout i {
    color: #ff9800 !important;
}

/* Fire icon in logo */
.logo-icon i {
    color: #d678ff;
    filter: drop-shadow(0 0 20px rgba(214, 120, 255, 0.6));
}

/* Hover effects */
a:hover i,
.clickable:hover i {
    opacity: 0.8;
    transition: opacity 0.2s ease;
}

/* Icon sizing consistency */
.nav-icon {
    width: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.nav-icon i {
    font-size: 1em;
}

/* Animation support */
.fa-spin {
    animation: fa-spin 2s infinite linear;
}

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