/* ============================================
   Fenix Desk - Local SVG Icon System
   Replaces Font Awesome with local sprite icons
   ============================================ */

.icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    vertical-align: -0.125em;
    fill: currentColor;
    flex-shrink: 0;
}

.icon-lg { width: 1.33em; height: 1.33em; }
.icon-2x { width: 2em; height: 2em; }
.icon-3x { width: 3em; height: 3em; }

@keyframes icon-spin {
    to {
        transform: rotate(360deg);
    }
}

.icon-spin {
    animation: icon-spin 0.8s linear infinite;
}

/* Preserve layout/behavior from previous <i class="fa-..."> icons */
.nav-item .icon {
    font-size: 18px;
    width: 20px;
    height: 20px;
    transition: all 0.3s ease;
}

.nav-item:hover .icon {
    transform: translateX(2px);
}

.nav-item.active .icon {
    color: var(--fenix-gold);
    text-shadow: 0 0 12px rgba(245, 166, 35, 0.5);
}

.search-container .icon {
    color: var(--gray-400);
    margin-right: 12px;
}

.social-button .icon {
    font-size: 18px;
    width: 18px;
    height: 18px;
}