body { font-family: 'Inter', sans-serif; background-color: #f8fafc; }

/* Transitions */
.sidebar-transition { transition: width 0.3s ease-in-out, transform 0.3s ease-in-out; }
.content-transition { transition: margin-left 0.3s ease-in-out; }

/* Animations */
.animate-fade-in-up { animation: fadeInUp 0.2s ease-out; }
.animate-fade-in { animation: fadeIn 0.3s ease-out; }

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

/* Modal Pop Animation */
@keyframes modalPop {
    0% { opacity: 0; transform: scale(0.95); }
    100% { opacity: 1; transform: scale(1); }
}
.animate-modal-pop {
    animation: modalPop 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* Scrollbar */
.custom-scroll::-webkit-scrollbar { width: 0; }

/* Sidebar Collapsed */
.sidebar-collapsed .text-label, 
.sidebar-collapsed .logo-text, 
.sidebar-collapsed .social-expanded { display: none !important; }

.sidebar-collapsed .logo-icon, 
.sidebar-collapsed .social-collapsed { display: flex !important; }
.sidebar-collapsed .logo-icon { margin: 0 auto; }

.sidebar-collapsed nav a { justify-content: center !important; padding-left: 0 !important; padding-right: 0 !important; }
.sidebar-collapsed nav a .icon-trigger { margin: 0 !important; }
.sidebar-collapsed nav { overflow: visible !important; }

/* Sidebar Expanded */
.sidebar-expanded .text-label, 
.sidebar-expanded .logo-text, 
.sidebar-expanded .social-expanded { display: flex !important; animation: fadeIn 0.3s; }

.sidebar-expanded .logo-icon, 
.sidebar-expanded .social-collapsed, 
.sidebar-expanded .custom-tooltip { display: none !important; }

/* Form Errors */
.input-error { border-color: #ef4444 !important; background-color: #fef2f2 !important; }
.error-text { display: none; color: #ef4444; font-size: 0.75rem; margin-top: 4px; font-weight: bold; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* Badge */
.badge-count { 
    display: flex; align-items: center; justify-content: center; 
    background-color: #6366f1; color: white; 
    font-size: 0.7rem; font-weight: bold; 
    padding: 0 6px; height: 18px; border-radius: 9px; 
    margin-left: auto; transition: all 0.3s; 
    box-shadow: 0 2px 4px rgba(99, 102, 241, 0.3); 
}
.sidebar-collapsed .badge-count { 
    position: absolute; top: 8px; right: 8px; margin: 0; 
    min-width: 16px; height: 16px; font-size: 0.6rem; 
    padding: 0 4px; z-index: 10; border: 2px solid white; 
}