/* ========================================
   Sidebar Component Styles
   ======================================== */

/* Sidebar Enhancements */
.sidebar-nav .sidebar-link {
  position: relative;
  transition: all 0.3s ease;
}

/* Dropdown Menu Styles */
.sidebar-item.has-arrow > a::after {
  content: '\ea58'; /* Tabler chevron-down icon */
  font-family: 'tabler-icons';
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  transition: transform 0.3s ease;
  font-size: 14px;
}

.sidebar-item.has-arrow > a[aria-expanded="true"]::after {
  transform: translateY(-50%) rotate(180deg);
}

.sidebar-nav .collapse {
  transition: all 0.3s ease;
}

.sidebar-nav .collapse ul {
  list-style: none;
  padding: 8px 0;
  margin: 0;
  background: rgba(var(--spike-surface-rgb), 0.5);
  border-radius: 0 0 8px 8px;
}

.sidebar-nav .collapse .sidebar-item {
  padding: 0;
}

.sidebar-nav .collapse .sidebar-link {
  padding: 8px 16px 8px 48px;
  font-size: 14px;
  color: var(--spike-text-secondary);
  border-radius: 0;
}

.sidebar-nav .collapse .sidebar-link:hover,
.sidebar-nav .collapse .sidebar-link.active {
  background: var(--spike-primary);
  color: white;
  transform: none;
}

.sidebar-nav .collapse .sidebar-link.active::before {
  display: none;
}

.sidebar-nav .sidebar-link.active::before {
  content: '';
  position: absolute;
  left: -16px;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 24px;
  background: var(--spike-primary);
  border-radius: 0 4px 4px 0;
}

.sidebar-nav .sidebar-link:hover {
  transform: translateX(2px);
}

/* Pulse Animation for Active Sessions */
@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(0, 133, 219, 0.7);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(0, 133, 219, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(0, 133, 219, 0);
  }
}

.pulse-animation {
  animation: pulse 2s infinite;
}

/* Sidebar Footer Stats */
.sidebar-footer {
  flex-shrink: 0;
  background: var(--spike-surface);
  border-top: 1px solid var(--spike-border);
}

.sidebar-footer a:hover {
  color: var(--spike-primary) !important;
  transition: color 0.2s ease;
}

/* Mini Sidebar Mode Adjustments */
[data-sidebartype="mini-sidebar"] .sidebar-footer {
  padding: 8px !important;
}

[data-sidebartype="mini-sidebar"] .sidebar-footer .hide-menu {
  display: none !important;
}

[data-sidebartype="mini-sidebar"] .sidebar-footer .d-flex {
  justify-content: center !important;
}

[data-sidebartype="mini-sidebar"] .sidebar-footer img {
  width: 32px !important;
  height: 32px !important;
}

/* Logo adjustments for mini-sidebar */
[data-sidebartype="mini-sidebar"] .brand-logo span {
  display: none !important;
}

[data-sidebartype="mini-sidebar"] .brand-logo .logo-img {
  justify-content: center !important;
}

[data-sidebartype="mini-sidebar"] .brand-logo .sidebartoggler {
  display: none !important;
}

/* Sidebar layout and positioning */
.left-sidebar {
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
}

.left-sidebar > div {
  height: 100vh;
}

/* Mobile Sidebar Collapse */
@media (max-width: 768px) {
  .left-sidebar {
    transform: translateX(-100%);
    transition: transform 0.3s ease;
  }
  
  .left-sidebar.show-sidebar {
    transform: translateX(0);
  }
  
  .sidebar-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99;
    display: none;
  }
  
  .sidebar-backdrop.show {
    display: block;
  }
}