/* Version 28: approved blue dashboard palette across every logbook screen.
   One sidebar and top ribbon remain in place as sections change. */
:root,
body[data-theme="male"],body[data-theme="female"],body[data-theme="staff"]{
  --paper:#f2f7fd;--paper-2:#e8f3fd;--soft:#eff7ff;
  --card:#fff;--input:#fff;--line:#cbdff0;
  --ink:#153c65;--teal:#164976;--teal-2:#0c3566;
  --brass:#287dc2;--brass-2:#a2d8ff;
  --sidebar-start:#0a4a83;--sidebar-end:#062e5f;
}
body,body #main,body #facultyDash{background:#f2f7fd!important;color:#10375e}
body #topbar{background:#fff!important;border-bottom:1px solid #c9deed!important}
body .card,body .v18-box,body .v20-box,body details.ref,body .saved-editor,body .posting-card,body .monthly-entry{background:#fff;border-color:#cbdff0}
body .v18-root,body .v20-legacy{color:#143b66}
body .v18-card,body .v18-section-card,body .v18-index-card{background:#fff!important;border-color:#cbdff0!important}
body table.tbl th{background:#e5f2fd!important;color:#163b68!important;border-color:#c6dcee!important}
body table.tbl td{border-color:#d7e5f2;color:#133a62}
body table.tbl tr:nth-child(even) td{background:#f6faff}
body .sec-title,body .card h3,body .card h4,body .dash-title{color:#103f73}
body input,body select,body textarea{border-color:#c2d5e8}
body .btn.primary,body .btn.brass,body .hod-review .btn{background:#1163a4!important;color:white!important;border-color:#1163a4!important}
body .btn.primary:hover,body .btn.brass:hover,body .hod-review .btn:hover{background:#09518b!important}
body .deadline-note,body .flash-message{background:#edf6ff;color:#153b64;border-color:#d0e4f5}
/* The existing institutional identity and the sidebar toggle are retained, unchanged in meaning/order. */
body #sidebar{
 background:linear-gradient(170deg,#09538e 0%,#063d71 44%,#072f60 100%)!important;
 color:#eaf6ff;width:236px;flex:0 0 236px;padding:12px 0 25px;
 overscroll-behavior:contain;scrollbar-color:#638eb3 transparent;
}
body #sidebar .sidebar-tools{height:29px;margin:0 7px 2px;padding:0 6px;justify-content:flex-end}
body #sidebar .sidebar-tools button{height:30px;min-height:30px;max-height:30px;width:30px;min-width:30px;max-width:30px;padding:4px;border:1px solid #d9ebff43;border-radius:6px;color:white}
body #sidebar .brand{padding:5px 9px 18px!important;text-align:center!important;border-bottom:1px solid #9cc5e84d;margin:0 0 9px}
body #sidebar .brand .sidebar-logo{height:76px;width:86px;max-width:100%;object-fit:contain;display:block;margin:0 auto 6px!important}
body #sidebar .brand h1{color:white;font:800 17px/1.32 Arial,'Segoe UI',sans-serif;margin:0 0 10px;text-align:center}
body #sidebar .brand .sidebar-affiliation{color:#fff;font:600 12.8px/1.4 Arial,'Segoe UI',sans-serif}
body #sidebar .brand .sidebar-affiliation strong{font-size:12.8px;display:block;margin-bottom:5px}
body #sidebar .brand .sidebar-college{color:#d9ebfc;font-size:11.4px;line-height:1.45;margin:0}
body #sidebar #navlinks,body #sidebar #navlinks.v18-sidebar,body #sidebar #navlinks.v20-legacy-nav{display:flex!important;flex-direction:column!important;align-items:stretch!important;padding:5px 9px 28px!important;gap:2px}
body #sidebar #navlinks a,body #sidebar #navlinks.v18-sidebar a,body #sidebar #navlinks.v20-legacy-nav a{
 display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;
 width:auto!important;min-height:39px!important;margin:1px 0!important;padding:9px 10px!important;
 color:#e9f5ff!important;font:600 12.2px/1.3 Arial,'Segoe UI',sans-serif!important;
 border:0!important;border-radius:6px!important;background:transparent;box-shadow:none;
 white-space:normal;text-decoration:none;text-align:left;
}
body #sidebar #navlinks a:hover{background:#1973b6!important;color:#fff!important}
body #sidebar #navlinks a.active,body #sidebar #navlinks a[aria-current="page"]{background:#197bc4!important;color:#fff!important;font-weight:750!important;box-shadow:none!important}
body #sidebar #navlinks .v28-nav-icon{display:inline-flex!important;align-items:center;justify-content:center;flex:0 0 21px!important;width:21px!important;min-width:21px!important;height:24px;color:#e0f3ff;background:none!important}
body #sidebar #navlinks .v28-nav-icon svg{display:block;width:19px;height:19px}
body #sidebar #navlinks a .num,body #sidebar #navlinks a .v18-navnum,body #sidebar #navlinks a .v20-icon{display:none!important}
body #sidebar #navlinks a.v20-existing-personal::before{display:none!important;content:none!important}
body #sidebar #navlinks .v18-navhead,body #sidebar #navlinks .v20-navhead{
  margin:12px 10px 3px!important;padding:7px 0 0!important;color:#a9cfea!important;
  font:750 9.5px/1.35 'Segoe UI',Arial,sans-serif!important;letter-spacing:1px;
}
body #sidebar #navlinks .pg-v27-home-link{order:-100;margin:2px 0 8px!important}
body #sidebar #navlinks .pg-v27-home-icon{display:none!important}
body #sidebar #navlinks a::before{display:none!important;content:none!important}
body #topbar{position:sticky;top:0;z-index:20;min-height:72px;gap:12px;padding:13px 20px!important}
body #topbar .college-ribbon-title{color:#082f61;font-size:16.5px;line-height:1.35;font-weight:850;margin-right:auto}
body #topbar .college-ribbon-title::after{content:'Postgraduate Student E-Logbook';display:block;font-size:12px;font-weight:500;color:#466c90;margin-top:2px}
body #topbar #statusMsg{font-size:11px;flex:0 1 auto;max-width:170px;color:#5a7794}
body #topbar .account-identity{min-width:0;flex-shrink:0}
/* Compact chat-style rail retains small logo and icon shortcuts. */
@media(min-width:881px){
 body.sidebar-closed #sidebar{width:70px!important;max-width:70px!important;min-width:70px!important;flex:0 0 70px!important;padding-top:10px!important;}
 body.sidebar-closed #sidebar .brand{padding:3px 1px 9px!important;min-height:55px!important}
 body.sidebar-closed #sidebar .brand .sidebar-logo{width:47px!important;height:47px!important;margin:0 auto!important}
 body.sidebar-closed #sidebar .brand h1,body.sidebar-closed #sidebar .brand .sidebar-affiliation{display:none!important}
 body.sidebar-closed #sidebar .sidebar-tools{justify-content:center;margin:0 auto 5px}
 body.sidebar-closed #sidebar #navlinks,body.sidebar-closed #sidebar #navlinks.v18-sidebar,body.sidebar-closed #sidebar #navlinks.v20-legacy-nav{padding:7px 7px 30px!important;gap:4px}
 body.sidebar-closed #sidebar #navlinks a,body.sidebar-closed #sidebar #navlinks.v18-sidebar a,body.sidebar-closed #sidebar #navlinks.v20-legacy-nav a{
  width:52px!important;max-width:52px!important;min-width:52px!important;min-height:44px!important;height:44px!important;
  margin:1px 0!important;padding:6px!important;font-size:0!important;justify-content:center!important;gap:0!important;
 }
 body.sidebar-closed #sidebar #navlinks a .v28-nav-icon{display:inline-flex!important;flex:0 0 27px!important;width:27px!important;height:30px!important}
 body.sidebar-closed #sidebar #navlinks a .v28-nav-icon svg{width:21px;height:21px}
 body.sidebar-closed #sidebar #navlinks .v18-navhead,body.sidebar-closed #sidebar #navlinks .v20-navhead{font-size:0!important;height:0!important;line-height:0!important;margin:5px 3px 3px!important;overflow:hidden}
 body.sidebar-closed #sidebar #navlinks a::before{display:none!important}
}
/* Reuse the approved Microbiology dashboard's actual content *inside* the same permanent shell. */
#v28DashboardPane{display:none;min-width:0;box-sizing:border-box;background:#f2f7fd}
body.v28-show-dashboard #v28DashboardPane{display:block}
body.v28-show-dashboard #main > :not(#topbar):not(#v28DashboardPane):not(#pgReviewerIdentity){display:none!important}
body.v28-show-dashboard #main{padding:0!important;background:#f2f7fd!important}
#v28DashboardPane .v27-hero{min-height:152px;padding:21px 26px 17px}
#v28DashboardPane .v27-hero h1{margin:7px 0}
#v28DashboardPane .v27-content{padding:15px 17px 30px}
#v28DashboardPane .v27-two,#v28DashboardPane .v27-bottom,#v28DashboardPane .v27-last{width:100%}
#v28DashboardPane .v27-portrait{background:#e4f2fd}
body.v28-loading-student #facultyDash.v27-student-mode{visibility:hidden}
/* Approved login illustration: crop excessive sky; display the actual college buildings.
   The image was reframed from the previously approved banner only. */
#loginScreen .v25-campus-header{
  height:clamp(345px,28vw,402px)!important;min-height:0!important;
  padding:10px 13px 10px!important;display:flex;flex-direction:column;
  justify-content:flex-start!important;align-items:center;
  background:#cfeafe url('assets/college-campus-framed-v28.webp') center center/cover no-repeat!important;
  isolation:isolate;position:relative;
}
#loginScreen .v25-campus-header::before{
 content:''!important;display:block!important;position:absolute;z-index:0;pointer-events:none;
 inset:120px 8% 60px;background:radial-gradient(ellipse at 50% 42%,#fffffff4 1%,#ffffffdd 40%,#ffffff12 75%,transparent 85%);
}
#loginScreen .v25-campus-header::after{display:none!important}
#loginScreen .v25-campus-pics{display:none!important}
#loginScreen .v25-emblem{
  display:block!important;position:relative!important;z-index:1!important;overflow:visible!important;
  clip-path:none!important;white-space:normal!important;
  width:124px!important;height:124px!important;max-width:130px!important;object-fit:contain!important;
  margin:0 0 2px!important;padding:0!important;filter:drop-shadow(0 1px 3px #fff);
}
#loginScreen .v25-college-name{
 display:block!important;position:relative!important;z-index:1!important;overflow:visible!important;
 clip-path:none!important;white-space:normal!important;height:auto!important;width:auto!important;
 font:700 clamp(18px,2.13vw,30px)/1.18 Georgia,serif!important;max-width:96%;margin:2px 0 13px!important;
 color:#092d5e;text-shadow:0 1px 9px #fff,0 0 15px #fff;
}
#loginScreen .v25-programme-title{position:relative;z-index:1;font:700 clamp(30px,3.15vw,48px)/1.1 Georgia,serif;margin:0 0 5px!important;color:#072f65;text-shadow:0 0 12px #fff,0 0 19px white}
#loginScreen .v25-programme-subtitle{position:relative;z-index:1;font-size:clamp(12px,1.17vw,18px);color:#345d84;margin:0!important;text-shadow:0 0 8px #fff,0 0 15px #fff}
#loginScreen .v25-login-layout{max-width:1520px;grid-template-columns:minmax(0,1.54fr) minmax(310px,1fr);gap:15px;padding:0 18px 8px}
#loginScreen .v25-info-panel,#loginScreen .v25-login-panel{border-radius:12px;background:#fff;border:1px solid #d5e5f2;box-shadow:0 5px 15px #244a7911}
@media(max-width:920px){
 #loginScreen .v25-login-layout{grid-template-columns:1fr}
 #loginScreen .v25-campus-header{height:345px!important}
 #loginScreen .v25-college-name{font-size:clamp(16px,3vw,23px)!important}
}
@media(max-width:880px){
 body #sidebar{width:100%!important;flex:auto!important;}
 body.sidebar-closed #sidebar{display:none!important}
 body #sidebar .brand h1{font-size:17px}
 body #topbar{min-height:64px;padding:10px 14px!important}
 body #topbar .college-ribbon-title{font-size:13px}
 #v28DashboardPane .v27-content{padding:10px}
}
@media(max-width:650px){
 #loginScreen .v25-campus-header{height:280px!important;padding-top:7px!important;background-size:auto 100%!important}
 #loginScreen .v25-emblem{width:84px!important;height:84px!important}
 #loginScreen .v25-college-name{font-size:16px!important;max-width:98%;margin:2px 0 7px!important}
 #loginScreen .v25-programme-title{font-size:25px!important}
 #loginScreen .v25-programme-subtitle{font-size:11px!important}
 #loginScreen .v25-campus-header::before{inset:70px 0 20px}
 #loginScreen .v25-login-layout{padding:0 10px 10px}
}
@media print{body.v28-show-dashboard #v28DashboardPane{display:block}body #sidebar{display:none!important}}
/* Final alignment refinements: unobstructed login emblem and a tidy dashboard ribbon. */
@media(min-width:921px){
 #loginScreen .v25-emblem{width:158px!important;height:151px!important;max-width:160px!important}
 #loginScreen .v25-college-name{margin-bottom:8px!important}
}
body.v28-show-dashboard #topbar #whoBadge,body.v28-show-dashboard #topbar #statusMsg{display:none!important}
body.v28-loading-student::after{content:'Opening your postgraduate E-Logbook…';position:fixed;left:50%;top:46%;z-index:1500;transform:translate(-50%,-50%);padding:18px 26px;border-radius:10px;background:#fff;color:#0a4274;box-shadow:0 6px 30px #153e691b;font:700 15px 'Segoe UI',Arial,sans-serif;pointer-events:none}
