/* NetGesCon - Sidebar Expandable Menu Styles */
.sidebar-menu {
    @apply space-y-1;
}

.menu-item {
    @apply flex items-center gap-3 px-4 py-2 rounded-lg text-gray-700 dark:text-gray-200 hover:bg-indigo-100 dark:hover:bg-gray-700 hover:text-indigo-700 dark:hover:text-yellow-300 transition-all duration-200 group;
}

.menu-item.active {
    @apply bg-indigo-500 text-white dark:bg-yellow-600 dark:text-gray-900;
}

.menu-item.active .menu-icon {
    @apply text-white dark:text-gray-900;
}

.menu-item:hover .menu-icon {
    @apply text-indigo-700 dark:text-yellow-300;
}

.menu-icon {
    @apply text-lg transition-colors duration-200;
}

.menu-label {
    @apply font-medium;
}

.menu-toggle-icon {
    @apply ml-auto transform transition-transform duration-200;
}

.menu-toggle-icon.expanded {
    @apply rotate-180;
}

.submenu {
    @apply pl-4 space-y-1 overflow-hidden transition-all duration-300 ease-in-out;
}

.submenu.collapsed {
    @apply max-h-0 opacity-0;
}

.submenu.expanded {
    @apply max-h-96 opacity-100;
}

.submenu-item {
    @apply flex items-center gap-3 px-4 py-2 rounded-lg text-gray-600 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-600 hover:text-gray-900 dark:hover:text-gray-100 transition-all duration-200 relative;
}

.submenu-item::before {
    @apply absolute left-2 top-1/2 transform -translate-y-1/2 w-2 h-2 rounded-full bg-gray-400 dark:bg-gray-500 transition-colors duration-200;
    content: '';
}

.submenu-item:hover::before {
    @apply bg-indigo-500 dark:bg-yellow-500;
}

.submenu-item.active {
    @apply bg-indigo-100 dark:bg-gray-600 text-indigo-700 dark:text-yellow-300;
}

.submenu-item.active::before {
    @apply bg-indigo-500 dark:bg-yellow-500;
}

.submenu-label {
    @apply text-sm font-medium;
}

/* Animazioni di slide e fade */
@keyframes slideDown {
    from {
        max-height: 0;
        opacity: 0;
    }
    to {
        max-height: 500px;
        opacity: 1;
    }
}

@keyframes slideUp {
    from {
        max-height: 500px;
        opacity: 1;
    }
    to {
        max-height: 0;
        opacity: 0;
    }
}

.submenu.expanding {
    animation: slideDown 0.3s ease-out forwards;
}

.submenu.collapsing {
    animation: slideUp 0.3s ease-out forwards;
}

/* Stili per icone specifiche */
.menu-icon.fa-building {
    @apply text-blue-600 dark:text-blue-400;
}

.menu-icon.fa-home {
    @apply text-green-600 dark:text-green-400;
}

.menu-icon.fa-users {
    @apply text-purple-600 dark:text-purple-400;
}

.menu-icon.fa-receipt {
    @apply text-orange-600 dark:text-orange-400;
}

.menu-icon.fa-chart-pie {
    @apply text-red-600 dark:text-red-400;
}

.menu-icon.fa-credit-card {
    @apply text-indigo-600 dark:text-indigo-400;
}

.menu-icon.fa-calendar-check {
    @apply text-teal-600 dark:text-teal-400;
}

.menu-icon.fa-file-invoice-dollar {
    @apply text-yellow-600 dark:text-yellow-400;
}

.menu-icon.fa-cogs {
    @apply text-gray-600 dark:text-gray-400;
}

/* Responsive per menu su mobile */
@media (max-width: 768px) {
    .sidebar-menu {
        @apply text-sm;
    }
    
    .menu-item {
        @apply px-3 py-2;
    }
    
    .submenu-item {
        @apply px-3 py-1;
    }
}