/* Attendance picker only. Keep existing classroom, assessment and note layouts. */
.classroomFlow [data-attendance-picker]{min-width:0;max-width:100%}
.classroomFlow .classroomRosterEditor .classroomStatusButtons{
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;
  min-width:0;max-width:100%;
}
.classroomFlow .classroomRosterEditor .classroomStatusButtons button{
  display:grid;place-items:center;align-content:center;gap:3px;
  min-width:0;min-height:50px;margin:0;padding:5px 2px;
  font-size:12px;line-height:1.2;text-align:center;white-space:nowrap;
  word-break:keep-all;overflow-wrap:normal;box-sizing:border-box;
}
.classroomFlow .classroomStatusButtons button.pending{border-style:dashed}
.classroomFlow .classroomAttendanceReasons{
  min-width:0;max-width:100%;margin-top:9px;padding:9px;
  border:1px solid #dbe7f1;border-radius:9px;background:#f3f8fc;box-sizing:border-box;
}
.classroomFlow .classroomAttendanceReasonHead{
  display:flex;align-items:center;justify-content:space-between;gap:6px;
  min-width:0;margin-bottom:7px;color:#58718a;font-size:11px;line-height:1.5;
}
.classroomFlow .classroomAttendanceReasonHead>span{min-width:0;word-break:keep-all;overflow-wrap:anywhere}
.classroomFlow .classroomAttendanceReasonHead>button{
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  min-height:30px;min-width:40px;margin:0;padding:3px 7px;
  border:1px solid #cbdbe9;border-radius:7px;background:#fff;color:#58718a;
  font:inherit;text-align:center;white-space:nowrap;
}
.classroomFlow .classroomAttendanceReasonButtons{
  display:grid;grid-template-columns:repeat(var(--attendance-reason-count,3),minmax(0,1fr));
  gap:5px;min-width:0;max-width:100%;
}
.classroomFlow .classroomAttendanceReasonButtons>button{
  display:flex;align-items:center;justify-content:center;min-width:0;min-height:44px;
  margin:0;padding:5px 2px;border:1px solid #cbdbe9;border-radius:8px;
  background:#fff;color:#476581;font:inherit;font-size:12px;font-weight:800;
  line-height:1.3;text-align:center;white-space:nowrap;word-break:keep-all;box-sizing:border-box;
}
.classroomFlow .classroomAttendanceReasonButtons>button.active{
  border-color:#4098d0;background:#e7f4ff;color:#096aa7;box-shadow:inset 0 0 0 1px #4098d0;
}
.classroomFlow .classroomAttendanceLegacy{display:block;margin-top:7px;color:#738597;font-size:11px;line-height:1.5}
.classroomFlow .classroomBulkAttendanceReasons{grid-column:1/-1;width:100%;flex:0 0 100%;margin-top:0}
.classroomFlow .classroomRosterStatus.status-early_leave{background:#fff1e6;color:#aa5726}
.classroomFlow .classroomRosterStatus{max-width:none}
.classroomFlow .classroomAttendanceBadgeText{display:grid;gap:1px;padding-block:3px;text-align:center;line-height:1.15}
.classroomFlow .classroomAttendanceBadgeText small{font-size:.9em;font-weight:700}
@media(max-width:600px){
  .classroomFlow .classroomRosterEditor .classroomStatusButtons{gap:4px}
  .classroomFlow .classroomRosterEditor .classroomStatusButtons button{font-size:11px;min-height:48px}
  .classroomFlow .classroomAttendanceReasons{padding:7px}
  .classroomFlow .classroomAttendanceReasonButtons>button{font-size:11px}
}
@media(max-width:360px){
  .classroomFlow .classroomRosterEditor .classroomStatusButtons{gap:3px}
  .classroomFlow .classroomRosterEditor .classroomStatusButtons button{font-size:10px}
  .classroomFlow .classroomAttendanceReasonButtons>button{font-size:10px}
}