/* Collapsible Sidebar Styles */

/* Smooth transitions for sidebar collapse */
[data-controller~="collapsible-sidebar"] {
  transition: width 0.3s ease-in-out;
}

/* Center icons and align content when collapsed */
[data-controller~="collapsible-sidebar"][data-collapsed="true"] {
  overflow-x: hidden;
}

/* Center nav items when collapsed */
[data-controller~="collapsible-sidebar"][data-collapsed="true"] nav a,
[data-controller~="collapsible-sidebar"][data-collapsed="true"] nav button {
  justify-content: center;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

/* Center recent items when collapsed */
[data-controller~="collapsible-sidebar"][data-collapsed="true"] #recent-analyses-list a {
  justify-content: center;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

/* Center user button when collapsed */
[data-controller~="collapsible-sidebar"][data-collapsed="true"] [data-collapsible-sidebar-target="userInfo"] button {
  justify-content: center;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

/* Show tooltips on hover and focus when collapsed */
[data-controller~="collapsible-sidebar"][data-collapsed="true"] [title]:hover::after,
[data-controller~="collapsible-sidebar"][data-collapsed="true"] [title]:focus::after {
  content: attr(title);
  position: absolute;
  left: 100%;
  margin-left: 0.5rem;
  padding: 0.5rem 0.75rem;
  background-color: rgba(0, 0, 0, 0.9);
  color: white;
  border-radius: 0.5rem;
  white-space: nowrap;
  z-index: 1000;
  font-size: 0.875rem;
  pointer-events: none;
}

/* Prevent text selection on nav items for cleaner interaction */
[data-controller~="collapsible-sidebar"] nav a {
  user-select: none;
}

/* Ensure toggle button is always visible */
[data-controller~="collapsible-sidebar"][data-collapsed="true"] [data-collapsible-sidebar-target="toggleButton"] {
  display: flex;
}
