/* IBD Dashboard — Cards, Tables, Badges, Modals */
/* ─────────────────────────────────────────────
   12. TYPOGRAPHY HIERARCHY
   ───────────────────────────────────────────── */
h1, .page-header h1, .ph-wrap h1 { font-size: 15px; font-weight: 700; line-height: 1.2; color: var(--text-primary); }
h2                                { font-size: 14px; font-weight: 700; line-height: 1.2; }
h3, .sb h3, .modal h3, .rm-modal h3,
.sched-title, .stu-title, .dt     { font-size: 13px; font-weight: 500; line-height: 1.2; }

.sl, .nav-section, .ht, .cc-meta, .ds,
.sched-sub, .profile-role, .ml-scard-lbl { font-size: 11px; font-weight: 400; }

.badge, .cm, .cp, .cal-tag, .ml-stu-id,
.si, .noc, .adc, .stg, .wtg              { font-size: 11px; font-weight: 400; }

table, td, th, select, input, textarea,
.nav-item, .nav-sub-item, .nav-parent    { font-size: 12px; }
th  { font-size: 11px; font-weight: 500; }
td  { font-size: 12px; font-weight: 400; line-height: 1.5; }
.nav-item, .nav-parent, .nav-sub-item   { font-size: 11px; }

.sv { font-size: 24px; font-weight: 700; line-height: 1.2; }


/* ─────────────────────────────────────────────
   13. STAT CARDS
   ───────────────────────────────────────────── */
.sg {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px; margin-bottom: 14px;
}
.stat {
  background: var(--bg-card);
  border: 0.5px solid var(--border-card);
  border-radius: 16px;
  padding: 10px 14px;
  display: flex; align-items: center; gap: 10px;
  box-shadow: var(--shadow-card);
  transition: transform .18s ease, box-shadow .18s ease;
  cursor: default;
}
.stat:hover    { transform: scale(1.02); box-shadow: 0 6px 20px rgba(0,0,0,0.10); }
.stat-icon     { width: 32px; height: 32px; border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; font-size: 15px; flex-shrink: 0; background: #f4f6f9; color: #555; }

.sl { font-size: 11px; color: var(--text-secondary); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 2px; }
.sv { color: var(--text-primary); }

/* Coloured stat variants — top border accent, fully rounded (no asymmetric corners) */
.stat-total  { border-top: 3px solid var(--info);    border-radius: 16px; background: var(--bg-card); }
.stat-total  .sl, .stat-total  .sv { color: var(--info); }
.stat-drop   { border-top: 3px solid var(--danger);  border-radius: 16px; background: var(--bg-card); }
.stat-drop   .sl, .stat-drop   .sv { color: var(--danger-dark); }
.stat-final  { border-top: 3px solid #D85A30;        border-radius: 16px; background: var(--bg-card); }
.stat-final  .sl, .stat-final  .sv { color: #712b13; }
.stat-warn   { border-top: 3px solid var(--warning); border-radius: 16px; background: var(--bg-card); }
.stat-warn   .sl, .stat-warn   .sv { color: var(--warning-dark); }

/* Colour-utility helpers */
.red { color: var(--danger-dark); }
.org { color: #993c1d; }
.amb { color: var(--warning-dark); }
.grn { color: var(--success); }
.blu { color: var(--info); }


/* ─────────────────────────────────────────────
   14. CLASS CARDS
   ───────────────────────────────────────────── */
.cg {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 8px; margin-bottom: 12px;
}
.cc {
  background: var(--bg-card);
  border: 0.5px solid var(--border-card);
  border-radius: var(--radius-md);
  padding: 12px 14px; cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease;
  will-change: transform, box-shadow;
  border-left: 3px solid var(--border-card);
  box-shadow: var(--shadow-card);
}
.cc:hover            { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,0.12); }
.cc.sel              { background: var(--accent-light); border: 2px solid var(--accent); box-shadow: 0 0 0 1px var(--accent), 0 4px 16px rgba(24,95,165,0.15); transform: translateY(-2px); }
.cc.cl-danger        { border-top: 3px solid var(--danger);  border-radius: var(--radius-md); }
.cc.cl-warn          { border-top: 3px solid var(--warning); border-radius: var(--radius-md); }
.cc.cl-ok            { border-top: 3px solid var(--success); border-radius: var(--radius-md); }

.ct      { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.cn      { font-size: 12px; font-weight: 700; color: var(--text-primary); }
.cm      { font-size: 10px; padding: 2px 7px; border-radius: 99px; font-weight: 700; }
.cm.am   { background: var(--accent-light); color: #0c447c; }
.cm.pm   { background: #eaf3de; color: #27500a; }

.cc-meta { font-size: 10px; color: var(--text-muted); margin-bottom: 8px; }

.cpills  { display: flex; gap: 3px; flex-wrap: wrap; margin-bottom: 8px; }
.cp      { font-size: 10px; padding: 2px 7px; border-radius: 99px; font-weight: 500; }
.cp.ok   { background: #f0f0f0; color: #555; }
.cp.wd   { background: #fde8e8; color: var(--danger-dark); }
.cp.ww   { background: #fef3e2; color: var(--warning-dark); }
.cp.na   { background: #f5f5f5; color: #bbb; font-style: italic; }

.cc-foot     { display: flex; justify-content: space-between; align-items: center; border-top: 0.5px solid #f5f5f5; padding-top: 7px; margin-top: 4px; }
.cc-stu-info { font-size: 10px; color: var(--text-muted); display: flex; align-items: center; gap: 4px; }
.cc-risk-dot { width: 5px; height: 5px; border-radius: 50%; display: inline-block; flex-shrink: 0; background: #ddd; }
.cc-risk-dot.danger { background: var(--danger); }
.cc-risk-dot.warn   { background: var(--warning); }
.cc-risk-dot.ok     { background: var(--success); }

.noc  { font-size: 10px; color: #bbb; font-style: italic; margin: 4px 0; }
.adc  { font-size: 10px; color: var(--accent); cursor: pointer; font-weight: 500; }


/* ─────────────────────────────────────────────
   15. DETAIL PANEL
   ───────────────────────────────────────────── */
.det {
  background: var(--bg-card);
  border: 0.5px solid var(--border-card);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}
.dh {
  padding: 10px 14px;
  background: #fafbfc;
  border-bottom: 0.5px solid var(--border-card);
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 6px;
}
.dt  { font-size: 13px; font-weight: 700; color: var(--text-primary); }
.ds  { font-size: 11px; color: var(--text-muted); }

/* Inline alert row */
.ia  { padding: 8px 14px; border-bottom: 0.5px solid var(--border-card); background: var(--accent-light); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.il  { font-size: 11px; color: var(--accent); font-weight: 500; }
.ib  { padding: 4px 12px; border-radius: 6px; border: 1px solid var(--accent); font-size: 11px; cursor: pointer; background: var(--accent); color: #fff; }

/* Legend bar */
.lb  { display: flex; gap: 10px; padding: 6px 14px; border-bottom: 0.5px solid var(--border-card); background: #fafbfc; flex-wrap: wrap; }
.lg  { font-size: 10px; color: #666; display: flex; align-items: center; gap: 3px; }
.dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; flex-shrink: 0; }

.ns  { padding: 2rem; text-align: center; font-size: 13px; color: #bbb; }

/* Tables */
table           { width: 100%; border-collapse: collapse; font-size: 11px; }
th              { padding: 7px 10px; text-align: left; color: var(--text-secondary); font-weight: 500; border-bottom: 0.5px solid var(--border-card); background: #fafbfc; white-space: nowrap; }
th.r            { text-align: right; }
td              { padding: 7px 10px; border-bottom: 0.5px solid #f5f5f5; color: var(--text-primary); }
td.r            { text-align: right; }
td.si           { font-size: 10px; color: #bbb; }
td.ph           { font-size: 10px; color: var(--text-muted); }
tr:last-child td{ border-bottom: none; }
tr:hover td     { background: #f9fafb; }
th.hm, td.hm   { /* hidden on mobile — see media query */ }

/* Badges */
.badge          { display: inline-block; font-size: 10px; padding: 2px 8px; border-radius: 99px; font-weight: 500; white-space: nowrap; }
.br             { background: #fde8e8; color: var(--danger-dark); }
.bo             { background: #faece7; color: #712b13; }
.ba             { background: #fef3e2; color: var(--warning-dark); }
.bg             { background: #eaf3de; color: var(--success); }
.bn             { background: #f5f5f5; color: #888; font-style: italic; }
.bb             { background: var(--accent-light); color: var(--accent); }

/* Inline tag helpers */
.stg  { font-size: 10px; color: var(--success); background: #eaf3de; padding: 2px 7px; border-radius: 99px; }
.wtg  { font-size: 10px; color: var(--warning-dark); background: #fef3e2; padding: 2px 7px; border-radius: 99px; }
.ht   { font-size: 10px; color: #bbb; padding: 8px 14px; border-top: 0.5px solid var(--border-card); text-align: center; }


/* ─────────────────────────────────────────────
   16. SETTINGS / EDIT SUB-PANEL
   ───────────────────────────────────────────── */
.sb      { padding: 16px; }
.sb h3   { font-size: 13px; font-weight: 500; margin-bottom: 6px; }
.sb p    { font-size: 11px; color: var(--text-muted); margin-bottom: 12px; }

.ci           { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.ci label     { font-size: 11px; color: #888; width: 65px; flex-shrink: 0; }
.ci input     { padding: 6px 10px; border: 0.5px solid #e0e0e0; border-radius: 6px; font-size: 12px; width: 90px; text-transform: uppercase; outline: none; }

.savebtn      { padding: 7px 20px; border-radius: 6px; border: none; background: var(--text-primary); color: #fff; font-size: 12px; cursor: pointer; }


/* ─────────────────────────────────────────────
   17. TOPBAR / TOOLBAR
   ───────────────────────────────────────────── */
.topbar       { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; flex-wrap: wrap; gap: 8px; }
.addclass-btn { padding: 6px 14px; border-radius: 99px; border: none; background: var(--text-primary); font-size: 12px; cursor: pointer; color: #fff; font-weight: 500; transition: background .15s; }
.addclass-btn:hover { background: #2d2d4e; }


/* ─────────────────────────────────────────────
   18. STUDENT LIST
   ───────────────────────────────────────────── */
.filters      { display: flex; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; align-items: flex-end; }
.fld          { display: flex; flex-direction: column; gap: 5px; }
.fld label    { font-size: 11px; font-weight: 500; color: #888; }
.fld select   { padding: 7px 12px; border: 0.5px solid #e0e0e0; border-radius: 7px; font-size: 12px; outline: none; min-width: 140px; background: var(--bg-card); color: var(--text-primary); }

.class-table  { background: var(--bg-card); border: 0.5px solid var(--border-card); border-radius: 10px; overflow: hidden; margin-bottom: 16px; box-shadow: var(--shadow-card); }
.link-btn     { font-size: 11px; color: var(--accent); cursor: pointer; text-decoration: underline; }

.stu-panel    { background: var(--bg-card); border: 0.5px solid var(--border-card); border-radius: 10px; overflow: hidden; box-shadow: var(--shadow-card); }
.stu-head     { padding: 10px 14px; background: #fafbfc; border-bottom: 0.5px solid var(--border-card); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; }
.stu-title    { font-size: 13px; font-weight: 600; color: var(--text-primary); }
.stu-actions  { display: flex; gap: 8px; }

.btn-sis      { padding: 5px 12px; border-radius: 6px; border: 0.5px solid var(--accent); font-size: 11px; cursor: pointer; background: transparent; color: var(--accent); }
.btn-add-stu  { padding: 5px 12px; border-radius: 6px; border: 0.5px solid var(--success); font-size: 11px; cursor: pointer; background: transparent; color: var(--success); }
.btn-back     { padding: 5px 12px; border-radius: 6px; border: 0.5px solid #ddd; font-size: 11px; cursor: pointer; background: transparent; color: #888; }

.add-form     { padding: 14px; border-bottom: 0.5px solid var(--border-card); background: #f9fff9; }
.add-form h4  { font-size: 12px; font-weight: 500; margin-bottom: 10px; }
.form-row     { display: flex; gap: 8px; flex-wrap: wrap; }
.form-row input { padding: 7px 10px; border: 0.5px solid #e0e0e0; border-radius: 6px; font-size: 12px; outline: none; flex: 1; min-width: 120px; }


/* ─────────────────────────────────────────────
   19. MODALS
   ───────────────────────────────────────────── */
.modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.3); z-index: 999; display: none; align-items: center; justify-content: center; }
.modal-overlay.open  { display: flex; }
.modal-overlay.show  { display: flex; } /* confirm modal uses .show */
.modal-overlay.open .modal  { animation: modalIn .2s cubic-bezier(.34,1.56,.64,1); }
.modal-overlay.show .modal  { animation: modalIn .2s cubic-bezier(.34,1.56,.64,1); }
.modal-overlay.closing .modal { animation: modalOut .15s ease forwards; }

.modal        { background: var(--bg-card); border-radius: var(--radius-xl); padding: 28px; width: 100%; max-width: 420px; box-shadow: var(--shadow-lg); }
.modal h3     { font-size: 14px; font-weight: 700; color: var(--text-primary); margin-bottom: 6px; }
.modal p      { font-size: 11px; color: var(--text-muted); margin-bottom: 16px; }

.modal-field              { margin-bottom: 12px; }
.modal-field label        { display: block; font-size: 11px; font-weight: 500; color: var(--text-secondary); margin-bottom: 5px; }
.modal-field input,
.modal-field select       { width: 100%; padding: 8px 12px; border: 0.5px solid #e0e0e0; border-radius: 7px; font-size: 12px; outline: none; background: var(--bg-card); color: var(--text-primary); }
.modal-field input:focus  { border-color: var(--accent); }

.modal-row    { display: flex; gap: 8px; }
.modal-row .modal-field { flex: 1; }
.modal-btns   { display: flex; gap: 8px; margin-top: 16px; }
.modal-save   { flex: 1; padding: 9px; border-radius: 7px; border: none; background: var(--text-primary); color: #fff; font-size: 12px; cursor: pointer; font-weight: 500; transition: background .15s; }
.modal-save:hover { background: #2d2d4e; }
.modal-cancel { padding: 9px 16px; border-radius: 7px; border: 0.5px solid #ddd; background: transparent; color: #555; font-size: 12px; cursor: pointer; }
.modal-cancel:hover { background: #f9fafb; color: var(--text-primary); }

.upload-zone  { border: 1.5px dashed #e0e0e0; border-radius: var(--radius-sm); padding: 14px; text-align: center; cursor: pointer; margin-bottom: 4px; }
.upload-zone:hover { border-color: var(--accent); background: var(--accent-light); }
.upload-zone p { font-size: 12px; color: var(--text-muted); }
.upload-zone.has-file   { border-color: var(--success); background: #f0faf5; }
.upload-zone.has-file p { color: var(--success); }


/* ─────────────────────────────────────────────
   20. ROOM TRACKER
   ───────────────────────────────────────────── */
.rt-topbar    { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 14px; flex-wrap: wrap; gap: 8px; }
.rt-addbtn    { padding: 6px 14px; border-radius: 99px; border: none; background: var(--text-primary); color: #fff; font-size: 12px; cursor: pointer; font-weight: 500; transition: background .15s; }
.rt-addbtn:hover { background: #2d2d4e; }

.rt-legend    { display: flex; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; align-items: center; }
.rt-lg        { display: flex; align-items: center; gap: 5px; font-size: 11px; color: #888; }
.rt-ld        { width: 12px; height: 12px; border-radius: 3px; flex-shrink: 0; }

.rt-filters   { display: flex; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.rt-filters select { padding: 6px 10px; border: 0.5px solid #e0e0e0; border-radius: 7px; font-size: 12px; outline: none; background: var(--bg-card); color: var(--text-primary); }

/* ── Filter Chip Dropdown (Option A style) ── */
.ibd-sel { position: relative; display: inline-block; }

/* Idle chip — shows label + chevron */
.ibd-sel-trigger {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 11px; border-radius: var(--radius-pill);
  border: 1.5px solid var(--border-card); background: var(--bg-card);
  font-size: 12px; font-weight: 500; color: var(--text-secondary);
  cursor: pointer; white-space: nowrap; transition: border-color .15s, background .15s;
  font-family: inherit;
}
.ibd-sel-trigger:hover { border-color: #aaa; color: var(--text-primary); }
.ibd-sel-trigger.open  { border-color: #aaa; color: var(--text-primary); }

/* Active chip — has a value, shows dark pill + × */
.ibd-sel-trigger.active {
  background: #1a1a2e; border-color: #1a1a2e; color: #fff; font-weight: 600;
}
.ibd-sel-trigger.active:hover { background: #2d2d4e; border-color: #2d2d4e; }

.ibd-sel-value   { max-width: 140px; overflow: hidden; text-overflow: ellipsis; }
.ibd-sel-chevron { font-size: 12px; flex-shrink: 0; transition: transform .2s; }
.ibd-sel-trigger.open .ibd-sel-chevron { transform: rotate(180deg); }

/* Clear × button inside active chip */
.ibd-sel-clear {
  font-size: 14px; line-height: 1; flex-shrink: 0;
  opacity: .7; margin-left: 1px; font-weight: 400;
  cursor: pointer; padding: 0 1px;
}
.ibd-sel-clear:hover { opacity: 1; }

/* Floating panel */
.ibd-sel-panel {
  position: absolute; top: calc(100% + 6px); left: 0;
  min-width: 180px; max-width: 280px;
  background: var(--bg-card); border: 0.5px solid var(--border-card);
  border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.12);
  display: none; z-index: 600; overflow: hidden;
}
.ibd-sel-panel.open { display: block; animation: menuIn .15s ease; }
.ibd-sel-search-wrap { padding: 8px 8px 4px; }
.ibd-sel-search {
  width: 100%; padding: 6px 10px; border: 0.5px solid var(--border-card);
  border-radius: 7px; font-size: 12px; outline: none;
  background: var(--bg-page); color: var(--text-primary); font-family: inherit;
}
.ibd-sel-search:focus { border-color: var(--accent); }
.ibd-sel-list  { max-height: 220px; overflow-y: auto; padding: 4px; }
.ibd-sel-item  {
  padding: 7px 10px; border-radius: 7px; font-size: 12px;
  cursor: pointer; color: var(--text-primary); transition: background .1s;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ibd-sel-item:hover    { background: var(--bg-page); }
.ibd-sel-item.selected { background: var(--accent-light); color: var(--accent); font-weight: 600; }

/* dark mode */
[data-theme="dark"] .ibd-sel-trigger        { background: var(--surface); border-color: var(--border); color: var(--text2); }
[data-theme="dark"] .ibd-sel-trigger:hover  { border-color: var(--border2); color: var(--text); }
[data-theme="dark"] .ibd-sel-trigger.active { background: var(--surface2); border-color: var(--border2); color: var(--text); }
[data-theme="dark"] .ibd-sel-panel          { background: var(--surface); border-color: var(--border); box-shadow: 0 8px 24px rgba(0,0,0,.4); }
[data-theme="dark"] .ibd-sel-search         { background: var(--surface2); border-color: var(--border2); color: var(--text); }
[data-theme="dark"] .ibd-sel-item           { color: var(--text); }
[data-theme="dark"] .ibd-sel-item:hover     { background: var(--surface2); }
[data-theme="dark"] .ibd-sel-item.selected  { background: rgba(24,95,165,.25); color: #60a5fa; }

.rt-conflict  { background: #fde8e8; border: 0.5px solid #f5b5b5; border-radius: 8px; padding: 10px 14px; margin-bottom: 12px; font-size: 12px; color: var(--danger-dark); }

.sched-wrap   { background: var(--bg-card); border: 0.5px solid var(--border-card); border-radius: var(--radius-md); overflow: hidden; margin-bottom: 12px; box-shadow: var(--shadow-card); }
.sched-head   { padding: 10px 14px; background: #fafbfc; border-bottom: 0.5px solid var(--border-card); display: flex; justify-content: space-between; align-items: center; }
.sched-title  { font-size: 13px; font-weight: 600; color: var(--text-primary); }
.sched-sub    { font-size: 11px; color: var(--text-muted); }

.sched-grid   { display: grid; grid-template-columns: 90px repeat(5,1fr); gap: 1px; background: var(--border-card); }
.gcell        { background: var(--bg-card); padding: 6px 8px; font-size: 11px; min-height: 52px; }
.gcell.ghead  { background: #fafbfc; color: var(--text-muted); font-weight: 500; text-align: center; min-height: 32px; display: flex; align-items: center; justify-content: center; }
.gcell.glabel { background: #fafbfc; display: flex; flex-direction: column; justify-content: center; padding: 6px 10px; }
.room-lname   { font-weight: 600; font-size: 12px; color: var(--text-primary); }
.room-lcap    { font-size: 10px; color: #bbb; }

.cell-occ     { background: var(--accent-light); border-radius: 4px; padding: 5px 7px; min-height: 38px; display: flex; flex-direction: column; justify-content: center; }
.cell-occ.pm  { background: #eaf3de; }
.cell-occ.cf  { background: #fde8e8; }
.cell-online  { background: #f3f0fe; border-radius: 4px; padding: 5px 7px; min-height: 38px; display: flex; flex-direction: column; justify-content: center; }
.cell-avail   { border-radius: 4px; min-height: 38px; display: flex; align-items: center; justify-content: center; border: 0.5px dashed #e0e0e0; background: #fafafa; }
.cell-cls     { font-size: 11px; font-weight: 600; color: #0c447c; }
.cell-cls.pm  { color: #27500a; }
.cell-cls.cf  { color: var(--danger-dark); }
.cell-lec     { font-size: 10px; color: var(--text-muted); }
.cell-oln     { font-size: 11px; font-weight: 600; color: #534AB7; }
.cell-oln-tag { font-size: 10px; color: #7F77DD; }
.cell-avail-txt { font-size: 10px; color: #ccc; }

.occ-bar      { height: 5px; border-radius: 99px; background: #f3f4f6; width: 60px; overflow: hidden; display: inline-block; vertical-align: middle; }
.occ-fill     { height: 100%; border-radius: 99px; }

.rt-tbl       { background: var(--bg-card); border: 0.5px solid var(--border-card); border-radius: var(--radius-md); overflow: hidden; margin-bottom: 14px; box-shadow: var(--shadow-card); }

/* Room modal */
.rm-modal-bg       { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.3); z-index: 999; display: none; align-items: center; justify-content: center; }
.rm-modal-bg.open  { display: flex; }
.rm-modal-bg.open .rm-modal { animation: modalIn .2s cubic-bezier(.34,1.56,.64,1); }
.rm-modal          { background: var(--bg-card); border-radius: var(--radius-xl); padding: 28px; width: 100%; max-width: 500px; max-height: 90vh; overflow-y: auto; box-shadow: var(--shadow-lg); }
.rm-modal h3       { font-size: 14px; font-weight: 700; color: var(--text-primary); margin-bottom: 6px; }
.rm-modal p        { font-size: 11px; color: var(--text-muted); margin-bottom: 14px; }

.mf           { margin-bottom: 12px; }
.mf label     { display: block; font-size: 11px; font-weight: 500; color: var(--text-secondary); margin-bottom: 5px; }
.mf input,
.mf select    { width: 100%; padding: 8px 12px; border: 0.5px solid #e0e0e0; border-radius: 7px; font-size: 12px; outline: none; background: var(--bg-card); color: var(--text-primary); }
.mrow         { display: flex; gap: 8px; }
.mrow .mf     { flex: 1; }
.mbtns        { display: flex; gap: 8px; margin-top: 16px; }
.msave        { flex: 1; padding: 9px; border-radius: 7px; border: none; background: var(--text-primary); color: #fff; font-size: 12px; cursor: pointer; font-weight: 500; transition: background .15s; }
.msave:hover  { background: #2d2d4e; }
.mcancel      { padding: 9px 16px; border-radius: 7px; border: 0.5px solid #ddd; background: transparent; color: #555; font-size: 12px; cursor: pointer; }

.day-schedule-grid    { display: grid; grid-template-columns: repeat(5,1fr); gap: 8px; margin-top: 6px; }
.day-sch-cell         { border: 0.5px solid var(--border-card); border-radius: var(--radius-sm); padding: 8px; background: #f9fafb; }
.day-sch-cell .dlabel { font-size: 11px; font-weight: 600; color: var(--text-primary); margin-bottom: 6px; text-align: center; }
.day-sch-cell select,
.day-sch-cell input   { width: 100%; padding: 5px 8px; border: 0.5px solid #e0e0e0; border-radius: 5px; font-size: 11px; outline: none; margin-bottom: 4px; background: var(--bg-card); }

/* Summary bar */
.spb          { background: #fafbfc; border: 0.5px solid var(--border-card); border-radius: 6px; padding: 10px 14px; display: flex; align-items: center; gap: 14px; margin-bottom: 12px; }
.spb-item     { text-align: center; }
.spb-label    { font-size: 10px; color: var(--text-muted); margin-bottom: 2px; }
.spb-val      { font-size: 15px; font-weight: 700; color: var(--text-primary); }
.spb-div      { font-size: 18px; color: #ddd; }

/* Info/warning banners */
.sem-warn-banner { background: #eff6ff; border: 0.5px solid #bfdbfe; border-radius: 8px; padding: 10px 14px; margin-bottom: 12px; font-size: 12px; color: var(--accent); display: flex; align-items: flex-start; gap: 8px; }
.rt-warn-banner  { background: #fefce8; border: 0.5px solid #fde047; border-radius: 8px; padding: 10px 14px; margin-bottom: 12px; font-size: 12px; color: #854d0e; }