:root{
  --blue:#002b7f;
  --blue2:#0b4fc2;
  --red:#c00000;
  --bg:#f4f6fb;
  --ink:#20242a;
  --muted:#657083;
  --card:#ffffff;
  --soft:#fbfcff;
  --line:#dce2ef;
  --green:#137333;
  --amber:#9a6700;
  --shadow:0 10px 30px rgba(0,0,0,.07);
}

/* Stage 21DU sales desk */
.salesDeskLayout{
  display:grid;
  grid-template-columns:280px minmax(0, 1fr) 330px;
  gap:16px;
  align-items:start;
}
.salesDeskToolbar .studentFilterGrid{
  align-items:end;
}
.salesToolbarButtons{
  display:flex;
  gap:10px;
  align-items:end;
}
.salesStudentColumn,
.salesBasketColumn{
  position:sticky;
  top:12px;
  max-height:calc(100vh - 24px);
  overflow:auto;
}
.salesStudentCards{
  display:grid;
  gap:8px;
}
.salesStudentCard{
  width:100%;
  text-align:left;
  background:#fff;
  color:#17233c;
  border:1px solid #d9deea;
  border-radius:8px;
  padding:10px;
  min-height:0;
  box-shadow:none;
}
.salesStudentCard.active{
  border-color:#003d8f;
  background:#f4f8ff;
}
.salesStudentCard strong,
.salesStudentCard span,
.salesStudentCard em,
.salesStudentCard small{
  display:block;
}
.salesStudentCard strong{
  color:#072f63;
  font-size:15px;
}
.salesStudentCard span,
.salesStudentCard em,
.salesStudentCard small{
  color:#667085;
  font-size:12px;
  font-style:normal;
  margin-top:3px;
}
.salesSelectedHeader{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
  border-bottom:1px solid #d9deea;
  padding-bottom:14px;
  margin-bottom:14px;
}
.salesSelectedHeader h2{
  margin:0;
}
.salesFamilyStrip{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-bottom:18px;
}
.salesShopSection{
  border-top:1px solid #d9deea;
  padding-top:18px;
  margin-top:18px;
}
.salesItemGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}
.compactSalesGrid{
  grid-template-columns:repeat(3, minmax(0, 1fr));
}
.salesItemCard{
  border:1px solid #d9deea;
  background:#fff;
  border-radius:8px;
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.salesItemCard h4{
  margin:0;
  color:#072f63;
  font-size:16px;
  line-height:1.2;
}
.salesItemCard p{
  margin:0;
  color:#667085;
  font-size:13px;
}
.salesItemCard strong{
  color:#003d8f;
  font-size:18px;
}
.salesItemCard label,
.salesInlineAdd label,
.salesCheckoutBox label{
  display:flex;
  flex-direction:column;
  gap:5px;
  margin:0;
  color:#344054;
  font-size:12px;
  font-weight:800;
}
.salesItemCard input,
.salesItemCard select,
.salesInlineAdd input,
.salesInlineAdd select,
.salesCheckoutBox input,
.salesCheckoutBox select{
  width:100%;
  min-height:38px;
}
.salesThumb{
  width:100%;
  aspect-ratio:4 / 3;
  object-fit:contain;
  border:1px solid #d9deea;
  border-radius:8px;
  background:#fff;
}
.salesInlineAdd{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr auto;
  gap:10px;
  align-items:end;
  border:1px solid #d9deea;
  border-radius:8px;
  padding:12px;
  background:#f8fafc;
  margin-top:12px;
}
.salesInlineAdd h4{
  margin:0;
  align-self:center;
}
.salesBasketList{
  display:grid;
  gap:8px;
  margin-bottom:14px;
}
.basketLine{
  display:grid;
  grid-template-columns:1fr auto;
  gap:8px;
  align-items:center;
  border:1px solid #d9deea;
  border-radius:8px;
  padding:10px;
  background:#fff;
}
.basketLine strong,
.basketLine span{
  display:block;
}
.basketLine strong{
  color:#072f63;
  font-size:14px;
}
.basketLine span{
  color:#667085;
  font-size:12px;
  margin-top:2px;
}
.basketLine em{
  color:#003d8f;
  font-style:normal;
  font-weight:900;
}
.basketLine button{
  grid-column:1 / -1;
  justify-self:start;
}
.salesCheckoutBox{
  display:grid;
  gap:12px;
  border-top:1px solid #d9deea;
  padding-top:14px;
}
.salesTotalRow{
  display:flex;
  justify-content:space-between;
  align-items:center;
  background:#f4f8ff;
  border:1px solid #d9deea;
  border-radius:8px;
  padding:12px;
}
.salesTotalRow span{
  color:#667085;
  font-weight:800;
}
.salesTotalRow strong{
  color:#003d8f;
  font-size:24px;
}
.stripeTerminalPanel{
  display:grid;
  gap:10px;
  border:1px solid #c8d7f2;
  background:#f6f9ff;
  border-radius:8px;
  padding:12px;
}
.stripeTerminalPanel[hidden]{
  display:none;
}
.stripeTerminalHeader{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
}
.stripeTerminalHeader strong,
.stripeTerminalHeader span{
  display:block;
}
.stripeTerminalHeader strong{
  color:#072f63;
  font-size:14px;
}
.stripeTerminalHeader span{
  color:#667085;
  font-size:12px;
  margin-top:3px;
}
.stripeTerminalDetails dl{
  display:grid;
  gap:6px;
  margin:0;
}
.stripeTerminalDetails div{
  display:grid;
  gap:2px;
}
.stripeTerminalDetails dt{
  color:#667085;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
}
.stripeTerminalDetails dd{
  margin:0;
  color:#17233c;
  font-size:12px;
  line-height:1.35;
  overflow-wrap:anywhere;
}
.stripeTerminalActions{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
}
.stripeTerminalActions button{
  width:100%;
}
@media (max-width:1180px){
  .salesDeskLayout{
    grid-template-columns:1fr;
  }
  .salesStudentColumn,
  .salesBasketColumn{
    position:static;
    max-height:none;
  }
  .compactSalesGrid,
  .salesItemGrid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}
@media (max-width:760px){
  .compactSalesGrid,
  .salesItemGrid,
  .salesInlineAdd{
    grid-template-columns:1fr;
  }
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  background:radial-gradient(circle at top,#eef4ff 0,#f4f6fb 35%,#f7f8fc 100%);
  color:var(--ink);
}
.shell{
  max-width:1040px;
  margin:0 auto;
  padding:22px;
}
.hero{
  background:linear-gradient(135deg,var(--blue),var(--blue2));
  color:#fff;
  border-radius:18px;
  display:flex;
  align-items:center;
  gap:18px;
  padding:30px;
  margin:12px 0 20px;
  border-bottom:6px solid var(--red);
  box-shadow:var(--shadow);
}
.hero::before,
.timetableHero::before{
  content:"";
  flex:0 0 82px;
  width:82px;
  height:82px;
  border-radius:50%;
  background:#fff url("brand/fmac-logo.png") center/contain no-repeat;
  box-shadow:0 10px 24px rgba(0,0,0,.2);
}
.hero > div,
.timetableHero > div{
  min-width:0;
}
.hero h1{
  margin:0 0 8px;
  font-size:34px;
  letter-spacing:-.5px;
}
.hero p{margin:0;opacity:.96}
@media (max-width:760px){
  .hero,
  .timetableHero{
    align-items:flex-start;
    flex-direction:column;
  }
  .hero::before,
  .timetableHero::before{
    flex-basis:64px;
    width:64px;
    height:64px;
  }
}
.eyebrow{
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:12px;
  font-weight:bold;
  margin:0 0 8px;
  opacity:.85;
}
.eyebrow.dark{
  color:var(--blue);
  opacity:1;
}
.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:18px;
  padding:22px;
  margin:16px 0;
  box-shadow:var(--shadow);
}
.hidden{display:none!important}
h2,h3,h4{margin:0;color:var(--ink)}
h2{font-size:28px}
h3{font-size:21px}
h4{font-size:17px}
.lead{
  margin:8px 0 0;
  color:var(--muted);
  line-height:1.45;
}
.studentLoginGuide{
  margin:16px 0 18px;
  padding:14px 16px;
  border-left:4px solid var(--blue);
  background:#f7faff;
  border-radius:0 12px 12px 0;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:14px 18px;
}
.studentLoginGuide h3{
  font-size:16px;
  margin:0 0 8px;
}
.studentLoginGuide ol{
  margin:0;
  padding-left:20px;
  color:var(--muted);
  line-height:1.5;
}
.studentLoginGuide li+li{
  margin-top:4px;
}
.studentLoginGuide p{
  grid-column:1 / -1;
  margin:0;
  color:var(--muted);
  line-height:1.45;
}
.studentLoginGuide a{
  color:var(--blue);
  font-weight:bold;
}
.studentPortalFeatureGrid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
}
.studentPortalFeatureGrid span{
  border:1px solid var(--line);
  background:#fff;
  border-radius:10px;
  padding:8px 10px;
  color:var(--blue);
  font-weight:bold;
  font-size:13px;
}
@media(max-width:720px){
  .studentLoginGuide{
    grid-template-columns:1fr;
  }
}
label{
  display:block;
  font-weight:bold;
  margin:16px 0 7px;
}
input,select,textarea{
  width:100%;
  padding:13px 14px;
  border:1px solid var(--line);
  border-radius:12px;
  font-size:16px;
  background:#fff;
  font-family:Arial,sans-serif;
}
textarea{
  resize:vertical;
  line-height:1.45;
}
button{
  background:var(--red);
  color:#fff;
  border:0;
  border-radius:11px;
  padding:13px 18px;
  font-weight:bold;
  cursor:pointer;
  margin:12px 8px 0 0;
  transition:transform .08s ease, opacity .15s ease, box-shadow .15s ease;
}
button:hover:not(:disabled){
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(192,0,0,.18);
}
button.secondary{background:var(--blue)}
button.secondary:hover:not(:disabled){box-shadow:0 8px 18px rgba(0,43,127,.2)}
button.ghost{
  background:#eef2fb;
  color:var(--blue);
  border:1px solid var(--line);
}
button:disabled{
  opacity:.48;
  cursor:not-allowed;
  transform:none;
  box-shadow:none;
}
.message,.portalMessage{
  margin-top:14px;
  color:var(--muted);
  line-height:1.5;
}
.message.bad{
  color:var(--red);
  font-weight:bold;
}

.inductionSplit{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(240px,320px);
  gap:16px;
  align-items:start;
  margin-top:18px;
}
.inductionActionBox{
  border:1px solid var(--line);
  border-radius:12px;
  padding:14px;
  background:#fbfcff;
}
.inductionActionBox p{
  margin:0 0 10px;
  color:var(--muted);
  line-height:1.45;
}
.inductionSession{
  display:block;
  width:100%;
  margin:0;
  text-align:left;
  color:var(--ink);
  background:var(--soft);
  border:1px solid var(--line);
  box-shadow:none;
}
.inductionSession:hover:not(:disabled){
  box-shadow:0 8px 18px rgba(0,43,127,.12);
}
.inductionSession.active{
  outline:3px solid rgba(192,0,0,.22);
  border-color:var(--red);
  background:#fff;
}
.publicInductionSummary,
.publicInductionMore{
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  color:var(--muted);
  padding:11px 12px;
  font-size:14px;
}
.publicInductionMore{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.publicInductionMore button{
  margin:0;
}
@media(max-width:820px){
  .inductionSplit{
    grid-template-columns:1fr;
  }
}

.dashboardPrimaryActions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:10px 0 18px;
}
.dashboardPrimaryActions button{
  margin:0;
}
.dashboardToolGroups{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:12px;
  margin-top:10px;
}
.dashboardToolGroup{
  border:1px solid var(--line);
  border-radius:12px;
  background:#fbfcff;
  padding:12px;
}
.dashboardToolGroup h3{
  font-size:15px;
  color:var(--blue);
  margin:0 0 10px;
}
.dashboardToolLinks{
  display:grid;
  gap:8px;
}
.dashboardToolLinks .buttonLink{
  justify-content:flex-start;
  width:100%;
  min-height:38px;
  padding:9px 11px;
  font-size:13px;
  text-align:left;
}
.areaNav{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin:0 0 18px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fbfcff;
}
.areaNav span{
  color:var(--blue);
  font-size:12px;
  font-weight:900;
  margin:0 4px;
  text-transform:uppercase;
}
.areaNav .buttonLink{
  min-height:36px;
  padding:8px 11px;
  font-size:13px;
}
.templateEditorPage{
  max-width:1480px;
}
.templateToolbar{
  display:grid;
  grid-template-columns:minmax(220px, 320px) 1fr;
  gap:12px;
  align-items:end;
  margin-bottom:16px;
}
.templateTabs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}
.templateTabs button{
  margin:0;
  background:#f4f7fb;
  color:var(--blue);
  border:1px solid var(--line);
  min-height:40px;
}
.templateTabs button.active{
  background:var(--blue);
  color:#fff;
  border-color:var(--blue);
}
.templateEditorGrid{
  display:grid;
  grid-template-columns:minmax(240px, 300px) minmax(0, 1fr);
  gap:16px;
  align-items:start;
}
.templateListPanel,
.templateWorkPanel{
  border:1px solid var(--line);
  border-radius:12px;
  background:#fbfcff;
  padding:14px;
}
.templateWorkPanel{
  background:#fff;
}
.templateSourceBadge{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  margin:4px 0 12px;
  border:1px solid var(--line);
  border-radius:999px;
  padding:6px 10px;
  color:var(--muted);
  background:#fff;
  font-size:12px;
  font-weight:800;
}
.templateSourceBadge.overrideOn{
  background:#e9f7ed;
  color:var(--green);
  border-color:#bde5cc;
}
.templateTokenBox{
  display:grid;
  gap:5px;
  color:var(--muted);
  font-size:13px;
}
.templateTokenBox strong{
  color:var(--ink);
  margin-bottom:3px;
}
.templateEditorSplit{
  display:grid;
  grid-template-columns:minmax(420px, 1.1fr) minmax(420px, .9fr);
  gap:14px;
  align-items:start;
}
.templateEditorSplit textarea{
  min-height:520px;
  font-family:Consolas, "Courier New", monospace;
  font-size:14px;
  line-height:1.45;
}
.templatePreviewBox{
  border:1px solid var(--line);
  border-radius:12px;
  background:#fbfcff;
  padding:12px;
}
.templatePreviewBox iframe{
  display:block;
  width:100%;
  min-height:520px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  margin-top:10px;
}
.templatePreviewBox pre{
  white-space:pre-wrap;
  word-break:break-word;
  margin:10px 0 0;
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.45;
}
.checkboxField label{
  display:flex;
  gap:8px;
  align-items:center;
}
.checkboxField input[type="checkbox"]{
  width:auto;
}
@media(max-width:900px){
  .templateToolbar,
  .templateEditorGrid,
  .templateEditorSplit{
    grid-template-columns:1fr;
  }
  .templateTabs{
    justify-content:flex-start;
  }
}


/* Stage 21DT database health */
.databaseHealthPage .portalShell{
  max-width:1240px;
}
.databaseHealthTotals .summaryCard strong{
  min-height:28px;
}
.healthGrid,
.healthMigrationGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  align-items:start;
}
.healthGrid .card{
  margin:0;
}
.databaseHealthTable th,
.databaseHealthTable td{
  white-space:normal;
  vertical-align:top;
}
.databaseHealthTable td:first-child{
  min-width:190px;
}
.databaseHealthTable td:nth-child(4),
.databaseHealthTable th:nth-child(4){
  text-align:left;
}
.databaseHealthTable small{
  display:block;
  color:var(--muted);
  font-weight:700;
  margin-top:4px;
  white-space:normal;
}
.auditLogTable details{
  margin:6px 0;
}
.auditLogTable summary{
  cursor:pointer;
  color:var(--blue);
  font-weight:900;
}
.auditLogTable pre{
  margin:8px 0 0;
  padding:10px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fbfcff;
  color:#17233c;
  white-space:pre-wrap;
  word-break:break-word;
  max-height:260px;
  overflow:auto;
}
.auditDetailsRow td{
  background:#f7faff;
}
.databaseHealthChecksTable td:nth-child(3),
.databaseHealthChecksTable th:nth-child(3){
  text-align:right;
  width:90px;
}
.databaseHealthChecksTable td:nth-child(2),
.databaseHealthChecksTable th:nth-child(2){
  text-align:left;
  width:115px;
}
.healthExamples{
  border-left:3px solid #dbe7ff;
  padding-left:8px;
}
.healthStatus{
  white-space:nowrap;
}
.healthMigrationStats{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:10px;
  margin:0 0 14px;
}
.healthMigrationStats div,
.healthUntrackedList{
  border:1px solid var(--line);
  border-radius:12px;
  background:#fbfcff;
  padding:12px;
}
.healthMigrationStats span,
.healthMigrationStats strong{
  display:block;
}
.healthMigrationStats span{
  color:var(--muted);
  font-size:12px;
  font-weight:900;
}
.healthMigrationStats strong{
  color:var(--blue);
  font-size:20px;
  margin-top:4px;
}
.healthUntrackedList{
  margin:0 0 14px;
}
.healthUntrackedList strong{
  color:var(--blue);
}
.healthUntrackedList ul{
  margin:8px 0 0;
  padding-left:20px;
  color:var(--muted);
}
.healthMigrationGrid h3{
  margin:0 0 10px;
  color:var(--blue);
  font-size:18px;
}
@media(max-width:980px){
  .healthGrid,
  .healthMigrationGrid{
    grid-template-columns:1fr;
  }
}
.portalMessage{
  padding:12px 14px;
  border-radius:12px;
  background:#eef7f0;
  color:var(--green);
  font-weight:bold;
}
.portalMessage.bad{
  background:#fff0f0;
  color:var(--red);
}
.panelHeader,.sectionTitle{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
}
.sectionTitle{
  margin-bottom:16px;
}
.sectionTitleActions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.sectionTitle p{
  margin:6px 0 0;
  color:var(--muted);
  line-height:1.45;
}
.summaryGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:12px;
  margin-top:18px;
}
.summaryCard{
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px;
  background:linear-gradient(180deg,#fff,#fbfcff);
}
.summaryCard span{
  display:block;
  color:var(--muted);
  font-size:13px;
  margin-bottom:6px;
}
.summaryCard strong{
  display:block;
  color:var(--blue);
  font-size:20px;
}
.studentPortalSummaryMenu{
  border:1px solid var(--line);
  border-radius:8px;
  background:#f8fbff;
  margin-top:18px;
  overflow:hidden;
}
.studentPortalSummaryMenu summary{
  cursor:pointer;
  color:var(--blue);
  font-weight:900;
  padding:12px 14px;
}
.studentPortalSummaryMenu .summaryGrid{
  margin-top:0;
  padding:0 14px 14px;
}
.studentPortalMenu{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
  border-top:1px solid var(--line);
  margin-top:18px;
  padding-top:16px;
}
.studentPortalMenu button{
  margin:0;
  min-height:46px;
  border:1px solid #cbd8ec;
  border-radius:8px;
  background:#fff;
  color:var(--blue);
  box-shadow:none;
  font-size:14px;
  line-height:1.2;
}
.studentPortalMenu button.active{
  background:var(--blue);
  border-color:var(--blue);
  color:#fff;
}
.studentPortalMenu button:focus-visible{
  outline:3px solid rgba(21,83,199,.25);
  outline-offset:2px;
}
.portalSectionHidden{
  display:none !important;
}
.bookingFlowSteps{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:14px;
}
.bookingFlowSteps span{
  border:1px solid #d7e2f1;
  border-radius:8px;
  background:#fff;
  color:#526071;
  font-size:13px;
  font-weight:900;
  min-height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:8px;
}
.bookingFlowSteps span.active{
  border-color:var(--blue);
  background:#eef4ff;
  color:var(--blue);
}
.bookingFlowSteps span.done{
  border-color:#abefc6;
  background:#ecfdf3;
  color:#067647;
}
.bookingFlowHidden{
  display:none !important;
}
.studentGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:14px;
}
.studentCard,.sessionCard,.graduationCard,.pastGraduationGroup{
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  background:var(--soft);
}
.studentCard.active,.sessionCard.active{
  outline:3px solid rgba(192,0,0,.22);
  border-color:var(--red);
  background:#fff;
}
.gradeRequestCard{
  display:grid;
  gap:10px;
}
.gradeRequestCard label{
  margin:0;
}
.gradeRequestCard input,
.gradeRequestCard textarea{
  width:100%;
}
.requestNote{
  margin:0;
  color:#344054;
  line-height:1.45;
}
.studentDetailNoticePanel{
  border:1px solid #f0d28a;
  background:#fffaf0;
  border-radius:8px;
  padding:14px;
  margin:0 0 18px;
}
.gradeRequestReviewPanel .studentTableWrap{
  margin-top:10px;
}
.sessionList,.timelineList{
  display:grid;
  gap:12px;
}
.studentCalendarToolbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:14px;
}
.bookingCentrePicker{
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid #d7e2f1;
  border-radius:8px;
  padding:8px 10px;
  background:#f8fbff;
}
.bookingCentrePicker span{
  font-size:.82rem;
  font-weight:800;
  color:#43536b;
}
.bookingCentrePicker select{
  min-width:180px;
  border:0;
  background:transparent;
  color:var(--blue);
  font-weight:900;
  outline:0;
}
.crossCentreTable input[type="text"]{
  min-width:260px;
  width:100%;
}
.crossCentreTable td{
  vertical-align:middle;
}
.bookingSelectedStudentNotice{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border:1px solid #d7e2f1;
  border-radius:8px;
  background:#fff;
  color:#344054;
  padding:10px 12px;
  margin-bottom:14px;
}
.bookingSelectedStudentNotice strong{
  color:var(--blue);
}
.bookingSelectedStudentNotice span{
  color:var(--muted);
  font-weight:900;
}
.selectedBookingSummary{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  border:1px solid #cfe0ff;
  border-radius:8px;
  background:#f7fbff;
  padding:11px 12px;
  margin-bottom:14px;
}
.selectedBookingSummary strong{
  color:var(--blue);
  white-space:nowrap;
}
.selectedBookingSummary div{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:7px;
}
.selectedBookingSummary span{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  border-radius:999px;
  background:#fff;
  border:1px solid #dbe7f8;
  color:#25364d;
  font-size:12px;
  font-weight:900;
  padding:5px 9px;
}
.bookingConfirmCard .sectionTitle{
  align-items:center;
}
.bookingCurrentBookingsCard .sectionTitle{
  margin-bottom:0;
}
.bookingCurrentBookingsCard #currentBookingsWrap{
  margin-top:16px;
}
.segmentedControl{
  display:inline-flex;
  border:1px solid var(--line);
  border-radius:8px;
  overflow:hidden;
  background:#fff;
}
.segmentedControl button{
  border:0;
  border-radius:0;
  background:#fff;
  color:#344054;
  padding:9px 13px;
  box-shadow:none;
}
.segmentedControl button.active{
  background:#082b7f;
  color:#fff;
}
.studentBookingCalendar{
  display:grid;
  grid-template-columns:repeat(7, minmax(0, 1fr));
  gap:6px;
  align-items:stretch;
}
.studentCalendarDay{
  min-height:128px;
  border:1px solid var(--line);
  border-radius:8px;
  padding:8px;
  background:#fff;
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:0;
}
.studentCalendarDay.muted{
  opacity:.45;
  background:#f8fafc;
}
.studentCalendarDay.hasSessions{
  background:#fbfdff;
}
.studentCalendarDay.today{
  border-color:#1553c7;
  box-shadow:0 0 0 2px rgba(21,83,199,.12);
}
.studentCalendarDay .calendarDateNumber{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  font-size:16px;
}
.studentCalendarDay.today .calendarDateNumber::after{
  content:"Today";
  border-radius:999px;
  background:#eef4ff;
  color:#1553c7;
  font-size:10px;
  font-weight:900;
  padding:3px 6px;
}
.studentCalendarDay.empty .calendarDayStats{
  margin-top:auto;
  color:#98a2b3;
}
.calendarStudentName{
  font-size:11px;
  font-weight:900;
  color:#526071;
  margin-bottom:3px;
}
.calendarSessionPick{
  border:1px solid #d9e2ef;
  border-radius:8px;
  padding:7px;
  cursor:pointer;
  background:#f8fbff;
  min-width:0;
}
.calendarSessionPick:hover,
.calendarSessionPick.active{
  border-color:#1553c7;
  box-shadow:0 0 0 2px rgba(21,83,199,.12);
}
.calendarSessionPick.full,
.sessionCard.full{
  cursor:not-allowed;
  opacity:.68;
  background:#f6f7f9;
}
.calendarSessionPick .bookingHeader{
  display:block;
}
.calendarSessionPick .sessionTitle{
  font-size:12px;
  line-height:1.25;
}
.calendarSessionPick .badge{
  margin-top:5px;
}
@media(max-width:800px){
  .studentBookingCalendar{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .studentCalendarToolbar{
    align-items:stretch;
  }
  .selectedBookingSummary{
    flex-direction:column;
  }
  .selectedBookingSummary div{
    justify-content:flex-start;
  }
  .studentCalendarToolbar .calendarToolbar,
  .studentCalendarToolbar .segmentedControl{
    width:100%;
  }
  .studentCalendarToolbar .calendarToolbar{
    justify-content:space-between;
  }
}
.paymentList{
  display:grid;
  gap:12px;
}
.paymentList.storeGrid{
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  align-items:start;
}
.paymentCard{
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  background:var(--soft);
}
.paymentHeader{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}
.paymentTitle{
  font-weight:bold;
  color:var(--blue);
}
.paymentSub{
  color:var(--muted);
  font-size:13px;
  margin-top:4px;
}
.paymentAmount{
  color:var(--blue);
  font-weight:900;
  white-space:nowrap;
}
.paymentMeta{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
  gap:8px;
  margin-top:12px;
}
.paymentActions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.paymentActions button{
  margin:0;
}
.paymentNotice{
  margin-top:10px;
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}
.familyTuitionChangeCurrent,
.familyTuitionChangeForm,
.familyTuitionRequestCard{
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  padding:12px;
}
.familyTuitionChangeForm{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:12px;
}
.familyTuitionChangeForm label{
  margin:0;
}
.familyTuitionChangeForm label span{
  display:block;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
  margin-bottom:6px;
}
.familyTuitionChangeForm select,
.familyTuitionChangeForm input,
.familyTuitionChangeForm textarea{
  width:100%;
}
.familyTuitionNotes,
.familyTuitionChangeForm .paymentActions,
.familyTuitionChangeForm .paymentNotice{
  grid-column:1 / -1;
}
.familyTuitionRequestList{
  display:grid;
  gap:10px;
}
.familyTuitionRequestCard .paymentMeta{
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
}
.storeToolbar,
.formTwo,
.referralGrid,
.storePaymentGrid,
.storeChoiceGrid,
.storeCreditSummary{
  display:grid;
  gap:12px;
}
.storeToolbar{
  grid-template-columns:minmax(220px,1fr) minmax(180px,260px);
  margin:0 0 14px;
}
.referralGrid{
  grid-template-columns:minmax(260px,380px) minmax(0,1fr);
  align-items:start;
}
.referralForm{
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  background:var(--soft);
}
.summerChallengeTeaser{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  border:1px solid #b8d2ff;
  border-radius:8px;
  background:#f2f7ff;
  margin-top:16px;
  padding:12px;
}
.summerChallengeTeaser img{
  width:46px;
  height:46px;
  object-fit:contain;
}
.summerChallengeTeaser strong,
.summerChallengeTeaser span{
  display:block;
}
.summerChallengeTeaser strong{
  color:var(--blue);
  font-size:16px;
}
.summerChallengeTeaser span{
  color:#40506a;
  font-size:13px;
  line-height:1.35;
  margin-top:2px;
}
.summerChallengeTeaser button{
  margin:0;
}
.summerChallengeCard{
  overflow:hidden;
}
.summerChallengeHero{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
  border:1px solid #b8d2ff;
  border-radius:8px;
  background:#eef5ff;
  padding:18px;
  margin-bottom:16px;
}
.summerChallengePoster{
  display:grid;
  gap:6px;
  justify-items:center;
  color:var(--blue);
  font-size:12px;
  font-weight:900;
  text-decoration:none;
}
.summerChallengePoster img{
  width:106px;
  aspect-ratio:664 / 921;
  object-fit:cover;
  border:1px solid #aac3ed;
  border-radius:8px;
  background:#fff;
  box-shadow:0 8px 18px rgba(0,43,127,.12);
}
.summerChallengeBrand{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}
.summerChallengeBrand img{
  width:72px;
  height:72px;
  object-fit:contain;
  flex:0 0 auto;
}
.summerChallengeBrand h3{
  color:var(--blue);
  margin:2px 0 4px;
}
.summerChallengeBrand p:last-child{
  color:#40506a;
  margin:0;
  line-height:1.45;
}
.summerChallengePrize{
  border:1px solid #ffd27a;
  border-radius:8px;
  background:#fff8df;
  padding:12px 14px;
  min-width:180px;
}
.summerChallengePrize span,
.summerChallengePrize strong{
  display:block;
}
.summerChallengePrize span{
  color:#7a4f00;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
}
.summerChallengePrize strong{
  color:#4e3500;
  margin-top:4px;
}
.summerChallengeTicketGrid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.summerChallengeTicket{
  display:flex;
  gap:10px;
  align-items:flex-start;
  border:1px solid var(--line);
  border-top:4px solid var(--blue);
  border-radius:8px;
  background:#fff;
  padding:12px;
}
.summerChallengeTicket.friend{
  border-top-color:#14843d;
}
.summerChallengeTicket.review{
  border-top-color:#f79009;
}
.summerChallengeTicket.social{
  border-top-color:#6941c6;
}
.summerChallengeNumber{
  display:flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:8px;
  background:var(--blue);
  color:#fff;
  font-size:20px;
  font-weight:900;
  flex:0 0 auto;
}
.summerChallengeTicket.friend .summerChallengeNumber{
  background:#14843d;
}
.summerChallengeTicket.review .summerChallengeNumber{
  background:#f79009;
}
.summerChallengeTicket.social .summerChallengeNumber{
  background:#6941c6;
}
.summerChallengeTicket h4{
  color:var(--ink);
  margin:0;
  font-size:15px;
}
.summerChallengeTicket p{
  color:#526071;
  font-size:13px;
  line-height:1.35;
  margin:5px 0 8px;
}
.summerChallengeTicket strong{
  color:var(--blue);
  display:block;
  font-size:13px;
}
.summerChallengeActions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}
.summerChallengeActions button{
  margin:0;
}
.summerChallengeDetails{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  border:1px solid #d8e0ec;
  border-radius:8px;
  background:#fbfcff;
  margin-top:14px;
  padding:12px;
}
.summerChallengeDetails strong{
  color:var(--blue);
}
.summerChallengeDetails p{
  color:#526071;
  line-height:1.4;
  margin:5px 0 0;
}
.summerChallengeTracker{
  border-top:1px solid #d8e0ec;
  margin-top:18px;
  padding-top:18px;
}
.summerTicketSheetGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
}
.summerTicketSheet{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  padding:12px;
}
.summerTicketSheet strong,
.summerTicketSheet span{
  display:block;
}
.summerTicketSheet > div:first-child strong{
  color:var(--blue);
}
.summerTicketSheet > div:first-child span{
  color:#526071;
  font-size:12px;
  line-height:1.35;
  margin-top:3px;
}
.summerTicketNumbers{
  display:flex;
  gap:6px;
}
.summerTicketNumbers div{
  min-width:74px;
  border:1px solid #d7e2f1;
  border-radius:8px;
  background:#f8fbff;
  padding:8px;
  text-align:center;
}
.summerTicketNumbers span{
  color:#526071;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
}
.summerTicketNumbers strong{
  color:var(--blue);
  font-size:22px;
  margin-top:2px;
}
.summerClaimPanel{
  border:1px solid #d8e0ec;
  border-radius:8px;
  background:#fbfcff;
  margin-top:14px;
  padding:14px;
}
.summerClaimPanel h4{
  color:var(--blue);
  margin:0 0 4px;
}
.summerClaimPanel p{
  color:#526071;
  margin:0 0 12px;
}
.summerClaimForm{
  display:grid;
  grid-template-columns:minmax(180px,1fr) minmax(220px,1.2fr) 160px;
  gap:10px;
  align-items:end;
}
.summerClaimForm label{
  margin:0;
}
.summerClaimForm label span{
  display:block;
  color:#344054;
  font-size:12px;
  font-weight:900;
  margin-bottom:5px;
}
.summerClaimEvidence{
  grid-column:1 / -1;
}
.summerClaimForm button{
  margin:0;
}
.summerTicketLedger{
  margin-top:14px;
}
.summerTicketLedgerHeader{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:8px;
}
.summerTicketLedgerHeader h4{
  color:var(--blue);
  margin:0;
}
.summerTicketLedgerHeader span{
  color:#526071;
  font-size:12px;
  font-weight:900;
}
.summerTicketLedgerRows{
  display:grid;
  gap:8px;
}
.summerTicketLedgerRow{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:start;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  padding:10px;
}
.summerTicketLedgerRow strong,
.summerTicketLedgerRow span,
.summerTicketLedgerRow small{
  display:block;
}
.summerTicketLedgerRow > div:first-child strong{
  color:var(--ink);
}
.summerTicketLedgerRow span,
.summerTicketLedgerRow small{
  color:#526071;
  line-height:1.35;
}
.summerTicketLedgerRow small{
  margin-top:5px;
}
.summerTicketLedgerRow > div:last-child{
  display:grid;
  gap:5px;
  justify-items:end;
}
.formTwo{
  grid-template-columns:1fr 1fr;
}
.storeCreditSummary{
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px;
  background:#fbfcff;
  margin-bottom:14px;
}
.storeCreditSummary span{
  display:block;
  color:var(--muted);
  font-size:12px;
  font-weight:bold;
  margin-bottom:5px;
}
.storeCreditSummary strong{
  color:var(--blue);
  font-size:20px;
}
.storeCreditLine{
  margin-top:10px;
  border:1px solid #bde5cc;
  border-radius:12px;
  padding:10px;
  background:#e9f7ed;
  color:var(--green);
  font-size:13px;
  font-weight:bold;
}
.storeProductCard{
  background:#fff;
}
.storeImageFallback{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:150px;
  border:1px dashed var(--line);
  border-radius:8px;
  background:#fbfcff;
  color:var(--muted);
  font-size:12px;
  font-weight:bold;
  margin-bottom:10px;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.storeChoiceGrid{
  margin-top:12px;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
}
.storeChoice{
  margin:0;
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px;
  background:#fbfcff;
}
.storeChoice span,
.storePaymentGrid span{
  display:block;
  color:var(--muted);
  font-size:12px;
  font-weight:bold;
  margin-bottom:6px;
}
.storeChoice strong{
  display:block;
  font-size:13px;
}
.storeChoice select,
.storePaymentGrid input{
  font-size:14px;
  padding:10px 11px;
  border-radius:10px;
}
.storePaymentGrid{
  grid-template-columns:1fr 1fr;
  margin-top:12px;
}
.storePaymentGrid.compact{
  max-width:140px;
  grid-template-columns:1fr;
}
.emptyState{
  border:1px dashed var(--line);
  border-radius:14px;
  padding:18px;
  color:var(--muted);
  background:#fbfcff;
}
.studentHeader,.bookingHeader,.graduationHeader{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
}
.sessionTitle{
  font-weight:bold;
  color:var(--blue);
}
.muted{
  color:var(--muted);
  font-size:14px;
}
.beltLine{
  margin-top:9px;
  font-size:14px;
  color:var(--ink);
}
.renewalBox{
  margin-top:13px;
  display:grid;
  gap:8px;
}
.renewalRow{
  display:grid;
  grid-template-columns:1fr auto;
  gap:4px 10px;
  align-items:center;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  font-size:13px;
}
.renewalRow span{
  color:var(--muted);
}
.renewalRow strong{
  color:var(--ink);
}
.renewalRow em{
  grid-column:1 / -1;
  font-style:normal;
  font-weight:bold;
}
.renewalOk{color:var(--green)}
.renewalDueSoon{color:var(--amber)}
.renewalOverdue{color:var(--red)}
.renewalMissing{color:var(--muted)}
.badge{
  display:inline-flex;
  align-items:center;
  width:max-content;
  border-radius:999px;
  padding:5px 9px;
  font-size:12px;
  font-weight:bold;
  background:#eef2fb;
  color:var(--blue);
}
.badge.ok{
  background:#e9f7ed;
  color:var(--green);
}
.badge.warn{
  background:#fff5dc;
  color:var(--amber);
}
.badge.bad{
  background:#fff0f0;
  color:var(--red);
}
.bookingMeta,.graduationMeta{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:8px;
  margin-top:12px;
}
.metaBox{
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px;
  font-size:13px;
}
.metaBox span{
  display:block;
  color:var(--muted);
  margin-bottom:3px;
}
.metaBox strong{
  color:var(--ink);
}
.quickActions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.quickActions button{margin-top:0}
.codePanel{
  margin-top:14px;
  border-top:1px solid var(--line);
  padding-top:4px;
}
.portalPasswordForm{
  border-top:1px solid var(--line);
  margin-top:4px;
  padding-top:6px;
}
.mustChangePassword{
  border-color:#f2c36b;
  background:#fffaf0;
}
.mustChangePassword .sectionTitle h3{
  color:#8a4b00;
}
.passwordHint{
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
  margin:10px 0 2px;
}
.pastGraduationGroup h4{
  margin-bottom:10px;
  color:var(--blue);
}
.timeline{
  position:relative;
  display:grid;
  gap:10px;
  padding-left:16px;
}
.timeline:before{
  content:"";
  position:absolute;
  left:4px;
  top:4px;
  bottom:4px;
  width:2px;
  background:var(--line);
}
.timelineItem{
  position:relative;
  background:#fff;
  border:1px solid var(--line);
  border-radius:13px;
  padding:11px 12px;
}
.timelineItem:before{
  content:"";
  position:absolute;
  left:-18px;
  top:15px;
  width:10px;
  height:10px;
  border-radius:999px;
  background:var(--red);
  box-shadow:0 0 0 3px #fff;
}
.timelineItemHeader{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
}
.timelineItemTitle{
  font-weight:bold;
  color:var(--ink);
}
.timelineItemDate{
  color:var(--blue);
  font-weight:bold;
  white-space:nowrap;
}
.timelineItemMeta{
  margin-top:6px;
  color:var(--muted);
  font-size:13px;
}
@media(max-width:850px){
  .summaryGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .studentPortalMenu{grid-template-columns:repeat(2,minmax(0,1fr))}
  .summerChallengeHero{grid-template-columns:1fr}
  .summerChallengeTicketGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .summerChallengePrize{max-width:360px}
}
@media(max-width:600px){
  .shell{padding:12px}
  .hero{padding:22px}
  .hero h1{font-size:27px}
  .card{padding:16px}
  .panelHeader,.sectionTitle,.studentHeader,.bookingHeader,.graduationHeader,.timelineItemHeader{display:block}
  .summaryGrid{grid-template-columns:1fr}
  .studentPortalMenu{grid-template-columns:1fr}
  .bookingFlowSteps{grid-template-columns:1fr}
  .studentGrid{grid-template-columns:1fr}
  .bookingSelectedStudentNotice{
    display:block;
  }
  .bookingSelectedStudentNotice span{
    display:block;
    margin-top:4px;
  }
  .storeToolbar,
  .formTwo,
  .referralGrid,
  .storePaymentGrid,
  .summerChallengeTeaser,
  .summerChallengeDetails,
  .summerChallengeTicketGrid{
    grid-template-columns:1fr;
  }
  .summerChallengeBrand{
    align-items:flex-start;
  }
  .summerChallengePoster{
    justify-items:start;
  }
  .summerChallengePoster img{
    width:min(100%, 260px);
    max-height:360px;
    object-fit:contain;
  }
  .paymentHeader{
    display:block;
  }
  .paymentAmount{
    margin-top:8px;
  }
  button{width:100%;margin-right:0}
  .renewalRow{grid-template-columns:1fr}
  .timelineItemDate{white-space:normal;margin-top:4px}
}


/* Stage 5 instructor dashboard */
.instructorGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.instructorGrid .field{
  min-width:0;
}
.instructorActions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}
.instructorActions button{
  margin-top:0;
}
.registerToolbar{
  display:grid;
  grid-template-columns:1fr 220px;
  gap:12px;
  margin-bottom:14px;
}
.classBlock{
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--soft);
  overflow:hidden;
}
.classBlockHeader{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
  padding:15px 16px;
  background:#fff;
  border-bottom:1px solid var(--line);
}
.classBlockTitle{
  font-weight:bold;
  color:var(--blue);
  font-size:17px;
}
.classBlockMeta{
  margin-top:5px;
  color:var(--muted);
  font-size:13px;
}
.registerRows{
  display:grid;
  gap:10px;
  padding:14px;
}
.registerStudentRow{
  display:grid;
  grid-template-columns:1fr auto;
  gap:12px;
  align-items:center;
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px;
}
.registerStudentName{
  font-weight:bold;
  color:var(--ink);
}
.registerStudentDetails{
  margin-top:4px;
  color:var(--muted);
  font-size:13px;
  line-height:1.35;
}
.attButtons{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  justify-content:flex-end;
}
.attButtons button{
  margin:0;
  padding:9px 11px;
  border-radius:9px;
  font-size:13px;
}
.attButtons .presentBtn{
  background:var(--green);
}
.attButtons .excusedBtn{
  background:var(--blue);
}
.attButtons .unexcusedBtn{
  background:var(--amber);
}
.attButtons .disabledBtn{
  opacity:.6;
}
.manualBookingLayout{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.searchResults{
  display:grid;
  gap:8px;
  margin-top:12px;
}
.searchResult{
  border:1px solid var(--line);
  border-radius:13px;
  background:#fff;
  padding:12px;
  cursor:pointer;
}
.searchResult:hover{
  border-color:var(--blue);
}
.searchResult.active{
  outline:3px solid rgba(0,43,127,.15);
  border-color:var(--blue);
}
.selectedStudentBox{
  border:1px solid var(--line);
  border-radius:13px;
  background:#fff;
  padding:12px;
  min-height:76px;
}
.sessionSelectList{
  display:grid;
  gap:8px;
  margin-top:12px;
}
.sessionPick{
  border:1px solid var(--line);
  border-radius:13px;
  background:#fff;
  padding:12px;
  cursor:pointer;
}
.sessionPick:hover{
  border-color:var(--blue);
}
.sessionPick.active{
  outline:3px solid rgba(192,0,0,.16);
  border-color:var(--red);
}
.sessionPick.full{
  opacity:.6;
  cursor:not-allowed;
}
.sessionPick.disabled{
  opacity:.55;
  cursor:not-allowed;
}
.attendanceSummaryGrid{
  margin:0 0 18px;
}
.attendanceCalendarToolbar{
  margin:16px 0 12px;
}
.attendanceBookingCalendar{
  margin-bottom:16px;
}
.attendanceCalendarDay{
  min-height:142px;
}
.attendanceCalendarDay.selected{
  border-color:#c00000;
  box-shadow:0 0 0 2px rgba(192,0,0,.14);
}
.attendanceCalendarDay.outsideWindow{
  background:#f8fafc;
}
.attendanceCalendarDateBtn{
  border:0;
  border-radius:0;
  box-shadow:none;
  background:transparent;
  color:inherit;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:6px;
  padding:0;
  text-align:left;
  width:100%;
}
.attendanceCalendarDateBtn:hover{
  color:var(--blue);
}
.calendarEmptyHint{
  margin-top:auto;
}
.attendanceSelectedDay{
  border-top:1px solid var(--line);
  margin-top:10px;
  padding-top:14px;
}
.attendanceSessionPick{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
}
.sessionInlineActions{
  display:flex;
  gap:8px;
  justify-content:flex-end;
  flex-wrap:wrap;
}
.pinNotice{
  margin-top:10px;
  color:var(--muted);
  font-size:13px;
}
@media(max-width:850px){
  .instructorGrid,
  .manualBookingLayout,
  .registerToolbar{
    grid-template-columns:1fr;
  }
  .registerStudentRow{
    grid-template-columns:1fr;
  }
  .attButtons{
    justify-content:flex-start;
  }
  .attendanceSessionPick{
    grid-template-columns:1fr;
  }
  .sessionInlineActions{
    justify-content:flex-start;
  }
}


/* Stage 6 instructor admin dashboard */
.adminTabs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:14px 0 18px;
}
.adminTabs button{
  margin:0;
  background:#eef2fb;
  color:var(--blue);
  border:1px solid var(--line);
}
.adminTabs button.active{
  background:var(--blue);
  color:#fff;
}
.adminPanel{
  display:none;
}
.adminPanel.active{
  display:block;
}
.adminList{
  display:grid;
  gap:12px;
}
.adminItem{
  border:1px solid var(--line);
  border-radius:16px;
  padding:15px;
  background:var(--soft);
}
.adminItemHeader{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
}
.adminItemTitle{
  font-weight:bold;
  color:var(--blue);
}
.adminItemSub{
  margin-top:4px;
  color:var(--muted);
  font-size:13px;
  line-height:1.35;
}
.adminItemMeta{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:8px;
  margin-top:12px;
}
.adminButtons{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.adminButtons button{
  margin:0;
  padding:10px 12px;
  font-size:13px;
}
.adminButtons .greenBtn{
  background:var(--green);
}
.adminButtons .blueBtn{
  background:var(--blue);
}
.adminButtons .amberBtn{
  background:var(--amber);
}
.adminControls{
  display:grid;
  grid-template-columns:1fr 160px auto;
  gap:12px;
  align-items:end;
  margin-bottom:14px;
}
.smallInput{
  padding:10px 11px;
  font-size:14px;
}
.dueLine{
  margin-top:8px;
  font-size:13px;
  font-weight:bold;
}
.dueOk{color:var(--green)}
.dueSoon{color:var(--amber)}
.dueOverdue{color:var(--red)}
@media(max-width:850px){
  .adminControls{
    grid-template-columns:1fr;
  }
  .adminItemHeader{
    display:block;
  }
}


/* Stage 7 instructor login */
.loginSplit{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
  align-items:start;
}
.loginHelp{
  background:var(--soft);
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
}
.userPill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid var(--line);
  border-radius:999px;
  padding:8px 12px;
  background:#fff;
  color:var(--blue);
  font-weight:bold;
  margin-top:10px;
}
.lockNotice{
  margin-top:12px;
  padding:12px 14px;
  border-radius:12px;
  background:#fff8e5;
  color:var(--amber);
  border:1px solid #f1d58b;
  font-size:13px;
  line-height:1.4;
}
@media(max-width:850px){
  .loginSplit{
    grid-template-columns:1fr;
  }
}


/* Stage 10 graduation register */
.heroActions{
  display:flex;
  align-items:flex-start;
  gap:10px;
}
.buttonLink{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  border:0;
  background:var(--blue);
  color:white;
  border-radius:11px;
  padding:12px 18px;
  font-weight:800;
  cursor:pointer;
  font-size:14px;
  min-height:42px;
  box-sizing:border-box;
}
.buttonLink.secondary{
  background:#f4f7fb;
  color:var(--blue);
  border:1px solid var(--line);
}
.datePillList{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.datePill{
  border:1px solid var(--line);
  background:var(--soft);
  color:var(--ink);
  border-radius:999px;
  padding:9px 13px;
  cursor:pointer;
  font-weight:700;
}
.datePill.active{
  background:var(--blue);
  color:#fff;
  border-color:var(--blue);
}
.bulkActions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:14px 0 18px;
}
.graduationList{
  display:grid;
  gap:12px;
}
.graduationCard{
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--soft);
  padding:16px;
}
.graduationCard.attended{
  border-color:#bde5cc;
  background:#f5fbf7;
}
.graduationCardHeader{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
}
.graduationStudentTitle{
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.graduationStudentTitle input{
  margin-top:4px;
}
.graduationStudentName{
  font-size:18px;
  font-weight:900;
  color:var(--blue);
}
.graduationSub{
  color:var(--muted);
  font-size:13px;
  margin-top:3px;
}
.graduationMeta{
  display:grid;
  grid-template-columns:repeat(4, minmax(130px, 1fr));
  gap:10px;
  margin:14px 0;
}
.graduationMeta .metaBox{
  background:white;
}
.emailTemplateRow{
  display:grid;
  grid-template-columns:minmax(220px, 1fr) auto auto auto;
  gap:10px;
  align-items:end;
}
.emailTemplateRow select{
  min-height:42px;
}
.statusDot{
  display:inline-block;
  border-radius:999px;
  padding:6px 10px;
  font-size:12px;
  font-weight:800;
  background:#eef2fb;
  color:var(--blue);
}
.statusDot.ok{
  background:#e8f7ee;
  color:var(--green);
}
.statusDot.warn{
  background:#fff2d9;
  color:var(--amber);
}
.statusDot.bad{
  background:#fdeaea;
  color:var(--red);
}
.emailPreview{
  margin-top:10px;
  font-size:12px;
  color:var(--muted);
  line-height:1.4;
}
@media(max-width:800px){
  .graduationMeta{
    grid-template-columns:1fr;
  }
  .emailTemplateRow{
    grid-template-columns:1fr;
  }
}


/* Stage 12 instructor centre stats */
.statsTwoColumn{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:18px;
  margin-top:20px;
}
.statsTwoColumn h4{
  margin:0 0 10px;
}
.statsTableWrap{
  overflow:auto;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
}
.statsTable{
  width:100%;
  border-collapse:collapse;
  font-size:14px;
}
.statsTable th,
.statsTable td{
  padding:11px 12px;
  border-bottom:1px solid var(--line);
  text-align:right;
  white-space:nowrap;
}
.statsTable th:first-child,
.statsTable td:first-child{
  text-align:left;
}
.statsTable thead th{
  color:var(--blue);
  background:#f4f7fb;
  font-weight:900;
}
.statsTable tbody tr:last-child td{
  border-bottom:0;
}
.statsTable tfoot td{
  background:#eef7f0;
  color:var(--green);
  font-weight:900;
  border-top:2px solid #cfe9d7;
  border-bottom:0;
}
@media(max-width:850px){
  .statsTwoColumn{
    grid-template-columns:1fr;
  }
}

.miniStat{
  display:inline-block;
  margin-left:8px;
  padding:2px 7px;
  border-radius:999px;
  background:#eef2fb;
  color:var(--blue);
  font-size:12px;
  font-weight:900;
}


/* Stage 13 prospect trial booking */
.prospectBadge{
  display:inline-block;
  padding:4px 8px;
  border-radius:999px;
  background:#fff2d9;
  color:#9a5b00;
  font-size:12px;
  font-weight:900;
  margin-left:6px;
}
.registerStudentRow.prospectRow{
  border-left:5px solid #f2b84b;
  background:#fffaf0;
}
.prospectContactLine{
  font-size:12px;
  color:var(--muted);
  margin-top:4px;
}


/* Stage 13B prospect list and add form */
.tallResults{
  max-height:360px;
  overflow:auto;
}
.miniHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}
.smallBtn{
  padding:8px 12px;
  font-size:13px;
}
.softDivider{
  border:0;
  border-top:1px solid var(--line);
  margin:18px 0;
}
.compactFormGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-bottom:10px;
}
.compactFormGrid input{
  min-width:0;
}
.prospectMeta{
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-top:3px;
}
.studentResult.selectedProspect{
  border-color:var(--blue);
  background:#eef7ff;
}
@media(max-width:700px){
  .compactFormGrid{
    grid-template-columns:1fr;
  }
}


/* Stage 14 Timetable Manager */
.filterGrid{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:14px;
}
.timetableForm{
  margin-bottom:12px;
}
.rankMultiSelect{
  width:100%;
  min-height:150px;
  margin:6px 0 8px;
}
.rankPresetBar{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:6px 0 4px;
}
.rankPresetBar .smallBtn{
  padding:7px 10px;
}
.choiceActions{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:12px;
}
.choiceActions .formHint{
  flex:1 1 280px;
  margin-bottom:0;
}
.wizardPanel,
.bulkEditPanel{
  border:1px solid var(--line);
  border-radius:8px;
  background:#fbfcff;
  padding:14px;
}
.wizardGrid{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:12px;
  margin-bottom:14px;
}
.wizardSplit{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  align-items:start;
  margin-bottom:14px;
}
.compactWizardSplit{
  margin:12px 0 0;
}
.wizardDayGrid{
  display:grid;
  grid-template-columns:repeat(7, minmax(0, 1fr));
  gap:8px;
  margin:7px 0 14px;
}
.wizardDayGrid label,
.bulkEditGrid label,
.compactWizardSplit label{
  min-height:42px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  margin:0;
  font-weight:900;
}
.wizardDayGrid input,
.bulkEditGrid input[type="checkbox"],
.compactWizardSplit input[type="checkbox"]{
  width:auto;
  margin:0;
}
.wizardTimeRows{
  display:grid;
  gap:8px;
  margin:7px 0 14px;
}
.wizardTimeRow{
  display:grid;
  grid-template-columns:160px 160px auto;
  gap:10px;
  align-items:center;
}
.bulkEditPanel{
  margin-bottom:14px;
}
.bulkEditGrid{
  display:grid;
  grid-template-columns:150px minmax(180px, 1fr) 100px 240px 120px 150px;
  gap:10px;
  align-items:center;
}
.inlineFields{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.rankSetupTable input[type="number"]{
  width:84px;
  padding:8px;
}
.rankSetupTable select{
  min-width:150px;
  padding:8px;
}
.rankSetupTable label{
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-weight:800;
  margin:0;
}
.rankSetupTable .rankProgramme{
  color:#5f6b7a;
  font-size:12px;
}
.formHint{
  margin:0 0 12px;
  color:#5f6b7a;
  font-size:13px;
}
.calendarToolbar{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.sessionActions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.sessionActions.formActions{
  justify-content:flex-start;
}
.timetableCalendar{
  display:grid;
  grid-template-columns:repeat(7, minmax(0, 1fr));
  gap:6px;
}
.calendarWeekday{
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  color:#667085;
  padding:0 4px 4px;
}
.calendarDay{
  min-height:96px;
  border:1px solid var(--line);
  background:#fff;
  color:#172033;
  border-radius:8px;
  padding:9px;
  text-align:left;
  display:flex;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
}
.calendarDay:hover,
.calendarDay.selected{
  border-color:#1553c7;
  box-shadow:0 0 0 2px rgba(21,83,199,.14);
}
.calendarDay.muted{
  opacity:.48;
}
.calendarDateNumber{
  font-size:18px;
  font-weight:900;
}
.calendarDayStats{
  display:block;
  font-size:12px;
  line-height:1.25;
  color:#526071;
}
.dayBookingPanel{
  margin-top:16px;
}
.dayBookingHeader{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  margin-bottom:12px;
}
.dayClassList{
  display:grid;
  gap:12px;
}
.dayClassBlock{
  border:1px solid var(--line);
  border-radius:8px;
  padding:12px;
  background:#fff;
}
.bookingRoster{
  margin-top:10px;
  border-top:1px solid var(--line);
}
.bookingRosterRow{
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:8px;
  padding:8px 0;
  border-bottom:1px solid #eef2f7;
  font-size:13px;
}
.emptyState.compact{
  padding:10px;
  margin-top:8px;
}
.closedRow{
  opacity:.65;
  background:#fff5f5;
}
.greenBtn{
  background:var(--green);
  color:#fff;
}
.greenBtn:hover:not(:disabled){
  box-shadow:0 8px 18px rgba(19,115,51,.2);
}
.dangerBtn{
  background:#a32626;
  color:#fff;
  border:0;
}
.dangerBtn:hover{
  filter:brightness(.95);
}
.secondaryLink{
  display:inline-block;
  padding:10px 14px;
  border-radius:10px;
  background:#fff;
  color:var(--blue);
  font-weight:900;
  text-decoration:none;
  border:1px solid var(--line);
}
.heroActions{
  display:flex;
  justify-content:flex-end;
  align-items:center;
}
@media(max-width:800px){
  .filterGrid{
    grid-template-columns:1fr;
  }
  .wizardGrid,
  .wizardSplit,
  .bulkEditGrid{
    grid-template-columns:1fr;
  }
  .wizardDayGrid{
    grid-template-columns:1fr 1fr;
  }
  .wizardTimeRow,
  .inlineFields{
    grid-template-columns:1fr;
  }
  .timetableCalendar{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .calendarWeekday{
    display:none;
  }
  .bookingRosterRow{
    grid-template-columns:1fr;
  }
}


/* Stage 14E timetable manager dashboard styling */
.timetablePage{
  background:#edf3fb;
}
.timetablePage .portalShell{
  box-sizing:border-box;
  width:100%;
  max-width:min(1760px, calc(100vw - 32px));
  margin:0 auto;
  padding:28px 22px 60px;
}
.timetableHero{
  background:linear-gradient(135deg, #082b7f, #1553c7);
  color:#fff;
  border-radius:18px;
  border-bottom:6px solid #d60000;
  box-shadow:0 16px 40px rgba(0,40,120,.18);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  padding:28px 34px;
}
.timetableHero h1{
  color:#fff;
  font-size:34px;
  line-height:1.05;
  margin:3px 0 8px;
}
.timetableHero p{
  color:#fff;
  margin:0;
}
.timetableHero .eyebrow{
  color:#fff;
  letter-spacing:.08em;
}
.lightButton{
  display:inline-block;
  background:#fff;
  color:#082b7f;
  border:1px solid rgba(255,255,255,.6);
  box-shadow:0 8px 20px rgba(0,0,0,.12);
}
.lightButton:hover{
  filter:brightness(.98);
}
.timetablePage .card{
  margin-top:20px;
}
.timetablePage .compactFormGrid.timetableForm{
  grid-template-columns:repeat(7, minmax(120px, 1fr));
}
.timetablePage #scheduleList .statsTable{
  min-width:1180px;
}
.timetablePage #sessionList .statsTable{
  min-width:1320px;
}
.timetablePage .statsTable th,
.timetablePage .statsTable td{
  vertical-align:middle;
}
.timetablePage .statsTable td:last-child{
  text-align:right;
}
@media(max-width:1180px){
  .timetablePage .compactFormGrid.timetableForm{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}
@media(max-width:760px){
  .timetablePage .portalShell{
    max-width:calc(100vw - 16px);
    padding:18px 8px 42px;
  }
  .timetablePage .compactFormGrid.timetableForm{
    grid-template-columns:1fr;
  }
  .timetableHero{
    flex-direction:column;
    align-items:flex-start;
    padding:24px;
  }
  .timetableHero h1{
    font-size:30px;
  }
}


/* Stage 15 Prospect induction dashboard */
.prospectPage .manualBookingLayout.prospectDashboardLayout{
  align-items:start;
}
.inductionCard{
  cursor:pointer;
}
.inductionCard .bookingHeader{
  align-items:flex-start;
}
.prospectActions{
  display:flex;
  gap:8px;
  margin-top:10px;
  flex-wrap:wrap;
}
.prospectPage .tallResults{
  max-height:420px;
  overflow:auto;
}


/* Stage 15C prospect overdue/display fixes */
.inductionCard .statusBadge.warn{
  background:#fff3cd;
  color:#856404;
}


/* Stage 15E prospect follow-up list */
.prospectPage .studentResult .prospectMeta:first-of-type{
  font-weight:700;
}


/* Stage 15H prospect quick status buttons */
.prospectQuickActions,
.prospectMiniActions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.prospectMiniActions{
  gap:6px;
}
.prospectMiniActions .smallBtn{
  padding:6px 9px;
  font-size:12px;
}
.selectedStudentBox .prospectQuickActions{
  margin-top:14px;
}
.compactSectionTitle{
  margin-top:22px;
}
.prospectConversionSummary{
  margin-bottom:14px;
}
.prospectJourneyList{
  display:flex;
  flex-direction:column;
  gap:12px;
  max-height:620px;
  overflow:auto;
  padding-right:4px;
  margin-bottom:22px;
}
.prospectJourneyCard{
  border:1px solid #d7e2f3;
  border-radius:8px;
  background:#fbfdff;
  padding:14px;
  cursor:pointer;
}
.prospectJourneyCard:hover{
  border-color:#8eb3e8;
  box-shadow:0 8px 20px rgba(0,43,127,.08);
}
.prospectJourneyHeader{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
}
.prospectJourneyHeader strong,
.prospectJourneyHeader span{
  display:block;
}
.prospectJourneyHeader strong{
  color:#06224a;
  font-size:16px;
}
.prospectJourneyHeader span{
  color:#4d6078;
  font-size:13px;
  margin-top:2px;
}
.prospectJourneySteps{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(120px, 1fr));
  gap:8px;
  margin-top:12px;
}
.prospectJourneyStep{
  border:1px solid #d7e2f3;
  border-radius:8px;
  background:#ffffff;
  padding:8px;
  min-height:58px;
}
.prospectJourneyStep.done{
  border-color:#b7ebc6;
  background:#f1fbf4;
}
.prospectJourneyStep.pending{
  border-color:#fed7aa;
  background:#fff8f0;
}
.prospectJourneyStep strong,
.prospectJourneyStep span{
  display:block;
}
.prospectJourneyStep strong{
  color:#06224a;
  font-size:12px;
  line-height:1.2;
}
.prospectJourneyStep span{
  color:#4d6078;
  font-size:12px;
  margin-top:3px;
  line-height:1.25;
}
.prospectJourneyActions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.prospectEditModalCard textarea,
.prospectEditModalCard select{
  width:100%;
}
.prospectEditModalCard label span{
  display:block;
  font-weight:800;
  color:#344054;
  margin:8px 0 5px;
}


/* Stage 16 graduation form reminders / not attending */
.graduationFormButtons{
  align-items:center;
}
.inlineCheck{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 10px;
  border-radius:10px;
  background:#f6f7fb;
  border:1px solid #d9deea;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}
.inlineCheck input{
  width:auto;
  margin:0;
}
.dangerCheck{
  background:#fff5f5;
  border-color:#f0b6b6;
  color:#9b1c1c;
}
.adminButtons button:disabled{
  opacity:.45;
  cursor:not-allowed;
}


/* Stage 16D current graduation filter */
.adminControls select#graduationFilter{
  min-width:240px;
}
.summaryCard strong{
  overflow-wrap:anywhere;
}


/* Stage 17 student directory/details */
.studentFilterGrid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr 1.4fr .8fr;
  gap:14px;
  align-items:end;
}
.studentTableWrap{
  width:100%;
  overflow:auto;
}
.studentTable{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
}
.studentTable th{
  text-align:left;
  padding:10px;
  background:#f1f4f9;
  border-bottom:1px solid #d9deea;
  white-space:nowrap;
}
.studentTable td{
  padding:10px;
  border-bottom:1px solid #edf0f5;
  vertical-align:top;
}
.studentTable td span{
  display:block;
  color:#667085;
  font-size:12px;
  margin-top:3px;
}
.studentDetailHero h1{
  margin-bottom:8px;
}
.studentQuickCards{
  display:grid;
  grid-template-columns:repeat(6, 1fr);
  gap:12px;
}
.studentQuickCards .summaryCard em{
  display:block;
  font-size:12px;
  color:#667085;
  font-style:normal;
}
.studentTabs{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  border-bottom:1px solid #d9deea;
  padding-bottom:12px;
  margin-bottom:18px;
}
.tabBtn{
  border:1px solid #d9deea;
  background:#fff;
  border-radius:999px;
  padding:9px 12px;
  font-weight:700;
  cursor:pointer;
}
.tabBtn.active{
  background:#0f3f7a;
  color:#fff;
  border-color:#0f3f7a;
}
.studentTabContent h3{
  margin:0 0 14px;
}
.detailGrid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:12px;
  margin-bottom:18px;
}
.detailField{
  padding:12px;
  border:1px solid #e1e5ee;
  background:#fafbff;
  border-radius:12px;
}
.detailField span{
  display:block;
  color:#667085;
  font-size:12px;
  font-weight:700;
  margin-bottom:4px;
}
.detailField strong{
  display:block;
  font-size:14px;
  overflow-wrap:anywhere;
}
.detailTable th,
.detailTable td{
  white-space:nowrap;
}
@media (max-width: 1000px){
  .studentFilterGrid,
  .studentQuickCards,
  .detailGrid{
    grid-template-columns:1fr;
  }
}


/* Stage 17D mapped student detail tabs */
.detailTwoColumn{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.detailTwoColumn h4{
  margin:0 0 10px;
}
.equipmentCard{
  border:1px solid #d9deea;
  border-radius:14px;
  padding:14px;
  margin-bottom:14px;
  background:#fff;
}
.equipmentGrid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:10px;
  margin-top:12px;
}
.equipmentItem{
  background:#f8fafc;
  border:1px solid #e4e7ef;
  border-radius:10px;
  padding:10px;
}
.equipmentPackImage{
  width:100%;
  max-height:150px;
  object-fit:cover;
  border:1px solid #d9deea;
  border-radius:8px;
  background:#fff;
  margin-bottom:10px;
}
.equipmentItem span{
  display:block;
  color:#667085;
  font-size:12px;
  font-weight:700;
  margin-bottom:3px;
}
.equipmentItem strong{
  display:block;
  font-size:13px;
}
.equipmentSaleItem{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
}
.equipmentSaleItem span,
.equipmentSaleItem strong{
  margin:0;
}
.equipmentSaleItem em{
  color:#667085;
  font-size:12px;
  font-style:normal;
  font-weight:800;
}
.equipmentSaleItem .smallBtn{
  margin-top:2px;
}
.proShopActionRow{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0 0 18px;
}
.inventoryThumb{
  width:52px;
  height:52px;
  object-fit:cover;
  border:1px solid #d9deea;
  border-radius:8px;
  background:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#667085;
  font-size:10px;
  font-weight:800;
  text-align:center;
}
.inventoryThumb.largeThumb{
  width:140px;
  height:140px;
  display:block;
  margin-top:8px;
}
.emptyThumb{
  padding:4px;
}
.inventoryImagePanel{
  display:grid;
  grid-template-columns:170px minmax(220px, 1fr) minmax(220px, 1fr);
  gap:12px;
  align-items:end;
  border:1px solid #d9deea;
  border-radius:12px;
  padding:12px;
  background:#fff;
}
.inventoryImagePanel .inlineActions{
  margin:0;
  align-self:end;
}
.inventoryImagePanel .fieldHelp{
  grid-column:1 / -1;
  margin:0;
}
.packItemPicker{
  grid-column:1 / -1;
  width:100%;
}
.miniNumberInput{
  width:82px;
  min-width:82px;
  padding:8px 10px;
}
.miniBadge.ok{
  background:#e9f7ed;
  color:#067647;
}
.miniBadge.bad{
  background:#fff0f0;
  color:#c00000;
}
@media (max-width: 1000px){
  .detailTwoColumn,
  .equipmentGrid,
  .inventoryImagePanel{
    grid-template-columns:1fr;
  }
}


/* Stage 17E student detail invalid response + tab text fix */
.studentTabs .tabBtn{
  color:#0f3f7a;
  background:#fff;
  border:1px solid #d9deea;
  margin:0;
  width:auto;
  min-width:auto;
  white-space:nowrap;
  line-height:1.2;
}
.studentTabs .tabBtn.active{
  color:#fff;
  background:#0f3f7a;
  border-color:#0f3f7a;
}
.studentTabs .tabBtn:hover:not(:disabled){
  box-shadow:0 6px 14px rgba(15,63,122,.15);
}


/* Stage 17H student detail quick actions and summaries */
.studentActionPanel{
  grid-column:1 / -1;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  border:1px solid #d9deea;
  border-radius:14px;
  padding:14px;
  background:#f8fbff;
}
.studentActionPanel strong{
  display:block;
  color:#072f63;
  font-size:15px;
}
.studentActionPanel span{
  display:block;
  color:#667085;
  font-size:12px;
  margin-top:3px;
}
.studentActionButtons{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.buttonLink.smallBtn,
button.smallBtn{
  padding:8px 10px;
  min-height:auto;
  font-size:13px;
  line-height:1.1;
}
.disabledLink{
  opacity:.45;
  pointer-events:none;
}
.studentMiniSummary{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:12px;
  margin-bottom:16px;
}
.warningCard{
  border-color:#f0b6b6 !important;
  background:#fff5f5 !important;
}
.streamSummaryGrid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:10px;
  margin:0 0 18px;
}
.streamCard{
  border:1px solid #d9deea;
  border-radius:12px;
  padding:12px;
  background:#f8fafc;
}
.streamCard span{
  display:block;
  color:#667085;
  font-size:12px;
  font-weight:700;
}
.streamCard strong{
  display:block;
  color:#072f63;
  font-size:17px;
  margin-top:4px;
}
.streamCard em{
  display:block;
  color:#667085;
  font-size:12px;
  font-style:normal;
  margin-top:4px;
}
.outstandingRow{
  background:#fff5f5;
}
.tabToolbar{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin:0 0 14px;
  padding:12px;
  border:1px solid #d9deea;
  border-radius:12px;
  background:#f8fafc;
}
.tabToolbar label{
  margin:0;
  font-weight:800;
}
.tabToolbar select{
  max-width:260px;
}
.tabToolbar span{
  color:#667085;
  font-size:13px;
}
.graduationHighlight{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
  border:1px solid #d9deea;
  border-radius:14px;
  background:#f8fbff;
  padding:16px;
  margin-bottom:18px;
}
.graduationHighlight span{
  display:block;
  color:#667085;
  font-size:12px;
  font-weight:800;
}
.graduationHighlight strong{
  display:block;
  color:#072f63;
  font-size:24px;
  margin-top:3px;
}
.graduationHighlight em{
  display:block;
  color:#344054;
  font-size:13px;
  font-style:normal;
  margin-top:4px;
}
.badgeLine{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:7px;
}
.miniBadge{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:5px 8px;
  font-size:12px;
  font-weight:800;
  background:#edf2f7;
  color:#344054;
}
.miniBadge.ok{
  background:#e8f7ee;
  color:#116329;
}
.miniBadge.warn{
  background:#fff3cd;
  color:#856404;
}
.miniBadge.bad{
  background:#fdeaea;
  color:#9b1c1c;
}
.inlineActions{
  min-width:260px;
}
.dangerMini{
  background:#fff5f5 !important;
  color:#9b1c1c !important;
  border-color:#f0b6b6 !important;
}
@media (max-width:1000px){
  .studentActionPanel,
  .graduationHighlight{
    flex-direction:column;
    align-items:flex-start;
  }
  .studentMiniSummary,
  .streamSummaryGrid{
    grid-template-columns:1fr;
  }
}


/* Stage 17I student edit + manual payment */
.inlineSectionTitle{
  margin-bottom:14px;
}
.studentEditForm{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:12px;
}
.studentEditForm .formGroupTitle{
  grid-column:1 / -1;
  margin:10px 0 0;
  padding-top:12px;
  border-top:1px solid #d9deea;
  color:#072f63;
}
.editField{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.editField span{
  color:#344054;
  font-size:12px;
  font-weight:800;
}
.editField input,
.editField select,
.editField textarea{
  width:100%;
  border:1px solid #d9deea;
  border-radius:10px;
  padding:10px 11px;
  font-size:14px;
  background:#fff;
}
.editFieldWide{
  grid-column:1 / -1;
}
.editActions{
  grid-column:1 / -1;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
  border-top:1px solid #d9deea;
  padding-top:14px;
  margin-top:4px;
}
@media (max-width:1000px){
  .studentEditForm{
    grid-template-columns:1fr;
  }
}


/* Stage 18 new student + Stripe signup */
.newStudentForm .formGroupTitle{
  grid-column:1 / -1;
  margin:12px 0 0;
  padding-top:12px;
  border-top:1px solid #d9deea;
  color:#072f63;
}
.editCheckboxField label{
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:700;
  color:#344054;
}
.editCheckboxField input[type="checkbox"]{
  width:auto;
}
.newStudentClassroomOnly{
  display:none;
}
.createdStudentResult{
  margin-top:18px;
}
.createdCard{
  border:1px solid #d9deea;
  border-radius:14px;
  padding:16px;
  background:#f8fbff;
}
.createdCard h3{
  margin:0 0 12px;
}
.noticeBox{
  border:1px solid #d9deea;
  border-radius:14px;
  padding:14px;
  background:#f8fafc;
  color:#344054;
}


/* Stage 21DL general information form */
.generalInfoFormPage .generalInfoCard{
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
}
.generalInfoSavedPanel{
  border:1px solid #d9deea;
  border-radius:12px;
  background:#f8fbff;
  padding:14px;
  margin:0 0 16px;
}
.generalInfoSavedHeader{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  margin-bottom:10px;
}
.generalInfoSavedHeader h4{
  margin:0;
  color:#071f41;
}
.generalInfoSavedSearch{
  margin-bottom:10px;
}
.generalInfoSavedSearch input{
  width:100%;
  border:1px solid #d9deea;
  border-radius:10px;
  padding:10px 11px;
  font-size:14px;
}
.savedFormsList{
  display:grid;
  gap:8px;
  max-height:330px;
  overflow:auto;
  padding-right:4px;
}
.savedFormRow{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:12px;
  align-items:center;
  border:1px solid #e3e9f4;
  border-radius:10px;
  background:#fff;
  padding:10px;
}
.savedFormRow strong,
.savedFormRow span,
.savedFormRow small{
  display:block;
}
.savedFormRow strong{
  color:#071f41;
}
.savedFormRow span{
  color:#344054;
  font-size:13px;
  margin-top:2px;
}
.savedFormRow small{
  color:#667085;
  font-size:12px;
  margin-top:3px;
}
.savedFormActions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.formToolbar{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}
.generalInfoStudentFields{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
.generalInfoStudentCard{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:12px;
  border:1px solid #d9deea;
  border-radius:12px;
  background:#fff;
  padding:12px;
}
.generalInfoStudentCardTitle{
  grid-column:1 / -1;
  color:#072f63;
  font-weight:900;
}
.printHeader{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:flex-start;
  border-bottom:2px solid #0b4aa2;
  padding-bottom:14px;
  margin-bottom:4px;
}
.printHeader h2{
  margin:0;
  font-size:30px;
  color:#071f41;
}
.printHeader .eyebrow{
  margin:0 0 4px;
}
.printDateField{
  min-width:220px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.printDateField span{
  color:#344054;
  font-size:12px;
  font-weight:800;
}
.printDateField input{
  width:100%;
  border:1px solid #d9deea;
  border-radius:10px;
  padding:10px 11px;
  font-size:14px;
  background:#fff;
}
.supportChoice .optionRow{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}
.supportChoice label{
  display:flex;
  align-items:center;
  gap:7px;
  font-weight:800;
  color:#344054;
}
.waiverBox{
  border:1px solid #c9d5ea;
  border-radius:12px;
  background:#f8fbff;
  padding:14px;
  color:#243b5a;
  line-height:1.45;
}
.waiverBox p{
  margin:0 0 8px;
}
.waiverBox p:last-child{
  margin-bottom:0;
}
.signatureField canvas{
  width:100%;
  height:190px;
  border:1px solid #b8c7df;
  border-radius:12px;
  background:
    linear-gradient(#fff, #fff) padding-box,
    repeating-linear-gradient(0deg, transparent 0, transparent 30px, rgba(11,74,162,.08) 31px) border-box;
  touch-action:none;
}

html.generalInfoClassroomModeRoot .heroActions,
html.generalInfoClassroomModeRoot .generalInfoSavedPanel,
html.generalInfoClassroomModeRoot .generalInfoStaffOnly,
html.generalInfoClassroomModeRoot #newStudentDirectBtn,
html.generalInfoClassroomModeRoot #newStudentFromFormBtn,
html.generalInfoClassroomModeRoot #newStudentFromFormBottomBtn,
html.generalInfoClassroomModeRoot #saveDraftBtn,
html.generalInfoClassroomModeRoot #saveDraftBottomBtn,
html.generalInfoClassroomModeRoot #printFormBtn,
html.generalInfoClassroomModeRoot #printFormBottomBtn,
html.generalInfoClassroomModeRoot #clearFormBtn,
html.generalInfoClassroomModeRoot #clearFormBottomBtn{
  display:none !important;
}

html.generalInfoClassroomModeRoot .formToolbar,
html.generalInfoClassroomModeRoot .editActions{
  justify-content:flex-end;
}

html.generalInfoClassroomModeRoot .generalInfoFormPage .generalInfoCard{
  max-width:1040px;
}

html.newStudentClassroomModeRoot .heroActions,
html.newStudentClassroomModeRoot .newStudentStaffOnly,
html.newStudentClassroomModeRoot #refreshContractPreviewBtn{
  display:none !important;
}

html.newStudentClassroomModeRoot .newStudentClassroomOnly{
  display:flex;
}

html.newStudentClassroomModeRoot .newStudentPage .card{
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
}

html.newStudentClassroomModeRoot .editActions{
  justify-content:flex-end;
}

@media (max-width:900px){
  .printHeader{
    flex-direction:column;
  }
  .printDateField{
    min-width:0;
    width:100%;
  }
  .savedFormRow{
    grid-template-columns:1fr;
  }
  .savedFormActions{
    justify-content:flex-start;
  }
  .generalInfoStudentCard{
    grid-template-columns:1fr;
  }
}

@media print{
  body.generalInfoFormPage{
    background:#fff;
  }
  .generalInfoFormPage .noPrint,
  .generalInfoFormPage .heroCard,
  .generalInfoFormPage .sectionTitle.noPrint,
  .generalInfoFormPage .editActions.noPrint,
  .generalInfoFormPage .message.noPrint{
    display:none !important;
  }
  .generalInfoFormPage .portalShell{
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
  }
  .generalInfoFormPage .card{
    border:0;
    box-shadow:none;
    padding:0;
    margin:0;
  }
  .generalInfoForm{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:7px 10px;
  }
  .generalInfoForm .formGroupTitle{
    margin:7px 0 0;
    padding-top:7px;
    font-size:14px;
    border-top:1px solid #222;
    color:#000;
  }
  .generalInfoForm .editField{
    gap:3px;
  }
  .generalInfoForm .editField span,
  .generalInfoForm .printDateField span{
    color:#000;
    font-size:10px;
    font-weight:700;
  }
  .generalInfoForm input,
  .generalInfoForm select,
  .generalInfoForm textarea,
  .generalInfoForm .printDateField input{
    border:1px solid #333;
    border-radius:0;
    padding:5px 6px;
    font-size:12px;
    min-height:28px;
    color:#000;
    background:#fff;
  }
  .generalInfoForm textarea{
    min-height:48px;
  }
  .generalInfoForm .waiverBox{
    border:1px solid #333;
    border-radius:0;
    padding:8px;
    background:#fff;
    font-size:10px;
    color:#000;
  }
  .generalInfoForm .waiverBox p{
    margin-bottom:4px;
  }
  .generalInfoForm .signatureField canvas{
    height:115px;
    border:1px solid #333;
    border-radius:0;
    background:#fff;
  }
  .generalInfoForm .supportChoice label{
    color:#000;
    font-size:11px;
  }
  .generalInfoStudentFields,
  .generalInfoStudentCard{
    gap:6px;
  }
  .generalInfoStudentCard{
    border:0;
    border-radius:0;
    padding:0;
    grid-template-columns:repeat(3, 1fr);
  }
  .generalInfoStudentCardTitle{
    font-size:12px;
    color:#000;
  }
  .generalInfoForm .printHeader{
    border-bottom:2px solid #000;
    padding-bottom:8px;
  }
  .generalInfoForm .printHeader h2{
    color:#000;
    font-size:22px;
  }
}
.publicSignupPage .publicHidden{
  display:none !important;
}
.publicSignupPage .heroCard{
  min-height:210px;
}
.publicSignupPage .studentEditForm{
  grid-template-columns:repeat(2, 1fr);
}
.stripeLinkPanel .detailGrid{
  margin-bottom:12px;
}
.stripeCopyActions{
  margin-bottom:12px;
}
.stripeSetupBox{
  display:grid;
  grid-template-columns:1.4fr minmax(180px,.6fr);
  gap:12px;
  align-items:end;
  border:1px solid #d9deea;
  border-radius:12px;
  background:#f8fbff;
  padding:14px;
  margin:0 0 14px;
}
.stripeSetupBox h4{
  margin:0 0 6px;
}
.stripeSetupBox p{
  margin:0;
  color:#667085;
  font-size:13px;
  line-height:1.45;
}
.stripeFamilyLink{
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:800;
  color:#344054;
}
.stripeDangerActions{
  border-top:1px solid #d9deea;
  margin-top:14px;
  padding-top:12px;
}
.stripeNotice{
  font-size:13px;
  line-height:1.45;
}
.familyTuitionAdminPanel{
  margin-bottom:16px;
}
.familyTuitionAdminPanel h4{
  margin:16px 0 8px;
}
.familyTuitionAdminForm{
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  margin-bottom:14px;
}
.familyTuitionAdminRequestList{
  display:grid;
  gap:12px;
}
.familyTuitionAdminRequestCard h4{
  margin:0;
}
.familyTuitionAdminRequestCard p{
  margin:6px 0 0;
  color:#475467;
}
@media (max-width:1000px){
  .publicSignupPage .studentEditForm,
  .stripeSetupBox,
  .familyTuitionAdminForm{
    grid-template-columns:1fr;
  }
}


/* Stage 18B tuition package dropdown */
#tuitionPackageSelect{
  min-height:42px;
}


/* Stage 18C family/new student signup */
.familyMembers{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:12px;
}
.familyMemberCard{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:10px;
  border:1px solid #d9deea;
  border-radius:14px;
  padding:14px;
  background:#f8fbff;
}
.familyMemberCard h4{
  grid-column:1 / -1;
  margin:0;
  color:#072f63;
}
.familyMemberCard .uniformField{
  grid-column:1 / -1;
}
.signupFeesBox{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.signupFeeRow{
  display:grid;
  grid-template-columns:1fr 90px 150px;
  gap:10px;
  align-items:center;
  border:1px solid #d9deea;
  border-radius:12px;
  padding:10px;
  background:#f8fafc;
}
.signupFeeRow label{
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:800;
  color:#344054;
}
.signupFeeRow input[type="checkbox"]{
  width:auto;
}
.signupFeeRow .signupFeeQty{
  padding:8px 10px;
  border:1px solid #d9deea;
  border-radius:10px;
}
.signupFeeRow em{
  font-style:normal;
  color:#667085;
  font-size:12px;
}
.signupFeeRow.discounted{
  border-color:#98d4a8;
  border-left-color:#11803b;
  background:#f3fbf5;
}
.signupFeeRow.discounted em{
  color:#116329;
  font-weight:800;
}
.publicSignupPage .signupFeeRow{
  border-left:4px solid #0f4c9b;
}
.publicSignupPage .signupFeeRow input[disabled]{
  accent-color:#0f4c9b;
}
.badgesPackBox{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.badgesPackRow{
  border:1px solid #d9deea;
  border-radius:12px;
  padding:12px;
  background:#fff;
}
.badgesPackMain{
  display:flex;
  gap:10px;
  align-items:flex-start;
  color:#344054;
  font-weight:800;
}
.badgesPackMain input{
  width:auto;
  margin-top:4px;
}
.badgesPackMain span{
  display:flex;
  flex-direction:column;
  gap:3px;
}
.badgesPackMain em,
.badgesPackRow small,
.badgesPackRow p{
  color:#667085;
  font-size:12px;
  font-style:normal;
  font-weight:700;
  margin:4px 0 0;
}
.badgePackChoices{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
  margin-top:10px;
}
.badgePackChoice{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.badgePackChoice span{
  color:#344054;
  font-size:12px;
  font-weight:800;
}
.badgePackChoice select{
  width:100%;
  border:1px solid #d9deea;
  border-radius:10px;
  padding:9px 10px;
  background:#fff;
}
@media (max-width:1000px){
  .familyMembers,
  .familyMemberCard,
  .signupFeeRow,
  .badgePackChoices{
    grid-template-columns:1fr;
  }
}


/* Stage 18D price/family fee filter fix */
.signupFeeRow[data-fee-id]{
  border-left:4px solid #0f4c9b;
}


/* Stage 18E robust price loader */
.fieldHelp{
  display:block;
  margin-top:6px;
  color:#667085;
  font-size:12px;
  font-weight:700;
}
.errorText{
  color:#b42318 !important;
}
.okText{
  color:#116329 !important;
}


/* Stage 18F create-student debug messages */
.message.error{
  white-space:pre-wrap;
  overflow:auto;
  max-height:420px;
}


/* Stage 19 Centre Setup */
.settingsTopControls{
  display:flex;
  gap:10px;
  align-items:end;
  flex-wrap:wrap;
}
.settingsTopControls label{
  display:flex;
  flex-direction:column;
  gap:5px;
  font-weight:800;
  color:#344054;
}
.settingsTopControls select{
  min-width:220px;
  border:1px solid #d9deea;
  border-radius:10px;
  padding:10px;
}
.settingsContent{
  margin-top:16px;
}
.settingsEditor{
  margin:12px 0 18px;
  padding:12px;
  border:1px solid #d9deea;
  border-radius:14px;
  background:#f8fbff;
}
.mono{
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size:12px;
}
.templateGrid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:12px;
  margin:16px 0;
}
.templateCard{
  display:flex;
  flex-direction:column;
  gap:8px;
  text-decoration:none;
  border:1px solid #d9deea;
  border-radius:14px;
  padding:14px;
  background:#f8fbff;
  color:#0f3f7a;
}
.templateCard strong{
  color:#072f63;
}
.templateCard span{
  color:#667085;
  font-size:13px;
}
.templateCard em{
  font-style:normal;
  font-weight:800;
  color:#0f4c9b;
}
.priceForm{
  margin-top:6px;
}
@media (max-width:1000px){
  .templateGrid{
    grid-template-columns:1fr;
  }
}


/* Stage 19B Centre Setup existing fields */
.settingsContent .formGroupTitle{
  grid-column:1 / -1;
  margin:14px 0 0;
  padding-top:12px;
  border-top:1px solid #d9deea;
  color:#072f63;
}


/* Stage 19C Stripe secret vault */
.secretStatusGrid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:12px;
  margin:12px 0 18px;
}
.secretStatusCard{
  border:1px solid #d9deea;
  border-radius:14px;
  padding:14px;
  background:#f8fbff;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.secretStatusCard span{
  color:#344054;
  font-size:12px;
  font-weight:800;
}
.secretStatusCard strong{
  color:#072f63;
  font-size:16px;
}
.secretStatusCard em{
  color:#667085;
  font-style:normal;
  font-size:12px;
}
.secretStatusCard.saved{
  border-left:4px solid #12b76a;
}
.secretStatusCard.missing{
  border-left:4px solid #f04438;
}
.warningCard{
  border-left:4px solid #f79009;
}
@media (max-width:1000px){
  .secretStatusGrid{
    grid-template-columns:1fr;
  }
}


/* Stage 19F Stripe status and webhook logs */
.webhookLogTable td{
  vertical-align:top;
}
.webhookLogTable .rowError{
  background:#fff1f3;
}
.secretStatusCard.saved strong{
  color:#067647;
}
.secretStatusCard.missing strong{
  color:#b42318;
}


/* Stage 20 centre feature switchboard */
.featureSwitchForm{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.featureAreaBlock{
  border:1px solid rgba(15, 23, 42, .10);
  border-radius:18px;
  padding:16px;
  background:#fff;
}
.featureAreaBlock h4{
  margin:0 0 12px;
}
.featureSwitchGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:12px;
}
.featureSwitchCard{
  border:1px solid rgba(15, 23, 42, .10);
  border-radius:14px;
  padding:14px;
  background:#f8fafc;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.featureSwitchCard strong{
  display:block;
  margin-bottom:4px;
}
.featureSwitchCard p{
  margin:8px 0 0;
  color:#475467;
  font-size:.92rem;
  line-height:1.35;
}
.featureSwitchControls{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.featureSwitchControls label{
  display:flex;
  align-items:center;
  gap:6px;
  font-weight:700;
  font-size:.9rem;
}
.feature-disabled,
[data-feature-hidden="1"]{
  display:none !important;
}


/* Stage 20B feature flag page wiring */
.feature-disabled,
[data-feature-hidden="1"]{
  display:none !important;
}
.featureBlockedNotice{
  border:2px solid rgba(180, 35, 24, .22);
  background:#fff7f7;
}
.featurePageBlocked main > section:not(.featureBlockedNotice){
  opacity:.35;
  pointer-events:none;
}
.featurePill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  border-radius:999px;
  padding:4px 10px;
  font-size:.82rem;
  font-weight:700;
  background:#eef4ff;
  color:#3538cd;
}


/* Stage 20C student portal feature wiring */
.feature-disabled,
[data-feature-hidden="1"]{
  display:none !important;
}
.warningCard{
  border-color:#fecdca !important;
  background:#fff1f3 !important;
  color:#912018 !important;
}
.featureOffStudentClassBooking #bookSelectedBtn,
button.disabledByFeature{
  opacity:.55;
  cursor:not-allowed;
}


/* Stage 20D remaining admin page feature wiring */
.feature-disabled,
[data-feature-hidden="1"]{
  display:none !important;
}
.featureBlockedNotice{
  border:2px solid rgba(180, 35, 24, .22);
  background:#fff7f7;
}
.featurePageBlocked main > section:not(.featureBlockedNotice){
  opacity:.35;
  pointer-events:none;
}


/* Stage 20F feature presets and dashboard visibility */
.dashboard-hidden,
[data-dashboard-hidden="1"]{
  display:none !important;
}
.featurePresetGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(210px, 1fr));
  gap:12px;
  margin-bottom:18px;
}
.featurePresetCard{
  appearance:none;
  border:1px solid rgba(15, 23, 42, .12);
  border-radius:16px;
  background:#fff;
  padding:14px;
  text-align:left;
  cursor:pointer;
  box-shadow:0 8px 24px rgba(15,23,42,.06);
}
.featurePresetCard:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 30px rgba(15,23,42,.10);
}
.featurePresetCard strong{
  display:block;
  color:#101828;
  font-size:1rem;
  margin-bottom:6px;
}
.featurePresetCard span{
  display:block;
  color:#475467;
  font-size:.9rem;
  line-height:1.35;
}


/* Stage 21 Instructor Diary + KPI Targets */
.diaryPage .kpiGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(420px, 1fr));
  gap:16px;
}
.kpiPanel{
  border:1px solid rgba(15,23,42,.10);
  border-radius:16px;
  background:#fff;
  padding:14px;
}
.kpiPanel h4{
  margin:0 0 10px;
}
.compactTable th,
.compactTable td{
  padding:7px 8px;
  font-size:.9rem;
}
.miniInput{
  max-width:92px;
  padding:6px 8px !important;
}
.overdueRow{
  background:#fff1f3;
}
.dangerCell{
  background:#ff3b30 !important;
  color:#fff !important;
  font-weight:800;
}


/* Stage 21B Diary automation dashboard */
.miniStatsGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(110px,1fr));
  gap:10px;
}
.miniStat{
  border:1px solid rgba(15,23,42,.10);
  border-radius:14px;
  padding:12px;
  background:#f8fafc;
}
.miniStat strong{
  display:block;
  font-size:1.7rem;
  line-height:1;
  color:#101828;
}
.miniStat span{
  display:block;
  color:#475467;
  margin-top:5px;
  font-size:.9rem;
}
.dangerMiniStat{
  background:#fff1f3;
  border-color:#fecdca;
}
.dangerMiniStat strong{
  color:#b42318;
}


/* Stage 21C diary appointment/button fix */
.diaryPage .tabRow{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
  margin-bottom:16px;
}
.diaryPage .tabBtn,
.tabRow .tabBtn{
  color:var(--blue);
  background:#fff;
  border:1px solid var(--line);
  min-width:96px;
  text-align:center;
  white-space:nowrap;
}
.diaryPage .tabBtn.active,
.tabRow .tabBtn.active{
  color:#fff;
  background:var(--blue);
  border-color:var(--blue);
}
.diaryPage .portalTable{
  min-width:760px;
}
.diaryPage .tableWrap{
  overflow-x:auto;
}
.appointmentTask{
  font-weight:800;
}


/* Stage 21D diary quick actions + follow-up editor */
.quickActionGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(80px, 1fr));
  gap:6px;
  min-width:180px;
}
.quickActionGrid .smallBtn{
  padding:7px 8px;
  font-size:.8rem;
}
.dangerBtn{
  background:#b42318 !important;
  color:#fff !important;
  border-color:#b42318 !important;
}
.followRuleTable select,
.followRuleTable textarea,
.followRuleTable input{
  min-width:120px;
}
.followRuleTable textarea{
  min-width:240px;
  resize:vertical;
}
.miniTextInput{
  max-width:140px;
  padding:6px 8px !important;
}
.noteBoxSmall{
  margin-top:6px;
  padding:6px 8px;
  border-radius:10px;
  background:#eef4ff;
  color:#3538cd;
  font-size:.82rem;
}
.mutedTiny{
  margin-top:4px;
  color:#667085;
  font-size:.78rem;
}
.diaryTaskTable th:last-child,
.diaryTaskTable td:last-child{
  min-width:210px;
}


/* Stage 21I diary task action/contact refinement */
.taskContactDetails{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-top:7px;
  font-size:.82rem;
}
.contactPill{
  display:inline-flex;
  align-items:center;
  gap:4px;
  width:max-content;
  max-width:260px;
  padding:4px 7px;
  border-radius:999px;
  background:#f2f4f7;
  color:#344054;
  line-height:1.2;
}
.contactPill a{
  color:#003b88;
  font-weight:700;
  text-decoration:none;
}
.contactPill a:hover{
  text-decoration:underline;
}
.quickActionGrid.compactActions{
  grid-template-columns:repeat(2, minmax(78px, 1fr));
  min-width:160px;
}
.quickActionGrid.prospectActions{
  grid-template-columns:repeat(2, minmax(84px, 1fr));
  min-width:185px;
}
.quickActionGrid.prospectActions .dangerBtn{
  grid-column:1 / -1;
}
.diaryTaskTable td{
  vertical-align:top;
}
.diaryTaskTable td:nth-child(4){
  min-width:210px;
}
@media (max-width: 760px){
  .quickActionGrid.compactActions,
  .quickActionGrid.prospectActions{
    grid-template-columns:1fr;
    min-width:130px;
  }
  .prospectJourneyHeader{
    display:block;
  }
  .prospectJourneySteps{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}


/* Stage 21L diary email system */
.emailBtn{
  background:#0455bf !important;
  color:#fff !important;
  border-color:#0455bf !important;
}
.emailTemplateEditor{
  display:grid;
  gap:14px;
}
.emailTemplateEditor textarea{
  width:100%;
  min-height:260px;
  font-family:Consolas, Monaco, monospace;
  font-size:.9rem;
}
.templateSourceBadge{
  display:inline-flex;
  width:max-content;
  padding:6px 10px;
  border-radius:999px;
  background:#eef4ff;
  color:#3538cd;
  font-weight:800;
  border:1px solid #c7d7fe;
}
.templateSourceBadge.overrideOn{
  background:#ecfdf3;
  color:#027a48;
  border-color:#abefc6;
}
.checkboxField{
  display:flex;
  align-items:end;
}
.followRuleTable select[name^="email_template_"]{
  min-width:220px;
}


/* Stage 21N HTML email code editor + preview */
.emailEditorSplit{
  display:grid;
  grid-template-columns:minmax(360px, 1fr) minmax(360px, 1fr);
  gap:18px;
  align-items:start;
}
.emailCodePane,
.emailPreviewPane{
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  padding:14px;
}
.paneTitle{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  margin-bottom:10px;
}
.paneTitle strong{
  color:#101828;
}
.paneTitle span{
  color:#667085;
  font-size:.85rem;
}
.emailCodePane textarea{
  width:100%;
  min-height:520px;
  resize:vertical;
  font-family:Consolas, Monaco, "Courier New", monospace;
  font-size:.88rem;
  line-height:1.45;
  tab-size:2;
  white-space:pre;
  overflow:auto;
}
.templatePreviewFrame{
  width:100%;
  min-height:520px;
  border:1px solid #d0d5dd;
  border-radius:12px;
  background:#fff;
}
.previewActions{
  margin-top:10px;
}
.noticeBox code{
  background:#eef4ff;
  color:#3538cd;
  padding:2px 5px;
  border-radius:5px;
}
@media (max-width: 980px){
  .emailEditorSplit{
    grid-template-columns:1fr;
  }
}


/* Stage 21P text / WhatsApp template system */
.textBtn{background:#0b7a3b!important;color:#fff!important;border-color:#0b7a3b!important;}
.textTemplateEditor textarea,#textSendBody{width:100%;font-family:Arial,sans-serif;font-size:1rem;line-height:1.45;resize:vertical;}
.textEditorSplit{display:grid;grid-template-columns:minmax(320px,1fr) minmax(320px,1fr);gap:18px;align-items:start;}
.textPreviewBox{border:1px solid var(--line);border-radius:16px;background:#fff;padding:14px;}
.textPreviewBox pre{white-space:pre-wrap;word-break:break-word;font-family:Arial,sans-serif;line-height:1.45;color:#101828;}
.smsCounter{margin-top:6px;color:#667085;font-size:.9rem;}
.modalOverlay{position:fixed;inset:0;z-index:9999;background:rgba(15,23,42,.55);display:flex;justify-content:center;align-items:center;padding:22px;}
.modalCard{width:min(760px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:18px;padding:20px;box-shadow:0 24px 70px rgba(15,23,42,.35);}
.textModalCard textarea{min-height:220px;}
@media(max-width:850px){.textEditorSplit{grid-template-columns:1fr;}}


/* Stage 21TK Communication Centre */
.communicationCentrePage .shell{
  max-width:1480px;
}
.communicationToolbar{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.communicationToolbar select{
  min-width:220px;
}
.communicationSummaryGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(170px, 1fr));
  gap:12px;
  margin-top:16px;
}
.communicationJourneyGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(340px, 1fr));
  gap:14px;
}
.communicationJourneyCard{
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  padding:15px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.communicationJourneyCard.ready{
  border-color:#b7dfc3;
}
.communicationJourneyCard.partial{
  border-color:#fedf89;
}
.communicationJourneyCard.attention{
  border-color:#fecdca;
}
.communicationJourneyHeader{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}
.communicationJourneyHeader span{
  display:block;
  color:#667085;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.03em;
}
.communicationJourneyHeader h3{
  margin:4px 0 0;
}
.communicationJourneyCard p{
  margin:0;
  color:#475467;
}
.communicationStatus{
  display:inline-flex;
  align-items:center;
  width:max-content;
  border-radius:999px;
  padding:5px 9px;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}
.communicationStatus.ready{
  background:#e9f7ed;
  color:var(--green);
}
.communicationStatus.partial{
  background:#fff5dc;
  color:var(--amber);
}
.communicationStatus.missing,
.communicationStatus.planned{
  background:#fff0f0;
  color:var(--red);
}
.communicationChecks{
  display:grid;
  gap:8px;
}
.communicationCheckLine{
  display:grid;
  grid-template-columns:minmax(110px, 1fr) auto;
  gap:6px 10px;
  align-items:start;
  border:1px solid #edf1f7;
  border-radius:8px;
  padding:10px;
  background:#f8fafc;
}
.communicationCheckLine > span{
  font-weight:900;
  color:#172033;
}
.communicationCheckLine small{
  grid-column:1 / -1;
  color:#667085;
  line-height:1.35;
}
.communicationCheckLine a{
  grid-column:1 / -1;
  color:var(--blue);
  font-weight:900;
  text-decoration:none;
}
.communicationActions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:auto;
}
.portalPasswordCampaignActions{
  margin-top:14px;
}
.portalPasswordCampaignActions button{
  margin:0;
}
.communicationLiveGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.communicationLiveGrid h3{
  margin:0 0 10px;
}
.communicationMiniList{
  display:grid;
  gap:8px;
}
.communicationMiniRow{
  border:1px solid #edf1f7;
  border-radius:8px;
  background:#fff;
  padding:10px 12px;
}
.communicationMiniRow.overdue{
  border-color:#fecdca;
  background:#fff7f7;
}
.communicationMiniRow strong,
.communicationMiniRow span{
  display:block;
}
.communicationMiniRow span{
  color:#667085;
  font-size:13px;
  margin-top:3px;
}
@media(max-width:900px){
  .communicationJourneyGrid,
  .communicationLiveGrid{
    grid-template-columns:1fr;
  }
  .communicationCheckLine{
    grid-template-columns:1fr;
  }
}


/* Stage 21ED Communication Queue */
.communicationQueuePage .portalShell{
  max-width:min(1900px, calc(100vw - 16px));
}
.communicationQueueFilters{
  grid-template-columns:1fr 1fr .85fr 1fr .6fr .6fr 1.35fr;
}
.communicationQueueSummary{
  margin-bottom:18px;
}
.communicationQueueTable th,
.communicationQueueTable td{
  vertical-align:top;
}
.communicationQueueTable td span{
  display:block;
  color:#667085;
  font-size:12px;
  margin-top:3px;
  overflow-wrap:anywhere;
}
.communicationQueueStatus,
.communicationQueueChannel{
  display:inline-flex;
  align-items:center;
  width:max-content;
  border-radius:999px;
  padding:5px 9px;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
  margin:0 4px 5px 0;
}
.communicationQueueStatus.sent{
  background:#e9f7ed;
  color:var(--green);
}
.communicationQueueStatus.failed{
  background:#fff0f0;
  color:var(--red);
}
.communicationQueueStatus.due{
  background:#fff5dc;
  color:var(--amber);
}
.communicationQueueStatus.queued,
.communicationQueueStatus.waiting{
  background:#eef4ff;
  color:#174ea6;
}
.communicationQueueStatus.skipped{
  background:#f2f4f7;
  color:#475467;
}
.communicationQueueChannel.email{
  background:#eef4ff;
  color:#174ea6;
}
.communicationQueueChannel.sms{
  background:#edf7f1;
  color:#0b7a3b;
}
.communicationQueueChannel.whatsapp{
  background:#e8fff1;
  color:#067647;
}
.communicationQueueRow.failed{
  background:#fffafa;
}
.communicationQueueRow.due{
  background:#fffdf5;
}
.communicationQueueRow.queued,
.communicationQueueRow.waiting{
  background:#fbfdff;
}
.communicationSourceTables{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:10px;
}
.communicationSourceTableItem{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
  border:1px solid #d9e2ef;
  background:#fbfcff;
  border-radius:8px;
  padding:10px;
}
.communicationSourceTableItem span{
  color:#667085;
  font-size:12px;
  font-weight:800;
}
.communicationSourceTableItem strong{
  font-size:12px;
  border-radius:999px;
  padding:5px 9px;
}
.communicationSourceTableItem strong.ready{
  background:#e9f7ed;
  color:var(--green);
}
.communicationSourceTableItem strong.missing{
  background:#fff0f0;
  color:var(--red);
}
@media(max-width:1200px){
  .communicationQueueFilters{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
  .communicationSourceTables{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}
@media(max-width:700px){
  .communicationQueueFilters,
  .communicationSourceTables{
    grid-template-columns:1fr;
  }
  .communicationSourceTableItem{
    flex-direction:column;
    align-items:flex-start;
  }
}


/* Stage 21Q text template editor */
.textBtn{
  background:#0b7a3b !important;
  color:#fff !important;
  border-color:#0b7a3b !important;
}
.textTemplateEditor textarea,
#textSendBody,
#templateBody{
  width:100%;
  font-family:Arial, sans-serif;
  font-size:1rem;
  line-height:1.45;
  resize:vertical;
}
.textEditorSplit{
  display:grid;
  grid-template-columns:minmax(320px, 1fr) minmax(320px, 1fr);
  gap:18px;
  align-items:start;
}
.textPreviewBox{
  border:1px solid var(--line, #d0d5dd);
  border-radius:16px;
  background:#fff;
  padding:14px;
}
.textPreviewBox pre{
  white-space:pre-wrap;
  word-break:break-word;
  font-family:Arial, sans-serif;
  line-height:1.45;
  color:#101828;
}
.smsCounter{
  margin-top:6px;
  color:#667085;
  font-size:.9rem;
}
.templateSourceBadge{
  display:inline-flex;
  width:max-content;
  padding:6px 10px;
  border-radius:999px;
  background:#eef4ff;
  color:#3538cd;
  font-weight:800;
  border:1px solid #c7d7fe;
  margin:10px 0;
}
.templateSourceBadge.overrideOn{
  background:#ecfdf3;
  color:#027a48;
  border-color:#abefc6;
}
.buttonLink{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
}
.buttonLink.smallBtn{
  padding:7px 10px;
}
@media (max-width: 850px){
  .textEditorSplit{
    grid-template-columns:1fr;
  }
}


/* Stage 21R centre-specific rules and call action */
.callBtn{
  background:#7a2e0e !important;
  color:#fff !important;
  border-color:#7a2e0e !important;
}
.followRuleTable .miniBadge{
  white-space:nowrap;
}


/* Stage 21Y admin menu + user management */
.topRightActions{
  display:flex;
  align-items:center;
  gap:10px;
  margin-left:auto;
}
.adminHamburgerMenu{
  position:relative;
  display:inline-block;
}
.adminMenuButton{
  border:1px solid #d0d5dd;
  background:#fff;
  color:#003b8f;
  border-radius:12px;
  padding:10px 14px;
  font-weight:800;
  cursor:pointer;
}
.adminMenuPanel{
  display:none;
  position:absolute;
  right:0;
  top:calc(100% + 8px);
  min-width:310px;
  max-width:min(92vw, 360px);
  max-height:calc(100vh - 120px);
  overflow:auto;
  background:#fff;
  border:1px solid #d0d5dd;
  border-radius:14px;
  box-shadow:0 18px 45px rgba(15,23,42,.18);
  padding:10px;
  z-index:1000;
}
.adminMenuPanel.open{
  display:block;
}
.adminMenuPanel a{
  display:block;
  padding:8px 10px;
  color:#003b8f;
  text-decoration:none;
  border-radius:10px;
  font-weight:700;
  font-size:13px;
}
.adminMenuPanel a:hover{
  background:#eef4ff;
}
.adminMenuGroup{
  border-bottom:1px solid #edf1f7;
  padding:4px 0 8px;
  margin-bottom:6px;
}
.adminMenuGroup:last-child{
  border-bottom:0;
  margin-bottom:0;
  padding-bottom:0;
}
.adminMenuGroupTitle{
  color:#667085;
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  margin:4px 8px 5px;
  text-transform:uppercase;
}
.adminMenuDuplicateHidden{
  display:none !important;
}
.adminPanel{
  border:1px solid #d0d5dd;
  border-radius:16px;
  padding:14px;
  background:#fff;
  margin-bottom:18px;
}
.adminPanel summary{
  cursor:pointer;
  font-size:1.1rem;
  font-weight:900;
  color:#101828;
  margin-bottom:12px;
}
.compactTable input[type="checkbox"]{
  transform:scale(1.15);
}
.modalOverlay{
  position:fixed;
  inset:0;
  z-index:9999;
  background:rgba(15,23,42,.55);
  display:flex;
  justify-content:center;
  align-items:center;
  padding:22px;
}
.modalCard{
  width:min(720px, 100%);
  max-height:90vh;
  overflow:auto;
  background:#fff;
  border-radius:18px;
  padding:20px;
  box-shadow:0 24px 70px rgba(15,23,42,.35);
}
.modalCard input{
  width:100%;
}
.inlineSectionTitle{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
}


/* Stage 21Z mail settings */
.warningBox{
  border:1px solid #fedf89;
  background:#fffaeb;
  color:#7a2e0e;
  padding:12px 14px;
  border-radius:14px;
  margin:12px 0;
}
.staffEmailSummary{
  font-size:.95rem;
  color:#475467;
}


/* Stage 21AA mail delivery settings */
.mailModeBadge{
  display:inline-flex;
  padding:4px 8px;
  border-radius:999px;
  background:#eef4ff;
  color:#003b8f;
  font-weight:800;
}


/* Stage 21AF SmartPay / contract signing */
.contractPreview{
  border:1px solid #d0d5dd;
  background:#fff;
  border-radius:14px;
  padding:18px;
  margin:12px 0;
  max-height:520px;
  overflow:auto;
  line-height:1.5;
}
.contractPreview h2,
.contractPreview h3{
  margin-top:14px;
}
.contractPreview p{
  margin:8px 0;
}


/* Stage 21AG contract preview / notice period */
.contractPreviewSignup{
  max-height:320px;
  overflow:auto;
  background:#fff;
}
.fieldLabelStrong{
  display:block;
  font-weight:900;
  color:#101828;
  margin-bottom:8px;
}


/* Stage 21AJ programme upgrade/add-on */
.programmeChangeBadge{
  display:inline-flex;
  padding:4px 8px;
  border-radius:999px;
  background:#eef4ff;
  color:#003b8f;
  font-weight:800;
}


/* Stage 21CP student upgrade/savings appointments */
.appointmentBookingForm{
  margin-bottom:18px;
}
.appointmentTable td:nth-child(5){
  min-width:220px;
  white-space:normal;
}
.appointmentActionButtons{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}
.paymentActionButtons{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}
.appointmentStatusBadge{
  display:inline-flex;
  align-items:center;
  padding:4px 8px;
  border-radius:999px;
  background:#eef4ff;
  color:#003b8f;
  font-weight:800;
  white-space:nowrap;
}
.appointmentStatusBadge.showed{
  background:#ecfdf3;
  color:#027a48;
}
.appointmentStatusBadge.no-show{
  background:#fff7ed;
  color:#9a3412;
}
.appointmentStatusBadge.cancelled{
  background:#fef3f2;
  color:#b42318;
}


/* Stage 21AL graduation grade/where inline edit */
.inlineEditSelect{
  width:100%;
  min-width:180px;
  padding:8px 10px;
  border:1px solid #cbd5e1;
  border-radius:10px;
  background:#fff;
}
.editingGraduationRow{
  background:#fffdf0;
}
.editingGraduationRow td{
  vertical-align:middle;
}


/* Stage 21AM Help Centre */
.helpShell{
  max-width:1500px;
}
.helpHero{
  margin-bottom:18px;
}
.helpLayout{
  display:grid;
  grid-template-columns:300px minmax(0,1fr);
  gap:18px;
  align-items:start;
}
.helpSideNav{
  position:sticky;
  top:14px;
  align-self:start;
  max-height:calc(100vh - 28px);
  overflow:auto;
  background:#ffffff;
  border:1px solid #d9e2f1;
  border-radius:18px;
  box-shadow:0 14px 34px rgba(15,23,42,.07);
  padding:14px;
}
.helpSearchBox{
  border-bottom:1px solid #e5e7eb;
  padding-bottom:12px;
  margin-bottom:10px;
}
.helpSearchBox label{
  display:block;
  font-weight:900;
  margin-bottom:6px;
  color:#0f172a;
}
.helpSearchBox input{
  width:100%;
  padding:10px 12px;
  border:1px solid #cbd5e1;
  border-radius:12px;
}
#helpNav{
  display:flex;
  flex-direction:column;
  gap:4px;
}
#helpNav a{
  display:block;
  padding:9px 10px;
  text-decoration:none;
  color:#0f172a;
  border-radius:10px;
  font-weight:800;
  font-size:.92rem;
}
#helpNav a:hover,
#helpNav a.active{
  background:#083d91;
  color:#fff;
}
.helpContent{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.helpSection{
  background:#fff;
  border:1px solid #d9e2f1;
  border-radius:18px;
  box-shadow:0 14px 34px rgba(15,23,42,.06);
  padding:24px;
  scroll-margin-top:22px;
}
.helpSection h2{
  margin:0 0 12px;
  font-size:1.55rem;
  color:#082f6f;
}
.helpSection h3{
  margin:18px 0 8px;
  color:#0f172a;
}
.helpSection p,
.helpSection li{
  color:#334155;
  line-height:1.58;
}
.helpSection code{
  background:#f1f5f9;
  color:#0f172a;
  border:1px solid #e2e8f0;
  border-radius:6px;
  padding:1px 5px;
}
.helpCards{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-top:14px;
}
.helpMiniCard{
  border:1px solid #d9e2f1;
  border-radius:16px;
  padding:14px;
  background:#f8fbff;
}
.helpMiniCard h3{
  margin-top:0;
}
.helpTrouble h3{
  border-top:1px solid #e5e7eb;
  padding-top:12px;
}
.helpTopButton{
  position:fixed;
  right:18px;
  bottom:18px;
  border:none;
  border-radius:999px;
  background:#083d91;
  color:#fff;
  font-weight:900;
  padding:12px 16px;
  box-shadow:0 10px 30px rgba(15,23,42,.18);
  opacity:0;
  pointer-events:none;
  transition:.18s ease;
}
.helpTopButton.show{
  opacity:1;
  pointer-events:auto;
}
@media (max-width: 960px){
  .helpLayout{
    grid-template-columns:1fr;
  }
  .helpSideNav{
    position:relative;
    top:auto;
    max-height:none;
  }
  .helpCards{
    grid-template-columns:1fr;
  }
}


/* Stage 21AO user management + transfer handover */
details.adminPanel{
  display:block;
}
.userCentreCards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:12px;
  margin:14px 0;
}
.userCentreCard{
  border:1px solid #d9e2f1;
  border-radius:14px;
  background:#f8fbff;
  padding:12px;
}
.userCentreCard strong{
  color:#003b8f;
}
.userCentreCard small{
  color:#475467;
}
.transferRequestCard{
  border:1px solid #bfdbfe;
  background:#eff6ff;
  border-radius:16px;
  padding:14px;
  margin:10px 0;
}
.transferRequestCard.pendingAttention{
  border-color:#facc15;
  background:#fffbeb;
}
.transferRequestMeta{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:8px;
  margin:10px 0;
}
.transferRequestMeta div{
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:10px;
  padding:8px;
}
.transferRequestMeta span{
  display:block;
  font-size:.78rem;
  color:#64748b;
  font-weight:800;
}
.transferRequestActions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  margin-top:10px;
}
.transferRequestActions select,
.transferRequestActions input{
  min-width:170px;
}
.transferDashboardList{
  display:grid;
  gap:10px;
}


/* Stage 21AQ FMAC graduation submission */
.graduationSubmissionLog{
  margin-top:12px;
}
.compactTable{
  font-size:.92rem;
}
.compactTable th,
.compactTable td{
  padding:8px 10px;
  vertical-align:top;
}
.compactTable small{
  color:#64748b;
}


/* Stage 21CW monthly returns */
.monthlyReturnPage .portalShell{
  max-width:1180px;
}
.smartpayBillingPage .portalShell{
  max-width:1180px;
}
.monthlyReturnControls{
  display:grid;
  grid-template-columns:2fr 1fr 120px auto;
  gap:12px;
  align-items:end;
}
.smartpayImportControls{
  display:grid;
  grid-template-columns:1.4fr 1fr 120px 1.6fr auto;
  gap:12px;
  align-items:end;
}
.monthlyReturnField label,
.monthlyReturnFormGrid label,
.monthlyReturnNotes{
  display:block;
  color:#102a5e;
  font-weight:900;
}
.monthlyReturnField input,
.monthlyReturnField select,
.monthlyReturnFormGrid input,
.monthlyReturnFormGrid select,
.monthlyReturnNotes textarea{
  width:100%;
  box-sizing:border-box;
  margin-top:6px;
  border:1px solid var(--line);
  border-radius:12px;
  padding:11px 12px;
  font-size:15px;
  background:#fff;
}
.monthlyReturnActions,
.monthlyReturnSubmitActions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.monthlyReturnTotals{
  margin:18px 0;
}
.monthlyReturnTotals .summaryCard{
  min-height:82px;
}
.monthlyReturnPayoutCard{
  margin:18px 0;
}
.payoutSummaryGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  margin-bottom:14px;
}
.monthlyReturnPayoutWrap{
  overflow-x:auto;
}
.monthlyReturnPayoutTable td:nth-child(2){
  color:#475467;
}
.monthlyReturnPayoutTable td:last-child,
.monthlyReturnPayoutTable th:last-child{
  text-align:right;
  white-space:nowrap;
}
.payoutTotalRow{
  background:#f8fbff;
}
.payoutTotalRow td{
  border-top:2px solid #c7d7f2;
}
.monthlyReturnGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
}
.monthlyReturnGrid .card{
  margin:0;
}
.monthlyReturnFormGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}
.monthlyReturnFormGrid.three{
  grid-template-columns:repeat(3, minmax(0, 1fr));
}
.monthlyReturnFormGrid.two{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}
.monthlyReturnNotes textarea{
  min-height:156px;
  resize:vertical;
}
.cellHint,
.suggestionText{
  display:block;
  min-height:18px;
  margin-top:4px;
  color:var(--muted);
  font-size:12px;
  font-weight:700;
}
.statusPill{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:5px 10px;
  border-radius:999px;
  border:1px solid #d7e0f1;
  background:#f8fbff;
  color:var(--blue);
  font-size:13px;
  font-weight:900;
  white-space:nowrap;
}
.statusPill.sent{
  border-color:#c8f5d4;
  background:#f0fff4;
  color:#0a5c22;
}
.monthlyReturnHistoryTable .smallBtn{
  padding:7px 10px;
  font-size:12px;
}

/* Expanded centre access permissions */
.centreAccessPage .shell{
  max-width:min(1680px, calc(100vw - 48px));
}
.centreAccessPage .hero{
  margin-top:18px;
}
.centreAccessWorkspace{
  margin:16px 0 42px;
}
.centreAccessWorkspace .instructorActions{
  margin-bottom:12px;
}
.centreAccessWorkspace .noticeBox{
  margin-bottom:14px;
}
.centreAccessUserToolbar{
  display:grid;
  grid-template-columns:minmax(320px, 1fr) minmax(360px, 1.2fr);
  gap:14px;
  align-items:end;
  max-width:1120px;
  margin:0 0 16px;
}
.presetPanel{
  border:1px solid #d7e0f1;
  border-radius:8px;
  background:#f8fbff;
  padding:12px;
}
.presetPanel label{
  display:block;
  margin:0 0 6px;
  color:#344054;
  font-size:13px;
  font-weight:900;
}
.presetControls{
  display:grid;
  grid-template-columns:minmax(150px, 1fr) auto auto;
  gap:8px;
  align-items:center;
}
.presetControls select,
.centrePresetActions select{
  min-height:36px;
  border:1px solid #d7e0f1;
  border-radius:8px;
  background:#fff;
  color:#101828;
  font-weight:800;
}
.presetMessage{
  margin:8px 0 0;
  color:#64748b;
  font-size:12px;
  font-weight:800;
}
.presetMessage.error{
  color:#b42318;
}
.centreAccessCardGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(520px, 1fr));
  gap:14px;
  align-items:start;
}
.centrePermissionCard{
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  box-shadow:0 10px 24px rgba(15,23,42,.06);
  overflow:hidden;
}
.centrePermissionHeader{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto auto auto;
  gap:12px;
  align-items:center;
  padding:14px 16px;
  border-bottom:1px solid #dbe4f4;
  background:#f8fbff;
}
.centrePermissionHeader span,
.primaryToggle{
  color:#64748b;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
}
.centrePermissionHeader strong{
  display:block;
  margin-top:2px;
  color:var(--blue);
  font-size:20px;
}
.primaryToggle{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:36px;
  padding:7px 10px;
  border:1px solid #d7e0f1;
  border-radius:8px;
  background:#fff;
}
.primaryToggle input{
  width:16px;
  height:16px;
}
.centrePresetActions{
  display:grid;
  grid-template-columns:minmax(132px, 1fr) auto;
  gap:7px;
  align-items:center;
  min-width:245px;
}
.permissionGroupGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));
  gap:12px;
  padding:14px;
}
.permissionGroupPanel{
  min-width:0;
}
.permissionGroupPanel h3{
  margin:0 0 8px;
  color:#475467;
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.permissionOptionGrid{
  display:grid;
  gap:7px;
}
.permissionOption{
  display:grid;
  grid-template-columns:20px minmax(0, 1fr);
  gap:9px;
  align-items:flex-start;
  min-height:48px;
  padding:9px;
  border:1px solid #dfe7f5;
  border-radius:8px;
  background:#fbfdff;
}
.permissionOption input{
  width:17px;
  height:17px;
  margin-top:1px;
}
.permissionOption strong,
.permissionOption small{
  display:block;
}
.permissionOption strong{
  color:#101828;
  font-size:13px;
  line-height:1.18;
}
.permissionOption small{
  margin-top:3px;
  color:#667085;
  font-size:11px;
  line-height:1.25;
}
.centreAccessMatrix th,
.centreAccessMatrix td{
  text-align:center;
  vertical-align:middle;
}
.centreAccessMatrix th:first-child,
.centreAccessMatrix td:first-child{
  text-align:left;
  position:sticky;
  left:0;
  z-index:1;
  background:#fff;
}
.centreAccessMatrix th{
  min-width:96px;
  white-space:normal;
}
.centreAccessMatrix input[type="checkbox"]{
  width:18px;
  height:18px;
}
.permissionGroup{
  display:block;
  margin-bottom:3px;
  color:#667085;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
}
.centreAccessViews{
  margin:16px 0;
}
.rolePermissionIntro{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin:16px 0 10px;
}
.rolePermissionIntro strong{
  color:var(--blue);
  font-size:18px;
}
.rolePermissionIntro span{
  color:#64748b;
  font-size:13px;
  font-weight:700;
  text-align:right;
}
.rolePermissionIntro.secondaryIntro{
  margin-top:24px;
}
.rolePermissionCardGrid,
.featureAreaCardGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(420px, 1fr));
  gap:14px;
  align-items:start;
}
.rolePermissionCard,
.featureAreaCard{
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  box-shadow:0 10px 24px rgba(15,23,42,.06);
  overflow:hidden;
}
.rolePermissionCardHeader,
.featureAreaCard > header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid #dbe4f4;
  background:#f8fbff;
}
.rolePermissionCardHeader > div:first-child span{
  display:block;
  color:#64748b;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
}
.rolePermissionCardHeader > div:first-child strong,
.featureAreaCard > header strong{
  display:block;
  color:var(--blue);
  font-size:20px;
}
.roleStatStrip{
  display:flex;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:7px;
}
.roleStatStrip span,
.featureAreaCard > header span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:5px 9px;
  border:1px solid #d7e0f1;
  border-radius:999px;
  background:#fff;
  color:#475467;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}
.roleStatStrip strong{
  margin-right:4px;
  color:var(--blue);
}
.rolePermissionGroupGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));
  gap:12px;
  padding:14px;
}
.rolePermissionGroup h3{
  margin:0 0 8px;
  color:#475467;
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.rolePermissionTileGrid,
.featureSwitchList{
  display:grid;
  gap:7px;
}
.rolePermissionTile{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:4px 8px;
  min-height:56px;
  padding:9px;
  border:1px solid #dfe7f5;
  border-radius:8px;
  background:#fbfdff;
}
.rolePermissionTile strong,
.rolePermissionTile small,
.rolePermissionTile em{
  display:block;
}
.rolePermissionTile strong{
  color:#101828;
  font-size:13px;
  line-height:1.18;
}
.rolePermissionTile small{
  margin-top:3px;
  color:#667085;
  font-size:11px;
  line-height:1.25;
}
.rolePermissionTile em{
  grid-column:1 / -1;
  color:#475467;
  font-size:11px;
  font-style:normal;
  font-weight:800;
}
.featureSwitchList{
  padding:14px;
}
.featureSwitchRow{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:5px 10px;
  padding:10px;
  border:1px solid #dfe7f5;
  border-radius:8px;
  background:#fbfdff;
}
.featureSwitchName strong,
.featureSwitchName small,
.featureOffList{
  display:block;
}
.featureSwitchName strong{
  color:#101828;
  font-size:14px;
  line-height:1.18;
}
.featureSwitchName small,
.featureOffList{
  color:#667085;
  font-size:11px;
  font-weight:800;
}
.featureSwitchName small{
  margin-top:3px;
}
.featureSwitchMetrics{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:6px;
}
.featureSwitchMetrics span{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:4px 8px;
  border:1px solid #bbf7d0;
  border-radius:999px;
  background:#f0fdf4;
  color:#166534;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}
.featureOffList{
  grid-column:1 / -1;
}
.rolePermissionTable td small,
.roleFeatureTable td small{
  display:block;
  margin-top:4px;
  color:#64748b;
  font-size:12px;
  font-weight:700;
}
.permissionCount{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:76px;
  min-height:28px;
  padding:4px 9px;
  border-radius:999px;
  border:1px solid #d7e0f1;
  background:#f8fbff;
  color:var(--blue);
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}
.permissionCount.enabled{
  border-color:#bbf7d0;
  background:#f0fdf4;
  color:#166534;
}
.permissionCount.disabled{
  border-color:#e2e8f0;
  background:#f8fafc;
  color:#64748b;
}
.roleFeatureTable th,
.roleFeatureTable td{
  white-space:normal;
  vertical-align:top;
}
.roleFeatureTable td:nth-child(3),
.roleFeatureTable td:nth-child(4){
  text-align:center;
  font-weight:900;
  color:var(--blue);
  white-space:nowrap;
}
@media (max-width: 760px){
  .centreAccessPage .shell{
    max-width:none;
    padding:12px;
  }
  .centreAccessCardGrid{
    grid-template-columns:1fr;
  }
  .centreAccessUserToolbar,
  .presetControls,
  .centrePresetActions{
    grid-template-columns:1fr;
  }
  .centrePermissionHeader{
    grid-template-columns:1fr;
  }
  .permissionGroupGrid{
    grid-template-columns:1fr;
  }
  .rolePermissionCardGrid,
  .featureAreaCardGrid{
    grid-template-columns:1fr;
  }
  .rolePermissionCardHeader,
  .featureAreaCard > header,
  .featureSwitchRow{
    grid-template-columns:1fr;
    flex-direction:column;
  }
  .roleStatStrip,
  .featureSwitchMetrics{
    justify-content:flex-start;
  }
  .rolePermissionIntro{
    align-items:flex-start;
    flex-direction:column;
  }
  .rolePermissionIntro span{
    text-align:left;
  }
}
.smartpayTotals{
  margin:18px 0;
}
.smartpayPreviewTable th,
.smartpayPreviewTable td{
  white-space:normal;
}
.unmatchedSmartpayRow{
  background:#fff7ed;
}
.warningNotice{
  border:1px solid #fed7aa;
  border-radius:12px;
  background:#fff7ed;
  color:#9a3412;
  padding:10px 12px;
  margin-bottom:12px;
  font-weight:800;
}

/* Stage 21EB accounting reports */
.accountingReportPage .portalShell{
  max-width:1180px;
}
.accountingControls{
  grid-template-columns:2fr 140px auto;
}
.accountingReportTable td,
.accountingReportTable th,
.accountingExpenseTable td,
.accountingExpenseTable th{
  white-space:normal;
}
.accountingReportTable td:nth-child(n+2):nth-child(-n+7),
.accountingReportTable th:nth-child(n+2):nth-child(-n+7),
.accountingExpenseTable td:nth-child(4),
.accountingExpenseTable th:nth-child(4){
  text-align:right;
  white-space:nowrap;
}
.accountingReportTable small,
.accountingExpenseTable small{
  display:block;
  margin-top:3px;
  color:#64748b;
  font-weight:700;
}
.accountingExpenseGrid{
  margin-top:16px;
}
.monthlyReturnFormGrid .wideField{
  grid-column:1 / -1;
}
.monthlyReturnFormGrid textarea{
  width:100%;
  box-sizing:border-box;
  min-height:112px;
  margin-top:6px;
  border:1px solid var(--line);
  border-radius:12px;
  padding:11px 12px;
  font-size:15px;
  resize:vertical;
}
.checkLine{
  display:flex !important;
  align-items:center;
  gap:10px;
  min-height:44px;
  margin-top:26px;
}
.checkLine input{
  width:auto !important;
  margin:0 !important;
}
.mutedText{
  color:#64748b;
  font-weight:800;
}

/* Stage 21YN yearly stats */
.yearlyStatsPage .portalShell{
  max-width:min(1760px, calc(100vw - 24px));
}
.yearlyStatsControls{
  grid-template-columns:minmax(260px, 1fr) 140px auto;
}
.yearlyStatsSummary{
  margin:18px 0;
}
.yearlyStatsSummary .summaryCard{
  min-height:104px;
}
.yearlyStatsSummary .summaryCard em{
  display:block;
  margin-top:6px;
  color:#64748b;
  font-size:12px;
  font-style:normal;
  font-weight:800;
}
.yearStatsTopGrid,
.yearStatsBottomGrid{
  display:grid;
  grid-template-columns:minmax(0, 1.15fr) minmax(420px, .85fr);
  gap:18px;
  margin:18px 0;
}
.yearStatsBottomGrid{
  grid-template-columns:minmax(0, .8fr) minmax(360px, .55fr);
}
.yearStatsChart{
  min-height:310px;
}
.yearStatsBars{
  display:grid;
  grid-template-columns:repeat(12, minmax(48px, 1fr));
  gap:10px;
  align-items:end;
  min-height:282px;
  padding:12px 4px 2px;
  overflow-x:auto;
}
.yearStatsBars.movement{
  min-height:250px;
}
.yearStatsBarColumn{
  display:flex;
  min-width:48px;
  min-height:260px;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}
.yearStatsBars.movement .yearStatsBarColumn{
  min-height:226px;
}
.yearStatsBarValue{
  min-height:18px;
  color:#475467;
  font-size:11px;
  font-weight:900;
  text-align:center;
  white-space:nowrap;
  writing-mode:vertical-rl;
  transform:rotate(180deg);
}
.yearStatsBarTrack{
  position:relative;
  width:100%;
  max-width:52px;
  height:190px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:4px;
  border:1px solid #d9e2f3;
  border-radius:8px;
  background:#f8fbff;
  padding:6px;
}
.yearStatsBarTrack.split{
  align-items:flex-end;
}
.yearStatsBar{
  display:block;
  width:100%;
  min-height:3px;
  border-radius:6px 6px 2px 2px;
  background:#002b7f;
}
.yearStatsBar.income{
  background:linear-gradient(180deg, #0b4fc2, #002b7f);
}
.yearStatsBar.newStudents{
  width:48%;
  background:#137333;
}
.yearStatsBar.lapsedStudents{
  width:48%;
  background:#c00000;
}
.yearStatsBarLabel{
  color:#102a5e;
  font-size:12px;
  font-weight:900;
}
.yearStatsLegend{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin:8px 0 0;
  color:#475467;
  font-size:13px;
  font-weight:900;
}
.yearStatsLegend i{
  display:inline-block;
  width:11px;
  height:11px;
  margin-right:5px;
  border-radius:3px;
  vertical-align:-1px;
}
.yearStatsLegend .new{
  background:#137333;
}
.yearStatsLegend .lapsed{
  background:#c00000;
}
.yearStatsFunnel{
  display:grid;
  gap:12px;
}
.yearStatsFunnelRow{
  display:grid;
  grid-template-columns:minmax(180px, 1fr) auto;
  gap:10px;
  align-items:center;
  border:1px solid #d9e2f3;
  border-radius:8px;
  background:#fbfdff;
  padding:12px;
}
.yearStatsFunnelRow strong,
.yearStatsFunnelRow span{
  display:block;
}
.yearStatsFunnelRow strong{
  color:#06224a;
}
.yearStatsFunnelRow span{
  margin-top:3px;
  color:#64748b;
  font-size:12px;
  font-weight:800;
}
.yearStatsFunnelMetric{
  min-width:70px;
  text-align:right;
  color:#002b7f;
  font-size:24px;
  font-weight:900;
}
.yearStatsFunnelTrack{
  grid-column:1 / -1;
  height:10px;
  border-radius:999px;
  background:#eef3fb;
  overflow:hidden;
}
.yearStatsFunnelTrack span{
  display:block;
  height:100%;
  border-radius:inherit;
  background:#0b4fc2;
}
.yearlyStatsTable td:nth-child(n+2),
.yearlyStatsTable th:nth-child(n+2),
.yearlyStatsMiniTable td:nth-child(n+2),
.yearlyStatsMiniTable th:nth-child(n+2){
  text-align:right;
  white-space:nowrap;
}
.yearlyStatsTable td:first-child,
.yearlyStatsMiniTable td:first-child{
  white-space:nowrap;
}
.yearStatsSourceList{
  display:grid;
  gap:10px;
}
.yearStatsSourceItem{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:4px 12px;
  align-items:center;
  border:1px solid #d9e2f3;
  border-radius:8px;
  background:#fbfdff;
  padding:12px;
}
.yearStatsSourceItem.ready{
  border-color:#bbf7d0;
  background:#f0fdf4;
}
.yearStatsSourceItem.missing{
  border-color:#fed7aa;
  background:#fff7ed;
}
.yearStatsSourceItem strong{
  color:#06224a;
}
.yearStatsSourceItem span{
  color:#102a5e;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
}
.yearStatsSourceItem em{
  grid-column:1 / -1;
  color:#64748b;
  font-size:12px;
  font-style:normal;
  font-weight:800;
}
@media(max-width:1180px){
  .yearStatsTopGrid,
  .yearStatsBottomGrid{
    grid-template-columns:1fr;
  }
}
@media(max-width:760px){
  .yearlyStatsControls{
    grid-template-columns:1fr;
  }
  .yearlyStatsPage .portalShell{
    max-width:100%;
  }
  .yearStatsBars{
    grid-template-columns:repeat(12, minmax(54px, 1fr));
  }
  .yearStatsFunnelRow,
  .yearStatsSourceItem{
    grid-template-columns:1fr;
  }
  .yearStatsFunnelMetric{
    text-align:left;
  }
}


/* Stage 292 monthly financial plan */
.monthlyPlanPage .portalShell{
  max-width:min(1760px, calc(100vw - 32px));
}
.monthlyPlanControls{
  grid-template-columns:1.2fr 1fr .8fr .8fr auto;
}
.monthlyPlanSummary{
  margin:18px 0;
}
.monthlyPlanSummary .summaryCard{
  min-height:104px;
}
.monthlyPlanSummary .summaryCard em{
  display:block;
  color:#64748b;
  font-style:normal;
  font-size:12px;
  font-weight:800;
  margin-top:6px;
}
.monthlyPlanSummary .summaryCard.goodVariance strong,
.goodVariance{
  color:#137333;
}
.monthlyPlanSummary .summaryCard.badVariance strong,
.badVariance{
  color:#b3261e;
}
.sectionActions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.monthlyPlanTopGrid{
  align-items:stretch;
}
.monthlyPlanChart{
  display:grid;
  gap:12px;
}
.monthlyPlanBarRow{
  display:grid;
  grid-template-columns:minmax(150px, 220px) minmax(240px, 1fr) minmax(150px, auto);
  gap:12px;
  align-items:center;
}
.monthlyPlanBarLabel{
  color:#10264a;
  font-weight:900;
}
.monthlyPlanBarTrack{
  position:relative;
  min-height:30px;
  border:1px solid #d6e0ef;
  border-radius:8px;
  background:#edf3fb;
  overflow:hidden;
}
.monthlyPlanBarTrack span{
  position:absolute;
  left:0;
  height:50%;
  min-width:4px;
}
.monthlyPlanBarTrack .target{
  top:0;
  background:#0b4fc2;
}
.monthlyPlanBarTrack .actual{
  bottom:0;
  background:#137333;
}
.monthlyPlanBarValue{
  color:#172033;
  font-weight:900;
  text-align:right;
  white-space:nowrap;
}
.monthlyPlanLegend .target{
  background:#0b4fc2;
}
.monthlyPlanLegend .actual{
  background:#137333;
}
.monthlyPlanEstimateGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}
.monthlyPlanEstimateGrid div{
  border:1px solid #d9e2f3;
  border-radius:8px;
  background:#fbfdff;
  padding:12px;
}
.monthlyPlanEstimateGrid span{
  display:block;
  color:#64748b;
  font-size:12px;
  font-weight:900;
  margin-bottom:5px;
}
.monthlyPlanEstimateGrid strong{
  display:block;
  color:#082b7f;
}
.monthlyPlanTable{
  min-width:1520px;
  table-layout:fixed;
}
.monthlyPlanTable .mpCategoryCol{width:360px;}
.monthlyPlanTable .mpTargetCountCol{width:190px;}
.monthlyPlanTable .mpTargetAmountCol{width:190px;}
.monthlyPlanTable .mpActualCountCol{width:120px;}
.monthlyPlanTable .mpActualAmountCol{width:140px;}
.monthlyPlanTable .mpRecordedCol{width:140px;}
.monthlyPlanTable .mpVarianceCol{width:130px;}
.monthlyPlanTable .mpNotesCol{width:250px;}
.monthlyPlanTable th:first-child,
.monthlyPlanTable td:first-child{
  width:360px;
  min-width:360px;
  max-width:360px;
}
.monthlyPlanTable th:first-child,
.monthlyPlanTable td:first-child{
  text-align:left !important;
}
.monthlyPlanTable th:nth-child(n+2),
.monthlyPlanTable td:nth-child(n+2),
.monthlyPlanDetailsTable th:last-child,
.monthlyPlanDetailsTable td:last-child{
  text-align:right;
}
.monthlyPlanTable input[type="number"],
.monthlyPlanTable input[type="text"]{
  width:100%;
  min-width:110px;
  border:1px solid #d9e2f3;
  border-radius:8px;
  background:#fff;
  padding:9px 10px;
}
.monthlyPlanTable .mpNotes{
  min-width:220px;
}
.monthlyPlanCategoryLabel{
  display:inline-grid;
  grid-template-columns:18px minmax(0, 1fr);
  align-items:start;
  column-gap:10px;
  width:100%;
  min-width:0;
  text-align:left;
}
.monthlyPlanCategoryLabel input{
  justify-self:start;
  margin-top:3px;
}
.monthlyPlanCategoryLabel strong,
.monthlyPlanCategoryLabel em{
  display:block;
  overflow-wrap:anywhere;
  white-space:normal;
}
.monthlyPlanCategoryLabel em{
  color:#64748b;
  font-size:12px;
  font-style:normal;
  font-weight:400;
  line-height:1.35;
  margin-top:3px;
}
.monthlyPlanDetailsTable{
  min-width:900px;
}
.monthlyPlanDetailsTable td:first-child{
  white-space:nowrap;
}
.monthlyPlanStudentToolbar{
  display:grid;
  grid-template-columns:minmax(220px, 320px) minmax(260px, 1fr);
  gap:12px;
  margin-bottom:14px;
}
.monthlyPlanStudentBoard{
  display:grid;
  gap:12px;
}
.monthlyPlanStudentGrid{
  display:grid;
  grid-template-columns:minmax(320px, .9fr) minmax(520px, 1.35fr);
  gap:16px;
  align-items:start;
}
.monthlyPlanCandidatePanel,
.monthlyPlanLanePanel{
  border:1px solid #d9e2f3;
  border-radius:8px;
  background:#fbfdff;
  padding:12px;
  min-width:0;
}
.monthlyPlanBoardHeader,
.monthlyPlanLaneHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.monthlyPlanLaneHeader > div{
  display:grid;
  gap:2px;
  min-width:0;
}
.monthlyPlanBoardHeader strong,
.monthlyPlanLaneHeader strong{
  color:#082b7f;
  font-size:16px;
}
.monthlyPlanBoardHeader span,
.monthlyPlanLaneHeader span{
  color:#52637a;
  font-size:12px;
  font-weight:900;
}
.monthlyPlanLaneHeader .smallBtn{
  flex:0 0 auto;
  white-space:nowrap;
}
.monthlyPlanCandidateList{
  display:grid;
  gap:10px;
  max-height:720px;
  overflow:auto;
  padding-right:4px;
}
.monthlyPlanCandidate,
.monthlyPlanPlannedStudent{
  display:grid;
  gap:8px;
  border:1px solid #d9e2f3;
  border-radius:8px;
  background:#fff;
  padding:11px;
  box-shadow:0 6px 16px rgba(8,43,127,.05);
}
.monthlyPlanCandidate[draggable="true"]{
  cursor:grab;
}
.monthlyPlanCandidate.dragging{
  opacity:.55;
}
.monthlyPlanCandidate.alreadyPlanned{
  background:#f5f8fc;
  border-style:dashed;
}
.monthlyPlanCandidate strong,
.monthlyPlanPlannedStudent strong{
  display:block;
  color:#172033;
  font-size:15px;
}
.monthlyPlanCandidate p,
.monthlyPlanPlannedStudent p{
  color:#52637a;
  font-size:12px;
  font-weight:800;
  line-height:1.35;
  margin:3px 0 0;
}
.monthlyPlanCandidate em,
.monthlyPlanPlannedStudent em{
  color:#41526a;
  font-size:12px;
  font-style:normal;
  line-height:1.4;
}
.monthlyPlanFamilyBreakdown{
  border:1px solid #d9e2f3;
  border-radius:8px;
  background:#f8fbff;
  padding:8px 10px;
}
.monthlyPlanFamilyBreakdown summary{
  cursor:pointer;
  color:#082b7f;
  font-size:12px;
  font-weight:900;
}
.monthlyPlanFamilyBreakdown ul{
  margin:8px 0;
  padding-left:18px;
  color:#41526a;
  font-size:12px;
  line-height:1.45;
}
.monthlyPlanCandidateMeta{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.monthlyPlanCandidateMeta span{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  border:1px solid #bfdbfe;
  border-radius:999px;
  background:#eff6ff;
  color:#082b7f;
  font-size:11px;
  font-weight:900;
  padding:2px 8px;
}
.monthlyPlanCandidateActions{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:8px;
  align-items:center;
}
.monthlyPlanCandidateActions select{
  width:100%;
  min-width:0;
  border:1px solid #d9e2f3;
  border-radius:8px;
  background:#fff;
  padding:8px 9px;
}
.monthlyPlanLaneGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}
.monthlyPlanLane{
  border:1px solid #d9e2f3;
  border-radius:8px;
  background:#f8fbff;
  padding:10px;
  min-height:180px;
  transition:border-color .15s ease, background .15s ease;
}
.monthlyPlanLane.dragOver{
  border-color:#0b4fc2;
  background:#eef5ff;
}
.monthlyPlanLaneDrop{
  display:grid;
  gap:8px;
}
.monthlyPlanDropHint{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:96px;
  border:1px dashed #bfcae0;
  border-radius:8px;
  color:#64748b;
  font-size:12px;
  font-weight:900;
  text-align:center;
}
.monthlyPlanPlannedStudent .dangerBtn{
  justify-self:start;
}
.setupWarning{
  border:1px solid #f1c5c1;
  border-radius:8px;
  background:#fff8f7;
  color:#9f1c12;
  font-weight:900;
  padding:10px 12px;
}
@media(max-width:1180px){
  .monthlyPlanControls{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .monthlyPlanBarRow{
    grid-template-columns:1fr;
  }
  .monthlyPlanBarValue{
    text-align:left;
  }
  .monthlyPlanStudentGrid{
    grid-template-columns:1fr;
  }
  .monthlyPlanCandidateList{
    max-height:520px;
  }
}
@media(max-width:760px){
  .monthlyPlanControls,
  .monthlyPlanEstimateGrid,
  .monthlyPlanStudentToolbar,
  .monthlyPlanLaneGrid{
    grid-template-columns:1fr;
  }
  .monthlyPlanPage .portalShell{
    max-width:100%;
  }
  .monthlyPlanCandidateActions{
    grid-template-columns:1fr;
  }
}


/* Stage 21EC bug reports */
.bugReportShortcut{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:9000;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:10px 14px;
  border-radius:999px;
  background:#002b7f;
  color:#fff;
  font-size:13px;
  font-weight:900;
  text-decoration:none;
  box-shadow:0 10px 24px rgba(0,43,127,.25);
}
.bugReportShortcut:hover{
  background:#0b4fc2;
}
.bugReportPage .portalShell{
  max-width:1180px;
}
.bugReportFormGrid{
  grid-template-columns:repeat(3, minmax(0, 1fr));
}
.bugReportFilters{
  grid-template-columns:1fr 1fr 1fr 2fr;
}
.bugReportsTable td,
.bugReportsTable th{
  vertical-align:top;
}
.bugSummaryCell strong,
.bugSummaryCell small{
  display:block;
}
.bugSummaryCell small,
.bugPageCell,
.bugSelectedDetails p{
  color:var(--muted);
  white-space:normal;
}
.bugPill,
.bugStatus{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  border-radius:999px;
  padding:3px 9px;
  font-size:12px;
  font-weight:900;
  background:#eef2fb;
  color:#002b7f;
}
.bugPill.high,
.statusWarn{
  background:#fff4d8;
  color:#9a6700;
}
.bugPill.urgent,
.statusBad{
  background:#fff0f0;
  color:#a32626;
}
.statusGood{
  background:#e9f8ee;
  color:#137333;
}
.bugDetailGrid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:10px;
  margin-bottom:14px;
}
.bugDetailGrid div{
  border:1px solid var(--line);
  border-radius:12px;
  background:#fbfcff;
  padding:10px;
}
.bugDetailGrid span,
.bugDetailGrid strong{
  display:block;
}
.bugDetailGrid span{
  color:var(--muted);
  font-size:12px;
  font-weight:900;
}
.bugDetailGrid strong{
  margin-top:4px;
  color:var(--blue);
}
.bugSelectedDetails h3{
  margin:14px 0 6px;
  color:var(--blue);
  font-size:16px;
}
.bugSelectedDetails p{
  margin:0 0 8px;
  white-space:pre-wrap;
}

/* Stage 21DO syllabus settings */
.syllabusSummary{
  margin:0 0 14px;
}
.syllabusEditorList{
  display:grid;
  gap:16px;
}
.syllabusEditorBlock{
  border:1px solid var(--line);
  border-radius:12px;
  background:#fbfcff;
  padding:16px;
}
.syllabusEditorGrid{
  align-items:start;
  margin:0 0 12px;
}
.compactSectionTitle{
  margin-bottom:12px;
}
.compactSectionTitle h3{
  margin:0;
}
.compactSectionTitle p{
  margin:4px 0 0;
  color:var(--muted);
}
.syllabusPreviewTable{
  margin-top:6px;
}
.syllabusPreviewTable td strong,
.syllabusPreviewTable td span{
  display:block;
}
.syllabusPreviewTable td span{
  color:var(--muted);
  font-size:12px;
  margin-top:3px;
}
.syllabusStudentCard .badge{
  max-width:150px;
  white-space:normal;
  text-align:center;
}
.syllabusMiniList{
  list-style:none;
  padding:0;
  margin:12px 0 0;
  display:grid;
  gap:8px;
}
.syllabusMiniList li{
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  padding:8px;
}
.syllabusMiniList strong,
.syllabusMiniList span{
  display:block;
}
.syllabusMiniList strong{
  color:var(--blue);
  font-size:12px;
}
.syllabusMiniList span{
  color:var(--ink);
  margin-top:2px;
}
.learnedSyllabusBox{
  margin:10px 0 0;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fbfcff;
  padding:10px;
}
.learnedSyllabusBox strong,
.learnedSyllabusBox span{
  display:block;
}
.learnedSyllabusBox strong{
  color:var(--blue);
  font-size:13px;
}
.learnedSyllabusBox span{
  color:var(--ink);
  margin-top:3px;
  font-weight:800;
}
.compactLearnedSyllabus{
  min-width:190px;
  margin:0;
  padding:8px;
}
.learnedSyllabusItems{
  list-style:none;
  padding:0;
  margin:8px 0 0;
  display:grid;
  gap:5px;
}
.learnedSyllabusItems li{
  color:var(--ink);
  font-size:12px;
}
.learnedSyllabusItems em{
  color:var(--muted);
  font-style:normal;
  font-weight:900;
  margin-right:4px;
}
.learnedSyllabusHistoryList{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  margin-top:12px;
}
.learnedSyllabusHistoryCard{
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  padding:14px;
}
.learnedSyllabusHistoryHeader{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr;
  gap:12px;
  margin-bottom:10px;
}
.learnedSyllabusHistoryHeader span{
  display:block;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}
.learnedSyllabusHistoryHeader strong{
  display:block;
  color:var(--blue);
  font-size:15px;
  margin-top:2px;
}
.learnedSyllabusHistoryItems{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.learnedSyllabusHistoryItems li{
  border:1px solid var(--line);
  border-radius:8px;
  background:#fbfcff;
  padding:9px 10px;
  min-width:0;
}
.learnedSyllabusHistoryItems strong,
.learnedSyllabusHistoryItems span,
.learnedSyllabusHistoryItems em,
.learnedSyllabusHistoryItems small{
  display:block;
}
.learnedSyllabusHistoryItems strong{
  color:var(--muted);
  font-size:12px;
}
.learnedSyllabusHistoryItems span{
  color:var(--ink);
  font-weight:900;
  margin-top:2px;
}
.learnedSyllabusHistoryItems em,
.learnedSyllabusHistoryItems small{
  color:var(--muted);
  font-size:12px;
  font-style:normal;
  margin-top:2px;
}
.compactNotice{
  margin:8px 0 10px;
  padding:8px 10px;
}
.fieldHint{
  display:block;
  color:var(--muted);
  font-size:12px;
  font-style:normal;
  font-weight:800;
  margin-top:6px;
}
.fieldHint a{
  color:var(--blue);
}
.firstAidLogList{
  display:grid;
  gap:12px;
}
.firstAidLogCard{
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  padding:14px;
}
.firstAidLogHeader{
  display:grid;
  grid-template-columns:1fr 220px;
  gap:12px;
  margin-bottom:10px;
}
.firstAidLogHeader span,
.firstAidLogGrid span{
  display:block;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}
.firstAidLogHeader strong,
.firstAidLogGrid strong{
  display:block;
  color:var(--ink);
  margin-top:2px;
}
.firstAidLogGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin:10px 0;
}
.firstAidLogGrid div{
  border:1px solid var(--line);
  border-radius:8px;
  background:#fbfcff;
  padding:9px;
}
.firstAidLogCard h4{
  margin:12px 0 4px;
}
.firstAidLogCard p{
  margin:0;
  white-space:pre-wrap;
}
.firstAidLogCard small{
  display:block;
  color:var(--muted);
  margin-top:12px;
}
.meritBadgePortalGrid{
  display:grid;
  grid-template-columns:360px 1fr;
  gap:16px;
  align-items:start;
}
.meritBadgeRequestPanel,
.meritBadgeStudentBlock{
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  padding:14px;
}
.meritBadgeRequestPanel label{
  display:block;
  font-weight:900;
  color:var(--blue);
  margin:10px 0 4px;
}
.meritBadgeRequestPanel select,
.meritBadgeRequestPanel textarea{
  width:100%;
}
.meritBadgeEarnedPanel{
  display:grid;
  gap:12px;
}
.meritBadgeGrid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
  gap:10px;
  margin-top:10px;
}
.meritBadgeTile{
  border:1px solid var(--line);
  border-radius:10px;
  background:#fbfcff;
  padding:10px;
  text-align:center;
}
.meritBadgeTile.earned{
  background:#f7fff9;
}
.meritBadgeImage,
.meritBadgeThumb{
  width:58px;
  height:58px;
  object-fit:contain;
  display:block;
  margin:0 auto 8px;
}
.meritBadgeThumb{
  width:42px;
  height:42px;
  margin:0;
}
.emptyBadgeImage{
  border:1px dashed var(--line);
  border-radius:8px;
  background:#fff;
  color:var(--muted);
  font-size:11px;
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:center;
}
.meritBadgeTile strong,
.meritBadgeTile span,
.meritBadgeTile em{
  display:block;
}
.meritBadgeTile strong{
  color:var(--ink);
  font-size:13px;
}
.meritBadgeTile span,
.meritBadgeTile em{
  color:var(--muted);
  font-size:12px;
  font-style:normal;
  margin-top:3px;
}
.badgeTableCell{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:180px;
}
.badgeTableCell strong,
.badgeTableCell span{
  display:block;
}
.badgeTableCell span{
  color:var(--muted);
  font-size:12px;
  margin-top:2px;
}
/* Stage 21DV daily dashboard */
.dailyDashboardPage .portalShell{
  max-width:1720px;
}
.dailyDashboardFilters{
  align-items:end;
}
.dailyDashboardGrid{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(360px,0.65fr);
  gap:18px;
  margin:18px 0;
}
.dailyDashboardThreePanel{
  grid-template-columns:repeat(3, minmax(0, 1fr));
}
.dailyDashboardMainPanel{
  min-width:0;
}
.dailyActionQueue{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:10px;
}
.dailyActionItem{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:10px;
  align-items:center;
  border:1px solid #d7e2f3;
  border-radius:8px;
  background:#fbfdff;
  padding:12px;
}
.dailyActionItem.warn{
  border-color:#fed7aa;
  background:#fff7ed;
}
.dailyActionItem.danger{
  border-color:#fecaca;
  background:#fff5f5;
}
.dailyActionItem.ok{
  border-color:#bbf7d0;
  background:#f0fdf4;
}
.dailyActionItem strong,
.dailyActionItem span{
  display:block;
}
.dailyActionItem strong{
  color:#06224a;
  font-size:14px;
}
.dailyActionItem span{
  margin-top:3px;
  color:#4d6078;
  font-size:13px;
  line-height:1.3;
}
.dailyDashboardList{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.compactDailyList{
  max-height:540px;
  overflow:auto;
  padding-right:4px;
}
.dailyDashboardRow{
  display:grid;
  grid-template-columns:minmax(260px,1fr) auto;
  gap:14px;
  align-items:center;
  border:1px solid #d7e2f3;
  border-radius:8px;
  padding:12px 14px;
  background:#fbfdff;
}
.dailyActionRow{
  grid-template-columns:minmax(220px,1fr);
  align-items:start;
}
.dailyActionRow .dailyRowActions{
  justify-content:flex-start;
}
.newStudentJourneyRow{
  grid-template-columns:minmax(300px,1fr) minmax(420px,0.9fr) auto;
}
.dailyRowTitle{
  font-weight:800;
  color:#06224a;
  line-height:1.25;
}
.dailyRowTitle a{
  color:#063b8f;
  text-decoration:none;
}
.dailyRowTitle a:hover{
  text-decoration:underline;
}
.dailyRowMeta{
  margin-top:3px;
  color:#4d6078;
  font-size:13px;
  line-height:1.35;
}
.dailyMetricStrip{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
}
.dailyMetricStrip span,
.journeyStatusGrid .statusBadge{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  gap:4px;
}
.dailyMetricStrip span{
  border:1px solid #d9e2f3;
  border-radius:8px;
  padding:5px 8px;
  background:#ffffff;
  color:#42556f;
  font-size:13px;
}
.dailyMetricStrip strong{
  color:#06224a;
}
.journeyStatusGrid{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  justify-content:flex-start;
}
.dailyRowActions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.buttonLink.smallBtn{
  padding:8px 11px;
  min-height:34px;
  font-size:13px;
}
.dailyMiniList{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:12px;
}
.dailyMiniRow{
  border:1px solid #d7e2f3;
  border-radius:8px;
  padding:10px 12px;
  background:#fbfdff;
}
.dailyMiniRow strong,
.dailyMiniRow span{
  display:block;
}
.dailyMiniRow strong{
  color:#06224a;
  font-size:14px;
}
.dailyMiniRow span{
  color:#4d6078;
  font-size:13px;
  margin-top:2px;
}
.attentionSummaryCard{
  border-color:#f0b429;
  background:#fffaf0;
}
.warnText{
  color:#9a5b00 !important;
}


/* Stage 21EF Student Risk Alerts */
.studentRiskAlertsPage .portalShell{
  max-width:min(1900px, calc(100vw - 16px));
}
.studentRiskFilters{
  grid-template-columns:1fr 1fr .8fr .75fr .75fr .75fr 1.35fr;
}
.studentRiskSummary{
  margin-bottom:18px;
}
.studentRiskTopGrid{
  display:grid;
  grid-template-columns:minmax(0, 1.25fr) minmax(360px, .75fr);
  gap:18px;
  margin:18px 0;
}
.studentRiskPriorityList{
  display:grid;
  gap:10px;
}
.studentRiskPriorityItem{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:12px;
  align-items:center;
  border:1px solid #d7e2f3;
  border-radius:8px;
  background:#fbfdff;
  padding:12px;
}
.studentRiskPriorityItem.bad{
  border-color:#fecaca;
  background:#fff5f5;
}
.studentRiskPriorityItem.warn{
  border-color:#fed7aa;
  background:#fff7ed;
}
.studentRiskPriorityItem strong,
.studentRiskPriorityItem span{
  display:block;
}
.studentRiskPriorityItem strong{
  color:#06224a;
}
.studentRiskPriorityItem span{
  color:#4d6078;
  font-size:13px;
  margin-top:3px;
  line-height:1.35;
}
.studentRiskSourceTables{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}
.studentRiskSourceItem{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  border:1px solid #d9e2ef;
  background:#fbfcff;
  border-radius:8px;
  padding:10px;
}
.studentRiskSourceItem span{
  color:#667085;
  font-size:12px;
  font-weight:800;
}
.studentRiskSourceItem strong{
  border-radius:999px;
  padding:5px 9px;
  font-size:12px;
}
.studentRiskSourceItem strong.ready{
  background:#e8f7ee;
  color:#087333;
}
.studentRiskSourceItem strong.missing{
  background:#fff0f0;
  color:#a11b1b;
}
.riskPermissionNote{
  color:#667085;
  font-size:13px;
  line-height:1.35;
  margin-top:12px;
}
.studentRiskTable th,
.studentRiskTable td{
  vertical-align:top;
}
.studentRiskTable td span{
  display:block;
  color:#667085;
  font-size:12px;
  margin-top:3px;
  overflow-wrap:anywhere;
}
.studentRiskTable td a{
  color:#063b8f;
  text-decoration:none;
}
.studentRiskTable td a:hover{
  text-decoration:underline;
}
.studentRiskRow.bad{
  background:#fffafa;
}
.studentRiskRow.warn{
  background:#fffdf5;
}
.studentRiskPill{
  display:inline-flex;
  align-items:center;
  width:max-content;
  border-radius:999px;
  border:1px solid #d9e2ef;
  background:#eef4ff;
  color:#174ea6;
  padding:6px 10px;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
  margin:0 0 5px;
}
.studentRiskPill.bad{
  background:#fff0f0;
  border-color:#efb4b4;
  color:#a11b1b;
}
.studentRiskPill.warn{
  background:#fff8e6;
  border-color:#f4d48b;
  color:#8a5b00;
}
.studentRiskPill.info{
  background:#eef4ff;
  border-color:#bfd7ff;
  color:#174ea6;
}
@media(max-width:1300px){
  .studentRiskFilters{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
  .studentRiskTopGrid{
    grid-template-columns:1fr;
  }
}
@media(max-width:760px){
  .studentRiskFilters,
  .studentRiskSourceTables{
    grid-template-columns:1fr;
  }
  .studentRiskPriorityItem{
    grid-template-columns:1fr;
  }
}

@media (max-width:1100px){
  .dailyDashboardGrid{
    grid-template-columns:1fr;
  }
  .dailyDashboardThreePanel{
    grid-template-columns:1fr;
  }
  .dailyActionItem{
    grid-template-columns:1fr;
  }
  .newStudentJourneyRow,
  .dailyDashboardRow{
    grid-template-columns:1fr;
  }
  .dailyMetricStrip,
  .dailyRowActions{
    justify-content:flex-start;
  }
}

.imageUploadRow{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
@media(max-width:980px){
  .monthlyReturnControls,
  .smartpayImportControls{
    grid-template-columns:1fr 1fr;
  }
  .accountingControls{
    grid-template-columns:1fr 1fr;
  }
  .monthlyReturnActions{
    grid-column:1 / -1;
  }
  .monthlyReturnGrid{
    grid-template-columns:1fr;
  }
}
@media(max-width:680px){
  .monthlyReturnControls,
  .smartpayImportControls,
  .monthlyReturnFormGrid,
  .monthlyReturnFormGrid.three,
  .monthlyReturnFormGrid.two,
  .bugReportFormGrid,
  .bugReportFilters,
  .bugDetailGrid{
    grid-template-columns:1fr;
  }
  .monthlyReturnActions,
  .monthlyReturnSubmitActions{
    flex-direction:column;
  }
  .monthlyReturnActions button,
  .monthlyReturnSubmitActions button{
    width:100%;
  }
  .syllabusEditorBlock{
    padding:12px;
  }
  .learnedSyllabusHistoryHeader,
  .learnedSyllabusHistoryItems,
  .firstAidLogHeader,
  .firstAidLogGrid,
.meritBadgePortalGrid{
  grid-template-columns:1fr;
}
}

/* Stage 21DV graduation schedule setup */
.graduationSetupGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(360px,1fr));
  gap:14px;
}
.graduationSetupCard{
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  padding:16px;
  display:grid;
  gap:14px;
}
.graduationSetupHeader{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
}
.graduationSetupHeader h4{
  margin:2px 0 5px;
  color:var(--blue);
  font-size:18px;
}
.graduationSetupHeader span,
.graduationSetupHeader em{
  display:block;
  color:var(--muted);
  font-style:normal;
  font-weight:800;
  font-size:13px;
  margin-top:3px;
}
.graduationSetupActions{
  display:flex;
  justify-content:flex-end;
  gap:7px;
  flex-wrap:wrap;
  min-width:220px;
}
.graduationSessionGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:8px;
}
.graduationSessionCard{
  border:1px solid #d9deea;
  border-radius:10px;
  background:#f8fbff;
  padding:10px;
  display:grid;
  gap:4px;
}
.graduationSessionCard.inactive{
  opacity:.58;
}
.graduationSessionCard span{
  color:var(--blue);
  font-weight:900;
}
.graduationSessionCard strong{
  color:var(--ink);
  font-size:13px;
}
.graduationSessionCard em{
  color:var(--muted);
  font-size:12px;
  font-style:normal;
}
.graduationClashBox{
  border:1px solid #f0d28a;
  border-radius:10px;
  background:#fffaf0;
  padding:12px;
}
.graduationClashHeader{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
}
.graduationClashHeader strong,
.graduationClashHeader span{
  display:block;
}
.graduationClashHeader span{
  color:var(--muted);
  font-size:12px;
  margin-top:3px;
}
.graduationClashList{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:8px;
  margin-top:10px;
}
.graduationClashList div{
  border:1px solid #f4dc9d;
  border-radius:8px;
  background:#fff;
  padding:8px;
}
.graduationClashList strong,
.graduationClashList span,
.graduationLegacyBox strong,
.graduationLegacyBox span{
  display:block;
}
.graduationClashList span,
.graduationLegacyBox span{
  color:var(--muted);
  font-size:12px;
  margin-top:3px;
}
.graduationLegacyList{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}
.graduationVenueNote{
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  padding:10px;
  margin-top:10px;
}
.graduationVenueNote strong,
.graduationVenueNote span{
  display:block;
}
.graduationVenueNote strong{
  color:var(--blue);
  font-size:12px;
}
.graduationVenueNote span{
  color:var(--ink);
  margin-top:3px;
}
.graduationActions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:12px;
}
.graduationActions button{
  margin:0;
}
@media(max-width:760px){
  .graduationSetupHeader,
  .graduationClashHeader{
    display:block;
  }
  .graduationSetupActions{
    justify-content:flex-start;
    margin-top:10px;
  }
}


/* Stage 21DW tuition billing overview */
.tuitionBillingPage .portalShell{
  max-width:min(1900px, calc(100vw - 16px));
}
.tuitionBillingFilters{
  grid-template-columns:1.1fr 1fr 1fr .75fr .85fr 1.35fr;
}
.billingFilterChecks{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:14px 0 6px;
}
.billingFilterChecks label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:8px 11px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fbfcff;
  color:#344054;
  font-size:13px;
  font-weight:800;
}
.billingFilterChecks input{
  width:auto;
  margin:0;
}
.tuitionBillingSummary{
  margin-bottom:18px;
}
.tuitionBillingTable th,
.tuitionBillingTable td{
  vertical-align:top;
}
.tuitionBillingTable td span{
  display:block;
  color:#667085;
  font-size:12px;
  margin-top:3px;
}
.tuitionBillingTable td:nth-child(7){
  max-width:260px;
}
.billingStatusPill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:112px;
  border-radius:999px;
  padding:6px 10px;
  font-size:12px;
  font-weight:900;
  border:1px solid #d9e2ef;
  background:#f8fbff;
  color:#344054;
  white-space:nowrap;
}
.billingStatusPill.paid{
  background:#e8f7ee;
  border-color:#bce4c8;
  color:#087333;
}
.billingStatusPill.defaulted{
  background:#fff2f2;
  border-color:#efb4b4;
  color:#a11b1b;
}
.billingStatusPill.no_link{
  background:#fff8e6;
  border-color:#f4d48b;
  color:#8a5b00;
}
.billingStatusPill.notice{
  background:#eef4ff;
  border-color:#bfd4ff;
  color:#174ea6;
}
.billingStatusPill.inactive{
  background:#f2f4f7;
  border-color:#d0d5dd;
  color:#475467;
}
.tuitionBillingRow.defaulted{
  background:#fffafa;
}
.tuitionBillingRow.no_link{
  background:#fffdf5;
}
.paidInFullRenewal.overdue{
  background:#fffafa;
}
@media(max-width:1000px){
  .tuitionBillingFilters{
    grid-template-columns:1fr 1fr;
  }
  .billingFilterChecks{
    flex-direction:column;
  }
}
@media(max-width:700px){
  .tuitionBillingFilters{
    grid-template-columns:1fr;
  }
}


/* Stage 21UM student portal users */
.portalUsersPage .portalShell{
  max-width:min(1900px, calc(100vw - 16px));
}
.portalUsersFilters{
  grid-template-columns:minmax(180px, 280px) minmax(190px, 260px) minmax(260px, 1fr);
}
.portalUsersSummary{
  margin-top:16px;
}
.portalUsersSummary .summaryCard em{
  display:block;
  margin-top:4px;
  color:#667085;
  font-size:12px;
  font-style:normal;
}
.tableScroll{
  width:100%;
  overflow-x:auto;
}
.portalUsersTable{
  min-width:1280px;
}
.portalUsersTable th,
.portalUsersTable td{
  vertical-align:top;
}
.portalUsersTable td span{
  display:block;
  color:#667085;
  font-size:12px;
  margin-top:3px;
}
.portalUsersTable td:nth-child(1){
  min-width:210px;
}
.portalUsersTable td:nth-child(2){
  min-width:240px;
}
.portalUsersTable td:nth-child(7){
  min-width:170px;
}
.portalUsersTable td:nth-child(7) .smallBtn{
  margin:0 6px 6px 0;
}
.portalUserNeedsAttention{
  background:#fffdf5;
}
.portalUserPill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:122px;
  border-radius:999px;
  padding:6px 10px;
  border:1px solid #d9e2ef;
  background:#f8fbff;
  color:#344054;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}
.portalUserPill.ok{
  background:#e8f7ee;
  border-color:#bce4c8;
  color:#087333;
}
.portalUserPill.warn{
  background:#fff8e6;
  border-color:#f4d48b;
  color:#8a5b00;
}
.portalUserPill.bad{
  background:#fff2f2;
  border-color:#efb4b4;
  color:#a11b1b;
}
.portalUserError{
  color:#b42318;
}
@media(max-width:900px){
  .portalUsersFilters{
    grid-template-columns:1fr;
  }
}


/* Stage 21EC Stripe health check */
.stripeHealthPage .portalShell{
  max-width:min(1900px, calc(100vw - 16px));
}
.stripeHealthFilters{
  grid-template-columns:minmax(220px, 420px);
}
.stripeHealthSummary{
  margin-bottom:18px;
}
.stripeHealthCentreGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
  margin-bottom:18px;
}
.stripeHealthCentreCard{
  display:grid;
  gap:14px;
  border-left:5px solid #98d7aa;
}
.stripeHealthCentreCard.warn{
  border-left-color:#f4c04f;
}
.stripeHealthCentreCard.bad{
  border-left-color:#d92d20;
}
.stripeHealthCentreHeader{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
}
.stripeHealthCentreHeader h3{
  margin:0;
  color:#072f63;
  font-size:24px;
}
.stripeHealthPill{
  min-width:auto;
  padding:6px 10px;
}
.stripeHealthPill.ok{
  background:#e8f7ee;
  border-color:#bce4c8;
  color:#087333;
}
.stripeHealthPill.warn{
  background:#fff8e6;
  border-color:#f4d48b;
  color:#8a5b00;
}
.stripeHealthPill.bad{
  background:#fff2f2;
  border-color:#efb4b4;
  color:#a11b1b;
}
.stripeHealthMiniGrid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:10px;
}
.stripeHealthMiniGrid div,
.stripeSecretRow,
.sourceTableItem{
  border:1px solid #d9e2ef;
  background:#fbfcff;
  border-radius:8px;
  padding:10px;
}
.stripeHealthMiniGrid span,
.stripeSecretRow span,
.sourceTableItem span{
  display:block;
  color:#667085;
  font-size:12px;
  font-weight:800;
}
.stripeHealthMiniGrid strong{
  display:block;
  margin-top:5px;
  color:#072f63;
  font-size:14px;
  line-height:1.25;
}
.stripeSecretGrid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:10px;
}
.stripeSecretRow{
  display:grid;
  gap:6px;
  align-content:start;
}
.stripeSecretRow small{
  display:block;
  color:#667085;
  font-size:12px;
  overflow-wrap:anywhere;
}
.stripeHealthIssues{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.stripeHealthIssues span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  border-radius:999px;
  background:#fff8e6;
  color:#8a5b00;
  border:1px solid #f4d48b;
  padding:6px 10px;
  font-size:12px;
  font-weight:900;
}
.stripeHealthIssues .okIssue{
  background:#e8f7ee;
  border-color:#bce4c8;
  color:#087333;
}
.stripeHealthTable th,
.stripeHealthTable td{
  vertical-align:top;
}
.stripeHealthTable td span{
  display:block;
  color:#667085;
  font-size:12px;
  margin-top:3px;
  overflow-wrap:anywhere;
}
.stripeSourceTables{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:10px;
}
.sourceTableItem{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}
@media(max-width:1200px){
  .stripeHealthCentreGrid{
    grid-template-columns:1fr;
  }
  .stripeHealthMiniGrid,
  .stripeSecretGrid,
  .stripeSourceTables{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}
@media(max-width:700px){
  .stripeHealthMiniGrid,
  .stripeSecretGrid,
  .stripeSourceTables{
    grid-template-columns:1fr;
  }
  .stripeHealthCentreHeader,
  .sourceTableItem{
    flex-direction:column;
    align-items:flex-start;
  }
}


/* Stage 21EA VIP lead capture */
.vipLeadsPage .portalShell{
  max-width:min(1680px, calc(100vw - 24px));
}
.vipLeadFormGrid{
  display:grid;
  grid-template-columns:1fr 1fr 1.2fr .55fr 1.2fr 1fr 1.25fr .8fr;
  gap:12px;
  align-items:end;
}
.vipNotes{
  margin-top:12px;
}
.vipLeadActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  flex-wrap:wrap;
  margin-top:12px;
}
.vipEmailToggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:40px;
  padding:8px 11px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fbfcff;
  color:#344054;
  font-size:13px;
  font-weight:800;
}
.vipEmailToggle input{
  width:auto;
  margin:0;
}
.vipStatsTable td span,
.vipRecentTable td span{
  display:block;
  color:#667085;
  font-size:12px;
  margin-top:3px;
}
.vipRecentTable th,
.vipRecentTable td{
  vertical-align:top;
}
@media(max-width:1300px){
  .vipLeadFormGrid{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }
}
@media(max-width:760px){
  .vipLeadFormGrid{
    grid-template-columns:1fr;
  }
  .vipLeadActions{
    align-items:stretch;
    flex-direction:column;
  }
  .vipLeadActions button{
    width:100%;
  }
}


/* Stage 296 instructor training programmes */
.studentCardBadges{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:flex-start;
  gap:6px;
}
.instructorTrainingStudent{
  display:grid;
  gap:14px;
  border:1px solid var(--line);
  background:#fbfcff;
  border-radius:8px;
  padding:14px;
}
.instructorTrainingGrid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}
.adminInstructorTrainingGrid{
  margin:14px 0;
}
.instructorTrainingProgramme{
  display:grid;
  gap:12px;
  align-content:start;
  border:1px solid #d9e2ef;
  border-left:5px solid #d9e2ef;
  background:#fff;
  border-radius:8px;
  padding:14px;
  min-width:0;
}
.instructorTrainingProgramme.available{
  border-left-color:#98d7aa;
}
.instructorTrainingProgramme.active{
  border-left-color:#0b4ea2;
}
.instructorTrainingProgramme.locked{
  border-left-color:#efb4b4;
  background:#fffafa;
}
.instructorTrainingProgramme p{
  margin:0;
  color:#344054;
  line-height:1.5;
}
.instructorTrainingBenefits{
  margin:0;
  padding-left:18px;
  color:#344054;
  line-height:1.45;
}
.instructorTrainingPriceGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
}
.instructorTrainingPriceGrid .metaBox{
  min-height:96px;
}
.instructorTrainingPriceGrid .metaBox em{
  display:block;
  margin-top:4px;
  color:#667085;
  font-size:12px;
  font-style:normal;
  font-weight:800;
}
.instructorTrainingActions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.instructorTrainingForm{
  margin:16px 0;
}
.instructorTrainingForm .editActions{
  justify-content:flex-start;
}
.instructorTrainingSessionBox,
.instructorTrainingAttendanceBox{
  display:grid;
  gap:10px;
}
.instructorTrainingSessionRows{
  display:grid;
  gap:8px;
}
.instructorTrainingSessionRow{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:10px;
  border:1px solid #d9e2ef;
  border-radius:8px;
  background:#fff;
  padding:10px 12px;
}
.instructorTrainingSessionRow strong,
.instructorTrainingSessionRow span{
  display:block;
}
.instructorTrainingSessionRow span{
  color:#667085;
  font-size:13px;
  margin-top:2px;
}
@media(max-width:1150px){
  .instructorTrainingGrid{
    grid-template-columns:1fr;
  }
  .instructorTrainingPriceGrid{
    grid-template-columns:1fr;
  }
}
@media(max-width:720px){
  .studentCardBadges{
    justify-content:flex-start;
  }
  .instructorTrainingStudent,
  .instructorTrainingProgramme{
    padding:12px;
  }
  .instructorTrainingSessionRow{
    grid-template-columns:1fr;
    align-items:start;
  }
}


/* Stage 306 lesson planner */
.lessonPlannerPage .portalShell{
  max-width:min(1840px, calc(100vw - 32px));
}
.lessonPlannerFilterGrid{
  grid-template-columns:minmax(180px, 300px) minmax(180px, 260px) auto;
}
.lessonPlannerWorkspace{
  padding:14px;
}
.lessonPlannerGrid{
  display:grid;
  grid-template-columns:300px minmax(0, 1fr) 360px;
  gap:14px;
  align-items:start;
}
.lessonPlannerPanel{
  border:1px solid #d9deea;
  border-radius:8px;
  background:#fbfcff;
  padding:14px;
  min-width:0;
}
.lessonClassPanel,
.lessonLibraryPanel{
  position:sticky;
  top:12px;
  max-height:calc(100vh - 24px);
  overflow:auto;
}
.lessonClassList,
.lessonLibraryList,
.lessonBlockList{
  display:grid;
  gap:10px;
}
.lessonClassButton{
  width:100%;
  margin:0;
  padding:12px;
  color:#17233c;
  background:#fff;
  border:1px solid #d9deea;
  border-radius:8px;
  box-shadow:none;
  text-align:left;
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
}
.lessonClassButton:hover:not(:disabled){
  box-shadow:0 8px 20px rgba(0,43,127,.08);
}
.lessonClassButton.active{
  border-color:#003d8f;
  background:#f4f8ff;
  outline:3px solid rgba(0,61,143,.12);
}
.lessonClassButton strong,
.lessonClassButton em,
.lessonClassButton small{
  display:block;
}
.lessonClassButton strong{
  color:#072f63;
  line-height:1.25;
}
.lessonClassButton em,
.lessonClassButton small{
  color:#5d6d82;
  font-size:12px;
  font-style:normal;
  margin-top:3px;
}
.lessonClassButton b,
.lessonClassButton i{
  flex:0 0 auto;
  border-radius:999px;
  padding:5px 8px;
  font-size:11px;
  font-style:normal;
}
.lessonClassButton b{
  color:#087333;
  background:#e8fff0;
  border:1px solid #b7ebc6;
}
.lessonClassButton i{
  color:#5d6d82;
  background:#f1f4f9;
  border:1px solid #d9deea;
}
.lessonPlanActions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:flex-end;
}
.lessonPlanActions button{
  margin:0;
}
.lessonPlanMetaGrid{
  display:grid;
  grid-template-columns:minmax(220px, 1fr) 180px;
  gap:12px;
  margin:10px 0 14px;
}
.lessonPlanMetaGrid label{
  margin:0;
}
.lessonPlanMetaGrid label span,
.lessonLibraryFilters label span,
.lessonDurationInput span{
  display:block;
  color:#344054;
  font-size:12px;
  font-weight:800;
  margin-bottom:5px;
}
.lessonWideField{
  grid-column:1 / -1;
}
.lessonTimelineHeader{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  border-top:1px solid #d9deea;
  border-bottom:1px solid #d9deea;
  padding:10px 0;
  margin-bottom:12px;
}
.lessonTimelineHeader strong{
  color:#072f63;
}
.lessonTimelineHeader span{
  color:#5d6d82;
  font-size:12px;
  font-weight:700;
}
.lessonBlockRow{
  display:grid;
  grid-template-columns:82px minmax(0, 1fr);
  gap:12px;
  align-items:start;
  border:1px solid #d9deea;
  border-radius:8px;
  background:#fff;
  padding:12px;
}
.lessonBlockTime{
  border-radius:8px;
  background:#f1f6ff;
  border:1px solid #d7e2f3;
  padding:10px 8px;
  text-align:center;
}
.lessonBlockTime strong,
.lessonBlockTime span{
  display:block;
}
.lessonBlockTime strong{
  color:#003d8f;
  font-size:16px;
}
.lessonBlockTime span{
  color:#5d6d82;
  font-size:12px;
  margin-top:3px;
}
.lessonBlockMain{
  display:grid;
  gap:8px;
  min-width:0;
}
.lessonBlockTop{
  display:grid;
  grid-template-columns:160px minmax(0, 1fr) 82px;
  gap:8px;
  align-items:start;
}
.lessonBlockTop input,
.lessonBlockTop select,
.lessonBlockMain textarea,
.lessonPlanMetaGrid input,
.lessonPlanMetaGrid select,
.lessonPlanMetaGrid textarea,
.lessonLibraryFilters input,
.lessonLibraryFilters select{
  border-radius:8px;
}
.lessonDurationInput{
  margin:0;
}
.lessonDurationInput input{
  min-height:46px;
  padding-left:10px;
  padding-right:10px;
}
.lessonBlockActions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.lessonBlockActions button{
  margin:0;
}
.lessonLibraryFilters{
  display:grid;
  gap:10px;
  margin-bottom:12px;
}
.lessonLibraryFilters label{
  margin:0;
}
.lessonRelevantOnly{
  width:100%;
  justify-content:flex-start;
  margin:0;
}
.lessonLibraryItem{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:10px;
  align-items:start;
  border:1px solid #d9deea;
  border-radius:8px;
  background:#fff;
  padding:11px;
}
.lessonLibraryItem span,
.lessonLibraryItem strong,
.lessonLibraryItem em,
.lessonLibraryItem p,
.lessonLibraryItem small{
  display:block;
}
.lessonLibraryItem span{
  color:#003d8f;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
}
.lessonLibraryItem strong{
  color:#072f63;
  font-size:15px;
  line-height:1.25;
  margin-top:2px;
}
.lessonLibraryItem em{
  color:#5d6d82;
  font-size:12px;
  font-style:normal;
  margin-top:3px;
}
.lessonLibraryItem p,
.lessonLibraryItem small{
  color:#5d6d82;
  line-height:1.35;
  margin:6px 0 0;
  font-size:12px;
}
.lessonLibraryItem button{
  margin:0;
}
@media(max-width:1320px){
  .lessonPlannerGrid{
    grid-template-columns:260px minmax(0, 1fr);
  }
  .lessonLibraryPanel{
    grid-column:1 / -1;
    position:static;
    max-height:none;
  }
  .lessonLibraryList{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}
@media(max-width:900px){
  .lessonPlannerGrid,
  .lessonPlannerFilterGrid,
  .lessonPlanMetaGrid,
  .lessonBlockRow,
  .lessonBlockTop,
  .lessonLibraryList{
    grid-template-columns:1fr;
  }
  .lessonClassPanel,
  .lessonLibraryPanel{
    position:static;
    max-height:none;
  }
  .lessonPlanActions{
    justify-content:flex-start;
  }
  .lessonTimelineHeader{
    align-items:flex-start;
    flex-direction:column;
  }
  .lessonBlockTime{
    text-align:left;
  }
}


/* Stage 21EV Summer Challenge ticket tracker */
.summerChallengeAdminPage .summaryGrid{
  margin-bottom:20px;
}
.summaryCard small{
  display:block;
  color:#5d6d82;
  font-size:12px;
  font-weight:800;
  margin-top:5px;
}
.summerChallengeAdminFilters{
  grid-template-columns:220px minmax(280px,1fr) 190px minmax(260px,1fr);
}
.summerChallengeAdminGrid{
  display:grid;
  grid-template-columns:minmax(360px,.85fr) minmax(0,1.15fr);
  gap:20px;
}
.summerStudentSearchBox{
  display:grid;
  gap:10px;
}
.summerStudentSearchRow{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
}
.summerStudentSearchRow button,
.summerChallengeAddGrid + button{
  margin:0;
}
.summerStudentSearchResults{
  display:grid;
  gap:8px;
  max-height:280px;
  overflow:auto;
}
.summerStudentSearchResult{
  border:1px solid #d7e2f1;
  border-radius:8px;
  background:#fff;
  color:#0f172a;
  display:block;
  margin:0;
  padding:10px 12px;
  text-align:left;
  width:100%;
}
.summerStudentSearchResult:hover{
  border-color:#063b8f;
  box-shadow:0 8px 18px rgba(0,43,127,.1);
}
.summerStudentSearchResult strong,
.summerStudentSearchResult span,
.summerStudentSearchResult small,
.summerChallengeAddGrid label span,
.summerEntriesTable td span,
.summerEntriesTable td small{
  display:block;
}
.summerStudentSearchResult strong{
  color:#063b8f;
}
.summerStudentSearchResult span,
.summerStudentSearchResult small{
  color:#5d6d82;
  font-size:12px;
  line-height:1.35;
  margin-top:3px;
}
.summerChallengeAddGrid{
  display:grid;
  grid-template-columns:1fr 150px 110px 140px;
  gap:10px;
  margin:14px 0;
}
.summerChallengeAddGrid label{
  margin:0;
}
.summerChallengeAddGrid label span{
  color:#344054;
  font-size:12px;
  font-weight:900;
  margin-bottom:5px;
}
.summerAddWide{
  grid-column:1 / -1;
}
.summerLeaderboardTable th,
.summerLeaderboardTable td,
.summerEntriesTable th,
.summerEntriesTable td{
  vertical-align:top;
}
.summerLeaderboardTable a,
.summerEntriesTable a{
  color:#063b8f;
  text-decoration:none;
}
.summerLeaderboardTable a:hover,
.summerEntriesTable a:hover{
  text-decoration:underline;
}
.summerEntriesTable td:nth-child(6){
  white-space:normal;
  min-width:260px;
  max-width:420px;
}
.summerEntriesTable td span,
.summerEntriesTable td small{
  color:#5d6d82;
  font-size:12px;
  line-height:1.35;
  margin-top:3px;
  overflow-wrap:anywhere;
}
.summerEntryActions{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  justify-content:flex-end;
  min-width:210px;
}
.summerEntryActions button{
  margin:0;
}
@media(max-width:1180px){
  .summerChallengeAdminFilters{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .summerChallengeAdminGrid{
    grid-template-columns:1fr;
  }
}
@media(max-width:700px){
  .summerChallengeAdminFilters,
  .summerChallengeAddGrid,
  .summerStudentSearchRow,
  .summerClaimForm,
  .summerTicketSheet,
  .summerTicketLedgerRow{
    grid-template-columns:1fr;
  }
  .summerTicketNumbers{
    justify-content:flex-start;
  }
  .summerEntryActions{
    justify-content:flex-start;
    min-width:0;
  }
}

@media print{
  .lessonPlannerControls,
  .lessonClassPanel,
  .lessonLibraryPanel,
  .lessonPlanActions,
  .heroActions{
    display:none!important;
  }
  .lessonPlannerGrid{
    grid-template-columns:1fr!important;
  }
  .lessonPlannerPanel,
  .lessonPlannerWorkspace,
  .card{
    box-shadow:none!important;
  }
}
