:root{--navy:#0d2d55;--blue:#1769e0;--bg:#f3f6fa;--text:#142238;--muted:#667085;--white:#fff;--border:#dbe2ea;--green:#138a4b;--red:#c62828;--amber:#b26a00}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 Arial,sans-serif}.top{height:58px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 5%;position:sticky;top:0;z-index:20}.brand{font-size:20px;font-weight:700}.top nav a{color:#fff;text-decoration:none;margin-left:22px}.wrap{max-width:1180px;margin:28px auto;padding:0 20px}.shell{display:grid;grid-template-columns:230px 1fr;gap:24px;max-width:1250px;margin:24px auto;padding:0 20px}.side{background:#fff;border:1px solid var(--border);border-radius:12px;padding:14px;height:max-content;position:sticky;top:82px}.side-title{font-weight:700;font-size:16px;padding:10px 12px 14px}.side a{display:block;padding:10px 12px;border-radius:8px;text-decoration:none;color:var(--text);margin:3px 0}.side a:hover,.side a.on{background:#eaf1ff;color:var(--blue);font-weight:600}.card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px;box-shadow:0 4px 18px rgba(16,24,40,.04);margin-bottom:20px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stat .num{font-size:32px;font-weight:800;margin-top:4px}.stat .label{color:var(--muted)}h1{font-size:30px;margin:0 0 20px}h2{margin-top:0}.btn{display:inline-block;background:var(--blue);color:#fff!important;border:0;border-radius:8px;padding:10px 15px;text-decoration:none;cursor:pointer;font-weight:700}.btn.secondary{background:#475467}.btn.green{background:var(--green)}.btn.red{background:var(--red)}.btn.small{padding:7px 10px;font-size:13px}.actions{display:flex;gap:8px;flex-wrap:wrap}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}label{display:block;font-weight:700;margin:10px 0 6px}input,select,textarea{width:100%;padding:11px 12px;border:1px solid #cbd5e1;border-radius:8px;font:inherit;background:#fff}textarea{min-height:100px}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:11px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}.table th{background:#f8fafc}.badge{display:inline-block;border-radius:999px;padding:4px 9px;font-size:12px;font-weight:700}.badge.green{background:#e7f7ee;color:#087443}.badge.amber{background:#fff4dd;color:#925600}.badge.red{background:#ffe8e8;color:#a61b1b}.badge.blue{background:#e8f0ff;color:#175cd3}.alert{padding:12px 14px;border-radius:8px;background:#e9f7ef;color:#087443;margin-bottom:16px}.alert.err{background:#ffe8e8;color:#a61b1b}.login{max-width:470px;margin:70px auto}.login .logo{font-size:28px;font-weight:800;margin-bottom:5px}.question{border:1px solid var(--border);border-radius:12px;padding:18px;margin-bottom:16px;background:#fff}.option{display:block;padding:9px;border:1px solid #e5e7eb;border-radius:7px;margin:8px 0}.option input{width:auto;margin-right:8px}footer{text-align:center;color:#667085;padding:30px}.timer{position:sticky;top:70px;background:#fff;border:2px solid var(--blue);border-radius:10px;padding:10px 15px;font-weight:800;text-align:center;z-index:10}.exam-grid{display:grid;grid-template-columns:1fr 260px;gap:20px}.qnav{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.qnav a{padding:8px;text-align:center;border-radius:6px;background:#eef2f6;text-decoration:none;color:var(--text)}.qnav a.answered{background:#dff5e9;color:#087443}.progress{height:9px;background:#e5e7eb;border-radius:99px;overflow:hidden}.progress span{display:block;height:100%;background:var(--blue)}@media(max-width:900px){.shell{grid-template-columns:1fr}.side{position:static}.cards{grid-template-columns:repeat(2,1fr)}.exam-grid,.grid2{grid-template-columns:1fr}}@media(max-width:560px){.cards{grid-template-columns:1fr}.brand{font-size:15px}.top{padding:0 15px}.top nav a{margin-left:10px}}
.page-head,.section-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.page-head h1,.page-head h2{margin-bottom:4px}.muted{color:var(--muted)}.answer-box{background:#f8fafc;border:1px solid var(--border);border-radius:8px;padding:14px;min-height:70px}.exam-head{display:flex;align-items:center;justify-content:space-between}.exam-head .timer{position:static;min-width:130px}.side a{font-size:14px}.table tr:hover td{background:#fafcff}@media(max-width:700px){.page-head,.section-head,.exam-head{align-items:flex-start;flex-direction:column}.exam-head .timer{width:100%}.table{display:block;overflow-x:auto;white-space:nowrap}}

.side-group{margin:18px 12px 7px;font-size:10px;font-weight:800;letter-spacing:.08em;color:#7a8aa3}.admin-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.admin-tile{display:block;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--border);border-radius:12px;padding:18px;box-shadow:0 5px 18px rgba(15,35,65,.04);transition:.15s}.admin-tile:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(15,35,65,.09)}.admin-tile h2{margin:7px 0 8px;font-size:19px}.admin-tile p{margin:0 0 16px;color:#61708a;line-height:1.45}.tile-group{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#2d6cdf;font-weight:700}.tile-link{font-weight:700;color:#1765e8}@media(max-width:900px){.admin-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.admin-grid{grid-template-columns:1fr}}
.linkbtn{border:0;background:none;padding:0;color:#1765e8;cursor:pointer;font:inherit;text-decoration:underline}.linkbtn:hover{color:#0b4fb7}

.login-links{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}.login-card{max-width:560px;margin:0 auto}.login-links a{font-weight:600}
/* OES v2.2.20 - modern administration navigation */
.admin-side{background:var(--admin-side);border:0;border-radius:0;color:#dce9f7;padding:16px 12px;box-shadow:10px 0 28px rgba(4,20,35,.08);min-height:calc(100vh - 82px);position:sticky;top:82px;overflow:auto;scrollbar-width:thin}
.side-brand{display:flex;align-items:center;gap:10px;padding:8px 10px 18px;color:#fff}.side-brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:#1d5f95;font-size:11px;font-weight:800;letter-spacing:.04em}.side-brand strong{display:block;font-size:15px}.side-brand small{display:block;color:#91a8bf;font-size:10px;margin-top:2px}.admin-side .side-group{margin:13px 12px 8px;color:var(--admin-muted);font-size:10px;letter-spacing:.12em}.admin-side .side-link{display:flex;align-items:center;gap:8px;min-height:38px;margin:2px 4px;padding:8px 10px;border-radius:8px;color:var(--admin-text);text-decoration:none;font-size:13px;font-weight:500;transition:background .15s ease,color .15s ease,transform .15s ease}.admin-side .side-link svg{width:15px;height:15px;fill:currentColor;flex:0 0 auto;opacity:.95}.admin-side .side-link:hover{background:var(--admin-hover);color:#fff;transform:translateX(1px)}.admin-side .side-link.on{background:var(--admin-active);color:#fff;box-shadow:inset 3px 0 0 var(--blue);font-weight:700}.admin-side .disabled-link{color:#7890a8!important;cursor:not-allowed}.admin-side .disabled-link em{margin-left:auto;font-size:9px;font-style:normal;color:#6d879f;border:1px solid #29455d;padding:2px 5px;border-radius:999px}.admin-side + main{min-width:0}.shell{grid-template-columns:250px 1fr;max-width:1400px}.shell:has(.admin-side){max-width:1450px;padding:0 18px;gap:22px}.admin-side::-webkit-scrollbar{width:5px}.admin-side::-webkit-scrollbar-thumb{background:#1c4563;border-radius:10px}
@media(max-width:900px){.admin-side{position:static;min-height:auto;border-radius:12px}.shell{grid-template-columns:1fr}.admin-side{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px}.side-brand,.admin-side .side-group{grid-column:1/-1}.admin-side .side-link{margin:2px}.admin-side .disabled-link{display:flex}}
@media(max-width:560px){.admin-side{display:block}.admin-side .side-link{min-height:40px}}
/* OES v2.2.22 - administrator branding controls */
.brand-with-logo{display:flex;align-items:center;gap:10px;min-width:0}.brand-with-logo .site-logo{flex:0 0 auto}.side-brand{flex-wrap:wrap}.side-logo{display:block;flex:0 0 auto}.side-brand > div{min-width:0}.side-brand strong,.side-brand small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-side .side-link svg{width:15px;height:15px;flex:0 0 auto}.admin-side .side-link{gap:8px}
@media(max-width:560px){.brand-with-logo .site-logo{max-width:110px!important}.brand-with-logo span{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.side-logo{max-width:150px!important}}
/* OES TVET ERP */
.tvet-kpi{border-top:3px solid var(--blue)}

/* =========================================================
   OES v2.3 Professional ERP Dashboard & UX Edition
   Unified top-module navigation + dashboard component system
   ========================================================= */
:root{--surface:#fff;--surface-2:#f8fafc;--muted:#667085;--border:#dbe2ea;--shadow-sm:0 2px 10px rgba(16,24,40,.05);--shadow-md:0 10px 28px rgba(16,24,40,.08);--radius:14px}
body{background:var(--bg);color:var(--text)}
.top{height:62px;padding:0 clamp(16px,4vw,54px);box-shadow:0 1px 0 rgba(255,255,255,.08);position:sticky;top:0;z-index:100}
.top nav{display:flex;align-items:center;gap:6px}.top nav a{margin-left:0;padding:8px 10px;border-radius:7px}.top nav a:hover{background:rgba(255,255,255,.1)}
.shell{display:grid;grid-template-columns:1fr;gap:0;max-width:1500px;margin:0 auto;padding:0 clamp(14px,3vw,30px)}
.shell:has(.admin-navigation){max-width:1500px;padding:0 clamp(14px,3vw,30px)}
.shell>main{min-width:0;padding:26px 0 10px}
.admin-navigation{position:sticky;top:62px;z-index:90;margin:0 -1px;background:var(--surface);border-bottom:1px solid var(--border);box-shadow:var(--shadow-sm)}
.admin-nav-head{display:grid;grid-template-columns:minmax(220px,1.1fr) auto minmax(300px,1.8fr) auto;align-items:center;gap:14px;padding:12px 16px;border-bottom:1px solid var(--border)}
.admin-brand{display:flex;align-items:center;gap:10px;min-width:0;text-decoration:none;color:var(--text)}
.admin-brand>span:last-child{min-width:0}.admin-brand strong{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.admin-brand small{display:block;font-size:10px;color:var(--muted);margin-top:1px}.admin-brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--admin-side);color:#fff;font-size:10px;font-weight:800}.admin-nav-logo{display:block;flex:0 0 auto}
.admin-home-link{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 12px;border-radius:9px;background:var(--surface-2);border:1px solid var(--border);color:var(--text);text-decoration:none;font-weight:700;font-size:13px;white-space:nowrap}.admin-home-link:hover{border-color:var(--blue);color:var(--blue)}
.global-search{position:relative;display:flex;align-items:center;min-width:0}.global-search input{height:40px;padding:0 58px 0 38px;border-radius:10px;border:1px solid var(--border);background:var(--surface-2);outline:none}.global-search input:focus{background:#fff;border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 12%,transparent)}.search-icon{position:absolute;left:13px;color:#667085;font-size:22px;line-height:1;z-index:1}.global-search kbd{position:absolute;right:9px;font-size:10px;color:#667085;background:#fff;border:1px solid var(--border);padding:3px 6px;border-radius:5px}
.admin-nav-tools{display:flex;align-items:center;gap:7px;justify-content:flex-end}.nav-popover{position:relative}.nav-tool,.nav-user{border:1px solid var(--border);background:#fff;height:38px;border-radius:9px;cursor:pointer;color:var(--text);font:inherit}.nav-tool{width:40px;position:relative}.nav-user{display:flex;align-items:center;gap:7px;padding:0 9px}.avatar{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--admin-side);color:#fff;font-size:11px;font-weight:800}.user-name{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700}.notif-dot{position:absolute;right:-3px;top:-4px;min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:#d92d20;color:#fff;font-size:9px;display:grid;place-items:center;border:2px solid #fff}.popover-panel{display:none;position:absolute;right:0;top:46px;width:320px;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-md);overflow:hidden}.popover-panel.open{display:block}.popover-title{padding:13px 15px;font-size:13px;font-weight:800;border-bottom:1px solid var(--border)}.notice-item,.profile-panel a{display:flex;gap:9px;padding:11px 14px;text-decoration:none;color:var(--text);font-size:12px;border-bottom:1px solid #eef2f6}.notice-item:hover,.profile-panel a:hover{background:var(--surface-2)}.notice-dot{width:8px;height:8px;border-radius:50%;margin-top:5px;flex:0 0 8px;background:#98a2b3}.notice-dot.amber{background:#f79009}.notice-dot.blue{background:#2e90fa}.notice-dot.green{background:#12b76a}.notice-dot.red{background:#f04438}.empty-mini{padding:18px;color:var(--muted);font-size:12px}.profile-panel{width:220px}.profile-panel a{display:block}
.module-bar{display:flex;align-items:stretch;gap:4px;padding:7px 10px;overflow:visible}.module-menu{position:relative;min-width:0}.module-trigger{display:flex;align-items:center;gap:7px;min-height:39px;padding:8px 11px;border-radius:9px;cursor:pointer;list-style:none;color:#344054;font-size:13px;font-weight:700;white-space:nowrap}.module-trigger::-webkit-details-marker{display:none}.module-trigger:hover{background:var(--surface-2);color:var(--blue)}.module-trigger.active{background:color-mix(in srgb,var(--blue) 10%,#fff);color:var(--blue)}.module-trigger svg{width:16px;height:16px;fill:currentColor;flex:0 0 auto}.chevron{font-size:12px;color:#98a2b3;margin-left:2px}.module-menu[open] .chevron{transform:rotate(180deg)}.module-dropdown{position:absolute;top:calc(100% + 4px);left:0;min-width:220px;background:#fff;border:1px solid var(--border);border-radius:11px;box-shadow:var(--shadow-md);padding:6px;z-index:120}.module-sub-link{display:block;padding:9px 10px;border-radius:7px;text-decoration:none;color:#344054;font-size:12px;font-weight:600}.module-sub-link:hover{background:var(--surface-2);color:var(--blue)}.module-sub-link.active{background:var(--blue);color:#fff}
.page-head{margin-bottom:18px}.page-head h1{font-size:32px;letter-spacing:-.025em}.page-head p{margin:3px 0 0}.breadcrumb{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:10px;font-size:12px;color:var(--muted)}.breadcrumb a{color:var(--blue);text-decoration:none}.breadcrumb a:hover{text-decoration:underline}.breadcrumb .sep{color:#98a2b3}
.dashboard-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:22px 24px;background:linear-gradient(135deg,var(--admin-side),color-mix(in srgb,var(--blue) 55%,var(--admin-side)));border-radius:18px;color:#fff;margin-bottom:20px;box-shadow:var(--shadow-md)}.dashboard-hero h1{margin:0 0 5px;font-size:30px}.dashboard-hero p{margin:0;color:#d8e5f3}.hero-actions{display:flex;gap:8px;flex-wrap:wrap}.hero-actions .btn{background:#fff;color:var(--admin-side)!important}
.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.kpi-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:17px;box-shadow:var(--shadow-sm);position:relative;overflow:hidden}.kpi-card:after{content:"";position:absolute;right:-20px;top:-20px;width:80px;height:80px;border-radius:50%;background:color-mix(in srgb,var(--blue) 7%,transparent)}.kpi-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.kpi-label{font-size:12px;color:var(--muted);font-weight:700}.kpi-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--blue) 10%,#fff);color:var(--blue)}.kpi-icon svg{width:17px;height:17px;fill:currentColor}.kpi-value{font-size:28px;font-weight:850;letter-spacing:-.02em;margin-top:9px}.kpi-foot{font-size:11px;color:var(--muted);margin-top:3px}.kpi-positive{color:#087443}.kpi-warning{color:#b54708}.kpi-danger{color:#b42318}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,.85fr);gap:16px}.dashboard-grid.equal{grid-template-columns:1fr 1fr}.dashboard-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:18px;box-shadow:var(--shadow-sm)}.dashboard-card h2{font-size:17px;margin:0}.dashboard-card .sub{font-size:12px;color:var(--muted);margin-top:3px}.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.card-head a{font-size:12px;color:var(--blue);text-decoration:none;font-weight:700}.analytics-bars{display:flex;align-items:flex-end;gap:10px;height:210px;padding:15px 5px 0}.bar-col{height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px;flex:1}.bar-value{font-size:10px;color:var(--muted);font-weight:700}.bar{width:min(42px,75%);min-height:5px;background:linear-gradient(180deg,var(--blue),color-mix(in srgb,var(--blue) 55%,#fff));border-radius:8px 8px 2px 2px}.bar-label{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:65px}.status-list{display:grid;gap:11px}.status-row{display:grid;grid-template-columns:95px 1fr 45px;align-items:center;gap:8px;font-size:11px}.status-row .track{height:8px;border-radius:99px;background:#eef2f6;overflow:hidden}.status-row .track span{display:block;height:100%;border-radius:99px;background:var(--blue)}.quick-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.quick-action{display:flex;align-items:center;gap:9px;padding:11px;border:1px solid var(--border);border-radius:10px;text-decoration:none;color:var(--text);font-size:12px;font-weight:700;background:#fff}.quick-action:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-1px)}.quick-action .qa-icon{width:30px;height:30px;border-radius:8px;background:var(--surface-2);display:grid;place-items:center;color:var(--blue);font-size:15px}
.module-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.mini-stat{padding:13px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px}.mini-stat b{display:block;font-size:21px}.mini-stat span{font-size:11px;color:var(--muted)}.data-table-wrap{overflow:auto}.data-table-wrap .table{min-width:680px}.table th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#667085}.table td{font-size:13px}
.student-hero{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;padding:20px;background:#fff;border:1px solid var(--border);border-radius:15px;box-shadow:var(--shadow-sm);margin-bottom:16px}.student-avatar{width:66px;height:66px;border-radius:16px;background:linear-gradient(135deg,var(--admin-side),var(--blue));color:#fff;display:grid;place-items:center;font-size:24px;font-weight:800}.student-meta h2{margin:0;font-size:21px}.student-meta p{margin:3px 0;color:var(--muted);font-size:12px}.student-tabs{display:flex;gap:5px;overflow:auto;padding:5px;background:#fff;border:1px solid var(--border);border-radius:12px;margin-bottom:16px}.student-tab{padding:9px 12px;border-radius:8px;text-decoration:none;color:#475467;font-size:12px;font-weight:700;white-space:nowrap}.student-tab:hover,.student-tab.active{background:var(--blue);color:#fff}
.search-page{max-width:1050px}.search-box-large{display:flex;gap:9px}.search-box-large input{height:46px}.search-result-group{margin-top:18px}.search-result{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #eef2f6;text-decoration:none;color:var(--text)}.search-result:hover{background:var(--surface-2)}.search-result .result-icon{width:34px;height:34px;border-radius:9px;background:#eef4ff;color:var(--blue);display:grid;place-items:center}.search-result strong{display:block;font-size:13px}.search-result small{color:var(--muted);font-size:11px}.no-results{padding:35px 15px;text-align:center;color:var(--muted)}
.form-section{padding-top:5px;margin-top:22px;border-top:1px solid #eef2f6}.form-section h3{font-size:14px;margin-bottom:6px}.empty-state{text-align:center;padding:40px 20px;border:1px dashed #cbd5e1;border-radius:12px;background:var(--surface-2);color:var(--muted)}
@media(max-width:1100px){.admin-nav-head{grid-template-columns:minmax(180px,1fr) auto minmax(260px,1.4fr) auto}.user-name{display:none}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-grid{grid-template-columns:1fr}.module-bar{overflow-x:auto}.module-menu{flex:0 0 auto}}
@media(max-width:820px){.admin-nav-head{grid-template-columns:1fr auto}.admin-home-link{display:none}.global-search{grid-column:1/-1;grid-row:2}.admin-nav-tools{grid-column:2;grid-row:1}.admin-navigation{top:62px}.module-bar{padding:6px}.module-trigger{min-height:37px;padding:7px 9px}.module-dropdown{position:fixed;left:10px;right:10px;top:132px;min-width:0}.student-hero{grid-template-columns:auto 1fr}.student-hero .actions{grid-column:1/-1}.module-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.top{height:54px}.top nav a:nth-child(1),.top nav a:nth-child(2){display:none}.brand{font-size:14px}.brand-with-logo .site-logo{max-width:100px!important}.admin-navigation{top:54px}.admin-nav-head{padding:9px 10px}.admin-brand strong{font-size:12px}.admin-brand small{font-size:9px}.kpi-grid{grid-template-columns:1fr}.dashboard-hero{padding:18px;align-items:flex-start;flex-direction:column}.dashboard-hero h1{font-size:24px}.quick-actions{grid-template-columns:1fr}.module-summary{grid-template-columns:1fr 1fr}.module-trigger span:not(.chevron){font-size:11px}.module-dropdown{top:122px}.popover-panel{position:fixed;left:10px;right:10px;top:105px;width:auto}.shell>main{padding-top:18px}}
.admin-breadcrumb{display:flex;align-items:center;gap:7px;padding:8px 16px;background:var(--surface-2);border-top:1px solid #f0f2f5;color:var(--muted);font-size:11px}.admin-breadcrumb a{color:var(--blue);text-decoration:none;font-weight:700}.admin-breadcrumb strong{color:#475467}.admin-breadcrumb span{color:#98a2b3}
.tvet-module-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
.tvet-module-grid .admin-tile{position:relative;min-height:190px;padding-top:18px;}
.tvet-module-grid .tile-icon{font-size:25px;line-height:1;margin-bottom:10px}
.workflow-steps{display:grid;grid-template-columns:repeat(9,minmax(110px,1fr));gap:8px;overflow:auto;padding:4px 0}
.workflow-steps>div{min-width:110px;padding:14px;border:1px solid var(--border,#e3e8ef);border-radius:12px;background:var(--card,#fff)}
.workflow-steps b{display:block;font-size:12px;color:var(--blue);margin-bottom:7px}.workflow-steps span{font-weight:700;font-size:13px}
@media(max-width:1100px){.tvet-module-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:760px){.tvet-module-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.workflow-steps{grid-template-columns:repeat(9,120px)}}
@media(max-width:480px){.tvet-module-grid{grid-template-columns:1fr;}}

/* OES v2.4.1 — horizontal module sub-navigation */
.module-bar{display:flex;align-items:stretch;gap:6px;padding:7px 10px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;white-space:nowrap}
.module-button{appearance:none;-webkit-appearance:none;border:0;background:transparent;font:inherit;outline:none}
.module-button:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 22%,transparent);position:relative;z-index:2}
.module-button svg{width:16px;height:16px;fill:currentColor;flex:0 0 auto}
.module-subnav{display:block;border-top:1px solid var(--border);background:var(--surface);min-height:0;padding:0 10px;overflow:hidden}
.module-subnav-panel{display:none;align-items:center;gap:4px;flex-wrap:wrap;min-width:0;padding:7px 0}
.module-subnav-panel.active{display:flex}
.module-subnav-panel[hidden]{display:none!important}
.module-sub-link{display:inline-flex;align-items:center;min-height:32px;padding:6px 10px;border-radius:7px;text-decoration:none;color:#344054;font-size:12px;font-weight:600;white-space:nowrap;border:1px solid transparent}
.module-sub-link:hover{background:var(--surface-2);color:var(--blue);border-color:var(--border)}
.module-sub-link.active{background:var(--blue);color:#fff;border-color:var(--blue)}
.module-trigger{user-select:none}
.module-trigger:hover{background:var(--surface-2);color:var(--blue)}
.module-trigger.active{background:color-mix(in srgb,var(--blue) 10%,#fff);color:var(--blue)}
.admin-navigation{overflow:visible}
@media(max-width:900px){.module-subnav-panel{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;padding-bottom:8px;scrollbar-width:thin}.module-sub-link{flex:0 0 auto}.module-bar{gap:3px}}
@media(max-width:560px){.module-trigger{min-height:36px;padding:7px 9px;font-size:11px}.module-trigger svg{width:15px;height:15px}.module-subnav{padding:0 7px}.module-sub-link{font-size:11px;padding:6px 9px}}


/* OES v2.4.2 — HARD OVERRIDE: horizontal module navigation
   This intentionally overrides legacy dropdown styles and prevents cached/legacy
   selectors from turning module sub-navigation into a vertical dropdown. */
.oes-horizontal-modules,
.admin-navigation .oes-horizontal-modules{
  display:flex !important;
  flex-direction:row !important;
  align-items:stretch !important;
  flex-wrap:nowrap !important;
  gap:6px !important;
  width:100% !important;
  padding:7px 10px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  white-space:nowrap !important;
}
.oes-horizontal-modules .module-trigger,
.admin-navigation .oes-horizontal-modules .module-trigger{
  appearance:none !important;
  -webkit-appearance:none !important;
  border:0 !important;
  outline:none !important;
  box-shadow:none !important;
  background:transparent !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  min-height:40px !important;
  width:auto !important;
  margin:0 !important;
  padding:8px 12px !important;
  border-radius:9px !important;
  color:#344054 !important;
  cursor:pointer !important;
  font:inherit !important;
  font-size:13px !important;
  font-weight:700 !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
}
.oes-horizontal-modules .module-trigger:hover,
.oes-horizontal-modules .module-trigger.active{
  border:0 !important;
  box-shadow:none !important;
  background:color-mix(in srgb,var(--blue) 10%,#fff) !important;
  color:var(--blue) !important;
}
.oes-horizontal-modules .module-trigger:focus,
.oes-horizontal-modules .module-trigger:focus-visible{
  outline:none !important;
  box-shadow:none !important;
}
.oes-horizontal-modules .module-trigger svg{
  width:16px !important;
  height:16px !important;
  flex:0 0 16px !important;
}
.oes-horizontal-subnav,
.admin-navigation .oes-horizontal-subnav{
  display:block !important;
  width:100% !important;
  min-height:46px !important;
  margin:0 !important;
  padding:0 10px !important;
  overflow:hidden !important;
  border-top:1px solid var(--border) !important;
  border-bottom:1px solid var(--border) !important;
  background:var(--surface) !important;
}
.oes-horizontal-subnav .module-subnav-panel,
.admin-navigation .oes-horizontal-subnav .module-subnav-panel{
  display:none !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex-wrap:wrap !important;
  gap:4px !important;
  width:100% !important;
  min-height:45px !important;
  margin:0 !important;
  padding:6px 0 !important;
  overflow:visible !important;
}
.oes-horizontal-subnav .module-subnav-panel.active,
.admin-navigation .oes-horizontal-subnav .module-subnav-panel.active{
  display:flex !important;
}
.oes-horizontal-subnav .module-subnav-panel[hidden],
.admin-navigation .oes-horizontal-subnav .module-subnav-panel[hidden]{
  display:none !important;
}
.oes-horizontal-subnav .module-sub-link,
.admin-navigation .oes-horizontal-subnav .module-sub-link{
  display:inline-flex !important;
  flex:0 0 auto !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  min-width:0 !important;
  min-height:32px !important;
  margin:0 !important;
  padding:6px 11px !important;
  border:1px solid transparent !important;
  border-radius:7px !important;
  background:transparent !important;
  color:#344054 !important;
  font-size:12px !important;
  font-weight:600 !important;
  line-height:1.2 !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  cursor:pointer !important;
}
.oes-horizontal-subnav .module-sub-link:hover,
.oes-horizontal-subnav .module-sub-link.active{
  background:var(--blue) !important;
  border-color:var(--blue) !important;
  color:#fff !important;
}
/* Legacy dropdown selectors must never affect the new navigation. */
.oes-horizontal-modules .module-dropdown,
.oes-horizontal-modules + .module-subnav .module-dropdown,
.oes-horizontal-modules .chevron{display:none !important;}

@media(max-width:900px){
  .oes-horizontal-subnav .module-subnav-panel{flex-wrap:nowrap !important;overflow-x:auto !important;overflow-y:hidden !important;padding-bottom:8px !important;scrollbar-width:thin !important;}
}
@media(max-width:560px){
  .oes-horizontal-modules{gap:2px !important;padding:6px !important;}
  .oes-horizontal-modules .module-trigger{min-height:36px !important;padding:7px 9px !important;font-size:11px !important;}
  .oes-horizontal-modules .module-trigger svg{width:15px !important;height:15px !important;}
  .oes-horizontal-subnav{padding:0 7px !important;}
  .oes-horizontal-subnav .module-sub-link{font-size:11px !important;padding:6px 9px !important;}
}

/* v2.4.6 System Administration */
.search-row{display:flex;gap:10px;align-items:center}.search-row input{flex:1}.permission-grid{margin-top:10px}.btn.small{padding:7px 10px;font-size:12px}.card-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.card-head h2{margin-bottom:3px}@media(max-width:700px){.search-row{flex-direction:column;align-items:stretch}}

/* OES v2.4.7 — Admin actions moved into the global topbar.
   The admin module navigation now starts directly beneath the topbar. */
.top.admin-topbar{
  height:68px !important;
  min-height:68px !important;
  background:var(--navy) !important;
  color:#fff !important;
  padding:0 clamp(18px,3vw,44px) !important;
  gap:22px !important;
  position:sticky !important;
  top:0 !important;
  z-index:200 !important;
}
.top.admin-topbar .brand{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  min-width:0 !important;
  flex:1 1 auto !important;
  color:#fff !important;
}
.top.admin-topbar .brand .site-logo{
  width:auto !important;
  max-width:125px !important;
  max-height:48px !important;
  object-fit:contain !important;
  background:#fff !important;
  border-radius:6px !important;
  padding:2px !important;
}
.top.admin-topbar .brand > span:last-child{
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  max-width:min(42vw,560px) !important;
  font-size:18px !important;
  font-weight:800 !important;
}
.top.admin-topbar nav{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:4px !important;
  flex:0 0 auto !important;
  white-space:nowrap !important;
}
.top.admin-topbar nav a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  min-height:40px !important;
  padding:0 13px !important;
  margin:0 !important;
  border:1px solid transparent !important;
  border-radius:8px !important;
  color:#fff !important;
  text-decoration:none !important;
  font-size:13px !important;
  font-weight:700 !important;
  transition:background .15s ease,border-color .15s ease !important;
}
.top.admin-topbar nav a:hover{
  background:rgba(255,255,255,.12) !important;
  border-color:rgba(255,255,255,.18) !important;
}
.top.admin-topbar nav .top-system-link{
  background:rgba(255,255,255,.10) !important;
  border-color:rgba(255,255,255,.16) !important;
}
.top.admin-topbar nav .top-system-link svg{fill:currentColor !important;flex:0 0 auto !important}
.top.admin-topbar nav .top-logout-link{color:#ffd7d2 !important}
.top.admin-topbar nav .top-logout-link:hover{background:rgba(198,40,40,.25) !important;border-color:rgba(255,180,180,.25) !important}

/* Remove the old duplicate white admin heading row. */
.admin-navigation{top:68px !important}
.admin-navigation > .admin-nav-head-professional{display:none !important}
.admin-navigation > .module-bar{border-top:0 !important}

@media(max-width:900px){
  .top.admin-topbar{height:62px !important;min-height:62px !important;padding:0 12px !important;gap:10px !important}
  .top.admin-topbar .brand > span:last-child{font-size:14px !important;max-width:34vw !important}
  .top.admin-topbar .brand .site-logo{max-width:92px !important;max-height:42px !important}
  .top.admin-topbar nav{overflow-x:auto !important;scrollbar-width:none !important}
  .top.admin-topbar nav::-webkit-scrollbar{display:none !important}
  .top.admin-topbar nav a{min-height:36px !important;padding:0 8px !important;font-size:11px !important}
  .admin-navigation{top:62px !important}
}
@media(max-width:620px){
  .top.admin-topbar{height:56px !important;min-height:56px !important}
  .top.admin-topbar .brand .site-logo{max-width:72px !important;max-height:36px !important}
  .top.admin-topbar .brand > span:last-child{font-size:11px !important;max-width:28vw !important}
  .top.admin-topbar nav .top-system-link span{display:none !important}
  .top.admin-topbar nav a{padding:0 6px !important;font-size:10px !important}
  .admin-navigation{top:56px !important}
}

/* OES v2.4.8 — SINGLE GLOBAL ADMIN TOPBAR
   The institution logo, system title, System Administration, Admin Panel,
   Dashboard and Logout are kept in ONE topbar at the very top of the page.
   No secondary/duplicate admin header is rendered. */
body:has(.top.admin-topbar){
  padding-top:0 !important;
}
.top.admin-topbar{
  position:sticky !important;
  top:0 !important;
  left:0 !important;
  width:100% !important;
  box-sizing:border-box !important;
  z-index:1000 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  margin:0 !important;
  border:0 !important;
  border-top:3px solid var(--blue) !important;
  border-bottom:1px solid rgba(255,255,255,.10) !important;
  background:#fff !important;
  color:var(--text) !important;
  box-shadow:0 2px 10px rgba(16,24,40,.06) !important;
  height:74px !important;
  min-height:74px !important;
  padding:0 28px !important;
}
.top.admin-topbar .brand{
  color:var(--text) !important;
  flex:1 1 auto !important;
  min-width:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:16px !important;
}
.top.admin-topbar .brand .site-logo{
  width:auto !important;
  max-width:112px !important;
  max-height:54px !important;
  padding:0 !important;
  background:transparent !important;
  border-radius:0 !important;
}
.top.admin-topbar .brand > span:last-child{
  color:var(--text) !important;
  max-width:none !important;
  overflow:visible !important;
  text-overflow:clip !important;
  white-space:nowrap !important;
  font-size:19px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
}
.top.admin-topbar nav{
  flex:0 0 auto !important;
  display:flex !important;
  align-items:center !important;
  gap:4px !important;
  overflow:visible !important;
}
.top.admin-topbar nav a{
  color:#344054 !important;
  background:transparent !important;
  border:1px solid transparent !important;
  border-radius:8px !important;
  min-height:42px !important;
  padding:0 13px !important;
  font-size:13px !important;
  font-weight:700 !important;
}
.top.admin-topbar nav a:hover{
  color:var(--blue) !important;
  background:var(--surface-2) !important;
  border-color:var(--border) !important;
}
.top.admin-topbar nav .top-system-link{
  color:var(--blue) !important;
  background:transparent !important;
  border-color:transparent !important;
}
.top.admin-topbar nav .top-logout-link{
  color:#b42318 !important;
}
.top.admin-topbar nav .top-logout-link:hover{
  color:#b42318 !important;
  background:#fff1f0 !important;
  border-color:#fecdca !important;
}
/* Never render the legacy second header. */
.admin-navigation > .admin-nav-head,
.admin-navigation > .admin-nav-head-professional,
.admin-navigation .admin-nav-head-professional{
  display:none !important;
  height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}
.admin-navigation{
  position:relative !important;
  top:auto !important;
  z-index:900 !important;
  margin:0 !important;
}
.admin-navigation > .module-bar{
  border-top:0 !important;
}
@media(max-width:900px){
  .top.admin-topbar{height:66px !important;min-height:66px !important;padding:0 14px !important}
  .top.admin-topbar .brand{gap:10px !important}
  .top.admin-topbar .brand .site-logo{max-width:86px !important;max-height:46px !important}
  .top.admin-topbar .brand > span:last-child{font-size:15px !important}
  .top.admin-topbar nav a{min-height:38px !important;padding:0 8px !important;font-size:11px !important}
}
@media(max-width:620px){
  .top.admin-topbar{height:58px !important;min-height:58px !important;padding:0 9px !important}
  .top.admin-topbar .brand{gap:7px !important}
  .top.admin-topbar .brand .site-logo{max-width:62px !important;max-height:38px !important}
  .top.admin-topbar .brand > span:last-child{font-size:11px !important;max-width:34vw !important;overflow:hidden !important;text-overflow:ellipsis !important}
  .top.admin-topbar nav{gap:1px !important}
  .top.admin-topbar nav a{min-height:34px !important;padding:0 6px !important;font-size:10px !important}
  .top.admin-topbar nav .top-system-link span{display:none !important}
}


/* OES v2.4.9 — SINGLE TOPBAR ENFORCEMENT
   The admin layout must contain exactly one global topbar. Older deployments may
   still inject the legacy blue .top header before the current .admin-topbar.
   On admin pages, keep the new administrative topbar and suppress legacy .top bars. */
body:has(.top.admin-topbar) .top:not(.admin-topbar){
  display:none !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
}
/* Defensive selectors for legacy page-level administration headers. */
body:has(.top.admin-topbar) .legacy-topbar,
body:has(.top.admin-topbar) .legacy-admin-topbar,
body:has(.top.admin-topbar) .old-topbar,
body:has(.top.admin-topbar) .site-topbar,
body:has(.top.admin-topbar) .global-topbar:not(.admin-topbar){
  display:none !important;
  height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
}


/* OES v2.5.0 — MERGED BLUE ADMIN TOPBAR
   Final UI decision: use ONE blue global topbar. It contains the logo,
   institution/system title, System Administration, Admin Panel, Dashboard
   and Logout. The previous white admin header is not used. */
body:has(.top.admin-topbar) .top.admin-topbar{
  background:var(--blue) !important;
  color:#fff !important;
  border-top:3px solid color-mix(in srgb,var(--blue) 78%,#fff) !important;
  border-bottom:1px solid rgba(255,255,255,.18) !important;
  box-shadow:0 2px 10px rgba(16,24,40,.12) !important;
}
body:has(.top.admin-topbar) .top.admin-topbar .brand,
body:has(.top.admin-topbar) .top.admin-topbar .brand > span:last-child{
  color:#fff !important;
}
body:has(.top.admin-topbar) .top.admin-topbar .brand .site-logo{
  max-width:112px !important;
  max-height:54px !important;
  background:transparent !important;
  padding:0 !important;
  border-radius:0 !important;
  object-fit:contain !important;
}
body:has(.top.admin-topbar) .top.admin-topbar nav a{
  color:#fff !important;
  background:transparent !important;
  border-color:transparent !important;
}
body:has(.top.admin-topbar) .top.admin-topbar nav a:hover,
body:has(.top.admin-topbar) .top.admin-topbar nav a:focus-visible{
  color:#fff !important;
  background:rgba(255,255,255,.14) !important;
  border-color:rgba(255,255,255,.22) !important;
}
body:has(.top.admin-topbar) .top.admin-topbar nav .top-system-link{
  color:#fff !important;
  background:rgba(255,255,255,.12) !important;
  border-color:rgba(255,255,255,.20) !important;
}
body:has(.top.admin-topbar) .top.admin-topbar nav .top-logout-link,
body:has(.top.admin-topbar) .top.admin-topbar nav .top-logout-link:hover{
  color:#fff !important;
  background:transparent !important;
  border-color:transparent !important;
}
/* Keep the module navigation below the single blue topbar. */
body:has(.top.admin-topbar) .admin-navigation{
  position:relative !important;
  top:auto !important;
  z-index:900 !important;
}
/* Suppress every legacy top/header bar if an older page include still emits it. */
body:has(.top.admin-topbar) > .top:not(.admin-topbar),
body:has(.top.admin-topbar) > header:not(.admin-topbar),
body:has(.top.admin-topbar) .legacy-topbar,
body:has(.top.admin-topbar) .legacy-admin-topbar,
body:has(.top.admin-topbar) .old-topbar,
body:has(.top.admin-topbar) .site-topbar,
body:has(.top.admin-topbar) .global-topbar:not(.admin-topbar){
  display:none !important;
}
@media(max-width:900px){
  body:has(.top.admin-topbar) .top.admin-topbar{height:66px !important;min-height:66px !important}
  body:has(.top.admin-topbar) .top.admin-topbar .brand .site-logo{max-width:86px !important;max-height:46px !important}
  body:has(.top.admin-topbar) .top.admin-topbar .brand > span:last-child{font-size:15px !important}
}
@media(max-width:620px){
  body:has(.top.admin-topbar) .top.admin-topbar{height:58px !important;min-height:58px !important}
  body:has(.top.admin-topbar) .top.admin-topbar .brand .site-logo{max-width:62px !important;max-height:38px !important}
  body:has(.top.admin-topbar) .top.admin-topbar .brand > span:last-child{font-size:11px !important;max-width:34vw !important}
}

/* =========================================================
   OES v2.5.1 — CANONICAL SINGLE BLUE TOPBAR
   One source of truth for the administrator header.
   The old white/professional header is not used.
   ========================================================= */
body:has(.top.admin-topbar) .top:not(.admin-topbar),
body:has(.top.admin-topbar) .admin-nav-head,
body:has(.top.admin-topbar) .admin-nav-head-professional,
body:has(.top.admin-topbar) .legacy-topbar,
body:has(.top.admin-topbar) .legacy-admin-topbar,
body:has(.top.admin-topbar) .old-topbar,
body:has(.top.admin-topbar) .site-topbar,
body:has(.top.admin-topbar) .global-topbar:not(.admin-topbar){
  display:none !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
}

.top.admin-topbar{
  position:sticky !important;
  top:0 !important;
  left:0 !important;
  width:100% !important;
  height:70px !important;
  min-height:70px !important;
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:24px !important;
  margin:0 !important;
  padding:0 28px !important;
  background:var(--blue) !important;
  color:#fff !important;
  border:0 !important;
  border-bottom:1px solid rgba(255,255,255,.16) !important;
  box-shadow:0 2px 8px rgba(0,0,0,.12) !important;
  z-index:2000 !important;
}
.top.admin-topbar .brand{
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  min-width:0 !important;
  flex:1 1 auto !important;
  color:#fff !important;
  font-size:20px !important;
  font-weight:800 !important;
}
.top.admin-topbar .brand .site-logo{
  display:block !important;
  width:auto !important;
  max-width:112px !important;
  max-height:54px !important;
  object-fit:contain !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  padding:0 !important;
}
.top.admin-topbar .brand > span:last-child{
  color:#fff !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  max-width:min(52vw,700px) !important;
  font-size:20px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
}
.top.admin-topbar nav{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:4px !important;
  flex:0 0 auto !important;
  white-space:nowrap !important;
  overflow:visible !important;
}
.top.admin-topbar nav a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  min-height:42px !important;
  margin:0 !important;
  padding:0 13px !important;
  border:1px solid transparent !important;
  border-radius:8px !important;
  background:transparent !important;
  color:#fff !important;
  text-decoration:none !important;
  font-size:13px !important;
  font-weight:700 !important;
}
.top.admin-topbar nav a:hover,
.top.admin-topbar nav a:focus-visible{
  background:rgba(255,255,255,.14) !important;
  border-color:rgba(255,255,255,.20) !important;
  color:#fff !important;
}
.top.admin-topbar nav .top-system-link{
  background:rgba(255,255,255,.10) !important;
  border-color:rgba(255,255,255,.14) !important;
  color:#fff !important;
}
.top.admin-topbar nav .top-system-link svg{
  width:16px !important;
  height:16px !important;
  fill:currentColor !important;
}
.top.admin-topbar nav .top-logout-link{color:#fff !important}
.top.admin-topbar nav .top-logout-link:hover{background:rgba(198,40,40,.28) !important}

/* Module navigation begins immediately below the single topbar. */
.admin-navigation{
  position:relative !important;
  top:auto !important;
  z-index:1000 !important;
  margin:0 !important;
  background:var(--surface,#fff) !important;
}
.admin-navigation > .module-bar{
  border-top:0 !important;
}

@media(max-width:900px){
  .top.admin-topbar{height:64px !important;min-height:64px !important;padding:0 14px !important;gap:10px !important}
  .top.admin-topbar .brand{gap:10px !important;font-size:15px !important}
  .top.admin-topbar .brand .site-logo{max-width:88px !important;max-height:44px !important}
  .top.admin-topbar .brand > span:last-child{font-size:15px !important;max-width:38vw !important}
  .top.admin-topbar nav{overflow-x:auto !important;scrollbar-width:none !important}
  .top.admin-topbar nav::-webkit-scrollbar{display:none !important}
  .top.admin-topbar nav a{min-height:38px !important;padding:0 8px !important;font-size:11px !important}
}
@media(max-width:620px){
  .top.admin-topbar{height:58px !important;min-height:58px !important;padding:0 9px !important}
  .top.admin-topbar .brand{gap:7px !important}
  .top.admin-topbar .brand .site-logo{max-width:64px !important;max-height:38px !important}
  .top.admin-topbar .brand > span:last-child{font-size:11px !important;max-width:30vw !important}
  .top.admin-topbar nav{gap:1px !important}
  .top.admin-topbar nav a{min-height:34px !important;padding:0 6px !important;font-size:10px !important}
  .top.admin-topbar nav .top-system-link span{display:none !important}
}


/* OES v2.5.2 — FINAL SINGLE BLUE TOPBAR
   The blue .top.admin-topbar is the only administrative header.
   The former white professional admin header is retired and must never render. */
.top.admin-topbar{
  background:var(--navy)!important;
  color:#fff!important;
  display:flex!important;
  width:100%!important;
  min-height:68px!important;
  height:68px!important;
  position:sticky!important;
  top:0!important;
  z-index:1000!important;
}
/* Legacy white header selectors from v2.4.x */
.admin-nav-head-professional,
.admin-header-actions,
.admin-brand-professional,
.admin-header-system{display:none!important;}
/* Never let a legacy header create vertical space. */
.admin-navigation>.admin-nav-head-professional{display:none!important;height:0!important;min-height:0!important;padding:0!important;margin:0!important;border:0!important;}
/* The module bar is navigation, not a second topbar. */
.admin-navigation{position:sticky!important;top:68px!important;z-index:900!important;}
.top.admin-topbar .top-system-link{display:inline-flex!important;align-items:center!important;gap:7px!important;}
.top.admin-topbar .top-system-link svg{width:16px!important;height:16px!important;fill:currentColor!important;}
@media(max-width:900px){.top.admin-topbar{height:62px!important;min-height:62px!important}.admin-navigation{top:62px!important}}
@media(max-width:620px){.top.admin-topbar{height:56px!important;min-height:56px!important}.admin-navigation{top:56px!important}}

/* OES v2.5.3 — CANONICAL BLUE TOPBAR: System Administration lives here. */
.top.admin-topbar {
  background: var(--blue, #1769e0) !important;
  color: #fff !important;
}
.top.admin-topbar .topbar-actions {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:6px !important;
  flex:0 0 auto !important;
  white-space:nowrap !important;
}
.top.admin-topbar .topbar-actions .top-system-link {
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  color:#fff !important;
  background:rgba(255,255,255,.12) !important;
  border:1px solid rgba(255,255,255,.20) !important;
  font-weight:800 !important;
}
.top.admin-topbar .topbar-actions .top-system-link svg {
  width:16px !important;
  height:16px !important;
  fill:currentColor !important;
  flex:0 0 16px !important;
}
.top.admin-topbar .topbar-actions a {
  color:#fff !important;
  text-decoration:none !important;
}
.top.admin-topbar .topbar-actions a:hover,
.top.admin-topbar .topbar-actions a:focus-visible {
  color:#fff !important;
  background:rgba(255,255,255,.18) !important;
}
/* Never allow a legacy white admin header to appear above the canonical blue bar. */
body:has(.top.admin-topbar) .admin-topbar-white,
body:has(.top.admin-topbar) .white-topbar,
body:has(.top.admin-topbar) .professional-admin-topbar,
body:has(.top.admin-topbar) .admin-header,
body:has(.top.admin-topbar) .admin-header-bar,
body:has(.top.admin-topbar) .admin-nav-head,
body:has(.top.admin-topbar) .admin-nav-head-professional {
  display:none !important;
}
@media (max-width: 760px) {
  .top.admin-topbar .topbar-actions .top-system-link span { display:inline !important; }
  .top.admin-topbar .topbar-actions a { padding-left:8px !important; padding-right:8px !important; font-size:11px !important; }
}


/* OES v2.5.6: clickable homepage brand */
.top .brand.brand-with-logo {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
.top .brand.brand-with-logo:hover,
.top .brand.brand-with-logo:focus-visible {
  text-decoration: none;
  opacity: .96;
}
.top .brand.brand-with-logo:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
  border-radius: 6px;
}

/* v2.5.10 — TVET master-data driven student creation */
.tvet-student-placement{margin-bottom:14px}
.tvet-student-placement select:disabled{opacity:.65;background:#f5f7fa}
.tvet-selection-summary{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap;margin:6px 0 22px;padding:14px 16px;border:1px solid #d8e3f0;border-radius:12px;background:#f7fbff;color:#334155}
.tvet-selection-summary strong{color:#0f3b67;white-space:nowrap}
.tvet-selection-summary span{font-weight:600;color:#52657d}
.tvet-student-placement small{display:block;margin-top:5px}

/* OES v2.5.25 — administrator-controlled global interface scaling
   The value is injected from includes/layout.php after this stylesheet. */
html,body{overflow-x:hidden}
body{zoom:var(--oes-ui-scale) !important;width:calc(100% / var(--oes-ui-scale)) !important;min-height:calc(100vh / var(--oes-ui-scale)) !important}
html{font-size:calc(16px * var(--oes-ui-scale))}
@supports not (zoom:1){body{font-size:calc(15px * var(--oes-ui-scale))}}
/* OES v2.5.27 Global Field Designer */
[data-oes-ui-grid]{display:grid;grid-auto-flow:row;align-items:start}
@media(max-width:900px){[data-oes-ui-grid] .oes-ui-field{grid-column:span 12!important}}
body.oes-design-mode .oes-ui-field{outline:2px dashed rgba(23,105,224,.28);outline-offset:3px}
body.oes-design-mode .oes-ui-field:hover{outline-color:#1769e0;background:rgba(23,105,224,.045)}
.finance-section-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:18px}.finance-section-card{min-width:0}.finance-link-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px}.finance-link{display:flex;gap:8px;align-items:flex-start;padding:8px 10px;border-radius:10px;background:rgba(23,105,224,.04);text-decoration:none}.finance-link:hover{background:rgba(23,105,224,.1)}.finance-link span{font-weight:800;color:var(--blue)}@media(max-width:980px){.finance-section-grid{grid-template-columns:1fr}.finance-link-grid{grid-template-columns:1fr}}

/* OES v2.5.41 — clean report printing
   Administrative chrome must never appear on printed reports. */
@media print {
  @page { margin: 14mm; }
  html, body {
    background: #fff !important;
    color: #000 !important;
    overflow: visible !important;
    zoom: 1 !important;
    width: auto !important;
    min-height: auto !important;
    font-size: 12pt !important;
  }

  /* Hide application chrome */
  .top.admin-topbar,
  .admin-navigation,
  .admin-nav-head,
  .admin-nav-head-professional,
  .admin-breadcrumb,
  #oes-ui-designer-launcher,
  [data-ui-designer-open],
  .oes-ui-server-launcher,
  .no-print,
  .print-hide {
    display: none !important;
  }

  /* Keep report/page content visible and full width */
  body:has(.top.admin-topbar) .wrap,
  body:has(.top.admin-topbar) .shell,
  body:has(.top.admin-topbar) main,
  body:has(.top.admin-topbar) .page,
  body:has(.top.admin-topbar) .report-page,
  body:has(.top.admin-topbar) .report-container {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: none !important;
  }

  /* Hide ordinary application footer/navigation on paper */
  footer,
  .top nav,
  .topbar-actions,
  .module-bar,
  .module-navigation {
    display: none !important;
  }

  /* Avoid clipped tables/cards in print */
  .card,
  .panel,
  .report-card,
  table {
    box-shadow: none !important;
    break-inside: avoid;
  }

  a { color: #000 !important; text-decoration: none !important; }
}

/* OES v2.5.44 — responsive auto-fit module navigation
   Top-level modules wrap and automatically share available width. */
.admin-navigation .module-bar.oes-horizontal-modules{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr)) !important;
  align-items:stretch !important;
  gap:6px !important;
  padding:7px 10px !important;
  width:100% !important;
  overflow:visible !important;
  white-space:normal !important;
}
.admin-navigation .module-bar .module-trigger{
  width:100% !important;
  min-width:0 !important;
  min-height:44px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  padding:8px 10px !important;
  text-align:center !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
  line-height:1.2 !important;
}
.admin-navigation .module-bar .module-trigger span{
  min-width:0 !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  text-align:center !important;
}
.admin-navigation .module-bar .module-trigger svg{
  flex:0 0 auto !important;
}
.admin-navigation .module-subnav.oes-horizontal-subnav{
  width:100% !important;
  overflow:visible !important;
}
.admin-navigation .module-subnav-panel.active{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:4px !important;
  width:100% !important;
  white-space:normal !important;
}
.admin-navigation .module-subnav-panel .module-sub-link{
  max-width:100% !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  text-align:center !important;
  line-height:1.2 !important;
}
@media(max-width:1100px){
  .admin-navigation .module-bar.oes-horizontal-modules{
    grid-template-columns:repeat(auto-fit,minmax(135px,1fr)) !important;
  }
}
@media(max-width:760px){
  .admin-navigation .module-bar.oes-horizontal-modules{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media(max-width:480px){
  .admin-navigation .module-bar.oes-horizontal-modules{
    grid-template-columns:1fr !important;
  }
  .admin-navigation .module-bar .module-trigger{
    justify-content:flex-start !important;
    text-align:left !important;
  }
  .admin-navigation .module-bar .module-trigger span{
    text-align:left !important;
  }
}

/* OES v2.5.46 — compact vertical module navigation
   Icons sit above labels and module spacing is reduced. */
.admin-navigation .module-bar.oes-horizontal-modules{
  grid-template-columns:repeat(auto-fit,minmax(120px,1fr)) !important;
  gap:2px !important;
  padding:4px 6px !important;
}
.admin-navigation .module-bar .module-trigger{
  min-height:58px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:3px !important;
  padding:6px 5px !important;
  line-height:1.08 !important;
}
.admin-navigation .module-bar .module-trigger svg{
  width:17px !important;
  height:17px !important;
  margin:0 !important;
}
.admin-navigation .module-bar .module-trigger span{
  display:block !important;
  width:100% !important;
  text-align:center !important;
}
@media(max-width:1100px){
  .admin-navigation .module-bar.oes-horizontal-modules{
    grid-template-columns:repeat(auto-fit,minmax(110px,1fr)) !important;
    gap:2px !important;
  }
}
@media(max-width:760px){
  .admin-navigation .module-bar.oes-horizontal-modules{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  .admin-navigation .module-bar .module-trigger{
    min-height:56px !important;
  }
}
@media(max-width:480px){
  .admin-navigation .module-bar.oes-horizontal-modules{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .admin-navigation .module-bar .module-trigger{
    justify-content:center !important;
    text-align:center !important;
  }
  .admin-navigation .module-bar .module-trigger span{
    text-align:center !important;
  }
}

/* OES v2.5.47 — enforce compact vertical module navigation after all legacy rules. */
.admin-navigation > .module-bar.oes-horizontal-modules{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(108px,1fr)) !important;
  gap:2px !important;
  padding:3px 4px !important;
  align-items:stretch !important;
  width:100% !important;
  overflow:visible !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules .module-trigger{
  width:100% !important;
  min-width:0 !important;
  min-height:58px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:2px !important;
  padding:5px 3px !important;
  text-align:center !important;
  white-space:normal !important;
  line-height:1.05 !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules .module-trigger > svg{
  display:block !important;
  width:18px !important;
  height:18px !important;
  flex:0 0 auto !important;
  margin:0 0 2px 0 !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules .module-trigger > span{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
  text-align:center !important;
  line-height:1.05 !important;
}
@media (max-width:1100px){
  .admin-navigation > .module-bar.oes-horizontal-modules{grid-template-columns:repeat(auto-fit,minmax(96px,1fr)) !important;}
}
@media (max-width:760px){
  .admin-navigation > .module-bar.oes-horizontal-modules{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
}
@media (max-width:480px){
  .admin-navigation > .module-bar.oes-horizontal-modules{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}


/* OES v2.5.48 — compact pill-style module navigation (reference layout) */
.admin-navigation > .module-bar.oes-horizontal-modules{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:4px !important;
  padding:3px 2px !important;
  width:100% !important;
  overflow:visible !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules .module-trigger{
  width:auto !important;
  min-width:0 !important;
  min-height:34px !important;
  height:auto !important;
  flex:0 1 auto !important;
  display:inline-flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:0 !important;
  padding:7px 16px !important;
  margin:0 !important;
  border-radius:10px !important;
  text-align:center !important;
  white-space:normal !important;
  line-height:1.15 !important;
  font-size:16px !important;
  font-weight:600 !important;
  box-sizing:border-box !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules .module-trigger > svg{
  display:none !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules .module-trigger > span{
  display:block !important;
  width:auto !important;
  min-width:0 !important;
  white-space:normal !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  text-align:center !important;
  line-height:1.15 !important;
}
@media (max-width:1100px){
  .admin-navigation > .module-bar.oes-horizontal-modules .module-trigger{font-size:15px !important;padding:6px 13px !important;}
}
@media (max-width:760px){
  .admin-navigation > .module-bar.oes-horizontal-modules{gap:3px !important;padding:2px !important;}
  .admin-navigation > .module-bar.oes-horizontal-modules .module-trigger{font-size:14px !important;padding:6px 11px !important;min-height:32px !important;}
}
@media (max-width:480px){
  .admin-navigation > .module-bar.oes-horizontal-modules .module-trigger{font-size:13px !important;padding:6px 9px !important;}
}


/* OES v2.5.49 — FINAL compact pill module navigation.  This must win over all previous module-bar rules. */
.admin-navigation > .module-bar.oes-horizontal-modules {
  display:flex !important;
  flex-flow:row wrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:4px !important;
  padding:2px 2px !important;
  margin:0 !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow:visible !important;
  white-space:normal !important;
  box-sizing:border-box !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger {
  flex:0 1 auto !important;
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
  min-height:0 !important;
  height:auto !important;
  margin:0 !important;
  padding:6px 12px !important;
  border-radius:9px !important;
  display:inline-flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:0 !important;
  font-size:14px !important;
  font-weight:600 !important;
  line-height:1.1 !important;
  text-align:center !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
  box-sizing:border-box !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger > svg,
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger .chevron {
  display:none !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger > span {
  display:block !important;
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  font-size:inherit !important;
  line-height:1.1 !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  text-align:center !important;
}
@media (max-width:900px) {
  .admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger {font-size:13px !important; padding:5px 10px !important;}
}
@media (max-width:620px) {
  .admin-navigation > .module-bar.oes-horizontal-modules {gap:3px !important; padding:2px !important;}
  .admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger {font-size:12px !important; padding:5px 8px !important; border-radius:8px !important;}
}

/* OES v2.5.50 — Compact pill modules WITH icons retained */
.admin-navigation > .module-bar.oes-horizontal-modules{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:5px !important;
  padding:4px 6px !important;
  overflow:visible !important;
  white-space:normal !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger{
  box-sizing:border-box !important;
  display:inline-flex !important;
  flex:0 1 auto !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:2px !important;
  min-width:0 !important;
  min-height:46px !important;
  max-width:220px !important;
  padding:5px 10px !important;
  margin:0 !important;
  border:1px solid var(--border) !important;
  border-radius:10px !important;
  background:#fff !important;
  color:#17324f !important;
  box-shadow:none !important;
  font-size:12px !important;
  font-weight:700 !important;
  line-height:1.08 !important;
  text-align:center !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger:hover,
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger.active{
  border-color:#9db9da !important;
  background:color-mix(in srgb,var(--blue) 10%,#fff) !important;
  color:var(--blue) !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger > svg,
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger > .chevron{
  display:block !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger > svg{
  width:15px !important;
  height:15px !important;
  flex:0 0 15px !important;
  margin:0 auto !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger > span{
  display:block !important;
  width:auto !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  font-size:inherit !important;
  line-height:inherit !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  text-align:center !important;
}
@media(max-width:900px){
  .admin-navigation > .module-bar.oes-horizontal-modules{gap:4px !important;padding:4px !important;}
  .admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger{min-height:44px !important;max-width:190px !important;padding:5px 8px !important;font-size:11px !important;}
  .admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger > svg{width:14px !important;height:14px !important;flex-basis:14px !important;}
}
@media(max-width:620px){
  .admin-navigation > .module-bar.oes-horizontal-modules{gap:3px !important;padding:3px !important;}
  .admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger{min-height:42px !important;max-width:160px !important;padding:4px 7px !important;border-radius:8px !important;font-size:10px !important;}
  .admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger > svg{width:13px !important;height:13px !important;flex-basis:13px !important;}
}


/* OES v2.5.51 — Force all top-level modules into one compact row */
.admin-navigation > .module-bar.oes-horizontal-modules{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:stretch !important;
  justify-content:stretch !important;
  gap:3px !important;
  padding:3px 4px !important;
  width:100% !important;
  max-width:100% !important;
  overflow:hidden !important;
  white-space:normal !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger{
  flex:1 1 0 !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  min-height:54px !important;
  padding:4px 5px !important;
  margin:0 !important;
  gap:2px !important;
  font-size:clamp(9px,0.70vw,12px) !important;
  line-height:1.03 !important;
  border-radius:9px !important;
  overflow:hidden !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger > svg{
  width:14px !important;
  height:14px !important;
  flex:0 0 14px !important;
  margin:0 auto 1px !important;
}
.admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger > span{
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  white-space:normal !important;
  overflow-wrap:break-word !important;
  word-break:normal !important;
  text-align:center !important;
}
@media(max-width:1100px){
  .admin-navigation > .module-bar.oes-horizontal-modules{overflow-x:auto !important;overflow-y:hidden !important;}
  .admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger{flex:0 0 auto !important;width:auto !important;min-width:82px !important;max-width:150px !important;font-size:10px !important;}
}
@media(max-width:620px){
  .admin-navigation > .module-bar.oes-horizontal-modules{gap:2px !important;padding:2px !important;}
  .admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger{min-width:76px !important;min-height:48px !important;padding:3px 4px !important;font-size:9px !important;border-radius:8px !important;}
  .admin-navigation > .module-bar.oes-horizontal-modules > .module-trigger > svg{width:13px !important;height:13px !important;flex-basis:13px !important;}
}


/* v2.5.53: Simple institutional student register form */
.student-capture-form{margin-top:4px}
.student-form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 18px;align-items:start;margin-bottom:20px}
.student-form-grid>div{min-width:0}
.student-form-grid .field-span-2{grid-column:span 2}
.student-form-grid .field-span-4{grid-column:1 / -1}
.student-capture-form input,.student-capture-form select,.student-capture-form textarea{height:42px;min-height:42px;padding:9px 12px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#142238;font:inherit;width:100%;box-sizing:border-box}
.student-capture-form textarea{height:88px;min-height:88px;resize:vertical}
.student-capture-form select{appearance:auto;-webkit-appearance:auto}
.student-capture-form input[readonly]{background:#f8fafc;font-weight:700}
.student-capture-form label{font-weight:700;margin:0 0 5px}
.student-capture-form .student-check{display:flex;align-items:center;gap:7px;margin:7px 0 0;font-weight:500;font-size:13px;color:#475467}
.student-capture-form .student-check input{width:auto;height:auto;min-height:0}
.student-form-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:2px}
@media(max-width:980px){.student-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.student-form-grid .field-span-2,.student-form-grid .field-span-4{grid-column:span 2}}
@media(max-width:620px){.student-form-grid{grid-template-columns:1fr}.student-form-grid .field-span-2,.student-form-grid .field-span-4{grid-column:1}}

/* OES v2.5.54 — Reusable Student Search across admin interfaces */
.top.admin-topbar nav .top-student-search-link{display:inline-flex;align-items:center;gap:6px;color:inherit;text-decoration:none;}
.top.admin-topbar nav .top-student-search-link svg{fill:currentColor;flex:0 0 auto;}
.top.admin-topbar nav .top-student-search-link:hover{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.20);}
.oes-student-search-modal{position:fixed;inset:0;z-index:99990;}
.oes-student-search-overlay{position:absolute;inset:0;background:rgba(15,23,42,.62);backdrop-filter:blur(2px);}
.oes-student-search-dialog{position:relative;z-index:2;width:min(1120px,calc(100vw - 28px));max-height:calc(100vh - 40px);margin:20px auto;background:#fff;border:1px solid #d9e2ec;border-radius:18px;box-shadow:0 24px 70px rgba(15,23,42,.28);overflow:auto;color:var(--text,#142238);}
.oes-student-search-header{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding:22px 24px 14px;border-bottom:1px solid #edf1f5;position:sticky;top:0;background:#fff;z-index:3;}
.oes-student-search-header h2{margin:0 0 5px;font-size:22px;}
.oes-student-search-header p{margin:0;color:#667085;font-size:13px;}
.oes-student-search-close{border:0;background:#f2f4f7;color:#344054;width:34px;height:34px;border-radius:9px;font-size:24px;line-height:1;cursor:pointer;}
.oes-student-search-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px;padding:20px 24px 8px;}
.oes-student-search-grid>div{min-width:0;}
.oes-student-search-grid label{display:block;font-weight:700;font-size:13px;margin:0 0 6px;}
.oes-student-search-grid input,.oes-student-search-grid select{width:100%;height:42px;box-sizing:border-box;border:1px solid #cbd5e1;border-radius:8px;background:#fff;padding:9px 12px;font:inherit;color:#142238;}
.oes-student-search-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 24px 16px;}
.oes-student-search-hotkey{margin-left:auto;font-size:11px;color:#667085;border:1px solid #d0d5dd;border-radius:6px;padding:4px 7px;background:#f8fafc;}
.oes-student-search-results{padding:0 24px 24px;}
.oes-student-search-result{display:flex;align-items:center;gap:12px;padding:12px 10px;border:1px solid #edf1f5;border-radius:10px;margin-top:8px;text-decoration:none;color:inherit;background:#fff;}
.oes-student-search-result:hover{background:#f8fbff;border-color:#cfe0ff;}
.oes-student-search-avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#eef4ff;color:#1769e0;font-weight:800;flex:0 0 auto;}
.oes-student-search-main{display:block;min-width:0;}
.oes-student-search-main strong{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.oes-student-search-main small,.oes-student-search-main em{display:block;font-size:11px;color:#667085;font-style:normal;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.oes-student-search-arrow{margin-left:auto;color:#98a2b3;font-size:18px;}
.oes-student-search-empty,.oes-student-search-loading,.oes-student-search-error{padding:34px 15px;text-align:center;color:#667085;border:1px dashed #d9e2ec;border-radius:12px;margin-top:10px;}
.oes-student-search-error{color:#b42318;background:#fff6f6;border-color:#f4c7c7;}
body.oes-search-open{overflow:hidden;}
@media(max-width:780px){
  .oes-student-search-dialog{max-height:calc(100vh - 16px);margin:8px auto;border-radius:14px;}
  .oes-student-search-grid{grid-template-columns:1fr;padding:16px 16px 8px;}
  .oes-student-search-header{padding:18px 16px 12px;}
  .oes-student-search-actions,.oes-student-search-results{padding-left:16px;padding-right:16px;}
  .oes-student-search-hotkey{margin-left:0;}
}


/* v2.5.55: Search controls use buttons to open the standard student search panel. */
.top.admin-topbar nav .top-search-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 12px;border:1px solid rgba(255,255,255,.22);border-radius:8px;background:rgba(255,255,255,.08);font-weight:700;}
.top.admin-topbar nav .top-search-button:hover{background:rgba(255,255,255,.16);}
.student-inline-search{display:flex;flex-direction:column;justify-content:flex-start;}
.student-search-trigger{height:42px;min-height:42px;display:inline-flex;align-items:center;justify-content:center;width:100%;font-weight:700;}
.student-inline-search small{margin-top:6px;}
@media (max-width:700px){.student-inline-search .student-search-trigger{width:100%;}}


/* OES v2.5.56 - Student Register search launcher */
.student-search-card{padding:24px 28px;}
.student-search-card-inner{display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.student-search-card h2{margin:0;}
.student-search-card .muted{margin:0;flex:1 1 320px;}
.student-search-card .student-search-trigger{min-width:210px;}
@media (max-width:700px){.student-search-card-inner{display:block}.student-search-card .muted{margin:8px 0 14px}.student-search-card .student-search-trigger{width:100%;}}


/* OES v2.5.57 - Keep shared student search hidden until launched. */
.oes-student-search-modal[hidden],
.oes-student-search-modal[aria-hidden="true"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.oes-student-search-modal:not([hidden]) {
  display: block !important;
  visibility: visible;
  pointer-events: auto;
}

/* OES v2.5.58 - Student Register uses a dedicated search page; shared modal is not injected there. */

/* v2.5.114 Saroki Systems login branding */
.saroki-login-card{text-align:left;padding:30px 34px}.saroki-login-brand{text-align:left;margin-bottom:22px}.saroki-login-logo{display:block;margin:0 0 14px}.saroki-login-name{font-size:42px;line-height:1.08;font-weight:800;letter-spacing:-.02em;color:var(--text)}.saroki-login-brand .muted{font-size:18px;margin:10px 0 0}.saroki-login-card form{margin-top:18px}@media(max-width:560px){.saroki-login-card{padding:24px}.saroki-login-name{font-size:34px}}

/* OES v2.5.147 — Compact Student Finance menus. Keep finance actions small like header navigation pills. */
.student-finance-menu{display:flex;flex-wrap:wrap;gap:6px;grid-template-columns:none!important}
.student-finance-menu .quick-action{display:inline-flex;flex:0 0 auto;align-items:center;gap:6px;padding:6px 10px;min-height:34px;border-radius:7px;font-size:11px;line-height:1.1;box-shadow:none}
.student-finance-menu .quick-action .qa-icon{width:22px;height:22px;border-radius:5px;font-size:12px}
.student-finance-menu .quick-action span:last-child{display:inline-flex;align-items:center;gap:4px}
.student-finance-menu .quick-action strong{font-size:11px;white-space:nowrap}
.student-finance-menu .quick-action small{font-size:9px;color:var(--muted);white-space:nowrap}
.student-finance-menu .quick-action:hover{transform:none}
@media(max-width:560px){.student-finance-menu{gap:5px}.student-finance-menu .quick-action{padding:6px 8px;min-height:32px}.student-finance-menu .quick-action small{display:none}}

/* OES v2.5.148 — Student Finance menu must match the compact header navigation pills. */
.student-finance-menu{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:4px !important;
  width:max-content !important;
  max-width:100% !important;
  grid-template-columns:none !important;
}
.student-finance-menu .quick-action{
  display:inline-flex !important;
  flex:0 0 auto !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  min-height:39px !important;
  height:39px !important;
  width:auto !important;
  padding:8px 11px !important;
  margin:0 !important;
  border:0 !important;
  border-radius:9px !important;
  background:transparent !important;
  color:#344054 !important;
  font-size:13px !important;
  font-weight:700 !important;
  line-height:1 !important;
  box-shadow:none !important;
  transform:none !important;
}
.student-finance-menu .quick-action:hover{
  background:var(--surface-2) !important;
  color:var(--blue) !important;
  border-color:transparent !important;
  transform:none !important;
}
.student-finance-menu .quick-action .qa-icon{
  width:16px !important;
  height:16px !important;
  min-width:16px !important;
  border-radius:0 !important;
  background:transparent !important;
  color:currentColor !important;
  font-size:15px !important;
}
.student-finance-menu .quick-action span:last-child{display:inline-flex !important;align-items:center !important;gap:0 !important;}
.student-finance-menu .quick-action strong{font-size:13px !important;white-space:nowrap !important;font-weight:700 !important;}
.student-finance-menu .quick-action small{display:none !important;}
@media(max-width:560px){
  .student-finance-menu{gap:2px !important;width:100% !important;}
  .student-finance-menu .quick-action{min-height:36px !important;height:36px !important;padding:7px 9px !important;font-size:11px !important;}
  .student-finance-menu .quick-action strong{font-size:11px !important;}
  .student-finance-menu .quick-action .qa-icon{width:15px !important;height:15px !important;font-size:13px !important;}
}

/* v2.5.149 — Student Finance menu uses exact header-style compact pills. */
.student-finance-header-menu a{transition:background .15s ease,color .15s ease}
.student-finance-header-menu a:hover{background:var(--surface-2)!important;color:var(--blue)!important}
@media(max-width:560px){.student-finance-header-menu{gap:2px!important;width:100%!important}.student-finance-header-menu a{height:36px!important;min-height:36px!important;padding:7px 9px!important;font-size:11px!important}.student-finance-header-menu a span{font-size:13px!important}}


/* OES v2.5.150 — Student Billing transactions use the same compact header-style menu as all finance menus. */
.student-finance-header-menu{display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:4px!important;width:max-content!important;max-width:100%!important}
.student-finance-header-menu a{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;height:39px!important;min-height:39px!important;width:auto!important;padding:8px 12px!important;margin:0!important;border:1px solid #cbd5e1!important;border-radius:8px!important;background:#475467!important;color:#fff!important;text-decoration:none!important;font-size:13px!important;font-weight:700!important;line-height:1!important;box-shadow:0 1px 2px rgba(16,24,40,.08)!important;white-space:nowrap!important;cursor:pointer!important;transition:background .15s ease,color .15s ease,border-color .15s ease,transform .05s ease!important}
.student-finance-header-menu a:hover{background:var(--blue)!important;border-color:var(--blue)!important;color:#fff!important}
.student-finance-header-menu a:active{transform:translateY(1px)!important}
.student-finance-header-menu a:focus-visible{outline:2px solid color-mix(in srgb,var(--blue) 45%,transparent)!important;outline-offset:2px!important}
.student-finance-header-menu .qa-icon{display:grid!important;place-items:center!important;width:16px!important;height:16px!important;min-width:16px!important;border-radius:0!important;background:transparent!important;color:currentColor!important;font-size:15px!important}
.student-finance-header-menu a>span:last-child{display:inline!important;font-size:13px!important}
@media(max-width:560px){.student-finance-header-menu{gap:2px!important;width:100%!important}.student-finance-header-menu a{height:36px!important;min-height:36px!important;padding:7px 9px!important;font-size:11px!important}.student-finance-header-menu .qa-icon{width:15px!important;height:15px!important;min-width:15px!important;font-size:13px!important}.student-finance-header-menu a>span:last-child{font-size:11px!important}}

/* Student Finance operations: compact button menu */
.student-finance-operations-menu{display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:6px!important;width:100%!important;max-width:100%!important}
.student-finance-operations-menu .sf-menu-button{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;height:38px!important;min-height:38px!important;padding:0 13px!important;border:1px solid #475467!important;border-radius:8px!important;background:#475467!important;color:#fff!important;text-decoration:none!important;font-size:12px!important;font-weight:700!important;line-height:1!important;white-space:nowrap!important;box-shadow:0 1px 2px rgba(16,24,40,.12)!important;cursor:pointer!important;box-sizing:border-box!important;transition:background .15s ease,border-color .15s ease,transform .05s ease!important}
.student-finance-operations-menu .sf-menu-button:hover{background:var(--blue)!important;border-color:var(--blue)!important;color:#fff!important;text-decoration:none!important}
.student-finance-operations-menu .sf-menu-button:active{transform:translateY(1px)!important}
.student-finance-operations-menu .sf-menu-button:focus-visible{outline:2px solid var(--blue)!important;outline-offset:2px!important}
.student-finance-operations-menu .sf-menu-button .qa-icon{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:16px!important;height:16px!important;min-width:16px!important;background:transparent!important;color:#fff!important;font-size:13px!important;line-height:1!important}
@media(max-width:560px){.student-finance-operations-menu{gap:5px!important}.student-finance-operations-menu .sf-menu-button{height:36px!important;min-height:36px!important;padding:0 10px!important;font-size:11px!important}}

/* v2.5.179 — all ERP submenu controls use a true button appearance */
.admin-navigation .module-sub-button,
.oes-horizontal-subnav .module-sub-button {
  appearance:none !important; -webkit-appearance:none !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  gap:7px !important; min-height:36px !important; padding:7px 13px !important;
  border:1px solid #475467 !important; border-radius:8px !important;
  background:#475467 !important; color:#fff !important;
  box-sizing:border-box !important; white-space:nowrap !important;
  text-decoration:none !important; font:inherit !important; font-size:12px !important;
  font-weight:700 !important; line-height:1.1 !important; cursor:pointer !important;
  box-shadow:0 1px 2px rgba(16,24,40,.12) !important;
  transition:background .15s ease,border-color .15s ease,transform .05s ease !important;
}
.admin-navigation .module-sub-button:hover,
.oes-horizontal-subnav .module-sub-button:hover {
  background:var(--blue) !important; border-color:var(--blue) !important; color:#fff !important;
}
.admin-navigation .module-sub-button:active,
.oes-horizontal-subnav .module-sub-button:active { transform:translateY(1px) !important; }
.admin-navigation .module-sub-button.active,
.oes-horizontal-subnav .module-sub-button.active {
  background:var(--blue) !important; color:#fff !important; border-color:var(--blue) !important;
}
.admin-navigation .module-sub-button:focus-visible,
.oes-horizontal-subnav .module-sub-button:focus-visible {
  outline:2px solid var(--blue) !important; outline-offset:2px !important;
}
.admin-navigation .module-sub-button.has-children { display:inline-flex !important; align-items:center !important; gap:7px !important; }
.admin-navigation .module-sub-button .third-tier-chevron { color:currentColor !important; font-size:16px !important; }
@media(max-width:900px){
  .admin-navigation .module-subnav-panel{gap:6px !important;}
  .admin-navigation .module-sub-button{flex:0 0 auto !important;}
}
@media(max-width:560px){
  .admin-navigation .module-sub-button, .oes-horizontal-subnav .module-sub-button {
    min-height:34px !important; padding:6px 10px !important; font-size:11px !important;
  }
}

/* OES v2.5.175 — true three-tier ERP navigation. All levels use buttons. */
.admin-navigation .module-thirdnav{
  width:100%;
  border-top:1px solid var(--border);
  background:var(--surface);
  padding:6px 10px;
  overflow-x:auto;
  overflow-y:hidden;
}
.admin-navigation .module-thirdnav[hidden]{display:none!important}
.admin-navigation .module-thirdnav-panel{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:5px;
}
.admin-navigation .module-thirdnav-panel[hidden]{display:none!important}
.admin-navigation .module-third-button{
  appearance:none !important; -webkit-appearance:none !important;
  border:1px solid #475467 !important;
  background:#475467 !important;
  color:#fff !important;
  border-radius:8px !important;
  padding:7px 12px !important;
  min-height:36px !important;
  font:inherit;
  font-size:12px;
  font-weight:700;
  line-height:1.15;
  cursor:pointer;
  white-space:nowrap;
  box-shadow:0 1px 2px rgba(16,24,40,.12);
  transition:background .15s ease,color .15s ease,border-color .15s ease,transform .1s ease;
}
.admin-navigation .module-third-button:hover,
.admin-navigation .module-third-button:focus-visible{
  background:var(--blue);
  color:#fff;
  border-color:var(--blue);
  outline:none;
}
.admin-navigation .module-sub-button.has-children{
  display:inline-flex;
  align-items:center;
  gap:7px;
}
.admin-navigation .third-tier-chevron{
  font-size:18px;
  line-height:1;
  opacity:.75;
}
.admin-navigation .module-sub-button[aria-expanded="true"]{
  background:color-mix(in srgb,var(--blue) 12%,var(--surface));
  border-color:var(--blue);
}
@media(max-width:760px){
  .admin-navigation .module-thirdnav{padding:6px 7px}
  .admin-navigation .module-thirdnav-panel{flex-wrap:nowrap}
  .admin-navigation .module-third-button{flex:0 0 auto;font-size:12px;padding:6px 9px}
}