/* Pubzone V4.5.5 — navigation compacte + PWA native-like
 * Important : ce fichier ne modifie pas les cartes métier du dashboard,
 * SafeLink, confiance, WordPress, etc. Il reste limité à la navigation.
 */

/* ---------- Sidebar desktop ---------- */
.member-side-v453 .member-nav-v453{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
}
.member-side-v453 .member-nav-title{
  margin:2px 12px 7px!important;
  color:#a2a8b7!important;
  font-size:.69rem!important;
  font-weight:900!important;
  letter-spacing:.13em!important;
}
.member-side-v453 .member-nav-v453>a,
.member-side-v453 .member-nav-sub>a{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.member-side-v453 .member-nav-v453>a>span,
.member-side-v453 .member-nav-sub>a>span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.member-nav-group-v453{margin:0;padding:0;border:0;min-width:0}
.member-nav-group-v453>summary{
  list-style:none;
  display:grid;
  grid-template-columns:24px minmax(0,1fr) 12px;
  align-items:center;
  gap:8px;
  min-height:45px;
  padding:7px 10px;
  border-radius:13px;
  color:#626c82;
  font-size:.94rem;
  font-weight:850;
  cursor:pointer;
  user-select:none;
  transition:background .18s ease,color .18s ease;
}
.member-nav-group-v453>summary::-webkit-details-marker{display:none}
.member-nav-group-v453>summary:hover{background:#f5f3ff;color:#5547d9}
.member-nav-group-v453>summary>i{
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  font-style:normal;
  font-weight:900;
  color:#667087;
}
.member-nav-group-v453>summary>span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.member-nav-group-v453>summary>b{
  font-size:.74rem;
  font-weight:900;
  line-height:1;
  transform:rotate(-90deg);
  transition:transform .18s ease;
  color:#a3a9b8;
}
.member-nav-group-v453[open]>summary{background:#f7f5ff;color:#5547d9}
.member-nav-group-v453[open]>summary>b{transform:rotate(0)}
.member-nav-sub{
  display:grid;
  gap:2px;
  margin:3px 0 5px 11px;
  padding:2px 0 3px 10px;
  border-left:2px solid #ebe8ff;
}
.member-nav-sub>a{
  position:relative;
  min-height:39px!important;
  padding:7px 9px!important;
  border-radius:10px!important;
  font-size:.87rem!important;
}
.member-nav-sub>a>i{
  display:grid!important;
  place-items:center!important;
  width:22px!important;
  min-width:22px!important;
  font-size:.84rem!important;
  font-style:normal!important;
}
.member-nav-sub>a.active{background:#ebe8ff!important;color:#5548dd!important}
.member-nav-sub>a.active:before{
  content:"";
  position:absolute;
  left:-13px;
  top:9px;
  bottom:9px;
  width:3px;
  border-radius:99px;
  background:#6557ef;
}
.member-nav-sub .nav-lock{margin-left:auto;flex:0 0 auto}
.member-side-v453 .credit-box{margin-top:10px}

/* ---------- Bouton menu en haut à droite PWA/mobile ---------- */
.pwa-top-menu{
  display:none;
  align-items:center;
  justify-content:center;
  width:46px;
  height:46px;
  padding:0;
  border:1px solid #e4e6ef;
  border-radius:14px;
  background:#fff;
  color:#11182d;
  box-shadow:0 5px 18px rgba(17,24,39,.04);
  font:inherit;
  cursor:pointer;
}
.pwa-top-menu span{font-size:1.18rem;line-height:1}

/* ---------- Menu mobile latéral ---------- */
.mobile-menu-v453{overflow:auto!important;overscroll-behavior:contain}
.mobile-menu-v453>details{border-top:1px solid #eceaf3}
.mobile-menu-v453>details>summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:50px;
  padding:12px 3px;
  font-weight:850;
  color:#575f73;
  cursor:pointer;
}
.mobile-menu-v453>details>summary::-webkit-details-marker{display:none}
.mobile-menu-v453>details>summary b{
  font-size:.76rem;
  transform:rotate(-90deg);
  transition:transform .18s ease;
  color:#9aa0ae
}
.mobile-menu-v453>details[open]>summary b{transform:rotate(0)}
.mobile-menu-v453>details>section{display:grid;gap:4px;padding:0 0 10px 8px}
.mobile-menu-v453>details>section>a{
  display:flex!important;
  align-items:center;
  min-height:42px;
  padding:9px 11px!important;
  border-radius:11px!important;
  background:#f8f7fc;
}
.mobile-menu-v453>a.active,
.mobile-menu-v453>details>section>a.active{background:#ebe8ff!important;color:#5548dd!important;font-weight:850}

/* ---------- PWA / mobile ---------- */
@media(max-width:760px){
  html,body{max-width:100%;overflow-x:hidden}
  body.mobile-menu-open{overflow:hidden}

  .member-side{display:none!important}
  .member-main{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    padding-bottom:calc(82px + env(safe-area-inset-bottom))!important;
    overflow-x:hidden;
  }

  .member-head{
    position:sticky!important;
    top:0;
    z-index:850;
    min-height:74px;
    padding:10px 12px!important;
    gap:8px!important;
    background:rgba(255,255,255,.96)!important;
    border-bottom:1px solid #e9ebf3!important;
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
  }
  .member-head .logo{flex:0 0 auto;min-width:0}
  .member-head .logo>span:last-child{font-size:1.45rem}

  .member-search{
    width:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    height:46px!important;
    margin-left:auto!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    border-radius:14px!important;
    overflow:hidden!important;
  }
  .member-search>span{margin:0!important;font-size:1.2rem}
  .member-search input,.member-search kbd{display:none!important}

  .member-actions{display:flex!important;align-items:center!important;gap:7px!important;margin-left:0!important}
  .member-actions .head-icon{width:46px!important;height:46px!important;min-width:46px!important;border-radius:14px!important}
  .member-actions .user-chip{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
  }
  .member-actions .user-chip>span{width:46px!important;height:46px!important;min-width:46px!important;border-radius:14px!important}
  .member-actions .user-chip>div,.member-actions .user-chip>i{display:none!important}
  .pwa-top-menu{display:inline-flex!important;flex:0 0 46px}

  /* Bottom navigation V4.5.5 : vraie barre d’app fixe, bord à bord, sans carte flottante. */
  .mobile-dock{
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    z-index:1000!important;
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    align-items:stretch!important;
    gap:0!important;
    min-height:calc(66px + env(safe-area-inset-bottom))!important;
    padding:4px 4px env(safe-area-inset-bottom)!important;
    margin:0!important;
    border:0!important;
    border-top:1px solid rgba(255,255,255,.10)!important;
    border-radius:0!important;
    background:#11182b!important;
    box-shadow:0 -8px 24px rgba(17,24,43,.14)!important;
  }
  .mobile-dock>a{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;
    min-width:0!important;
    min-height:62px!important;
    padding:5px 2px 4px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    color:#aeb6c9!important;
    text-decoration:none!important;
    box-shadow:none!important;
    transform:none!important;
    font:inherit!important;
    -webkit-tap-highlight-color:transparent;
  }
  .mobile-dock>a::before{
    content:"";
    position:absolute;
    top:0;
    left:50%;
    width:30px;
    height:3px;
    border-radius:0 0 3px 3px;
    background:transparent;
    transform:translateX(-50%);
  }
  .mobile-dock>a>i{
    display:grid!important;
    place-items:center!important;
    width:30px!important;
    height:28px!important;
    margin:0!important;
    border-radius:0!important;
    background:transparent!important;
    color:inherit!important;
    font-size:1.08rem!important;
    font-style:normal!important;
    line-height:1!important;
    transform:none!important;
  }
  .mobile-dock>a>span{
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.68rem!important;
    line-height:1.05!important;
    font-weight:650!important;
  }
  .mobile-dock>a.active{color:#fff!important}
  .mobile-dock>a.active::before{background:#7064ff!important}
  .mobile-dock>a.active>i{color:#8f86ff!important;background:transparent!important}
  .mobile-dock>a>b{
    position:absolute!important;
    top:7px!important;
    left:calc(50% + 8px)!important;
    right:auto!important;
    display:grid!important;
    place-items:center!important;
    min-width:16px!important;
    height:16px!important;
    padding:0 4px!important;
    border:2px solid #11182b!important;
    border-radius:999px!important;
    background:#ef4444!important;
    color:#fff!important;
    font-size:.58rem!important;
    line-height:1!important;
  }

  /* Drawer depuis la droite, comme une vraie app. */
  .mobile-menu-sheet{
    position:fixed!important;
    inset:0!important;
    z-index:1200!important;
    display:block!important;
    padding:0!important;
    background:rgba(12,18,32,.34)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transition:opacity .2s ease,visibility .2s ease!important;
  }
  .mobile-menu-sheet.is-open,
  .mobile-menu-sheet.open,
  .mobile-menu-sheet[aria-hidden="false"]{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
  .mobile-menu-card{
    position:absolute!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:auto!important;
    width:min(88vw,370px)!important;
    max-width:370px!important;
    height:100dvh!important;
    max-height:none!important;
    margin:0!important;
    padding:calc(18px + env(safe-area-inset-top)) 18px calc(28px + env(safe-area-inset-bottom))!important;
    border:0!important;
    border-radius:26px 0 0 26px!important;
    background:#fff!important;
    box-shadow:-24px 0 60px rgba(17,24,39,.22)!important;
    transform:translateX(102%)!important;
    transition:transform .24s cubic-bezier(.2,.8,.2,1)!important;
    overflow:auto!important;
  }
  .mobile-menu-sheet.is-open .mobile-menu-card,
  .mobile-menu-sheet.open .mobile-menu-card,
  .mobile-menu-sheet[aria-hidden="false"] .mobile-menu-card{transform:translateX(0)!important}
  .mobile-menu-card>div:first-child{
    position:sticky;
    top:calc(-18px - env(safe-area-inset-top));
    z-index:2;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    margin:0 -2px 10px!important;
    padding:16px 2px 12px!important;
    background:#fff;
    font-size:1rem;
    font-weight:900;
  }
  .mobile-menu-card [data-mobile-menu-close]{
    display:grid!important;
    place-items:center!important;
    width:42px!important;
    height:42px!important;
    padding:0!important;
    border:1px solid #e5e7ef!important;
    border-radius:13px!important;
    background:#f7f8fb!important;
    color:#11182d!important;
    font-size:1.35rem!important;
  }
}

@media(max-width:520px){
  .member-head{padding-inline:10px!important}
  .member-head .logo>span:last-child{font-size:1.31rem}
  .member-search,.member-actions .head-icon,.member-actions .user-chip,.member-actions .user-chip>span,.pwa-top-menu{
    width:43px!important;height:43px!important;min-width:43px!important;flex-basis:43px!important
  }
  .mobile-dock{left:8px!important;right:8px!important;border-radius:20px!important}
  .mobile-dock>a>span,.mobile-dock>button>span{font-size:.65rem!important}
}

@media(display-mode:standalone) and (max-width:760px){
  .member-head{padding-top:calc(10px + env(safe-area-inset-top))!important}
  .mobile-dock{bottom:calc(7px + env(safe-area-inset-bottom))!important}
}

/* ========================================================================== 
   PUBZONE V4.5.5 — RESET FINAL PWA / MOBILE
   Ce bloc DOIT rester en dernier : il neutralise les anciennes règles qui
   recréaient une barre flottante/arrondie sur <=520px et en standalone.
   ========================================================================== */
@media (max-width:760px){
  :root{
    --pz-mobile-header-h:72px;
    --pz-mobile-dock-h:64px;
  }

  html,body{
    width:100%!important;
    max-width:100%!important;
    min-height:100%!important;
    overflow-x:hidden!important;
  }

  /* Header applicatif réellement fixe */
  .member-head{
    position:fixed!important;
    inset:0 0 auto 0!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    max-width:none!important;
    min-height:calc(var(--pz-mobile-header-h) + env(safe-area-inset-top))!important;
    height:auto!important;
    margin:0!important;
    padding:calc(10px + env(safe-area-inset-top)) 12px 10px!important;
    border-radius:0!important;
    border:0!important;
    border-bottom:1px solid #e8eaf1!important;
    background:rgba(255,255,255,.98)!important;
    box-shadow:0 2px 14px rgba(17,24,39,.06)!important;
    z-index:1150!important;
    box-sizing:border-box!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
  }

  /* Compense le header fixe et le dock fixe */
  .member-main{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding-top:calc(var(--pz-mobile-header-h) + env(safe-area-inset-top) + 18px)!important;
    padding-bottom:calc(var(--pz-mobile-dock-h) + env(safe-area-inset-bottom) + 18px)!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
  }

  /* Sur mobile, le footer web n'a pas sa place derrière une navigation native. */
  .member-footer{
    display:none!important;
  }

  /* VRAIE bottom navigation : collée aux 4 bords utiles, sans aucun arrondi. */
  .mobile-dock,
  body .mobile-dock,
  .member-app .mobile-dock{
    position:fixed!important;
    inset:auto 0 0 0!important;
    top:auto!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:100%!important;
    max-width:none!important;
    min-width:100%!important;
    height:auto!important;
    min-height:calc(var(--pz-mobile-dock-h) + env(safe-area-inset-bottom))!important;
    margin:0!important;
    padding:3px 0 env(safe-area-inset-bottom)!important;
    gap:0!important;
    border:0!important;
    border-top:1px solid rgba(255,255,255,.10)!important;
    border-radius:0!important;
    outline:0!important;
    background:#11182b!important;
    box-shadow:0 -4px 18px rgba(17,24,43,.14)!important;
    overflow:visible!important;
    transform:none!important;
    box-sizing:border-box!important;
    z-index:1200!important;
  }

  .mobile-dock>a,
  .mobile-dock>button{
    border-radius:0!important;
    margin:0!important;
    box-shadow:none!important;
    background:transparent!important;
    transform:none!important;
  }

  /* Aucun ancien pseudo-fond arrondi ne doit survivre. */
  .mobile-dock::before,
  .mobile-dock::after{
    display:none!important;
    content:none!important;
  }

  /* Le drawer passe au-dessus du header et du dock. */
  .mobile-menu-sheet{
    z-index:1400!important;
  }
}

/* Neutralisation EXPLICITE des deux règles fautives de la V4.5.4. */
@media (max-width:520px){
  .mobile-dock,
  body .mobile-dock,
  .member-app .mobile-dock{
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:100%!important;
    margin:0!important;
    border-radius:0!important;
  }
}

@media (display-mode:standalone) and (max-width:760px){
  .member-head{
    top:0!important;
    padding-top:calc(10px + env(safe-area-inset-top))!important;
    border-radius:0!important;
  }
  .mobile-dock,
  body .mobile-dock,
  .member-app .mobile-dock{
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:100%!important;
    margin:0!important;
    border-radius:0!important;
    padding-bottom:env(safe-area-inset-bottom)!important;
  }
}