/* Vantage RP — navigation du panel V2 pour les pages qui gardent leur ancienne feuille de style
   (Téléphone, Métier : l'appli reste la même, seul le cadre change). Autonome : ne dépend pas de v2.css,
   n'écrase aucune variable de la page (tout est posé sur les éléments de la navigation). */
.pnav, .v2-appbar, .pnav-scrim {
  --n-text: #F5F5F7; --n-text-2: #D2D2D7; --n-muted: #86868B; --n-violet: #8B5CF6; --n-violet-hi: #A78BFA; --n-pink: #EC4899;
  --n-ease: cubic-bezier(0.32, 0.72, 0, 1);
  font-family: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased; box-sizing: border-box;
}
.pnav *, .v2-appbar * { box-sizing: border-box; }
.pnav a, .v2-appbar a { text-decoration: none; }
.pnav button, .v2-appbar button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; padding: 0; }
.pnav :focus-visible, .v2-appbar :focus-visible { outline: 2px solid var(--n-violet-hi); outline-offset: 3px; border-radius: .375rem; }

.pnav { position: fixed; z-index: 7000; top: 0; bottom: 0; left: 0; width: 16rem; max-width: 86vw; display: flex; flex-direction: column; gap: .125rem; margin: 0; padding: calc(.75rem + env(safe-area-inset-top, 0px)) .75rem calc(1rem + env(safe-area-inset-bottom, 0px)); background: #0B0A0E; box-shadow: inset -1px 0 0 rgba(255,255,255,.06); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; color: var(--n-text); font-size: 16px; line-height: 1.4; text-align: left; }
.pnav::-webkit-scrollbar { display: none; }
.pnav-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: 0 .25rem .5rem .5rem; }
.pnav-brand { display: inline-flex; align-items: center; gap: .625rem; min-height: 2.75rem; min-width: 0; font-weight: 600; letter-spacing: -.01em; color: var(--n-text); }
.pnav-brand img { width: 1.75rem; height: 1.75rem; flex: none; border-radius: .5rem; object-fit: contain; }
.pnav-brand span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pnav-label { margin: 1rem .75rem .375rem; font-size: .6875rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--n-muted); }
.pnav-link { display: flex; align-items: center; gap: .75rem; min-height: 2.75rem; padding: 0 .75rem; border-radius: .75rem; font-size: .9375rem; font-weight: 500; color: var(--n-text-2); transition: background-color 160ms ease, color 160ms ease; }
.pnav-link svg { width: 1.25rem; height: 1.25rem; flex: none; opacity: .75; }
.pnav-link[aria-current="page"] { background: rgba(139,92,246,.14); color: var(--n-text); box-shadow: inset 0 0 0 1px rgba(139,92,246,.3); }
.pnav-link[aria-current="page"] svg { color: var(--n-violet-hi); opacity: 1; }
.pnav-link[target="_blank"]::after { content: '↗'; margin-left: auto; font-size: .8125rem; color: var(--n-muted); }
@media (hover: hover) and (pointer: fine) { .pnav-link:not([aria-current]):hover { background: rgba(255,255,255,.05); color: var(--n-text); } }
.pnav-foot { margin-top: auto; padding-top: 1.25rem; display: grid; gap: .375rem; }
.pnav-user { display: flex; align-items: center; gap: .625rem; min-width: 0; padding: .5rem .75rem; border-radius: .75rem; background: rgba(255,255,255,.04); }
.pnav-user .av { width: 2rem; height: 2rem; flex: none; display: grid; place-items: center; border-radius: 50%; font-size: .875rem; font-weight: 600; color: #fff; background: linear-gradient(135deg, var(--n-violet), var(--n-pink)); }
.pnav-user .nm { min-width: 0; font-size: .875rem; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pnav-old { display: inline-flex; align-items: center; gap: .5rem; min-height: 2.5rem; padding: 0 .75rem; border-radius: .75rem; font-size: .8125rem; color: var(--n-muted); }
.pnav-old b { font: 600 .6875rem/1 ui-monospace, 'Geist Mono', monospace; color: #fff; background: var(--n-violet); border-radius: 980px; padding: .3125rem .4375rem; }
.pnav-x, .v2-appbar .app-menu { display: none; }
.pnav-scrim { display: none; }

/* Barre du haut (< 1200 px) : bouton Menu + titre de la page */
.v2-appbar { position: fixed; top: 0; left: 0; right: 0; z-index: 6000; height: calc(2.75rem + env(safe-area-inset-top, 0px)); padding: env(safe-area-inset-top, 0px) 16px 0; display: flex; align-items: center; gap: 1rem; background: rgba(0,0,0,.72); -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%); color: var(--n-text); font-size: 15px; }
.v2-appbar .t { font-weight: 600; letter-spacing: -.012em; }

@media (min-width: 1200px) {
  body.has-pnav { padding-left: 16rem !important; }
  .v2-appbar { display: none; }
}
@media (max-width: 1199px) {
  .pnav { transform: translateX(-100%); visibility: hidden; box-shadow: 0 0 3rem rgba(0,0,0,.7); transition: transform 320ms var(--n-ease), visibility 0s linear 320ms; }
  .pnav-open .pnav { transform: none; visibility: visible; transition: transform 320ms var(--n-ease), visibility 0s; }
  .pnav-scrim { display: block; position: fixed; inset: 0; z-index: 6500; background: rgba(0,0,0,.55); opacity: 0; pointer-events: none; transition: opacity 240ms ease; }
  .pnav-open .pnav-scrim { opacity: 1; pointer-events: auto; }
  html.pnav-open { overflow: hidden; }
  .pnav-x { display: block; position: relative; flex: none; width: 2.75rem; height: 2.75rem; border-radius: 50%; }
  .pnav-x::before, .pnav-x::after { content: ''; position: absolute; left: 50%; top: 50%; width: .875rem; height: 1.5px; border-radius: 1px; background: var(--n-text-2); }
  .pnav-x::before { transform: translate(-50%, -50%) rotate(45deg); } .pnav-x::after { transform: translate(-50%, -50%) rotate(-45deg); }
  .v2-appbar .app-menu { display: inline-flex; align-items: center; gap: .4375rem; min-height: 2.75rem; font-size: 15px; color: var(--n-violet-hi); }
  .v2-appbar .app-menu svg { width: 1.25rem; height: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) { .pnav, .pnav-open .pnav, .pnav-scrim { transition: none; } }
