/* ════════════════════════════════════════════════════════════════════
   NutriPatient — Style éditorial (v1.16.0)
   Inspiré de l'interface MTC Patient — ivoire + vert forêt + or.
   Chargé APRÈS front.css : override les variables racine et certaines
   propriétés clés sans toucher au CSS de base.
   ════════════════════════════════════════════════════════════════════ */

/* v1.60.0 — @import Google Fonts retiré : une requête vers ce CDN
   transmet l'adresse IP du praticien et, sur les pages patient, celle de
   la personne. Piles système via les jetons (--np-sans/serif/mono). */

/* ════════════════════════════════════════════════════════════════════
   APP-SHELL (v1.16.1) — sidebar fixe à la MTC
   ─────────────────────────────────────────────────────────────────────
   Ne s'active que sur body.np-app-body (mode standalone). Transforme
   le wrapper .np-app-wrap en grid 2 colonnes height:100vh : sidebar
   fixe à gauche, main scrollable à droite. Le body ne scroll pas.
   ════════════════════════════════════════════════════════════════════ */
body.np-app-body {
  margin: 0; padding: 0;
  height: 100vh; height: 100dvh;
  overflow: hidden;
}
body.np-app-body .np-front.np-app-wrap.np-layout-vertical {
  display: grid;
  grid-template-columns: var(--sidebar-w, 260px) 1fr;
  height: 100vh; height: 100dvh;
  width: 100vw;
  min-height: 0; max-height: none;
  overflow: hidden;
}
body.np-app-body.np-has-demo-banner .np-front.np-app-wrap.np-layout-vertical {
  /* Le bandeau démo prend ~40px en overlay top : on rogne la grid */
  height: calc(100vh - 40px);
  height: calc(100dvh - 40px);
  margin-top: 40px;
}
body.np-app-body .np-sidebar {
  position: relative !important;     /* plus de sticky */
  top: auto !important;
  height: 100% !important;
  overflow: hidden !important;       /* le scroll interne se fait dans .np-sidebar-content */
  z-index: 50;
}
body.np-app-body .np-main {
  height: 100%;
  min-height: 0;                     /* indispensable en flex/grid pour permettre overflow */
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
/* Mobile : la sidebar redevient un drawer fixed (déjà géré par front.css),
   la grid passe en 1 colonne. */
@media (max-width: 767px) {
  body.np-app-body .np-front.np-app-wrap.np-layout-vertical {
    display: block;
    height: 100vh; height: 100dvh;
  }
  body.np-app-body .np-main {
    height: calc(100vh - var(--nav-h, 60px));
    height: calc(100dvh - var(--nav-h, 60px));
  }
}

/* ─── Surcouche éditoriale ────────────────────────────────────────────
   v1.60.0 — Ce fichier ne définit plus de couleur. Il ne fait que donner
   ses noms historiques aux jetons de np-tokens.css, pour que les règles
   écrites avant la 1.60 continuent de fonctionner sans être réécrites.

   DEUX PIÈGES ÉVITÉS ICI, tous deux introduits par la reprise mécanique
   de la charte et corrigés à la main.

   Le premier : `--np-ink: var(--np-ink)`. Une propriété personnalisée
   qui se référence elle-même forme un cycle ; le moteur la déclare
   invalide et TOUT ce qui l'utilise retombe sur la valeur initiale. Le
   texte principal de l'application aurait perdu sa couleur.

   Le second : ce bloc redéfinissait `--np-line`, qui est désormais un
   jeton. Il l'écrasait par un noir translucide — correct comme bordure,
   faux partout où le filet sert de fond. Le nom historique devient donc
   `--np-line-soft`, et le jeton reste seul maître de `--np-line`. */
:root {
  --np-ink-soft:   var(--np-ink2);
  --np-mute:       var(--np-ink3);
  --np-cream:      var(--np-paper);
  --np-cream-2:    var(--np-rail);        /* rail sombre — v1.60.0 */
  --np-cream-3:    var(--np-rail-active); /* survol dans le rail */
  --np-forest:     var(--np-f600);
  --np-forest-l:   var(--np-f500);
  --np-forest-xl:  var(--np-f50);
  --np-gold:       var(--np-amber);
  --np-gold-soft:  var(--np-amber-line);
  --np-line-soft:  rgba(15, 20, 17, .14);
  --np-line-2:     var(--np-line2);

  /* Override des variables existantes pour réutilisation transparente */
  --np-bg:         var(--np-cream);
  --np-white:      var(--np-surface);
  --np-navy:       var(--np-ink);
  --np-slate:      var(--np-ink-soft);
  --np-border:     var(--np-line);
  --np-green:      var(--np-forest);
  --np-green-l:    var(--np-forest-l);
  --np-green-xl:   var(--np-forest-xl);
  --np-teal:       var(--np-gold);
  --np-shadow:     0 0 0 1px var(--np-line);
  --np-shadow-md:  0 0 0 1px var(--np-line-2);
  --np-radius:     6px;

  /* Rail sombre — v1.60.0. L'application est l'outil, la zone de travail
     est le papier : la distinction se fait ici, en trois variables. */
  --sidebar-bg:           var(--np-rail);
  --sidebar-bg-hover:     var(--np-rail-active);
  --sidebar-section-color: var(--np-rail-ink3);
  --sidebar-w:            240px;
}

/* ═══════════════════════════════════════════════════════════════════
   TYPOGRAPHIE — serif sobre pour titres, sans pour le corps
   ═══════════════════════════════════════════════════════════════════ */
.np-front {
  background: var(--np-cream);
  color: var(--np-ink);
}

.np-front h1,
.et_pb_section .np-front h1, .entry-content .np-front h1 {
  font-family: var(--np-serif) !important;
}
/* v1.60.0 — le serif était posé sur TOUS les titres : employé partout, il
   n'est plus un signal. Il reste aux h1 (titres de dossier) et aux noms ;
   h2/h3 reviennent à la grotesque. */
.np-front h2, .np-front h3,
.et_pb_section .np-front h2, .et_pb_section .np-front h3,
.entry-content .np-front h2, .entry-content .np-front h3 {
  font-family: var(--np-sans) !important;
  color: var(--np-ink) !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
}
.np-front h1 { font-size: 2.4rem !important; line-height: 1.15 !important; }
.np-front h2 { font-size: 1.55rem !important; }
.np-front h3 { font-size: 1.25rem !important; }

/* Gros chiffres dans les stats : aussi en serif (resserrés v1.16.7) */
.np-stat-value {
  font-family: var(--np-serif)!important;
  font-size: 2.6rem !important;
  font-weight: 500 !important;
  color: var(--np-forest) !important;
  line-height: 1 !important;
  letter-spacing: -0.01em !important;
}

/* Labels en petites caps sobres */
.np-stat-label,
.np-card-title-eyebrow,
.np-eyebrow {
  font-size: .68rem !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--np-mute) !important;
  font-weight: 600 !important;
}

/* ═══════════════════════════════════════════════════════════════════
   SIDEBAR éditoriale
   ═══════════════════════════════════════════════════════════════════ */
/* v1.60.0 — Le rail est sombre. Les encres qui suivent en découlent :
   changer le fond sans changer les textes donnait une barre illisible,
   ce que seule une capture du rendu réel a montré. */
.np-layout-vertical .np-sidebar {
  background: var(--np-rail);
  border-right: 1px solid var(--np-rail-line);
}

.np-sidebar-brand {
  border-bottom: 1px solid var(--np-rail-line);
  padding: 12px 14px 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.np-sidebar-brand-link {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none !important;
  min-width: 0;
}
.np-sidebar-brand-icon-img {
  width: 38px; height: 38px;
  flex-shrink: 0;
  object-fit: contain;
  display: block;
}
.np-sidebar-brand-text {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.np-sidebar-brand-name {
  font-family: var(--np-serif);
  font-size: 1.18rem;
  font-weight: 600;
  color: var(--np-ink);
  line-height: 1.05;
  letter-spacing: -0.005em;
}
.np-sidebar-brand-sub {
  font-family: var(--np-sans);
  font-size: .64rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--np-mute);
  font-weight: 600;
}

/* Mode collapsed : icône seule centrée */
.np-layout-vertical.np-sidebar-collapsed .np-sidebar-brand {
  padding: 12px 8px;
  justify-content: center;
}
.np-layout-vertical.np-sidebar-collapsed .np-sidebar-brand-text {
  display: none;
}
.np-layout-vertical.np-sidebar-collapsed .np-sidebar-brand-icon-img {
  width: 32px; height: 32px;
}

/* Bouton toggle plus explicite : icône chevron + tooltip + hover marqué */
.np-sidebar-toggle {
  background: transparent !important;
  border: 1px solid var(--np-rail-line) !important;
  border-radius: 6px !important;
  width: 28px; height: 28px;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--np-ink-soft) !important;
  flex-shrink: 0;
  cursor: pointer;
  font-size: 1rem;
  transition: background .15s, border-color .15s, color .15s;
}
.np-sidebar-toggle:hover {
  background: var(--np-rail-active) !important;
  border-color: var(--np-rail-line) !important;
  color: #fff !important;
}
.np-sidebar-toggle-icon {
  display: inline-block;
  font-weight: 700;
  font-size: 1.1rem;
  line-height: 1;
  transition: transform .2s;
}
/* En mode collapsed : la flèche pointe à droite */
.np-layout-vertical.np-sidebar-collapsed .np-sidebar-toggle-icon {
  transform: rotate(180deg);
}

/* Sections : labels small-caps */
.np-sidebar-section-title {
  color: var(--np-mute) !important;
  font-size: .66rem !important;
  letter-spacing: .16em !important;
  font-weight: 700 !important;
  padding: 10px 18px 3px !important;
  text-transform: uppercase;
}
.np-sidebar-section {
  margin-bottom: 0 !important;
}
.np-sidebar-section + .np-sidebar-section {
  margin-top: 2px !important;
}

/* Liens de menu : tons sombres, pas de fond, accent à gauche pour actif */
.np-sidebar-link {
  color: var(--np-rail-ink2) !important;
  font-size: .88rem !important;
  font-weight: 500 !important;
  padding: 5px 18px !important;
  border-left: 3px solid transparent;
  transition: background .12s, color .12s, border-color .12s;
  line-height: 1.4 !important;
  gap: 10px;
}
.np-sidebar-link:hover {
  background: var(--np-rail-active) !important;
  color: var(--np-rail-ink) !important;
}
.np-sidebar-link-active {
  background: var(--np-rail-active) !important;
  color: #fff !important;
  font-weight: 700 !important;
  border-left-color: var(--np-rail-accent) !important;
}
.np-sidebar-link-icon {
  opacity: .65;
  font-size: .92em !important;
  filter: grayscale(.25);
  width: 18px; text-align: center;
  flex-shrink: 0;
}
.np-sidebar-link-active .np-sidebar-link-icon {
  opacity: 1;
  filter: none;
}

/* Footer sidebar : avatar + email + actions discrètes */
.np-sidebar-footer {
  border-top: 1px solid var(--np-line) !important;
  background: var(--np-cream-3);
  padding: 10px 0 6px !important;
}

/* v1.19.0 — Compteurs dépenses IA */
.np-sidebar-ia-counters {
  display: flex;
  gap: 6px;
  margin: 0 12px 10px;
  padding: 8px 10px;
  background: rgba(255,255,255,.6);
  border: 1px solid var(--np-line);
  border-radius: 8px;
  text-decoration: none;
  color: inherit;
  transition: background-color .15s, border-color .15s;
}
.np-sidebar-ia-counters:hover {
  background: rgba(255,255,255,.95);
  border-color: var(--np-forest);
}
.np-sidebar-ia-counter {
  flex: 1 1 50%;
  display: flex; flex-direction: column; gap: 1px;
  text-align: center;
}
.np-sidebar-ia-counter-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--np-slate);
  font-weight: 500;
}
.np-sidebar-ia-counter-value {
  font-size: 13px;
  font-weight: 700;
  color: var(--np-navy);
  font-variant-numeric: tabular-nums;
}
.np-sidebar-ia-counter-value small {
  font-size: 9px;
  font-weight: 500;
  color: var(--np-slate);
  margin-left: 2px;
}
/* Mode collapsed : on cache les compteurs (pas de place) */
.np-sidebar-collapsed .np-sidebar-ia-counters { display: none; }

.np-sidebar-user {
  padding: 4px 18px 6px !important;
  gap: 10px !important;
  display: flex; align-items: center;
}
.np-sidebar-user-avatar {
  background: var(--np-forest) !important;
  color: var(--np-surface) !important;
  font-size: .82rem !important;
  width: 34px !important; height: 34px !important;
  font-family: var(--np-sans)!important;
}
.np-sidebar-user-info {
  min-width: 0;
  flex: 1;
}
.np-sidebar-user-name {
  color: var(--np-ink) !important;
  font-size: .88rem !important;
  font-weight: 600 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.np-sidebar-user-email {
  color: var(--np-mute);
  font-size: .74rem;
  font-weight: 400;
  display: block;
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.np-sidebar-logout {
  color: var(--np-mute) !important;
  padding: 7px 22px !important;
  font-size: .8rem !important;
}
.np-sidebar-logout:hover {
  color: var(--np-forest) !important;
  background: transparent !important;
}

/* v1.16.6 — Boutons footer EXPLICITES : icône + label, côte à côte */
.np-sidebar-footer-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  padding: 8px 14px 0;
}
.np-sidebar-footer-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 7px 8px;
  border-radius: 6px;
  background: var(--np-white);
  border: 1px solid var(--np-line-2);
  color: var(--np-ink-soft);
  text-decoration: none !important;
  font-family: var(--np-sans);
  font-size: .76rem;
  font-weight: 500;
  letter-spacing: .005em;
  transition: background .12s, border-color .12s, color .12s, transform .12s;
  white-space: nowrap;
}
.np-sidebar-footer-btn:hover {
  background: var(--np-forest-xl);
  border-color: var(--np-forest);
  color: var(--np-forest) !important;
}
.np-sidebar-footer-btn:active {
  transform: translateY(1px);
}
.np-sidebar-footer-btn-icon {
  font-size: .92rem;
  line-height: 1;
}
.np-sidebar-footer-btn-label {
  line-height: 1;
}
/* Variante déconnexion : ton plus discret au repos, rouge subtil au hover */
.np-sidebar-footer-btn-logout:hover {
  background: var(--np-paper);
  border-color: var(--np-rose);
  color: var(--np-rose) !important;
}
/* Mode collapsed : seulement les icônes, en colonne */
.np-layout-vertical.np-sidebar-collapsed .np-sidebar-footer-actions {
  grid-template-columns: 1fr;
  padding: 8px 8px 0;
}
.np-layout-vertical.np-sidebar-collapsed .np-sidebar-footer-btn-label {
  display: none;
}
.np-layout-vertical.np-sidebar-collapsed .np-sidebar-footer-btn {
  padding: 8px 6px;
}

/* ═══════════════════════════════════════════════════════════════════
   ZONE PRINCIPALE
   ═══════════════════════════════════════════════════════════════════ */
.np-layout-vertical .np-main {
  background: var(--np-cream);
  padding: 36px 44px 60px !important;
}

.np-page-title {
  font-family: var(--np-serif)!important;
  font-size: 2.4rem !important;
  font-weight: 600 !important;
  color: var(--np-ink) !important;
  margin: 0 0 4px !important;
  letter-spacing: -0.01em;
}
.np-page-title-eyebrow {
  font-family: var(--np-sans);
  display: block;
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--np-mute);
  font-weight: 500;
  margin-bottom: 6px;
}
.np-page-title-sub {
  font-family: var(--np-sans);
  font-size: .9rem;
  color: var(--np-ink-soft);
  font-weight: 400;
  margin: 0 0 24px;
}

.np-page-header {
  border-bottom: 1px solid var(--np-line) !important;
  padding-bottom: 20px !important;
  margin-bottom: 28px !important;
}

/* ═══════════════════════════════════════════════════════════════════
   CARDS — sobres, bordures fines, sans ombre
   ═══════════════════════════════════════════════════════════════════ */
.np-card {
  background: var(--np-white) !important;
  border: 1px solid var(--np-line) !important;
  border-radius: var(--np-radius) !important;
  padding: 22px 26px !important;
  margin-bottom: 18px !important;
  box-shadow: none !important;
}
.np-card-title {
  font-family: var(--np-serif)!important;
  font-size: 1.3rem !important;
  font-weight: 600 !important;
  color: var(--np-ink) !important;
  margin: 0 0 16px !important;
  border: none !important;
  padding: 0 !important;
}

/* Stats cards : layout horizontal serré (v1.16.7) — chiffre à gauche, label à droite */
.np-stat-card {
  background: var(--np-white) !important;
  border: 1px solid var(--np-line) !important;
  border-radius: var(--np-radius) !important;
  padding: 16px 22px !important;
  box-shadow: none !important;
  transition: border-color .15s;
  display: flex;
  align-items: center;
  gap: 18px;
}
.np-stat-card:hover {
  border-color: var(--np-line-2) !important;
}
.np-stat-card .np-stat-value {
  font-size: 2.4rem !important;
  flex-shrink: 0;
}
.np-stat-card .np-stat-label {
  flex: 1;
  text-align: left;
}
.np-stats-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 12px !important;
  margin-bottom: 20px !important;
}

/* ═══════════════════════════════════════════════════════════════════
   TABLES & LISTES — séparateurs subtils, pas de fond
   ═══════════════════════════════════════════════════════════════════ */
.np-table {
  background: transparent !important;
}
.np-table th {
  background: transparent !important;
  color: var(--np-mute) !important;
  font-size: .7rem !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  border-bottom: 1px solid var(--np-line-2) !important;
  padding: 10px 12px !important;
}
.np-table td {
  border-bottom: 1px solid var(--np-line) !important;
  padding: 14px 12px !important;
  color: var(--np-ink) !important;
  font-size: .92rem !important;
}
.np-table tbody tr:last-child td {
  border-bottom: none !important;
}
.np-table tbody tr:hover {
  background: var(--np-cream) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   LISTE PATIENTS RÉCENTS — avec avatar cercle initiales
   ═══════════════════════════════════════════════════════════════════ */
.np-patient-row {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid var(--np-line);
  text-decoration: none;
}
.np-patient-row:last-child { border-bottom: none; }
.np-patient-row:hover .np-patient-name { color: var(--np-forest); }

.np-patient-avatar {
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--np-forest-xl);
  color: var(--np-forest);
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--np-sans);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .03em;
  flex-shrink: 0;
}
.np-patient-name {
  font-weight: 600;
  color: var(--np-ink);
  transition: color .12s;
}
.np-patient-meta {
  font-size: .8rem;
  color: var(--np-mute);
  font-family: var(--np-mono);
}
.np-patient-time {
  margin-left: auto;
  font-size: .82rem;
  color: var(--np-mute);
}

/* ═══════════════════════════════════════════════════════════════════
   BOUTONS
   ═══════════════════════════════════════════════════════════════════ */
.np-btn {
  border-radius: var(--np-radius) !important;
  font-weight: 500 !important;
  font-size: .88rem !important;
  letter-spacing: .005em !important;
  padding: 9px 18px !important;
  transition: .15s !important;
}
.np-btn-primary {
  background: var(--np-forest) !important;
  color: var(--np-surface) !important;
  border: 1px solid var(--np-forest) !important;
}
.np-btn-primary:hover {
  background: var(--np-forest-l) !important;
  border-color: var(--np-forest-l) !important;
}
.np-btn-secondary {
  background: transparent !important;
  color: var(--np-ink) !important;
  border: 1px solid var(--np-line-2) !important;
}
.np-btn-secondary:hover {
  background: var(--np-cream-2) !important;
  border-color: var(--np-ink-soft) !important;
  color: var(--np-forest) !important;
}
.np-btn-outline {
  background: transparent !important;
  color: var(--np-forest) !important;
  border: 1px solid var(--np-forest) !important;
}
.np-btn-outline:hover {
  background: var(--np-forest-xl) !important;
}
.np-btn-ia {
  background: var(--np-gold) !important;
  color: var(--np-surface) !important;
  border-color: var(--np-gold) !important;
}
.np-btn-ia:hover {
  background: var(--np-gold-soft) !important;
  border-color: var(--np-gold-soft) !important;
}

/* "Voir agenda complet →" : style lien plutôt que bouton */
.np-card-link {
  font-size: .85rem;
  color: var(--np-forest);
  font-weight: 500;
  text-decoration: none;
  display: inline-block;
}
.np-card-link:hover {
  color: var(--np-forest-l);
  text-decoration: underline;
}

/* ═══════════════════════════════════════════════════════════════════
   ONGLETS PATIENT — épurés, soulignement fin
   ═══════════════════════════════════════════════════════════════════ */
.np-tabs {
  border-bottom: 1px solid var(--np-line) !important;
  margin-bottom: 24px !important;
  display: flex; flex-wrap: wrap; gap: 0 !important;
}
.np-tab {
  background: transparent !important;
  color: var(--np-ink-soft) !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  padding: 9px 13px !important;
  font-size: .84rem !important;
  font-weight: 500 !important;
  margin-bottom: -1px !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: color .15s, border-color .15s;
}
.np-tab:hover {
  color: var(--np-ink) !important;
}
.np-tab-active {
  color: var(--np-forest) !important;
  border-bottom-color: var(--np-forest) !important;
  font-weight: 600 !important;
  background: transparent !important;
}

/* ═══════════════════════════════════════════════════════════════════
   FORMULAIRES — bordures fines, focus discret
   ═══════════════════════════════════════════════════════════════════ */
.np-front input[type=text],
.np-front input[type=email],
.np-front input[type=number],
.np-front input[type=tel],
.np-front input[type=date],
.np-front input[type=password],
.np-front textarea,
.np-front select,
.np-form input[type=text],
.np-form input[type=email],
.np-form input[type=number],
.np-form textarea,
.np-form select {
  background: var(--np-white);
  border: 1px solid var(--np-line-2);
  border-radius: var(--np-radius);
  padding: 9px 12px;
  font-family: var(--np-sans);
  font-size: .92rem;
  color: var(--np-ink);
  width: 100%;
  transition: border-color .15s, box-shadow .15s;
  box-shadow: none !important;
}
.np-front input:focus,
.np-front textarea:focus,
.np-front select:focus {
  border-color: var(--np-forest) !important;
  box-shadow: 0 0 0 3px var(--np-forest-xl) !important;
  outline: none !important;
}
.np-field label,
.np-form label {
  font-size: .76rem !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  color: var(--np-mute) !important;
  margin-bottom: 5px !important;
  display: block;
}

/* ═══════════════════════════════════════════════════════════════════
   ALERTES & BADGES
   ═══════════════════════════════════════════════════════════════════ */
.np-alert {
  border-radius: var(--np-radius);
  border-width: 1px !important;
  padding: 12px 16px !important;
  font-size: .88rem !important;
  font-weight: 400 !important;
}
.np-alert-success {
  background: var(--np-forest-xl) !important;
  border-color: var(--np-forest-l) !important;
  color: var(--np-forest) !important;
}
.np-alert-error {
  background: var(--np-rose-bg) !important;
  border-color: var(--np-rose) !important;
  color: var(--np-rose) !important;
}
.np-alert-warning,
.np-alert-warn {
  background: var(--np-paper) !important;
  border-color: var(--np-gold-soft) !important;
  color: var(--np-gold) !important;
}

.np-badge {
  border-radius: 999px;
  padding: 2px 10px;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .03em;
}

/* ═══════════════════════════════════════════════════════════════════
   BOUTON FLOTTANT — Recherche aliment rapide (parallèle au "Snippets" MTC)
   ═══════════════════════════════════════════════════════════════════ */
.np-fab {
  position: fixed;
  right: 28px; bottom: 28px;
  background: var(--np-forest);
  color: var(--np-surface);
  padding: 12px 22px 12px 18px;
  border: none;
  border-radius: 999px;
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--np-sans);
  font-size: .92rem;
  font-weight: 500;
  letter-spacing: .005em;
  box-shadow: 0 4px 18px rgba(31, 81, 50, .25), 0 0 0 1px rgba(255,255,255,.06) inset;
  cursor: pointer;
  text-decoration: none;
  transition: transform .15s, box-shadow .15s;
  z-index: 90;
}
.np-fab:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 22px rgba(31, 81, 50, .35), 0 0 0 1px rgba(255,255,255,.06) inset;
}
.np-fab-icon {
  font-size: 1.05em;
  opacity: .9;
}

/* ═══════════════════════════════════════════════════════════════════
   AGENDA — zone vide plus aérée
   ═══════════════════════════════════════════════════════════════════ */
.np-empty {
  text-align: center;
  color: var(--np-mute);
  font-style: italic;
  padding: 24px 0;
  font-size: .92rem;
}

/* ═══════════════════════════════════════════════════════════════════
   COLLAPSED MODE — ajustements
   ═══════════════════════════════════════════════════════════════════ */
.np-layout-vertical.np-sidebar-collapsed .np-sidebar {
  width: 64px;
}
.np-layout-vertical.np-sidebar-collapsed .np-sidebar-link {
  padding-left: 0 !important;
  padding-right: 0 !important;
  border-left: none;
}
.np-layout-vertical.np-sidebar-collapsed .np-sidebar-link-active {
  background: var(--np-forest-xl) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   RESPONSIVE — sidebar mobile
   ═══════════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
  .np-layout-vertical .np-main {
    padding: 20px 18px 60px !important;
  }
  .np-page-title {
    font-size: 1.8rem !important;
  }
  .np-stat-value {
    font-size: 2.6rem !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   TOPBAR mobile : assortie au reste
   ═══════════════════════════════════════════════════════════════════ */
.np-topbar {
  background: var(--np-cream-2) !important;
  color: var(--np-ink) !important;
  border-bottom: 1px solid var(--np-line);
  box-shadow: none !important;
}
.np-topbar-burger {
  color: var(--np-ink) !important;
}
.np-topbar-brand {
  color: var(--np-ink) !important;
  font-family: var(--np-serif)!important;
  font-size: 1.05rem !important;
  font-weight: 600 !important;
}

/* ═══════════════════════════════════════════════════════════════════
   "Vue patient" (np-sidebar-link-demo) — alignement v1.16.4
   Le legacy avait margin/border dashed prévus pour fond sombre :
   on neutralise pour aligner sur les autres liens du menu.
   ═══════════════════════════════════════════════════════════════════ */
.np-layout-vertical .np-sidebar-link-demo {
  border: none !important;
  border-left: 3px solid transparent !important;
  margin: 0 !important;
  border-radius: 0 !important;
  padding: 5px 18px !important;
  background: transparent !important;
}
.np-layout-vertical .np-sidebar-link-demo:hover {
  background: var(--np-cream-3) !important;
  border-left-color: var(--np-mute) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   RECHERCHE PRÉDICTIVE CONTEXTUELLE (.np-psearch) — v1.16.4
   Composant réutilisable, instancié par module (Patients, Aliments,
   Compléments, …). Voir assets/js/np-search.js pour le comportement.
   ═══════════════════════════════════════════════════════════════════ */
.np-psearch {
  position: relative;
}
.np-psearch-inline {
  display: flex;
  align-items: center;
}
.np-psearch-icon {
  position: absolute;
  left: 12px; top: 50%;
  transform: translateY(-50%);
  color: var(--np-mute);
  font-size: .92rem;
  pointer-events: none;
  z-index: 1;
}
.np-psearch-input {
  width: 100%;
  padding: 9px 14px 9px 36px !important;
  font-size: .92rem !important;
  background: var(--np-white) !important;
  border: 1px solid var(--np-line-2) !important;
  border-radius: var(--np-radius) !important;
  color: var(--np-ink) !important;
  font-family: var(--np-sans)!important;
  outline: none !important;
  transition: border-color .15s, box-shadow .15s;
  height: 38px;
}
.np-psearch-input::placeholder {
  color: var(--np-mute);
}
.np-psearch-input:focus {
  border-color: var(--np-forest) !important;
  box-shadow: 0 0 0 3px var(--np-forest-xl) !important;
}
.np-psearch-dropdown {
  display: none;
  position: absolute;
  left: 0; right: 0; top: calc(100% + 4px);
  background: var(--np-white);
  border: 1px solid var(--np-line-2);
  border-radius: var(--np-radius);
  box-shadow: 0 12px 32px rgba(15, 20, 17, .15), 0 2px 6px rgba(15, 20, 17, .08);
  z-index: 200;
  max-height: 70vh;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.np-psearch-dropdown.np-psearch-open { display: block; }
.np-psearch-group { padding: 8px 0; }
.np-psearch-group + .np-psearch-group { border-top: 1px solid var(--np-line); }
.np-psearch-group-title {
  padding: 6px 14px 4px;
  font-size: .68rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--np-mute);
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 6px;
}
.np-psearch-group-icon {
  opacity: .6;
  filter: grayscale(.25);
  font-size: .92rem;
}
.np-psearch-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  text-decoration: none !important;
  color: var(--np-ink);
  cursor: pointer;
  transition: background .1s;
}
.np-psearch-item:hover,
.np-psearch-item-focus {
  background: var(--np-forest-xl) !important;
}
.np-psearch-item-main { flex: 1; min-width: 0; }
.np-psearch-item-label {
  font-size: .92rem;
  font-weight: 500;
  color: var(--np-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.np-psearch-item-sub {
  font-size: .76rem;
  color: var(--np-mute);
  font-family: var(--np-mono);
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.np-psearch-item-badge {
  font-size: .68rem;
  background: var(--np-cream-3);
  color: var(--np-ink-soft);
  padding: 2px 7px;
  border-radius: 999px;
  font-weight: 600;
  letter-spacing: .03em;
  flex-shrink: 0;
}
.np-psearch-item mark {
  background: rgba(151, 119, 42, .25);
  color: inherit;
  padding: 0 1px;
  border-radius: 2px;
  font-weight: 600;
}
.np-psearch-empty {
  padding: 18px 14px;
  text-align: center;
  font-size: .9rem;
  color: var(--np-mute);
  font-style: italic;
}
.np-psearch-empty strong {
  color: var(--np-ink);
  font-style: normal;
}

/* ═══════════════════════════════════════════════════════════════════
   BOUTONS .np-btn-xs — normalisation v1.16.2
   Tous les petits boutons d'action en colonne "actions" doivent avoir
   la même hauteur, padding, font-size, alignement vertical.
   ═══════════════════════════════════════════════════════════════════ */
.np-btn-xs {
  padding: 4px 10px !important;
  font-size: .76rem !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  height: 26px !important;
  min-height: 26px !important;
  border-radius: 5px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  white-space: nowrap !important;
  letter-spacing: 0 !important;
}

/* Variante par défaut (sans modifier) → outline gris-vert subtil */
.np-btn-xs:not(.np-btn-primary):not(.np-btn-secondary):not(.np-btn-outline):not(.np-btn-ia):not(.np-btn-danger):not(.np-btn-sage-active):not(.np-btn-warning) {
  background: var(--np-white) !important;
  color: var(--np-ink) !important;
  border: 1px solid var(--np-line-2) !important;
}
.np-btn-xs:not(.np-btn-primary):not(.np-btn-secondary):not(.np-btn-outline):not(.np-btn-ia):not(.np-btn-danger):not(.np-btn-sage-active):not(.np-btn-warning):hover {
  background: var(--np-cream-2) !important;
  border-color: var(--np-ink-soft) !important;
  color: var(--np-forest) !important;
}

/* "Partager" (état non-partagé) → outline vert subtil */
.np-btn-xs.np-btn-outline {
  background: var(--np-white) !important;
  color: var(--np-forest) !important;
  border: 1px solid var(--np-forest) !important;
  opacity: .85;
}
.np-btn-xs.np-btn-outline:hover {
  opacity: 1;
  background: var(--np-forest-xl) !important;
}

/* "Partagé" (état partagé) → vert plein */
.np-btn-xs.np-btn-sage-active,
.np-btn-sage-active.np-btn-xs {
  background: var(--np-forest) !important;
  color: var(--np-surface) !important;
  border: 1px solid var(--np-forest) !important;
}
.np-btn-xs.np-btn-sage-active:hover {
  background: var(--np-forest-l) !important;
  border-color: var(--np-forest-l) !important;
}

/* "Extraire bilan" (action IA) → doré subtil */
.np-btn-xs.np-btn-ia {
  background: var(--np-gold) !important;
  color: var(--np-surface) !important;
  border: 1px solid var(--np-gold) !important;
}
.np-btn-xs.np-btn-ia:hover {
  background: var(--np-gold-soft) !important;
  border-color: var(--np-gold-soft) !important;
  color: var(--np-surface) !important;
}

/* "🗑" trash → bouton icône carré, rouge subtil */
.np-btn-xs.np-btn-danger {
  background: transparent !important;
  color: var(--np-mute) !important;
  border: 1px solid var(--np-line-2) !important;
  width: 26px !important;
  padding: 4px !important;
  font-size: .85rem !important;
}
.np-btn-xs.np-btn-danger:hover {
  background: var(--np-rose-bg) !important;
  color: var(--np-rose) !important;
  border-color: var(--np-rose) !important;
}

/* Cellule actions : alignement et resserrement */
.np-actions {
  display: flex !important;
  gap: 6px !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  justify-content: flex-end;
}
@media (max-width: 900px) {
  .np-actions { flex-wrap: wrap !important; justify-content: flex-start; }
}

/* ═══════════════════════════════════════════════════════════════════
   TABLES — lignes plus serrées
   ═══════════════════════════════════════════════════════════════════ */
.np-table th {
  padding: 8px 10px !important;
  font-size: .68rem !important;
}
.np-table td {
  padding: 9px 10px !important;
  font-size: .88rem !important;
  vertical-align: middle !important;
}
/* Méta sous le nom du document : plus discret */
.np-table .np-meta,
.np-table small.np-meta {
  font-size: .76rem !important;
  color: var(--np-mute) !important;
  display: block;
  margin-top: 2px;
  font-weight: 400;
}
/* Empêcher les 2 lignes pour le filename : ellipsis si trop long */
.np-table-wrap {
  overflow-x: auto;
}
.np-table {
  table-layout: auto;
  min-width: 720px;
}

/* ═══════════════════════════════════════════════════════════════════
   AGENDA — modale RDV unifiée + hover overlay (v1.16.5)
   ═══════════════════════════════════════════════════════════════════ */

/* Overlay et dialog */
.np-rdv-overlay {
  position: fixed; inset: 0;
  background: rgba(15, 20, 17, .55);
  z-index: 9000;
  display: flex; align-items: flex-start; justify-content: center;
  padding: 4vh 16px;
  overflow-y: auto;
}
.np-rdv-dialog {
  background: var(--np-white);
  border-radius: 12px;
  width: 100%;
  max-width: 580px;
  margin: auto;
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
  overflow: hidden;
  border: 1px solid var(--np-line-2);
}
.np-rdv-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--np-line);
  background: var(--np-cream);
}
.np-rdv-header h3 {
  margin: 0 !important;
  font-family: var(--np-serif)!important;
  font-size: 1.4rem !important;
  color: var(--np-ink) !important;
  font-weight: 600 !important;
}
.np-rdv-close {
  background: transparent; border: none; cursor: pointer;
  font-size: 1.4rem; color: var(--np-mute);
  width: 32px; height: 32px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  transition: .15s;
}
.np-rdv-close:hover { background: var(--np-cream-3); color: var(--np-ink); }

.np-rdv-body { padding: 18px 20px; }
.np-rdv-footer {
  padding: 12px 20px;
  background: var(--np-cream);
  border-top: 1px solid var(--np-line);
  display: flex; gap: 8px; align-items: center;
}

/* Toggle Patient existant / Nouveau */
.np-rdv-mode-toggle {
  display: flex; gap: 6px;
  background: var(--np-cream-2);
  padding: 4px;
  border-radius: 8px;
  margin-bottom: 14px;
}
.np-rdv-mode-opt {
  flex: 1;
  display: flex; align-items: center; justify-content: center; gap: 6px;
  padding: 8px 12px;
  border-radius: 6px;
  font-size: .88rem;
  font-weight: 500;
  color: var(--np-ink-soft);
  cursor: pointer;
  transition: .15s;
}
.np-rdv-mode-opt input { display: none; }
.np-rdv-mode-opt:hover { color: var(--np-ink); }
.np-rdv-mode-opt.np-rdv-mode-active {
  background: var(--np-white);
  color: var(--np-forest);
  font-weight: 700;
  box-shadow: 0 1px 3px rgba(0,0,0,.08);
}

/* Recherche prédictive en contexte modale */
.np-psearch-modal { position: relative; }
.np-psearch-modal .np-psearch-dropdown {
  /* dans la modale, on veut que le dropdown apparaisse au-dessus
     des champs en-dessous, sans être tronqué par overflow */
  max-height: 280px;
  z-index: 9100;
}

/* Patient sélectionné (pastille) */
.np-rdv-patient-selected {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px;
  background: var(--np-forest-xl);
  border: 1px solid var(--np-forest);
  border-radius: 8px;
  margin-top: 6px;
}
.np-rdv-patient-avatar {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--np-forest);
  color: var(--np-surface);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .78rem;
  font-weight: 600;
  flex-shrink: 0;
}
.np-rdv-patient-label {
  flex: 1;
  font-size: .92rem;
  color: var(--np-ink);
}
.np-rdv-patient-clear {
  background: transparent; border: none;
  font-size: 1.2rem; cursor: pointer;
  color: var(--np-mute);
  width: 26px; height: 26px;
  border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  transition: .15s;
}
.np-rdv-patient-clear:hover { background: rgba(255,255,255,.5); color: var(--np-ink); }

/* Form rows dans la modale */
.np-rdv-body .np-form-row { margin-bottom: 12px; }
.np-rdv-body .np-form-row label {
  display: block;
  font-size: .76rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--np-mute);
  margin-bottom: 5px;
}
.np-rdv-body .np-form-row-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.np-rdv-body .np-input,
.np-rdv-body .np-select,
.np-rdv-body .np-textarea {
  width: 100%;
  padding: 8px 12px;
  border: 1px solid var(--np-line-2);
  border-radius: var(--np-radius);
  font-size: .92rem;
  background: var(--np-white);
  color: var(--np-ink);
  font-family: var(--np-sans);
}
.np-rdv-body .np-input:focus,
.np-rdv-body .np-select:focus,
.np-rdv-body .np-textarea:focus {
  outline: none;
  border-color: var(--np-forest);
  box-shadow: 0 0 0 3px var(--np-forest-xl);
}

/* Hover overlay sur la grille agenda — indicateur 30 min */
.np-slot-hover {
  position: absolute;
  left: 0; right: 0;
  background: rgba(27, 74, 46, .12);
  border-top: 1px solid var(--np-forest);
  border-bottom: 1px solid var(--np-forest);
  z-index: 5;
  pointer-events: none;
  display: flex; align-items: center; justify-content: center;
  font-size: .8rem;
  font-weight: 600;
  color: var(--np-forest);
  font-family: var(--np-mono);
}

/* Le .np-day-body doit être positionné pour accueillir l'overlay */
.np-day-body { position: relative; }

/* Curseur pointer sur la zone cliquable */
.np-day-body { cursor: pointer; }
.np-day-body .np-event { cursor: pointer; }

/* ═══════════════════════════════════════════════════════════════════
   Items spéciaux dans la sidebar (v1.16.6)
   ═══════════════════════════════════════════════════════════════════ */

/* Item DÉSACTIVÉ — ex. "Compléments alimentaires" en attente */
.np-sidebar-link-disabled {
  display: flex !important;
  align-items: center;
  gap: 10px;
  padding: 5px 18px !important;
  color: var(--np-mute) !important;
  font-size: .88rem !important;
  font-weight: 500 !important;
  border-left: 3px solid transparent !important;
  cursor: not-allowed !important;
  opacity: .65;
  user-select: none;
}
.np-sidebar-link-disabled:hover {
  background: transparent !important;
  color: var(--np-mute) !important;
}
.np-sidebar-link-disabled .np-sidebar-link-icon {
  opacity: .55;
  filter: grayscale(.6);
}
.np-sidebar-link-disabled .np-sidebar-link-label {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.np-sidebar-link-badge {
  font-size: .58rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--np-cream-3);
  color: var(--np-mute);
  border: 1px solid var(--np-line);
  white-space: nowrap;
  flex-shrink: 0;
}

/* Item EXTERNE (target=_blank) — petite flèche ↗ après le label */
.np-sidebar-link-ext {
  margin-left: auto;
  font-size: .72rem;
  color: var(--np-mute);
  opacity: .7;
  flex-shrink: 0;
}
.np-sidebar-link:hover .np-sidebar-link-ext {
  opacity: 1;
  color: var(--np-forest);
}

/* En mode collapsed : on cache labels et badges */
.np-layout-vertical.np-sidebar-collapsed .np-sidebar-link-badge,
.np-layout-vertical.np-sidebar-collapsed .np-sidebar-link-ext {
  display: none;
}

/* ═══════════════════════════════════════════════════════════════════
   AGENDA — Toolbar harmonisée (v1.16.7)
   Override les styles legacy pour aligner tous les boutons sur la
   palette éditoriale : forest + cream + lignes fines.
   ═══════════════════════════════════════════════════════════════════ */

.np-agenda-topbar {
  background: var(--np-white) !important;
  border-bottom: 1px solid var(--np-line) !important;
  padding: 14px 22px !important;
  gap: 10px !important;
}

/* Toggle Semaine / Mois — segmented control éditorial */
.np-agenda-views {
  display: flex !important;
  background: var(--np-cream-2) !important;
  border-radius: var(--np-radius) !important;
  padding: 3px !important;
  overflow: visible !important;
  border: 1px solid var(--np-line) !important;
}
.np-view-btn {
  padding: 6px 14px !important;
  font-size: .82rem !important;
  font-weight: 600 !important;
  color: var(--np-mute) !important;
  text-decoration: none !important;
  border-radius: 4px !important;
  transition: .12s !important;
  font-family: var(--np-sans)!important;
}
.np-view-btn:hover { color: var(--np-ink-soft) !important; }
.np-view-btn.active {
  background: var(--np-forest) !important;
  color: var(--np-surface) !important;
}

/* Toggle 5 jours / 7 jours — même pattern segmented control */
.np-agenda-days-toggle {
  display: flex;
  background: var(--np-cream-2);
  border-radius: var(--np-radius);
  padding: 3px;
  border: 1px solid var(--np-line);
}
.np-agenda-days-btn {
  padding: 6px 14px;
  font-size: .82rem;
  font-weight: 600;
  color: var(--np-mute);
  text-decoration: none;
  border-radius: 4px;
  transition: .12s;
  font-family: var(--np-sans);
}
.np-agenda-days-btn:hover { color: var(--np-ink-soft); }
.np-agenda-days-btn.active {
  background: var(--np-white);
  color: var(--np-forest);
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}

/* Bouton "Connecter Google Calendar" — uniforme avec les boutons secondary */
.np-btn-gc {
  background: var(--np-white) !important;
  border: 1px solid var(--np-line-2) !important;
  color: var(--np-ink-soft) !important;
  padding: 6px 12px !important;
  border-radius: var(--np-radius) !important;
  font-size: .82rem !important;
  font-family: var(--np-sans)!important;
}
.np-btn-gc:hover {
  border-color: var(--np-forest) !important;
  color: var(--np-forest) !important;
  background: var(--np-forest-xl) !important;
}

.np-btn-gc-sync {
  background: var(--np-white) !important;
  border: 1px solid var(--np-line-2) !important;
  color: var(--np-ink-soft) !important;
  padding: 6px 12px !important;
  border-radius: var(--np-radius) !important;
  font-size: .82rem !important;
  font-family: var(--np-sans)!important;
}
.np-btn-gc-sync:hover {
  background: var(--np-forest-xl) !important;
  border-color: var(--np-forest) !important;
  color: var(--np-forest) !important;
}

/* Navigation calendrier (semaine prev/next, S18, Aujourd'hui) */
.np-cal-nav {
  background: var(--np-white) !important;
  border-bottom: 1px solid var(--np-line) !important;
  padding: 10px 22px !important;
  gap: 10px !important;
}
.np-nav-arrow {
  color: var(--np-mute) !important;
}
.np-nav-arrow:hover {
  background: var(--np-cream-2) !important;
  color: var(--np-forest) !important;
}
.np-cal-title {
  font-family: var(--np-serif)!important;
  font-size: 1.15rem !important;
  color: var(--np-ink) !important;
  font-weight: 600 !important;
}
.np-sem-num {
  font-size: .68rem !important;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--np-mute) !important;
  background: var(--np-cream-2) !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  font-weight: 600;
  border: 1px solid var(--np-line);
}
.np-today-btn {
  border: 1px solid var(--np-line-2) !important;
  border-radius: var(--np-radius) !important;
  font-size: .82rem !important;
  color: var(--np-ink-soft) !important;
  font-family: var(--np-sans)!important;
  padding: 5px 14px !important;
}
.np-today-btn:hover {
  border-color: var(--np-forest) !important;
  color: var(--np-forest) !important;
  background: var(--np-forest-xl) !important;
}

/* ════════════════════════════════════════════════════════════════════
   v1.17.0 — Palette de commandes Cmd+K / Ctrl+K
   ════════════════════════════════════════════════════════════════════ */

.np-cmdk-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 20, 17, 0.5);
  backdrop-filter: blur(3px);
  display: none;
  align-items: flex-start;
  justify-content: center;
  z-index: 10000;
  padding-top: 12vh;
}
.np-cmdk-overlay.open { display: flex; }

body.np-cmdk-open { overflow: hidden; }

.np-cmdk-modal {
  background: var(--np-surface);
  width: 100%;
  max-width: 580px;
  border-radius: 12px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.18);
  overflow: hidden;
  animation: np-cmdk-pop 0.18s ease-out;
}
@keyframes np-cmdk-pop {
  from { opacity: 0; transform: translateY(-8px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0)    scale(1); }
}

.np-cmdk-modal .np-psearch {
  position: relative;
}
.np-cmdk-modal .np-psearch-input {
  width: 100%;
  border: none !important;
  border-bottom: 1px solid var(--np-line, var(--np-line2)) !important;
  border-radius: 0 !important;
  padding: 18px 22px !important;
  font-size: 1.05rem !important;
  font-family: var(--np-serif)!important;
  color: var(--np-ink, var(--np-ink));
  background: var(--np-surface) !important;
  outline: none !important;
}
.np-cmdk-modal .np-psearch-input::placeholder {
  color: var(--np-mute, var(--np-ink3));
  font-style: italic;
}
.np-cmdk-modal .np-psearch-dropdown {
  position: static !important;
  max-height: 60vh;
  overflow-y: auto;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

.np-cmdk-footer {
  display: flex;
  gap: 18px;
  padding: 10px 22px;
  background: var(--np-cream, var(--np-paper));
  border-top: 1px solid var(--np-line, var(--np-line2));
  font-size: 0.78rem;
  color: var(--np-mute, var(--np-ink3));
}
.np-cmdk-footer kbd {
  display: inline-block;
  padding: 2px 6px;
  margin-right: 4px;
  background: var(--np-surface);
  border: 1px solid var(--np-line, var(--np-line2));
  border-radius: 4px;
  font-family: ui-monospace, 'SF Mono', Menlo, monospace;
  font-size: 0.72rem;
  color: var(--np-ink, var(--np-ink));
}

@media (max-width: 640px) {
  .np-cmdk-overlay { padding-top: 6vh; align-items: flex-start; }
  .np-cmdk-modal { max-width: calc(100vw - 24px); }
  .np-cmdk-footer { font-size: 0.72rem; flex-wrap: wrap; gap: 10px; }
}

/* ═══════════════════════════════════════════════════════════════════
   RAIL SOMBRE — v1.60.0
   ═══════════════════════════════════════════════════════════════════

   POURQUOI CE BLOC EST EN FIN DE FICHIER, ET NON DISPERSÉ PLUS HAUT.

   Tout ce fichier a été écrit pour une barre latérale ivoire : encres
   sombres, survols crème, actif en vert forêt sur fond pâle. Beaucoup de
   ces règles portent `!important`. Repeindre uniquement le fond donnait
   une barre parfaitement illisible — texte sombre sur fond sombre — ce
   qu'aucune maquette n'aurait révélé, et qu'une capture du rendu réel a
   montré immédiatement.

   Les reprendre une à une, au milieu du fichier, aurait laissé des
   oublis. Un bloc terminal, exhaustif, est vérifiable d'un coup d'œil :
   si le rail change un jour d'avis, c'est ici, et nulle part ailleurs.

   Les `!important` ci-dessous ne sont pas de la paresse : ils répondent
   à ceux qui les précèdent. Retirer les uns sans les autres casserait
   l'ensemble.
   ═══════════════════════════════════════════════════════════════════ */

.np-front .np-sidebar,
.np-layout-vertical .np-sidebar {
  background: var(--np-rail) !important;
  border-right: 1px solid var(--np-rail-line) !important;
  color: var(--np-rail-ink);
}

/* ── Marque ── */
.np-front .np-sidebar-brand {
  border-bottom: 1px solid var(--np-rail-line) !important;
}
.np-front .np-sidebar-brand-name {
  color: var(--np-rail-ink) !important;
  font-family: var(--np-serif);
  letter-spacing: -.012em;
}
.np-front .np-sidebar-brand-sub {
  color: var(--np-rail-ink3) !important;
}
/* Les logos livrés sont pensés pour un fond clair. Sur fond sombre, un
   léger éclaircissement évite le carré terne, sans les redessiner. */
.np-front .np-sidebar-brand-icon-img {
  filter: brightness(1.12) saturate(.92);
}

/* ── Bouton de repli ── */
.np-front .np-sidebar-toggle {
  background: transparent !important;
  border: 1px solid var(--np-rail-line) !important;
  color: var(--np-rail-ink3) !important;
}
.np-front .np-sidebar-toggle:hover {
  background: var(--np-rail-active) !important;
  border-color: var(--np-rail-line) !important;
  color: var(--np-rail-ink) !important;
}

/* ── Intitulés de groupe ── */
.np-front .np-sidebar-section-title {
  color: var(--np-rail-ink3) !important;
}
.np-front .np-sidebar-section + .np-sidebar-section {
  border-top: 1px solid var(--np-rail-line) !important;
}

/* ── Liens ──
   Trois états nettement séparés. Le repos est volontairement en retrait :
   un rail où tout crie ne hiérarchise plus rien. */
.np-front .np-sidebar-link {
  color: var(--np-rail-ink2) !important;
  border-left-color: transparent !important;
}
.np-front .np-sidebar-link:hover {
  background: var(--np-rail-active) !important;
  color: var(--np-rail-ink) !important;
  border-left-color: var(--np-rail-line) !important;
}
.np-front .np-sidebar-link-active,
.np-front .np-sidebar-link.np-sidebar-link-active {
  background: var(--np-rail-active) !important;
  color: #fff !important;
  border-left-color: var(--np-rail-accent) !important;
  font-weight: 600 !important;
}
.np-front .np-sidebar-link-icon { opacity: .82; }
.np-front .np-sidebar-link-active .np-sidebar-link-icon { opacity: 1; }

.np-front .np-sidebar-link-disabled {
  color: var(--np-rail-ink3) !important;
  opacity: .55;
}
.np-front .np-sidebar-link-badge {
  background: var(--np-rail-2) !important;
  color: var(--np-rail-ink2) !important;
  border: 1px solid var(--np-rail-line) !important;
}
.np-front .np-sidebar-link-active .np-sidebar-link-badge {
  background: var(--np-rail-accent) !important;
  color: var(--np-rail-2) !important;
  border-color: transparent !important;
}

/* ── Pied : compteurs de dépense, utilisateur, déconnexion ──
   C'est là que le praticien vérifie ce que lui coûte sa journée. Discret,
   jamais illisible : le libellé reste au-dessus de 4,5:1 sur le rail. */
.np-front .np-sidebar-footer {
  border-top: 1px solid var(--np-rail-line) !important;
  background: var(--np-rail-2) !important;
}
/* Le cartouche des compteurs se creuse au lieu de s'éclaircir. Éclairci,
   il rapprochait son fond de la couleur des libellés et faisait tomber
   leur contraste à 3,99:1 ; creusé, il l'élève à 5,2:1. */
.np-front .np-sidebar-ia-counters {
  background: rgba(0,0,0,.20) !important;
  border: 1px solid var(--np-rail-line) !important;
  border-radius: 8px;
}
.np-front .np-sidebar-ia-counters:hover {
  background: rgba(0,0,0,.30) !important;
  border-color: var(--np-rail-accent) !important;
}
.np-front .np-sidebar-ia-counter-label { color: var(--np-rail-ink3) !important; }
.np-front .np-sidebar-ia-counter-value {
  color: var(--np-rail-ink) !important;
  font-variant-numeric: tabular-nums;
}
.np-front .np-sidebar-user-name  { color: var(--np-rail-ink) !important; }
.np-front .np-sidebar-user-avatar {
  background: var(--np-rail-accent) !important;
  color: var(--np-rail-2) !important;
}
.np-front .np-sidebar-logout {
  color: var(--np-rail-ink3) !important;
}
.np-front .np-sidebar-logout:hover {
  color: var(--np-rail-ink) !important;
  background: var(--np-rail-active) !important;
}

/* ── Barre mobile : même famille que le rail ── */
.np-front .np-topbar {
  background: var(--np-rail) !important;
  border-bottom: 1px solid var(--np-rail-line) !important;
}
.np-front .np-topbar-brand,
.np-front .np-topbar-burger { color: var(--np-rail-ink) !important; }

/* ── Grands chiffres ──
   Le serif reste pour les noms et les titres. Un poids ou un IMC se lit
   en chiffres alignés : le serif y ferait joli et se comparerait mal. */
.np-front .np-stat-value,
.np-front .np-kpi-value {
  font-family: var(--np-sans) !important;
  font-variant-numeric: tabular-nums;
  font-weight: 600 !important;
  letter-spacing: -.02em !important;
  color: var(--np-ink) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   GROUPES DE NAVIGATION REPLIABLES — v1.60.0
   « Bases de référence » compte six entrées qu'on ouvre rarement et qui
   poussaient le pied du rail — compteurs de dépense, licence — hors de
   l'écran sur un portable. Les groupes se replient.
   Règle de sûreté : le groupe qui contient la page ouverte reste déplié,
   quoi qu'ait choisi le praticien. On ne referme pas sous ses pieds.
   ═══════════════════════════════════════════════════════════════════ */

.np-front details.np-sidebar-section > summary {
  list-style: none;
  cursor: pointer;
  display: flex; align-items: center; gap: 8px;
  user-select: none;
}
.np-front details.np-sidebar-section > summary::-webkit-details-marker { display: none; }
.np-front details.np-sidebar-section > summary:hover { color: var(--np-rail-ink2) !important; }

.np-front .np-sidebar-chevron {
  margin-left: auto; font-size: 15px; line-height: 1;
  color: var(--np-rail-ink3);
  transform: rotate(90deg);
  transition: transform .15s ease;
}
.np-front details.np-sidebar-section:not([open]) .np-sidebar-chevron {
  transform: rotate(0deg);
}

/* Replié, le groupe ne garde que son intitulé : pas de marge fantôme. */
.np-front details.np-sidebar-section:not([open]) { padding-bottom: 0; }

/* En mode réduit (rail collapsé), les intitulés disparaissent : le chevron
   n'aurait plus rien à commander. */
.np-layout-vertical.np-sidebar-collapsed .np-sidebar-chevron { display: none; }
.np-layout-vertical.np-sidebar-collapsed details.np-sidebar-section > summary {
  pointer-events: none;
}