/* --- VARIABLES LOCALES (Scoped) --- */
#nird-navbar {
  --nav-bg: rgba(15, 23, 42, 0.95);
  --nav-text: #f8fafc;
  --nav-accent: #38bdf8;
  --nav-height: 70px;
}

/* --- RESET LOCAL --- */
/* On s'assure que la box-sizing est bonne juste pour la nav */
#nird-navbar,
#nird-navbar * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: "Segoe UI", Roboto, Helvetica, sans-serif;
  /* Force la police ici */
}

/* --- MAIN STYLE --- */
/* L'utilisation de l'ID #nird-navbar augmente le "poids" du sélecteur */
#nird-navbar.navbar {
  background-color: var(--nav-bg);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  height: var(--nav-height);
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  line-height: 1.5;
}

/* Renommé pour éviter conflit avec Bootstrap ou autre */
#nird-navbar .navbar-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  height: 100%;
  width: 100%;
}

#nird-navbar .navbar-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
}

/* --- BRAND --- */
#nird-navbar .navbar-brand {
  display: flex;
  align-items: center;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--nav-text);
  text-decoration: none;
  /* Sécurité contre les styles de liens globaux */
  cursor: pointer;
  transition: transform 0.3s ease;
}

#nird-navbar .navbar-brand:hover {
  transform: scale(1.05);
}

#nird-navbar .logo {
  margin-right: 10px;
  font-size: 1.8rem;
}

/* --- MENUS & LIENS --- */
#nird-navbar .navbar-menu {
  display: flex;
  list-style: none !important;
  /* Force la suppression des puces */
  gap: 30px;
  margin: 0;
  padding: 0;
}

#nird-navbar .nav-link {
  text-decoration: none !important;
  /* Force la suppression du soulignement par défaut */
  color: #94a3b8;
  font-weight: 500;
  font-size: 1rem;
  transition: all 0.3s ease;
  position: relative;
  display: block;
  background: transparent;
  /* Évite les héritages de fonds de boutons */
}

#nird-navbar .nav-link:hover,
#nird-navbar .nav-link.active {
  color: var(--nav-text);
}

/* Soulignement animé */
#nird-navbar .nav-link::after {
  content: "";
  position: absolute;
  width: 0;
  height: 2px;
  bottom: -5px;
  left: 0;
  background-color: var(--nav-accent);
  transition: width 0.3s ease;
}

#nird-navbar .nav-link:hover::after,
#nird-navbar .nav-link.active::after {
  width: 100%;
}