/* =============================================================================
 * nav-theme.css — Menu latéral : distinguer TRES nettement les grands menus
 * (sections) des sous-menus (pages), par couleur de fond, majuscules,
 * barre d'accent et décalage.
 * ========================================================================== */

/* --- GRAND MENU (titre de section) --------------------------------------- */
.md-nav--primary .md-nav__item--section > .md-nav__link {
  text-transform: uppercase;
  font-weight: 800;
  font-size: 0.66rem;
  letter-spacing: 0.06em;
  color: #ffffff !important;
  background: var(--md-primary-fg-color, #3f51b5);
  border-radius: 0.25rem;
  padding: 0.45rem 0.6rem;
  margin: 1.1rem 0 0.45rem;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}

/* Le tout premier grand menu : pas de marge en trop en haut */
.md-nav--primary > .md-nav__list > .md-nav__item--section:first-child > .md-nav__link {
  margin-top: 0.3rem;
}

/* --- SOUS-MENU (liste des pages d'une section) --------------------------- */
/* Décalage + ligne verticale de rattachement */
.md-nav--primary .md-nav__item--section > nav.md-nav > .md-nav__list {
  margin-left: 0.6rem;
  padding-left: 0.7rem;
  border-left: 2px solid var(--md-default-fg-color--lightest, #e0e0e0);
}

/* Chaque page du sous-menu */
.md-nav--primary .md-nav__item--section .md-nav__item > .md-nav__link {
  font-size: 0.8rem;
  padding: 0.2rem 0.4rem;
  color: var(--md-default-fg-color--light);
}

/* Petit repère "•" devant chaque sous-page */
.md-nav--primary .md-nav__item--section .md-nav__item > .md-nav__link::before {
  content: "";
  display: inline-block;
  width: 0.35rem;
  height: 0.35rem;
  margin-right: 0.5rem;
  border-radius: 50%;
  background: var(--md-default-fg-color--lighter, #bdbdbd);
  vertical-align: middle;
}

/* --- Pages de premier niveau (Accueil, Comprendre le projet) ------------- */
.md-nav--primary > .md-nav__list > .md-nav__item:not(.md-nav__item--section) > .md-nav__link {
  font-weight: 700;
  font-size: 0.85rem;
}

/* --- Page ACTIVE : bien mise en évidence --------------------------------- */
.md-nav--primary .md-nav__link--active {
  font-weight: 800 !important;
  color: var(--md-primary-fg-color) !important;
  background: color-mix(in srgb, var(--md-primary-fg-color) 16%, transparent);
  border-radius: 0.25rem;
}
.md-nav--primary .md-nav__link--active::before {
  background: var(--md-primary-fg-color) !important;
}

/* Un peu d'air entre les sections */
.md-nav--primary > .md-nav__list > .md-nav__item { margin-bottom: 0.1rem; }