/* ===== DevPortal navbar overrides ===== */

/* Garde la même base visuelle que base.html */
.header {
  position: sticky;
  top: 0;
  z-index: 1000;
  backdrop-filter: blur(8px);
}

/* Contrainte de largeur identique */
.header .container,
.content {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1rem;
}

/* Liste de nav plus compacte (on a retiré Notifs/Messages) */
.nav-list {
  display: flex;
  align-items: center;
  gap: 1rem;
}

/* Lien “user-menu” (avatar + username) */
.user-menu {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  text-decoration: none;
}

/* Avatar utilisateur (même rendu que sur base) */
.user-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid rgba(255,255,255,.15);
}

/* Dropdown utilisateur */
.dropdown {
  position: relative;
}
.dropdown > .user-menu {
  cursor: pointer;
}
.dropdown .dropdown-content.user-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + .5rem);
  min-width: 220px;
  padding: .5rem 0;
  border-radius: 10px;
  background: rgba(20, 26, 34, 0.98);
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
  display: none;       /* affiché au hover/focus */
}
.dropdown:hover .dropdown-content.user-dropdown,
.dropdown:focus-within .dropdown-content.user-dropdown {
  display: block;
}
.user-dropdown a {
  display: block;
  padding: .55rem .9rem;
  color: #e8f0ff;
  text-decoration: none;
  white-space: nowrap;
}
.user-dropdown a:hover {
  background: rgba(255,255,255,.06);
}

/* Bouton de logout dans le dropdown */
.user-dropdown .logout-btn {
  width: 100%;
  text-align: left;
  background: transparent;
  border: 0;
  padding: .55rem .9rem;
  cursor: pointer;
  color: #e8f0ff;
}
.user-dropdown .logout-btn:hover {
  background: rgba(255,255,255,.06);
}

/* Petite ligne séparatrice dans le menu */
.user-dropdown .divider {
  height: 1px;
  margin: .35rem 0;
  background: rgba(255,255,255,.08);
}

/* Recherche compacte (si tu gardes le formulaire) */
#search-form {
  display: flex;
  align-items: center;
  gap: .5rem;
}
#search-form .form-select,
#search-form .form-control {
  height: 36px;
  padding: 0 .6rem;
}
#search-form .btn {
  height: 36px;
  line-height: 34px;
}

/* Boutons */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .5rem .85rem;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.12);
  background: transparent;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
.btn:hover {
  border-color: rgba(255,255,255,.25);
}
.btn.btn-primary {
  border: 0;
}

/* Cacher tout ce qui serait relié aux notifs/messages si des classes
   restent traîner depuis base.html (sécurité) */
.nav-list .notifications,
.nav-list .messages,
.nav-list .inbox,
.nav-list .badge,
.header .notifications-bell,
.header .messages-link {
  display: none !important;
}

/* Mobile */
.menu-toggle { display: none; }
@media (max-width: 768px) {
  .nav-list { gap: .6rem; }
  .user-avatar { width: 28px; height: 28px; }
  #search-form { display: none; } /* optionnel: masque la recherche sur mobile */
}