/* Mise en page unifiée pour toutes les sidebars (admin et user) */
:root {
  --sidebar-width: 260px;
  --sidebar-width-closed: 78px;
  --sidebar-banner-offset: 0px;
  --sidebar-profile-height: 60px;
}

.sidebar {
  position: fixed;
  top: var(--sidebar-banner-offset);
  left: 0;
  width: var(--sidebar-width);
  height: calc(100vh - var(--sidebar-banner-offset));
  background: #11101d;
  z-index: 100;
  transition: width 0.4s ease;
  display: flex;
  flex-direction: column;
}

.sidebar.close {
  width: var(--sidebar-width-closed);
}

.sidebar .logo-details {
  height: 60px;
  min-height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.sidebar .logo-details .logo_name {
  white-space: nowrap;
  overflow: hidden;
}

.sidebar .nav-links {
  list-style: none;
  flex: 1;
  margin: 0;
  padding: 16px 0 90px 0;
  height: auto;
  overflow-y: auto;
  overflow-x: hidden;
}

.sidebar .nav-links li {
  list-style: none;
}

.sidebar .nav-links li a {
  display: flex;
  align-items: center;
}

.sidebar .nav-links li .link_name {
  white-space: nowrap;
  overflow: hidden;
}

.sidebar .profile-details {
  margin-top: auto;
  position: relative;
  width: 100%;
  min-height: var(--sidebar-profile-height);
  padding: 15px;
  background: #1d1b31;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  box-sizing: border-box;
}

.sidebar.close .profile-details {
  justify-content: center;
}

.sidebar.close .logo-details .logo_name,
.sidebar.close .nav-links .link_name,
.sidebar.close .profile-details .name-job {
  opacity: 0;
  pointer-events: none;
}

.home-section {
  position: relative;
  left: var(--sidebar-width);
  width: calc(100% - var(--sidebar-width));
  min-height: 100vh;
  background: #E4E9F7;
  transition: left 0.4s ease, width 0.4s ease;
}

.sidebar.close ~ .home-section {
  left: var(--sidebar-width-closed);
  width: calc(100% - var(--sidebar-width-closed));
}

.home-section .home-content {
  height: 60px;
  display: flex;
  align-items: center;
}
