/* Only compact phones get the proposed navigation. Card contents are untouched. */
#peV2BottomNavigation{display:none}
#mobileTabOptions .peV2SettingsEntryIcon{display:none}
html.peV2PhoneNavigation #mobileTabBar{display:none!important}
html.peV2PhoneNavigation #peV2BottomNavigation{position:fixed;z-index:900;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;padding:6px 10px calc(6px + env(safe-area-inset-bottom,0px));min-height:64px;box-sizing:border-box;background:#fff;border-top:1px solid #d9e2e8;box-shadow:0 -3px 14px #173c5b08}
html.peV2PhoneNavigation #peV2BottomNavigation button{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;min-width:0;min-height:49px;padding:5px 0;border:0;border-radius:13px;background:transparent;color:#6d8190;font:inherit;font-size:11px;font-weight:800;-webkit-tap-highlight-color:transparent}
html.peV2PhoneNavigation #peV2BottomNavigation button svg{display:block;width:21px;height:21px;flex:none}
html.peV2PhoneNavigation #peV2BottomNavigation button.is-active{background:#eaf6ff;color:#087cba}
html.peV2PhoneNavigation #peV2BottomNavigation button:focus-visible{outline:2px solid #566773;outline-offset:1px}
html.peV2PhoneNavigation #peV2BottomNavigation.is-keyboard-hidden{display:none}
html.peV2PhoneNavigation .pe87Main{padding-bottom:calc(78px + env(safe-area-inset-bottom,0px))!important}
html.peV2PhoneNavigation #mobileTabOptions [data-mobile-tab="lessonCalendar"]{display:none!important}
html.peV2PhoneNavigation #mobileTabSheet[data-v2-menu="all"] #mobileTabOptions [data-mobile-tab="workMemos"]{display:none!important}
html.peV2PhoneNavigation #mobileTabSheet[data-v2-menu="all"] #mobileTabOptions [data-mobile-tab="admin"] .peV2SettingsEntryOriginalIcon{display:none!important}
html.peV2PhoneNavigation #mobileTabSheet[data-v2-menu="all"] #mobileTabOptions [data-mobile-tab="admin"] .peV2SettingsEntryIcon{display:inline-flex;align-items:center;justify-content:center;flex:none;width:21px;height:21px}
html.peV2PhoneNavigation #mobileTabSheet[data-v2-menu="all"] #mobileTabOptions [data-mobile-tab="admin"] .peV2SettingsEntryIcon svg{display:block;width:100%;height:100%}
html.peV2PhoneNavigation #mobileTabSheet[data-v2-menu="progress"] #mobileTabOptions [data-mobile-tab]:not([data-mobile-tab="progress"]):not([data-mobile-tab="calendar"]),
html.peV2PhoneNavigation #mobileTabSheet[data-v2-menu="records"] #mobileTabOptions [data-mobile-tab]:not([data-mobile-tab="assessment"]):not([data-mobile-tab="paps"]){display:none!important}
html.peV2PhoneNavigation #mobileTabSheet[data-v2-menu="progress"] .peCreatorCredit,
html.peV2PhoneNavigation #mobileTabSheet[data-v2-menu="records"] .peCreatorCredit{display:none!important}
html.peV2PhoneNavigation #mobileTabSheet .mobileTabOptions{grid-template-columns:minmax(0,1fr)!important}
html.peV2PhoneNavigation #mobileTabSheet .mobileTabSheetPanel{padding-bottom:calc(18px + env(safe-area-inset-bottom,0px))!important}
/* Use the existing first important layer so the legacy active colour cannot
   override this. Keep aria-current and keyboard focus; only saved tint goes. */
@layer peV2SoftBlue20261018n {
  html.peV2PhoneNavigation #mobileTabSheet[data-v2-menu] #mobileTabOptions [data-mobile-tab]:is(.active,[aria-current="page"]) {
    background:#fff!important;color:#333!important;
    border-color:#d4d4d4!important;box-shadow:none!important;
  }
}
/* Foundation owns fixed-body position and restores its original scroll offset.
   These rules contain nested scrollers without overwriting another modal lock. */
html.peV2PhoneNavigation.peV2NavigationSheetOpen,
html.peV2PhoneNavigation body.peV2NavigationSheetOpen{overflow:hidden!important;overscroll-behavior:none}
html.peV2PhoneNavigation.peV2NavigationSheetOpen #mobileTabSheet{overscroll-behavior:none}
html.peV2PhoneNavigation.peV2NavigationSheetOpen #mobileTabSheet .mobileTabBackdrop{touch-action:none}
html.peV2PhoneNavigation.peV2NavigationSheetOpen #mobileTabSheet .mobileTabSheetPanel{touch-action:pan-y;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
