/* Student toolbar: content-sized buttons in one horizontal row. */
@media (min-width:769px) {
  html[data-pe-tab="students"] #app.studentScreen > .studentManagementHeader {
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    column-gap:8px!important;
    row-gap:0!important;
  }
  html[data-pe-tab="students"] #app.studentScreen > .studentManagementHeader > h2 {
    flex:0 1 auto!important;
    min-width:0!important;
    white-space:normal!important;
    word-break:keep-all;
    overflow-wrap:anywhere;
  }
  html[data-pe-tab="students"] #app.studentScreen > .studentManagementHeader > .studentHeaderRosterActions,
  html[data-pe-tab="students"] #app.studentScreen > .studentManagementHeader > .studentHeaderRosterActions.hasInactiveStudents {
    display:flex!important;
    flex-flow:row nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    flex:0 1 auto!important;
    width:max-content!important;
    min-width:0!important;
    max-width:100%!important;
    margin-left:auto!important;
    gap:8px!important;
    overflow-x:auto;
    overscroll-behavior-x:contain;
  }
  html[data-pe-tab="students"] #app.studentScreen > .studentManagementHeader > .studentHeaderRosterActions > .btn,
  html[data-pe-tab="students"] #app.studentScreen > .studentManagementHeader > .studentHeaderSave {
    display:inline-flex!important;
    flex:0 0 auto!important;
    align-items:center!important;
    justify-content:center!important;
    width:max-content!important;
    min-width:0!important;
    max-width:none!important;
    height:44px!important;
    min-height:44px!important;
    padding:0 10px!important;
    margin:0!important;
    white-space:nowrap!important;
    text-align:center!important;
    line-height:1.2!important;
  }
}
@media (min-width:769px) and (max-width:1100px) {
  html[data-pe-tab="students"] #app.studentScreen > .studentManagementHeader {
    display:grid!important;
    grid-template-columns:minmax(0,1fr) max-content!important;
    row-gap:8px!important;
  }
  html[data-pe-tab="students"] #app.studentScreen > .studentManagementHeader > h2 {
    grid-column:1 / -1!important;
    grid-row:1!important;
  }
  html[data-pe-tab="students"] #app.studentScreen > .studentManagementHeader > .studentHeaderRosterActions,
  html[data-pe-tab="students"] #app.studentScreen > .studentManagementHeader > .studentHeaderRosterActions.hasInactiveStudents {
    grid-column:1!important;
    grid-row:2!important;
    margin-left:0!important;
  }
  html[data-pe-tab="students"] #app.studentScreen > .studentManagementHeader > .studentHeaderSave {
    grid-column:2!important;
    grid-row:2!important;
  }
}
@media (max-width:768px) {
  html[data-pe-tab="students"] body:has(#mobileStudentSelector) #app.studentScreen .studentRosterActions,
  html[data-pe-tab="students"] body:has(#mobileStudentSelector) #app.studentScreen .studentRosterActions.hasInactiveStudents,
  html[data-pe-tab="students"] #app.studentScreen .studentRosterActions,
  html[data-pe-tab="students"] #app.studentScreen .studentRosterActions.hasInactiveStudents {
    display:flex!important;
    flex-flow:row nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    gap:7px!important;
    overflow-x:auto!important;
    overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;
    padding-block:2px;
  }
  html[data-pe-tab="students"] body:has(#mobileStudentSelector) #app.studentScreen .studentRosterActions > .btn,
  html[data-pe-tab="students"] #app.studentScreen .studentRosterActions > .btn {
    display:inline-flex!important;
    flex:0 0 auto!important;
    align-items:center!important;
    justify-content:center!important;
    width:max-content!important;
    min-width:0!important;
    max-width:none!important;
    min-height:44px!important;
    height:44px!important;
    padding:0 9px!important;
    margin:0!important;
    white-space:nowrap!important;
    text-align:center!important;
    line-height:1.2!important;
  }
}
html[data-pe-tab="students"] body:has(#mobileStudentSelector) #app.studentScreen :is(.studentHeaderRosterActions,.studentRosterActions) .studentRosterButtonLines,
html[data-pe-tab="students"] #app.studentScreen :is(.studentHeaderRosterActions,.studentRosterActions) .studentRosterButtonLines {
  display:inline-flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  gap:.3em!important;
  white-space:nowrap!important;
}