/* Quiet navigation is presentation-only. Existing study controls, sessions and
   saved schedules remain mounted, with their original event handlers intact. */

/* The four core actions keep the same order at every width and in both layouts. */
html[data-theme] body#studyTickApp.low-stimulation:not(.focus-view)
  #studyTickHeader .st-primary > :is(#stNavDashboard,#stTimetableNav,#focusView,#stReflectNav),
html[data-theme] body#studyTickApp.low-stimulation:not(.focus-view)
  #stNavSidebar .st-primary > :is(#stNavDashboard,#stTimetableNav,#focusView,#stReflectNav) {
  min-height:46px!important;
}

/* Some smaller screens run the separate legacy five-tab mobile navigation.
   During quiet mode, use the original four header actions instead to prevent
   Group Timer, TickNotes and More from reappearing as extra destinations. */
@media(max-width:700px) {
  html[data-theme] body#studyTickApp.low-stimulation:not(.focus-view) #stMobileNav {
    display:none!important;
  }
  html[data-theme] body#studyTickApp.st-mobile-ready.low-stimulation:not(.focus-view)
    > header#studyTickHeader.st-refined .st-toolbar {
    display:flex!important;
  }
  html[data-theme] body#studyTickApp.low-stimulation:not(.focus-view)
    #studyTickHeader.st-refined .st-toolbar {
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    gap:8px!important;
    width:100%!important;
  }
  html[data-theme] body#studyTickApp.low-stimulation:not(.focus-view)
    #studyTickHeader.st-refined .st-toolbar .st-primary {
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    flex:1 1 100%!important;
    order:2!important;
    overflow:visible!important;
  }
  html[data-theme] body#studyTickApp.low-stimulation:not(.focus-view)
    #studyTickHeader.st-refined .st-toolbar .st-primary > :is(#stNavDashboard,#stTimetableNav,#focusView,#stReflectNav) {
    display:inline-flex!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    min-height:48px!important;
    height:auto!important;
    padding:9px 6px!important;
    align-items:center!important;
    justify-content:center!important;
    white-space:normal!important;
    text-align:center!important;
    box-sizing:border-box!important;
  }
  html[data-theme] body#studyTickApp.low-stimulation:not(.focus-view) #stNavDashboard {order:1!important}
  html[data-theme] body#studyTickApp.low-stimulation:not(.focus-view) #stTimetableNav {order:2!important}
  html[data-theme] body#studyTickApp.low-stimulation:not(.focus-view) #focusView {order:3!important}
  html[data-theme] body#studyTickApp.low-stimulation:not(.focus-view) #stReflectNav {order:4!important}

  /* Menu is a setting/exit, not a fifth study destination: it must remain
     reachable so that users can switch Low Stimulation off at any time. */
  html[data-theme] body#studyTickApp.low-stimulation:not(.focus-view)
    #studyTickHeader.st-refined .st-toolbar .st-utility {
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    flex:1 1 100%!important;
    order:1!important;
  }
  html[data-theme] body#studyTickApp.low-stimulation:not(.focus-view)
    #studyTickHeader.st-refined .st-toolbar #studyTickMenu {
    display:inline-flex!important;
    width:46px!important;
    min-width:46px!important;
    min-height:46px!important;
  }
}

/* Mobile: remove the legacy bottom five-tab bar without removing destinations. */
@media (max-width:700px) {
  html[data-theme] body#studyTickApp #stMobileNav {
    display:none!important;
  }
  html[data-theme] body#studyTickApp.st-mobile-ready:not(.focus-view)
    > header#studyTickHeader.st-refined .st-toolbar {
    display:flex!important;
  }
}