/* Consistent editable forms at every device width and display-zoom setting.
   Scope to app controls, leaving report previews, ledgers and exports intact. */
@media screen {
 #daily .fields,#school .fields,#enrollment .fields,#stock .fields,
 #allocation .fields,#reportControls .fields {
  grid-template-columns:minmax(0,1fr)!important;
 }
 #enrollment #classSetupRows .classSetupRow.genderClassRow {
  grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,.72fr)) minmax(42px,.9fr)!important;
  gap:4px!important;padding:8px 0!important;align-items:end;width:100%;min-width:0;
 }
 #enrollment #classSetupRows .classSetupRow.genderClassRow label {
  font-size:11px!important;white-space:nowrap;margin:3px 0!important;min-width:0;
 }
 #enrollment #classSetupRows .classSetupRow.genderClassRow input {
  font-size:14px!important;min-height:40px;height:40px;padding:7px 4px!important;min-width:0!important;width:100%;box-sizing:border-box;
 }
 #enrollment #classSetupRows .classSetupRow.genderClassRow button {
  grid-column:auto!important;justify-self:stretch;align-self:end;width:100%;min-width:0;margin:0 0 3px!important;min-height:40px!important;white-space:nowrap;
  font-size:10px!important;padding:7px 3px!important;
 }
 #reportControls .reportShareRow {flex-direction:column;align-items:stretch}
}

/* Enrollment actions share a compact row, with a fixed place for Edit. */
.enrollmentActions{display:flex;align-items:stretch;gap:8px;width:100%;margin-top:10px}
.enrollmentActions>.btn{margin:0!important;min-height:44px;line-height:1.3;white-space:normal;overflow-wrap:break-word;border-radius:11px;padding:11px 12px}
.enrollmentActions>button[onclick="saveClassSetup()"]{flex:1 1 0;min-width:0;background:#155e48;color:#fff}
.enrollmentActions>.actionEdit{flex:0 0 auto;min-width:64px;background:#e5eefb;color:#245a86}
html[data-theme=dark] .enrollmentActions>.actionEdit{background:#294b6c;color:#e5f0ff}
html body button:disabled,html body button.btn:disabled,html body button.btn.dataSaved:disabled{background:#d7dadd!important;color:#60666c!important;border-color:#bcc1c6!important;opacity:1!important;cursor:not-allowed!important;box-shadow:none!important;transform:none!important;animation:none!important;transition:none!important;filter:none!important}
html[data-theme=dark] body button:disabled,html[data-theme=dark] body button.btn:disabled,html[data-theme=dark] body button.btn.dataSaved:disabled{background:#3d4248!important;color:#c5c9ce!important;border-color:#636a72!important}

/* Keep the primary action at the same compact size as Edit or Cancel. */
#enrollment .enrollmentActions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#enrollment .enrollmentActions>.btn{min-width:0;min-height:44px;padding:6px 8px;line-height:1.2}
#enrollmentReductionTable{margin:12px 0;max-height:32dvh;overflow:auto}
#enrollmentReductionTable table{white-space:normal;font-size:11px}
#enrollmentReductionTable th,#enrollmentReductionTable td{padding:5px 4px;overflow-wrap:anywhere}
#enrollmentSafetyDialog{max-height:90dvh;overflow:auto}
#recent .recentTenDays{table-layout:fixed;width:100%;white-space:nowrap;font-size:10px}
#recent .recentTenDays th,#recent .recentTenDays td{padding:7px 2px;line-height:18px;white-space:nowrap;overflow:hidden}
#recent .recentTenDays tbody tr{height:34px}
#recent .recentTenDays th:first-child{width:46%}
#recent .recentTenDays th:nth-child(2),#recent .recentTenDays th:nth-child(3),#recent .recentTenDays th:nth-child(4){width:7%}
#recent .recentTenDays th:nth-child(5){width:18%}
#recent .recentTenDays th:nth-child(6){width:15%}
#recent .recentTenDays td:first-child{font-size:clamp(8px,2.3vw,11px)}
#recent .sundayRow td:first-child{color:#bc2636;font-weight:700}
#recent .holidayRow td:first-child{color:#8b5a20;font-weight:700}
html[data-theme=dark] #recent .sundayRow td:first-child{color:#ff8e98}
html[data-theme=dark] #recent .holidayRow td:first-child{color:#e4b47e}

#enrollmentReductionTable table{width:100%;min-width:0;table-layout:fixed;font-size:10px}
#enrollmentReductionTable th,#enrollmentReductionTable td{padding:5px 2px;white-space:normal;overflow-wrap:anywhere}

/* Class-wise Daily Entry: name, count, and enrollment on one line. */
#daily #classDailyFields .dailyClassRow{margin:2px 0!important;padding:3px 7px!important}
#classDailyFields .dailyClassRow>label.dailyClassLine{display:grid;grid-template-columns:minmax(0,1fr) minmax(104px,.8fr);align-items:center;gap:8px;margin:0!important;line-height:1.3}
#classDailyFields .dailyClassName{min-width:0;white-space:normal;overflow-wrap:anywhere}
#classDailyFields .dailyClassLine .countWithMax{display:grid;grid-template-columns:minmax(56px,1fr) minmax(36px,auto);align-items:center;gap:6px;margin:0}
#classDailyFields .dailyClassLine .classMealCount{width:100%;min-width:0;text-align:center}
#classDailyFields .dailyClassLine .maximum{margin:0;min-width:0;white-space:nowrap;font-size:15px}
#classDailyFields .dailyClassRow>.hint:empty{display:none}
#classDailyFields .dailyClassRow>.hint{margin:3px 0 0;font-size:11px}
#daily #classDailyFields>.classGroup{padding:8px!important;margin:6px 0!important}

/* Readable semibold recent entries; retain all figures on small screens. */
#recent .recentTenDays{min-width:400px;font-size:11px;font-weight:600}
#recent .recentTenDays td:first-child{font-size:11px;font-weight:650}
#recent .recentTenDays th{font-size:11px;font-weight:750}
#zeroMealSaveDialog{width:min(420px,calc(100% - 32px));max-height:85dvh;overflow:auto;border:1px solid #94b4a2;border-radius:18px;padding:20px;background:var(--card,#fff);color:var(--ink,#21352d)}
#zeroMealSaveMessage{line-height:1.5}
html[data-theme=dark] #zeroMealSaveDialog{background:#192a22;color:#e7f1eb}

#recent .recentTenDays th:first-child{width:47%}
#recent .recentTenDays td:first-child{padding-right:0}
#recent .recentTenDays th:nth-child(2),#recent .recentTenDays th:nth-child(3),#recent .recentTenDays th:nth-child(4){width:7.25%}
#recent .recentTenDays th:nth-child(5){width:17.75%}
#recent .recentTenDays th:nth-child(6){width:13.5%}
