.mobile-page-nav{display:none}
@media(max-width:600px){
  .app-shell{display:block!important;padding-bottom:0!important}

  /* Dashboard mobile: una sola barra orizzontale, senza seconda riga sovrapposta */
  .sidebar{
    display:flex!important;
    align-items:stretch!important;
    gap:8px!important;
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    top:auto!important;
    width:100%!important;
    height:auto!important;
    max-height:none!important;
    z-index:100!important;
    padding:8px 8px calc(8px + env(safe-area-inset-bottom))!important;
    background:rgba(247,247,251,.97)!important;
    border-top:1px solid var(--line)!important;
    box-shadow:0 -10px 30px rgba(32,29,53,.14)!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    backdrop-filter:blur(10px)!important;
    scrollbar-width:none!important
  }
  .sidebar::-webkit-scrollbar{display:none!important}
  .sidebar .brand,.sidebar .profile{display:none!important}

  /* nav e sidebar-bottom diventano un'unica riga scorrevole */
  .sidebar nav,.sidebar-bottom{display:contents!important}

  .sidebar .nav-item,.sidebar .nav-item:not(.active){
    flex:0 0 82px!important;
    min-width:82px!important;
    min-height:58px!important;
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:3px!important;
    margin:0!important;
    padding:8px 7px!important;
    border-radius:12px!important;
    background:#fff!important;
    border:1px solid var(--line)!important;
    color:#686378!important;
    box-shadow:0 6px 14px rgba(50,38,84,.08)!important;
    font-size:9.5px!important;
    line-height:1.08!important;
    white-space:normal!important;
    text-align:center!important
  }
  .sidebar .nav-item span{
    display:block!important;
    width:auto!important;
    margin:0!important;
    font-size:18px!important;
    line-height:1!important
  }
  .sidebar .nav-item.active{
    background:linear-gradient(135deg,#071c35,#0f3d67)!important;
    color:#fff!important;
    border-color:rgba(216,167,61,.55)!important;
    box-shadow:inset 0 0 0 1px rgba(216,167,61,.10),0 6px 14px rgba(7,28,53,.18)!important
  }

  .app-shell>main{padding-bottom:calc(118px + env(safe-area-inset-bottom))!important}
  .sealed-screen,.category-list{padding-bottom:calc(118px + env(safe-area-inset-bottom))!important}

  body.has-mobile-page-nav{padding-bottom:calc(92px + env(safe-area-inset-bottom))}
  .mobile-page-nav{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:70;
    display:flex;
    gap:8px;
    overflow-x:auto;
    padding:8px 8px calc(8px + env(safe-area-inset-bottom));
    background:rgba(247,247,251,.96);
    border-top:1px solid var(--line);
    box-shadow:0 -10px 30px rgba(32,29,53,.14);
    backdrop-filter:blur(10px);
    scrollbar-width:none
  }
  .mobile-page-nav::-webkit-scrollbar{display:none}
  .mobile-page-nav-item{
    flex:0 0 auto;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    min-width:86px;
    min-height:55px;
    padding:9px 10px;
    border-radius:12px;
    background:#fff;
    border:1px solid var(--line);
    color:#686378;
    box-shadow:0 6px 14px rgba(50,38,84,.08);
    font-size:10px;
    font-weight:700;
    line-height:1.15;
    text-align:center;
    text-decoration:none
  }
  .mobile-page-nav-item span{display:block;font-size:18px;margin-bottom:3px}
  .mobile-page-nav-item.active{
    background:linear-gradient(135deg,#071c35,#0f3d67);
    color:#fff;
    border-color:rgba(216,167,61,.55)
  }

  /* FM 2.0 viene caricato dopo alcuni CSS: questa regola più specifica impedisce
     che la sidebar desktop torni verticale e copra la dashboard su iPhone. */
  body.pv-v2 .app-shell>.sidebar{
    position:fixed!important;
    inset:auto 0 0 0!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:stretch!important;
    width:100vw!important;
    min-width:0!important;
    max-width:100vw!important;
    height:auto!important;
    min-height:0!important;
    max-height:calc(78px + env(safe-area-inset-bottom))!important;
    margin:0!important;
    transform:none!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
  }
  body.pv-v2 .app-shell>.sidebar nav,
  body.pv-v2 .app-shell>.sidebar .sidebar-bottom{display:contents!important}
  body.pv-v2 .app-shell>main{
    margin-left:0!important;
    width:100%!important;
    max-width:100%!important;
    padding-left:16px!important;
    padding-right:16px!important;
    padding-bottom:calc(118px + env(safe-area-inset-bottom))!important;
  }
}
