/* HG Edu v18.60-RC16 - shared responsive UI layer.
   Layout only: data, IDs, handlers and route behavior stay in their owners. */

/* Keep the application shell fluid without using page-level overflow masking. */
body:not(.hg-auth-guest) .wrap>main,
body:not(.hg-auth-guest) .wrap>main .page,
body:not(.hg-auth-guest) .wrap>main .page>*,
body:not(.hg-auth-guest) .wrap>main .page .card,
body:not(.hg-auth-guest) .wrap>main .page .row>*,
body:not(.hg-auth-guest) .wrap>main .page .grid>*,
body:not(.hg-auth-guest) .wrap>main .pageHeading>* ,
body:not(.hg-auth-guest) .wrap>main .sectionHead>* {
  min-width:0;
}

body:not(.hg-auth-guest) .wrap>main,
body:not(.hg-auth-guest) .wrap>main .page,
body:not(.hg-auth-guest) .wrap>main .page * ,
body:not(.hg-auth-guest) .modalBg,
body:not(.hg-auth-guest) .modalBg * {
  box-sizing:border-box;
}

body:not(.hg-auth-guest) .wrap>main .page {
  width:100%;
  max-width:1600px;
  margin-inline:auto;
}

body:not(.hg-auth-guest) .wrap>main .page input:not([type="checkbox"]):not([type="radio"]),
body:not(.hg-auth-guest) .wrap>main .page select,
body:not(.hg-auth-guest) .wrap>main .page textarea {
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}

body:not(.hg-auth-guest) .wrap>main .page input[type="checkbox"],
body:not(.hg-auth-guest) .wrap>main .page input[type="radio"] {
  width:auto;
  max-width:none;
}

body:not(.hg-auth-guest) .wrap>main .pageHeading,
body:not(.hg-auth-guest) .wrap>main .sectionHead {
  min-width:0;
}

body:not(.hg-auth-guest) .wrap>main .pageHeading>div:first-child,
body:not(.hg-auth-guest) .wrap>main .sectionHead>div:first-child {
  min-width:0;
}

body:not(.hg-auth-guest) .wrap>main .pageHeading h2,
body:not(.hg-auth-guest) .wrap>main .pageHeading h3,
body:not(.hg-auth-guest) .wrap>main .sectionHead h2,
body:not(.hg-auth-guest) .wrap>main .sectionHead h3,
body:not(.hg-auth-guest) .wrap>main .pageHeading p,
body:not(.hg-auth-guest) .wrap>main .sectionHead p {
  overflow-wrap:anywhere;
}

body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .pageHeading h2 {
  font-size:clamp(20px,1.55vw,26px);
  line-height:1.25;
}

body:not(.hg-auth-guest) .wrap>main .pageHeading>.btn,
body:not(.hg-auth-guest) .wrap>main .sectionHead>.btn {
  flex:0 0 auto;
  margin:0;
}

body:not(.hg-auth-guest) .wrap>main .page .row>div,
body:not(.hg-auth-guest) .wrap>main .page .grid>div,
body:not(.hg-auth-guest) .wrap>main .page fieldset {
  min-width:0;
}

/* Tables keep all columns and scroll inside their own bounded region. */
body:not(.hg-auth-guest) .wrap>main .tableWrap,
body:not(.hg-auth-guest) .wrap>main [class*="table-wrap"],
body:not(.hg-auth-guest) .wrap>main [class*="tableWrap"] {
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-inline:contain;
}

body:not(.hg-auth-guest) .wrap>main .page table {
  max-width:none;
}

body:not(.hg-auth-guest) .wrap>main .page .metric,
body:not(.hg-auth-guest) .wrap>main .page .cashMetric,
body:not(.hg-auth-guest) .wrap>main .hg1823-metric,
body:not(.hg-auth-guest) .wrap>main .hg17414-metric,
body:not(.hg-auth-guest) .wrap>main .hg-income-metric {
  min-width:0;
}

body:not(.hg-auth-guest) .wrap>main .page .metric b,
body:not(.hg-auth-guest) .wrap>main .page .cashMetric b,
body:not(.hg-auth-guest) .wrap>main .hg1823-metric b,
body:not(.hg-auth-guest) .wrap>main .hg17414-metric b,
body:not(.hg-auth-guest) .wrap>main .hg-income-metric b {
  overflow-wrap:anywhere;
  line-height:1.25;
}

body:not(.hg-auth-guest) .wrap>main .btn:not(.smallbtn):not(.hg17424-contact-action) {
  box-sizing:border-box;
  min-height:36px;
}

body:not(.hg-auth-guest) .wrap>main .btn:focus-visible,
body:not(.hg-auth-guest) .wrap>main input:focus-visible,
body:not(.hg-auth-guest) .wrap>main select:focus-visible,
body:not(.hg-auth-guest) .wrap>main textarea:focus-visible {
  outline:2px solid var(--hg-primary,#287f6d);
  outline-offset:2px;
}

/* Header: keep back, global search and weather as separate non-shrinking tools. */
body:not(.hg-auth-guest)>header {
  box-sizing:border-box;
  min-width:0;
}

body:not(.hg-auth-guest)>header>*,
body:not(.hg-auth-guest)>header #hgRouteActions,
body:not(.hg-auth-guest)>header #hgWeatherWidget,
body:not(.hg-auth-guest)>header #hg1825GlobalSearch {
  min-width:0;
}

body:not(.hg-auth-guest)>header #hgWeatherWidget,
body:not(.hg-auth-guest)>header #hgRouteActions {
  flex:0 0 auto;
}

@media (min-width:901px) {
  body:not(.hg-auth-guest)>header {
    padding-inline:14px;
    gap:8px;
  }

  body:not(.hg-auth-guest)>header #hg1825GlobalSearch {
    flex:1 1 280px;
    min-width:220px;
    max-width:none;
    margin-inline:0;
  }
}

@media (min-width:901px) and (max-width:1100px) {
  body:not(.hg-auth-guest)>header #hg1825GlobalSearch {
    min-width:180px;
  }

  body:not(.hg-auth-guest)>header #hgRouteActions .hgRouteBtn {
    padding-inline:7px;
  }
}

/* Common desktop/tablet form rhythm. */
@media (min-width:901px) and (max-width:1199px) {
  body:not(.hg-auth-guest) .wrap>main {
    padding:16px;
  }

  #setup .row,
  #teachers .row,
  #classes .row,
  #students .row,
  #sessions .row,
  #salary .row,
  #finance .row,
  #cashFund .row,
  #reports .row,
  #qa .row,
  #hg17426ScheduleForm {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  #hg22SalaryControls,
  .hg-income-estimate .hg-income-controls,
  .hg-income-estimate .hg-income-metrics {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  #tuitionDebts .hg-debt-filters,
  .hg1826-filter-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  #tuitionDebts .hg-debt-metrics {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  #sessions .v1681-controls {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  #sessions .v1681-controls>*:last-child {
    grid-column:1/-1;
  }
}

/* Route-specific grids use the same breathing room without sharing a layout. */
.hg1843-filter-grid,
.hg1843-create-form,
.hg1823-toolbar,
.hg1823-import-grid,
.hg1823-filter-grid,
.hg1823-metrics,
.hg1826-filter-grid,
.hg1826-metrics,
.hg-income-controls,
.hg-income-metrics,
.hg-qcs-filter-grid,
.hg17414-metrics {
  min-width:0;
}

.hg1843-registration-toolbar,
.hg1843-registration-detail,
.hg1823-import-card,
.hg1826-detail-card,
.hg-qcs-toolbar,
.hg-income-estimate .card {
  min-width:0;
}

.hg1843-search-existing,
.hg1843-actions,
.hg1843-candidate-actions,
.hg-debt-actions,
.hg1823-source-tools,
.hg1823-row-actions,
.hg-qcs-actions,
.cashActions,
.hg17426-entry-actions,
.hg17426-page-actions>div,
.hg17414-actions {
  min-width:0;
  flex-wrap:wrap;
}

.hg1843-actions .btn,
.hg1843-candidate-actions .btn,
.hg-debt-actions .btn,
.hg1823-source-tools .btn,
.hg1823-row-actions .btn,
.cashActions .btn,
.hg17426-entry-actions .btn,
.hg17414-actions .btn {
  margin-top:0;
}

#reports .hg17414-table-wrap,
#reports .hg17414-preview,
#sessions .v1681-calendar,
#sessions .v1681-preview {
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

#cashFund .cashMetrics {
  grid-template-columns:repeat(3,minmax(0,1fr));
}

#cashFund .cashMetric {
  min-width:0;
}

#cashFund .cashMetric b {
  overflow-wrap:anywhere;
}

#tuitionDebts .hg-debt-filters>div,
#tuitionDebts .hg-debt-metrics>* {
  min-width:0;
}

#tuitionDebts .hg-debt-table-wrap,
#hgDebtTable,
#cashHistoryTable,
#tblTeachers,
#tblClasses,
#tblStudents,
#tblSessions,
#tblSalary,
#tblSmartClasses {
  min-width:0;
}

#hg17426ScheduleBatch .hg17426-form>div,
#hg17426ScheduleBatch .hg17426-note,
#hg17426ScheduleBatch .hg17426-page-actions {
  min-width:0;
}

#hg17426ScheduleBatch .hg17426-table-wrap,
#hg17426ScheduleBatch .hg17426-wall-table-wrap {
  max-width:100%;
}

/* Keep modal content usable on low-height laptop and touch screens. */
body:not(.hg-auth-guest) .modalBg {
  padding:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));
}

body:not(.hg-auth-guest) .modal {
  max-width:1180px;
  max-height:calc(100dvh - 20px);
}

@media (max-width:900px) {
  body:not(.hg-auth-guest)>header {
    padding-inline:8px;
    gap:5px;
  }

  body:not(.hg-auth-guest)>header .menuToggle,
  body:not(.hg-auth-guest)>header .mobileLogo,
  body:not(.hg-auth-guest)>header #hgWeatherWidget,
  body:not(.hg-auth-guest)>header #hgRouteActions,
  body:not(.hg-auth-guest)>header #hg1825GlobalSearch {
    flex:0 0 auto;
  }

  body:not(.hg-auth-guest)>header #hg1825GlobalSearch {
    margin-left:auto;
    margin-right:0;
  }

  body:not(.hg-auth-guest) .wrap>main {
    padding:12px;
    padding-bottom:max(16px,env(safe-area-inset-bottom));
  }

  body:not(.hg-auth-guest) .wrap>main .page:not(#tuition)> .card {
    padding:12px;
    margin-bottom:10px;
  }

  body:not(.hg-auth-guest) .wrap>main .pageHeading,
  body:not(.hg-auth-guest) .wrap>main .sectionHead {
    align-items:flex-start;
    flex-wrap:wrap;
    gap:9px;
  }

  body:not(.hg-auth-guest) .wrap>main .pageHeading>div:first-child,
  body:not(.hg-auth-guest) .wrap>main .sectionHead>div:first-child {
    flex:1 1 240px;
  }

  body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .pageHeading h2 {
    font-size:clamp(20px,5.8vw,24px);
  }

  body:not(.hg-auth-guest) .wrap>main .page .btn:not(.smallbtn):not(.hg17424-contact-action) {
    min-height:40px;
  }

  body:not(.hg-auth-guest) .wrap>main .page input:not([type="checkbox"]):not([type="radio"]),
  body:not(.hg-auth-guest) .wrap>main .page select,
  body:not(.hg-auth-guest) .wrap>main .page textarea {
    min-height:40px;
  }

  #setup .row,
  #teachers .row,
  #classes .row,
  #students .row,
  #sessions .row,
  #salary .row,
  #finance .row,
  #cashFund .row,
  #reports .row,
  #qa .row,
  #hg17426ScheduleForm,
  #hg22SalaryControls,
  .hg-income-estimate .hg-income-controls,
  .hg-income-estimate .hg-income-metrics {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  #tuitionDebts .hg-debt-filters,
  #tuitionDebts .hg-debt-metrics,
  .hg1826-filter-grid,
  .hg1826-metrics {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  #tuitionDebts .hg-debt-filters>div:first-child,
  .hg1826-filter-grid .hg1826-search-field {
    grid-column:1/-1;
  }

  #cashFund .cashMetrics {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .hg1843-filter-grid,
  .hg1843-detail-grid,
  .hg1843-create-form,
  .hg1823-toolbar,
  .hg1823-filter-grid,
  .hg1823-metrics,
  .hg-qcs-filter-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .hg1823-import-grid {
    grid-template-columns:1fr;
  }

  .hg1823-tabs {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .hg17414-actions {
    display:flex;
    gap:8px;
  }

  .hg17414-actions .btn {
    flex:1 1 150px;
  }

  .hg1823-table-wrap table,
  .hg1826-table-wrap table,
  .hg1843-registration-table-wrap table,
  .hg-qcs-table-wrap table {
    font-size:13px;
  }
}

@media (max-width:760px) {
  .hg1843-search-existing {
    display:grid;
    grid-template-columns:minmax(0,1fr);
  }

  .hg1843-actions .btn,
  .hg1843-candidate-actions .btn {
    flex:1 1 150px;
  }

  .hg1826-filter-grid .hg1826-search-field {
    grid-column:1/-1;
  }

  .hg-qcs-actions {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:600px) {
  body:not(.hg-auth-guest) .wrap>main .page:not(#tuition)> .card {
    padding:10px;
  }

  body:not(.hg-auth-guest) .wrap>main .pageHeading>button.btn,
  body:not(.hg-auth-guest) .wrap>main .pageHeading>.btn,
  body:not(.hg-auth-guest) .wrap>main .sectionHead>.hg-debt-actions {
    flex:1 1 100%;
    width:100%;
  }

  body:not(.hg-auth-guest) .wrap>main .sectionHead>.hg-debt-actions {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  #setup .row,
  #teachers .row,
  #classes .row,
  #students .row,
  #sessions .row,
  #salary .row,
  #finance .row,
  #cashFund .row,
  #reports .row,
  #qa .row,
  #hg17426ScheduleForm,
  #hg22SalaryControls,
  .hg-income-estimate .hg-income-controls,
  .hg-income-estimate .hg-income-metrics,
  #tuitionDebts .hg-debt-filters,
  .hg1843-filter-grid,
  .hg1843-detail-grid,
  .hg1843-create-form,
  .hg1823-toolbar,
  .hg1823-filter-grid,
  .hg1823-metrics,
  .hg1826-filter-grid,
  .hg1826-metrics,
  .hg-qcs-filter-grid {
    grid-template-columns:1fr;
  }

  #tuitionDebts .hg-debt-metrics,
  #cashFund .cashMetrics {
    grid-template-columns:1fr;
  }

  #tuitionDebts .hg-debt-filters>div:first-child,
  .hg1826-filter-grid .hg1826-search-field,
  .hg1843-create-form .wide {
    grid-column:auto;
  }

  #hgDebtReminderPanel .row>div[style] {
    grid-column:auto!important;
  }

  .hg1823-tabs {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .hg-qcs-actions {
    grid-template-columns:1fr;
  }

  .hg17426-page-actions>div,
  .hg17426-modal-actions {
    display:grid;
    grid-template-columns:1fr;
  }

  .hg17426-page-actions .btn,
  .hg17426-modal-actions .btn,
  .cashActions .btn {
    width:100%;
  }

  body:not(.hg-auth-guest) .modalBg {
    padding:8px;
  }

  body:not(.hg-auth-guest) .modal {
    width:100%;
    max-height:calc(100dvh - 16px);
    padding:12px;
  }

  body:not(.hg-auth-guest) #modalBody .row {
    grid-template-columns:1fr!important;
  }
}

@media (max-width:420px) {
  body:not(.hg-auth-guest) .wrap>main .sectionHead>.hg-debt-actions {
    grid-template-columns:1fr;
  }

  .hg1823-tabs {
    grid-template-columns:1fr;
  }
}

@media (max-width:360px) {
  body:not(.hg-auth-guest) .wrap>main .page:not(#tuition)> .card {
    padding:9px;
  }

  .hg1843-actions .btn,
  .hg1843-candidate-actions .btn {
    flex-basis:100%;
  }
}
