/*
 RC26 — ONE PLATFORM / ONE VISUAL SYSTEM
 Purpose: remove page-to-page layout and typography drift without changing forms,
 URLs, datasets or security logic. Loaded after all legacy page styles.
*/
:root{
  --ux26-bg:#f3f7f5;
  --ux26-paper:#fff;
  --ux26-ink:#163c31;
  --ux26-body:#36564b;
  --ux26-muted:#667f73;
  --ux26-green:#087858;
  --ux26-deep:#064d3b;
  --ux26-soft:#edf8f2;
  --ux26-border:#dbe8e1;
  --ux26-border-light:#e9f0ec;
  --ux26-shadow:0 6px 18px rgba(19,58,39,.035);
  --ux26-radius:16px;
  --ux26-gap:14px;
  --ux26-width:1512px;
  --ux26-font:'Cairo',Tahoma,'Segoe UI',sans-serif;
}
html{font-synthesis:none}
.management-shell{background:var(--ux26-bg)!important;color:var(--ux26-body);font-family:var(--ux26-font)}
.management-shell :is(button,input,select,textarea){font-family:var(--ux26-font)!important}
/* Consistent shell. Same sidebar and readable text on every administration page. */
.management-topbar,.management-topbar .header-main{min-height:70px!important}
.management-topbar .brand-copy strong{font-size:15px!important;font-weight:600!important;line-height:1.55!important}
.management-topbar .brand-copy small{font-size:12px!important;font-weight:400!important;line-height:1.5!important}
.management-topbar .quick-search-copy strong{font-size:13px!important;font-weight:500!important}
.management-topbar .quick-search-copy small{font-size:11.5px!important;font-weight:400!important}
.management-topbar :is(.header-icon,.brand-mark,.account-avatar){border-radius:11px!important}
.management-topbar .header-icon .bi{font-size:18px!important}
.management-sidebar{background:#064b39!important}
.management-sidebar-head{min-height:79px!important;padding:17px 16px!important}
.management-sidebar-head strong{color:#fff!important;font-size:15px!important;font-weight:600!important}
.management-sidebar-head small{color:#b9d7cb!important;font-size:11px!important;font-weight:400!important}
.management-nav-label{color:#a4ccbb!important;font-size:11px!important;font-weight:500!important}
.management-nav-link{min-height:41px!important;display:flex!important;align-items:center!important;gap:11px!important;padding:9px 12px!important;border-radius:10px!important;line-height:1.6!important;font-size:13.5px!important;font-weight:500!important}
.management-nav-link .bi{font-size:16.5px!important;font-weight:400!important;line-height:1!important;flex:0 0 19px;text-align:center}
.management-nav-link.is-active{background:#def4e9!important;color:#064d3b!important}
.management-nav-link:not(.is-active){color:#eef8f2!important}
.management-nav-link:not(.is-active):hover{background:rgba(255,255,255,.10)!important}
.management-sidebar-foot strong{font-size:12px!important;font-weight:500!important}
.management-sidebar-foot small{font-size:11px!important}
/* All pages: one content width, one edge inset, same vertical rhythm. */
.management-shell .management-content{
  min-width:0!important;width:100%!important;
  padding:18px clamp(14px,1.7vw,28px) 40px!important;
  font:400 14.25px/1.85 var(--ux26-font)!important;
  color:var(--ux26-body)!important;
}
.management-shell .management-content > :is(.ux26-page,.lead24,.ops20,.fm7204,.fu7205,.vr710,.sc79,.sd791,.sc79,.sio,.sec,.sl,.supc,.supd,.supi,.asc,.asm,.asi,.usc,.cal711,.imp7206,.sys727,.oi,.ei,.perf,.pr,.ae,.sg12,.gd12,.rp19,.fm7204,.vr710){
  width:100%!important;max-width:var(--ux26-width)!important;
  margin:0 auto 36px!important;padding:0!important;
  box-sizing:border-box!important;
}
.management-shell .management-content > .ux26-page:is(.ops20,.lead24,.cal711,.sio,.supi,.asi,.im7206){gap:var(--ux26-gap)!important}
.management-shell .management-content :is(h1,h2,h3,h4,h5,h6){font-family:var(--ux26-font)!important;font-weight:600!important;letter-spacing:0!important;color:var(--ux26-ink)!important}
.management-shell .management-content :is(h1){font-size:clamp(22px,1.65vw,26px)!important;line-height:1.55!important}
.management-shell .management-content :is(h2){font-size:18px!important;line-height:1.65!important}
.management-shell .management-content :is(h3){font-size:15.5px!important;line-height:1.65!important}
.management-shell .management-content :is(h4,h5){font-size:14px!important;line-height:1.65!important}
.management-shell .management-content :is(p){line-height:1.85}
.management-shell .management-content :is(b,strong){font-weight:600!important}
.management-shell .management-content :is(small){font-size:12px;line-height:1.75}
.management-shell .management-content :is(.muted,.text-muted){color:var(--ux26-muted)!important}
/* One page title band: identical geometry and weight regardless of app. */
.management-shell .management-content :is(.ux26-hero,.lead24-intro,.ops20-hero,.fm-head,.fu-hero,.vr-hero,.sc79-hero,.sd791-hero,.sio-hero,.sec-hero,.sl-hero,.supc-hero,.supi-hero,.supd-head,.asc-hero,.asm-hero,.asi-hero,.cal-hero,.im-hero,.sys-hero,.perf-hero,.pr-hero,.oi-preop-hero,.rp19-hero,.usc .hero){
  min-height:134px!important;
  padding:23px 25px!important;
  background:linear-gradient(108deg,#edf8f2 0%,#f8fcfa 57%,#fff 100%)!important;
  background-image:linear-gradient(108deg,#edf8f2 0%,#f8fcfa 57%,#fff 100%)!important;
  border:1px solid #d9e8df!important;border-radius:var(--ux26-radius)!important;
  box-shadow:var(--ux26-shadow)!important;
  gap:20px!important;
}
.management-shell .management-content :is(.lead24-intro,.ops20-hero,.fm-head,.fu-hero,.vr-hero,.sc79-hero,.sio-hero,.supc-hero,.supi-hero,.asc-hero,.asi-hero,.cal-hero,.im-hero,.sys-hero){align-items:center!important}
.management-shell .management-content :is(.ux26-hero,.lead24-intro,.ops20-hero,.fm-head,.fu-hero,.vr-hero,.sc79-hero,.sio-hero,.sec-hero,.supc-hero,.supi-hero,.asc-hero,.asi-hero,.cal-hero,.im-hero,.sys-hero) :is(h1,[class$='-title']){
 font-weight:600!important;font-size:clamp(22px,1.7vw,26px)!important;line-height:1.55!important;
}
.management-shell .management-content :is(.ux26-hero,.lead24-intro,.ops20-hero,.fm-head,.fu-hero,.vr-hero,.sc79-hero,.sio-hero,.supc-hero,.supi-hero,.asc-hero,.asi-hero,.cal-hero,.im-hero,.sys-hero) :is(p,[class$='-sub'],[class$='-subtitle']){
 font-size:13.25px!important;font-weight:400!important;color:#5f796d!important;line-height:1.85!important;
}
.management-shell .management-content :is(.ux26-hero,.lead24-intro,.ops20-hero,.fm-head,.fu-hero,.vr-hero,.sc79-hero,.sio-hero,.supc-hero,.supi-hero,.asc-hero,.asi-hero,.cal-hero,.im-hero,.sys-hero) :is([class$='-kicker'],[class$='-eyebrow']){
 font-size:12.5px!important;font-weight:500!important;letter-spacing:0!important;
}
/* Quiet cards and one systematic visual rhythm. */
.management-shell .management-content :is(.ux26-surface,.lead24-card,.ops20-card,.fm-card,.fu-card,.vr-card,.sc79-card,.sd791-card,.sio-card,.sec-card,.supc-card,.supd-card,.supi-card,.asc-card,.asm-card,.asi-card,.cal-card,.im-card,.sys-card,.sg12 .panel,.gd12 .panel,.usc .card,.perf-surface,.portal-surface){
  background-color:#fff;border-color:var(--ux26-border)!important;
  border-radius:var(--ux26-radius)!important;box-shadow:var(--ux26-shadow)!important;
}
.management-shell .management-content :is(.ux26-stat,.lead24-kpi,.ops20-kpi,.fm-kpi,.fu-kpi,.vr-stat,.sc79-stat,.supc-kpi,.asc-kpi,.sio-stat,.supi-stat,.asi-stat,.cal-stat,.im-stat,.sys-stat,.sec-stat){
  min-height:105px!important;padding:17px 18px!important;
  border:1px solid var(--ux26-border)!important;border-radius:14px!important;
  box-shadow:var(--ux26-shadow)!important;
}
.management-shell .management-content :is(.ux26-stat,.lead24-kpi,.ops20-kpi,.fm-kpi,.fu-kpi,.vr-stat,.sc79-stat,.supc-kpi,.asc-kpi,.sio-stat,.supi-stat,.asi-stat,.cal-stat,.im-stat,.sys-stat,.sec-stat) :is(small,span,[class$='-label']){
  font-size:12.5px!important;font-weight:500!important;line-height:1.7!important;
}
.management-shell .management-content :is(.ux26-stat,.lead24-kpi,.ops20-kpi,.fm-kpi,.fu-kpi,.vr-stat,.sc79-stat,.supc-kpi,.asc-kpi,.sio-stat,.supi-stat,.asi-stat,.cal-stat,.im-stat,.sys-stat,.sec-stat) :is(strong,[class$='-value'],[class$='-number']){
  font-size:clamp(23px,1.8vw,29px)!important;line-height:1.4!important;font-weight:600!important;
  font-variant-numeric:tabular-nums;
}
/* Consistent search, filters, controls — avoid tiny 8–10px original styles. */
.management-shell .management-content :is(label,legend){font:500 12.5px/1.7 var(--ux26-font)!important;color:#466a5a!important}
.management-shell .management-content :is(input:not([type='checkbox']):not([type='radio']):not([type='hidden']),select,textarea){
 min-height:42px!important;font-size:13.5px!important;font-weight:400!important;line-height:1.6!important;
 border:1px solid var(--ux26-border)!important;border-radius:10px!important;
 background-color:#fff;color:var(--ux26-ink)!important;
}
.management-shell .management-content :is(input,select,textarea)::placeholder{color:#8a9b92;opacity:1}
.management-shell .management-content :is(input,select,textarea):focus-visible{border-color:#59a98c!important;outline:2px solid #9adac2!important;outline-offset:1px}
.management-shell .management-content :is(.ux26-toolbar,.ops20-filters,.fm-filters,.vr-filters,.sc79-toolbar,.supc-filter,.asc-filter,.fu-filter,.cal-filter,.rc7-week-toolbar,.usc .filter-grid){
  background:#fff;border:1px solid var(--ux26-border)!important;border-radius:14px!important;
  box-shadow:var(--ux26-shadow)!important;
}
.management-shell .management-content :is(button,.btn,[class$='-btn'],a[role='button']){font-family:var(--ux26-font)!important;font-weight:500!important;font-size:13px!important;letter-spacing:0!important}
.management-shell .management-content :is(.ops20-btn,.cal-btn,.sio-btn,.supi-btn,.asi-btn,.vr-btn,.fm-btn,.sys-btn,.sec-btn,.sl-btn,.supc-btn,.asc-btn,.im-primary){min-height:39px!important;border-radius:10px!important;padding:8px 13px!important}
.management-shell .management-content :is(button,a,input,select,textarea):focus-visible{outline:2px solid #4aa582!important;outline-offset:2px}
.management-shell .management-content :is(.bi){font-size:17px;line-height:1;font-weight:400!important;vertical-align:middle}
.management-shell .management-content svg:not(.lead24-symbols):not(.ops22-symbols){stroke-width:1.7}
.management-shell .management-content :is(.badge,[class$='-badge'],[class$='-pill']){font-size:11.8px!important;font-weight:500!important}
/* Tables: single density, row separator, contrast, and legible column headings. */
.management-shell .management-content :is(table,.ux26-table){border-collapse:collapse;font-variant-numeric:tabular-nums}
.management-shell .management-content :is(table,.ux26-table) th{
 background:#f3f8f5!important;color:#476e5d!important;font-family:var(--ux26-font)!important;
 font-size:12.6px!important;font-weight:600!important;line-height:1.6!important;
 padding:12px 13px!important;border-bottom:1px solid var(--ux26-border)!important;
}
.management-shell .management-content :is(table,.ux26-table) td{
 font-family:var(--ux26-font)!important;color:#385b4d!important;
 font-size:13px!important;line-height:1.75!important;padding:12px 13px!important;
 border-bottom:1px solid var(--ux26-border-light)!important;vertical-align:middle!important;
}
.management-shell .management-content table tbody tr:hover{background-color:#f7fbf9}
.management-shell .management-content :is([class*='table-wrap'],.table-responsive,.table-scroll){max-width:100%;overflow-x:auto;scrollbar-width:thin}
.management-shell .management-content :is([class*='table-wrap'],.table-responsive,.table-scroll) table{min-width:max-content;max-width:none}
/* Repeated status pills: less decorative, more readable. Preserve state colors. */
.management-shell .management-content :is(.ops20-tag,.fm-status,.fu-status,.vr-status,.sc79-status,.supc-status,.asc-status,.cal-badge,.lead24-status){font-weight:500!important;font-size:11.8px!important;letter-spacing:0!important}
/* Empty states are designed deliberately, not endless blank white areas. */
.management-shell .management-content :is(.fm-table-empty-state,.vr-empty,.fu-empty,.ops20-empty,.sc79-empty,.supc-empty,.im-empty,.cal-empty,.usc .empty){min-height:215px!important;padding:32px 22px!important}
.management-shell .management-content :is(.fm-table-empty-state,.vr-empty,.fu-empty,.ops20-empty,.sc79-empty,.supc-empty,.im-empty,.cal-empty,.usc .empty) :is(h2,h3,strong){font-weight:600!important;font-size:17px!important}
/* Maintain 3-step import flows with consistent card format and readable meta. */
.management-shell .management-content :is(.sio,.supi,.asi,.imp7206,.sec) :is([class*='step'],[class*='flow']) :is(small,span){font-size:12px!important;font-weight:500!important}
.management-shell .management-content :is(.sio,.supi,.asi,.imp7206,.sec) :is([class*='drop'],[class*='upload']){border-radius:13px!important}
/* Different table/hero architectures keep their functionality but share the same kit. */
.management-shell .management-content :is(.oi,.ei,.perf,.pr,.ae) :is([class*='hero'],[class*='header'],[class*='identity']){border-radius:var(--ux26-radius)}
.management-shell .management-content :is(.oi,.ei,.perf,.pr,.ae) :is(h1,h2){font-weight:600!important}
/* Supervisor pages / auth: linked through their own base templates. */
body:has(.portal-shell){background:var(--ux26-bg)!important;color:var(--ux26-body);font:400 14px/1.85 var(--ux26-font)!important}
body .portal-shell :is(h1,h2,h3,h4){font-weight:600!important;line-height:1.6!important}
body .portal-shell h1{font-size:clamp(22px,1.7vw,26px)!important}
body .portal-shell h2{font-size:18px!important}
body .portal-shell :is(input:not([type=checkbox]):not([type=radio]),select,textarea){min-height:42px!important;font-size:13.5px!important;border-radius:10px!important;border-color:var(--ux26-border)!important}
body .portal-shell :is(button,.portal-btn){font-size:13.5px!important;font-weight:500!important}
body .portal-shell :is(.portal-surface,.portal-card,.portal-panel){background-color:#fff;border-color:var(--ux26-border)!important;border-radius:var(--ux26-radius)!important;box-shadow:var(--ux26-shadow)!important}
body .portal-shell :is(.planner-hero,.schools-hero,.ve-head,.history-head,.ws-heading){background-image:linear-gradient(108deg,#edf8f2,#fff)!important;border-color:var(--ux26-border)!important}
body .portal-shell :is(th){font-weight:600!important;font-size:12.6px!important}
body .portal-shell :is(td){font-weight:400!important;font-size:13px!important}
body .login-page :is(h1,h2){font-weight:600!important}
body .login-page :is(input,button){font-size:14px!important}
/* Responsive: uniform margins, no horizontal page overflow. Tables scroll locally. */
@media(max-width:1200px){
 .management-shell .management-content{padding-inline:16px!important}
 .management-shell .management-content :is(.ux26-hero,.lead24-intro,.ops20-hero,.fm-head,.fu-hero,.vr-hero,.sc79-hero,.sio-hero,.supc-hero,.asc-hero,.asi-hero,.cal-hero,.im-hero,.sys-hero){padding:20px!important}
}
@media(max-width:760px){
 .management-shell .management-content{padding:12px 12px 30px!important}
 .management-shell .management-content :is(.ux26-hero,.lead24-intro,.ops20-hero,.fm-head,.fu-hero,.vr-hero,.sc79-hero,.sio-hero,.supc-hero,.asc-hero,.asi-hero,.cal-hero,.im-hero,.sys-hero){min-height:0!important;padding:17px!important}
 .management-shell .management-content :is(h1){font-size:21px!important}
 .management-shell .management-content :is(h2){font-size:17px!important}
 .management-shell .management-content :is(.ux26-stat,.lead24-kpi,.ops20-kpi,.fm-kpi,.fu-kpi,.vr-stat,.sc79-stat,.supc-kpi,.asc-kpi,.sio-stat,.supi-stat,.asi-stat,.cal-stat,.im-stat,.sys-stat){min-height:93px!important;padding:13px!important}
 .management-shell .management-content :is(input,select,textarea){font-size:14px!important}
}
@media(prefers-reduced-motion:reduce){.management-shell *,body .portal-shell *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
/* Higher specificity than legacy inline-page styles for the unified semantic wrappers. */
.management-shell .management-content .ux26-page :is(table,.ux26-table) th{font-size:12.8px!important;font-weight:600!important;line-height:1.7!important}
.management-shell .management-content .ux26-page :is(table,.ux26-table) td{font-size:13.2px!important;font-weight:400!important;line-height:1.75!important}
.management-sidebar .management-nav .management-nav-link.is-active{font-weight:500!important}
/* Readability pass: previous releases used 8–11px text deep inside page widgets. */
.management-shell .management-content .ux26-page :is(small,[class$='-hint'],[class$='-note'],[class$='-muted']){font-size:12px!important;line-height:1.8!important;font-weight:400!important}
.management-shell .management-content .ux26-page .ux26-stat :is(span,small,[class$='-label']){font-size:12.5px!important;font-weight:500!important;line-height:1.7!important}
.management-shell .management-content .ux26-page .ux26-stat :is(strong,[class$='-value'],[class$='-number']){font-size:clamp(23px,1.8vw,29px)!important;font-weight:600!important}
.management-shell .management-content .ux26-page .ux26-hero :is(h1,[class$='-title']){font-size:clamp(22px,1.7vw,26px)!important;font-weight:600!important}
.management-shell .management-content .ux26-page .ux26-hero :is([class$='-kicker'],[class$='-eyebrow']){font-size:12.5px!important;font-weight:500!important}
.management-shell .management-content .ux26-page .ux26-hero :is(p,[class$='-sub'],[class$='-subtitle']){font-size:13.25px!important;font-weight:400!important}