.hidden {
    display: none !important;
}

.nav-btn {
    color: #4b5563;
    border-bottom: 2px solid transparent;
    transition: all 0.3s ease;
}

.dark .nav-btn {
    color: #cbd5e1;
}

.nav-btn.active {
    color: #2563eb;
    border-bottom: 2px solid #2563eb;
}

.dark .nav-btn.active {
    color: #60a5fa;
    border-bottom: 2px solid #60a5fa;
}

.nav-btn:hover:not(.active) {
    color: #3b82f6; 
}

.filter-btn.active-filter {
    background-color: #111827;
    color: white;
    border-color: #111827;
}

.dark .filter-btn.active-filter {
    background-color: #3b82f6;
    border-color: #3b82f6;
    color: white;
}

.fade-in {
    animation: fadeIn 0.4s ease-in-out;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}