/* HG Edu v18.62 RC76: shared application presentation. Runtime data and handlers stay in their owners. */
:root{
  --hg-ui-surface:var(--hg-surface,var(--panel,#111827));
  --hg-ui-surface-soft:var(--hg-surface-secondary,var(--panel2,#0b1525));
  --hg-ui-border:var(--hg-border,var(--line,#334155));
  --hg-ui-border-strong:var(--hg-border-strong,var(--line,#475569));
  --hg-ui-text:var(--hg-text,var(--text,#e6edf7));
  --hg-ui-muted:var(--hg-text-muted,var(--muted,#94a3b8));
  --hg-ui-primary:var(--hg-primary,var(--blue,#3b82f6));
  --hg-ui-primary-soft:var(--hg-primary-soft,rgba(59,130,246,.1));
  --hg-ui-success:var(--hg-success,var(--green,#22c55e));
  --hg-ui-shadow:var(--hg-shadow-sm,0 3px 12px rgba(0,0,0,.08));
}

body:not(.hg-auth-guest) .wrap>main{padding:clamp(16px,1.8vw,24px)}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition){max-width:1480px}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition)>.card{
  padding:16px 18px;
  margin-bottom:12px;
  border-color:color-mix(in srgb,var(--hg-ui-border) 88%,transparent);
  box-shadow:var(--hg-ui-shadow);
}

body:not(.hg-auth-guest) .wrap>main .page:not(#tuition)>h2:first-child,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition)>.card>h2:first-child{
  margin:0 0 6px;
  color:var(--hg-ui-text);
  font-size:clamp(20px,1.5vw,24px);
  line-height:1.25;
}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition)>h2:first-child+small,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition)>.card>h2:first-child~.small:first-of-type{color:var(--hg-ui-muted)}

body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .pageHeading,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .sectionHead{
  margin-bottom:12px;
  padding-bottom:12px;
  border-bottom:1px solid color-mix(in srgb,var(--hg-ui-border) 76%,transparent);
}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .pageHeading h2,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .sectionHead h2{
  color:var(--hg-ui-text);
  font-size:clamp(20px,1.55vw,25px);
  line-height:1.25;
}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .pageHeading p,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .sectionHead p{max-width:760px;color:var(--hg-ui-muted)}

body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) label{
  margin:0 0 5px;
  color:var(--hg-ui-muted);
  font-size:12px;
  font-weight:650;
}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) input:not([type="checkbox"]):not([type="radio"]),
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) select,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) textarea{
  min-height:40px;
  border-color:var(--hg-ui-border);
  background:var(--hg-ui-surface);
  color:var(--hg-ui-text);
}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) input:focus,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) select:focus,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) textarea:focus{
  border-color:var(--hg-ui-primary);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--hg-ui-primary) 16%,transparent);
}

body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .row,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .grid{gap:10px}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .btn{
  min-height:38px;
  margin-top:8px;
  box-shadow:none;
}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .btn:not(.ok):not(.badbtn):not(.gold){
  border:1px solid var(--hg-ui-border-strong);
  background:var(--hg-ui-surface);
  color:var(--hg-ui-primary);
}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .btn.ok{
  background:var(--hg-ui-primary);
  color:var(--hg-text-on-primary,#fff);
}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .btn.gold{color:var(--hg-ui-text)}

body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .metric,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .cashMetric,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .v1681-summary>div,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .v1682o-fin>div,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .hg17414-metrics>div,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .hg1823-metric,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .hg1826-metrics .metric,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .hg-income-metric{
  min-height:0;
  padding:12px 13px;
  border-color:color-mix(in srgb,var(--hg-ui-border) 85%,transparent);
  background:var(--hg-ui-surface-soft);
  box-shadow:none;
}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .metric span,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .cashMetric span,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .v1681-summary span,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .v1682o-fin span,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .hg17414-metrics span{color:var(--hg-ui-muted)}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .metric b,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .cashMetric b,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .v1681-summary b,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .v1682o-fin b,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .hg17414-metrics b,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .hg1823-metric b,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .hg-income-metric b{
  color:var(--hg-ui-text)!important;
  font-variant-numeric:tabular-nums;
}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .v1682o-fin .profit{background:var(--hg-ui-primary-soft);border-color:color-mix(in srgb,var(--hg-ui-primary) 36%,var(--hg-ui-border))}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .v1682o-fin .profit b{color:var(--hg-ui-primary)!important}

body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) table{margin-top:8px;color:var(--hg-ui-text)}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) th{
  padding:9px 10px;
  color:var(--hg-ui-text);
  background:var(--hg-ui-surface-soft);
  border-bottom-color:var(--hg-ui-border);
  font-size:12px;
  font-weight:700;
}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) td{padding:9px 10px;border-bottom-color:color-mix(in srgb,var(--hg-ui-border) 76%,transparent)}
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .tableWrap,
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) [class*="table-wrap"],
body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) [class*="tableWrap"]{
  border:1px solid color-mix(in srgb,var(--hg-ui-border) 82%,transparent);
  border-radius:10px;
  background:var(--hg-ui-surface);
}
#teachers>.card:last-child,
#classes>.card:last-child,
#students>.card:last-child,
#sessions>.card:has(table),
#salary>.card:has(table),
#reports>.card:has(table),
#cashFund>.card:has(table){overflow-x:auto}

#teachers .teacher-list-tools{display:grid;grid-template-columns:minmax(240px,1fr) auto;gap:10px;align-items:end}
#classes>.card:last-child>input,
#students>.card:last-child>input{margin-bottom:4px}
#tuitionDebts .hg-debt-filters,
.hg1823-filter-grid,
.hg1826-filter-grid,
.hg1843-filter-grid,
.hg-income-controls,
.hg-qcs-filter-grid{gap:10px}
#tuitionDebts .hg-debt-actions,
.hg1823-source-tools,
.hg1843-actions,
.hg1843-candidate-actions,
.hg17414-actions,
.cashActions,
.hg30-actions{gap:8px}
#tuitionDebts .hg-debt-actions .btn,
.hg1823-source-tools .btn,
.hg1843-actions .btn,
.hg1843-candidate-actions .btn,
.hg17414-actions .btn,
.cashActions .btn,
.hg30-actions .btn{margin:0}

#operationsOverview .v1682o-head{margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--hg-ui-border)}
#operationsOverview .v1682o-title{border-bottom-color:var(--hg-ui-border)}
#operationsOverview .v1682o-title>b,
#operationsOverview .v1682o-left strong{color:var(--hg-ui-primary)}
#operationsOverview .v1682o-row{padding:10px 0;border-bottom-color:color-mix(in srgb,var(--hg-ui-border) 72%,transparent)}
#operationsOverview .v1682o-badge{font-weight:650}
#sessions .v1681-hero{background:var(--hg-ui-surface);border:1px solid var(--hg-ui-border);box-shadow:var(--hg-ui-shadow)}
#sessions .v1681-hero h2{color:var(--hg-ui-text)}
#sessions .v1681-day{background:var(--hg-ui-surface-soft);border-color:var(--hg-ui-border);color:var(--hg-ui-text)}
#sessions .v1681-day.selected{outline-color:var(--hg-ui-primary)}
#sessions .v1681-day.today{box-shadow:inset 0 0 0 2px var(--hg-ui-primary)}

#receipts .hg30-help,
#receipts .hg30-grid,
#reports pre,
.hg1810-disclosure,
.hg1823-import-card,
.hg1826-detail-card,
.hg1843-registration-toolbar,
.hg1843-registration-detail{
  border-color:var(--hg-ui-border);
  background:var(--hg-ui-surface-soft);
}
#receipts .hg30-editor-total b{color:var(--hg-ui-text)}
.hg1810-disclosure>summary,
.v1682o-collapsible>.v1682o-title{color:var(--hg-ui-text)}

/* Public registration and tuition lookup use the same light hierarchy. */
body:has(.public-shell){background:var(--hg-page-bg,#fdfcf9);color:var(--hg-text,#1f2d35)}
.public-header{border-bottom-color:var(--hg-border,#ddd7cd);box-shadow:var(--hg-shadow-sm,0 2px 8px rgba(38,55,48,.05))}
.public-shell{max-width:900px}
.hero{padding:30px 10px 24px}
.hero h1{color:var(--hg-text,#1f2d35)}
.panel{padding:22px;border-color:var(--hg-border,#ddd7cd);border-radius:14px;box-shadow:var(--hg-shadow-sm,0 2px 8px rgba(38,55,48,.05))}
.section-heading{margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--hg-border,#ddd7cd)}
.search-results{margin-top:10px}
.search-result{border-color:var(--hg-border,#ddd7cd);box-shadow:none}
.selected-student{border-color:var(--hg-border,#ddd7cd);background:var(--hg-surface-secondary,#f7faf8)}
.registration-panel form{gap:14px}
.registration-fields{gap:14px}

@media(max-width:1199px){
  body:not(.hg-auth-guest) .wrap>main .page:not(#tuition)>.card{padding:14px 16px}
  #teachers .teacher-list-tools{grid-template-columns:1fr}
  #teachers .teacher-list-tools .btn{width:fit-content}
}
@media(max-width:900px){
  body:not(.hg-auth-guest) .wrap>main{padding:12px}
  body:not(.hg-auth-guest) .wrap>main .page:not(#tuition)>.card{padding:12px}
  body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .pageHeading,
  body:not(.hg-auth-guest) .wrap>main .page:not(#tuition) .sectionHead{padding-bottom:10px}
  .hero{padding:24px 0 20px}
  .panel{padding:18px}
}
@media(max-width:600px){
  #teachers .teacher-list-tools .btn{width:100%}
  .panel{padding:15px}
  .section-heading{margin-bottom:14px}
}
