@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Poppins:wght@400;500;600;700&display=swap');

:root{
  --poppins:Futura, "Futura PT", "Century Gothic", "Trebuchet MS", sans-serif;
  --lato:Futura, "Futura PT", "Century Gothic", "Trebuchet MS", sans-serif;
  --app-bg:#f6f7fb;
  --app-surface:#ffffff;
  --app-surface-2:#f9fafc;
  --app-border:#dfe4ec;
  --app-border-soft:#edf0f5;
  --app-text:#182230;
  --app-muted:#667085;
  --app-primary:#00bc96;
  --app-primary-hover:#00a584;
  --app-accent:#00bc96;
  --app-header:#4f5e70;
  --app-danger:#b42318;
  --app-warning:#b54708;
  --app-radius:8px;
  --app-shadow:0 10px 28px rgba(16,24,40,.07);
  --app-shadow-sm:0 2px 8px rgba(16,24,40,.06);
  --sidebar-width:272px;
  --sidebar-collapsed-width:76px;
}

*{box-sizing:border-box}

html{min-height:100%}

body{
  min-height:100vh;
  background:#f2f5fa;
  color:#323b44;
  font-family:"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:14px;
  line-height:1.5;
}

.app-shell{
  display:flex;
  min-height:100vh;
  width:100%;
}

.app-sidebar{
  background:#0229BD;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  box-shadow:0 20px 50px rgba(16,24,40,.12);
  color:#182230;
  display:flex;
  flex-direction:column;
  flex:0 0 var(--sidebar-width);
  height:calc(100vh - 2rem);
  margin:1rem;
  min-height:0;
  padding:1rem .75rem;
  position:sticky;
  top:1rem;
  transition:flex-basis .2s ease,width .2s ease,background .2s ease;
  z-index:1000;
}

.app-content{
  display:flex;
  flex:1;
  flex-direction:column;
  min-width:0;
}

.sidebar-brand{
  border-bottom:1px solid var(--app-border-soft);
  margin-bottom:.9rem;
  padding:.25rem .55rem 1rem;
}

.sidebar-brand a{
  align-items:center;
  color:#101828;
  display:flex;
  font-size:1.15rem;
  font-weight:800;
  gap:.65rem;
  text-decoration:none;
}

.sidebar-brand .site-logo{
  align-items:center;
  display:inline-flex;
  height:26px;
  justify-content:center;
  object-fit:contain;
  width:26px;
}

.login-logo{
  height:36px;
  margin-bottom:.3rem;
  object-fit:contain;
  width:36px;
}

.sidebar-brand small{
  color:#667085;
  display:block;
  font-size:.76rem;
  font-weight:600;
  margin:.35rem 0 0 3rem;
}

.sidebar-nav{
  display:flex;
  flex:1;
  flex-direction:column;
  gap:.15rem;
  overflow-y:auto;
  padding-right:.15rem;
}

.sidebar-toggle{
  align-items:center;
  background:#101828;
  border:3px solid #f6f7fb;
  border-radius:999px;
  box-shadow:0 8px 18px rgba(16,24,40,.18);
  color:#fff;
  display:inline-flex;
  height:30px;
  justify-content:center;
  position:absolute;
  right:-15px;
  top:62px;
  transition:transform .2s ease,background .2s ease;
  width:30px;
  z-index:5;
}

.sidebar-toggle:hover{background:var(--app-primary)}

.sidebar-label{
  color:#98a2b3;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.08em;
  margin:1rem .65rem .3rem;
  text-transform:uppercase;
}

.sidebar-link{
  align-items:center;
  border:1px solid transparent;
  border-radius:10px;
  background:transparent;
  color:#475467;
  display:flex;
  font-weight:700;
  gap:.7rem;
  min-height:44px;
  padding:.45rem .55rem;
  position:relative;
  text-decoration:none;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,color .16s ease;
  width:100%;
}

.sidebar-link i{
  align-items:center;
  background:#f2f4f7;
  border:1px solid #e4e7ec;
  border-radius:8px;
  color:#667085;
  display:inline-flex;
  font-size:1rem;
  height:32px;
  justify-content:center;
  width:32px;
}

.sidebar-nav .sidebar-link::after{
  color:#98a2b3;
  content:"\F285";
  font-family:"bootstrap-icons";
  font-size:.72rem;
  margin-left:auto;
  opacity:.8;
}

.sidebar-link:hover,
.sidebar-link:focus{
  background:#f8fafc;
  border-color:#e4e7ec;
  box-shadow:0 4px 12px rgba(16,24,40,.06);
  color:#182230;
  text-decoration:none;
}

.sidebar-link:hover i,
.sidebar-link:focus i{
  background:#e6faf5;
  border-color:#b5ead9;
  color:#00a584;
}

.sidebar-link.active{
  background:#e6faf5;
  border-color:#b5ead9;
  color:#00876d;
  box-shadow:0 8px 18px rgba(0,188,150,.12);
}

.sidebar-link.active i{
  background:#00bc96;
  border-color:#00bc96;
  color:#fff;
}

.sidebar-link.active::after{color:#00a584}

/* Sidebar tinted to match the masthead (navy) */
.sidebar-brand a,
.sidebar-brand small{color:#fff}
.sidebar-brand small{color:rgba(255,255,255,.65)}
.sidebar-label{color:rgba(255,255,255,.55)}
.sidebar-link{color:#dbe4f5}
.sidebar-link i{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.14);color:#c7d4ee}
.sidebar-nav .sidebar-link::after{color:rgba(255,255,255,.5)}
.sidebar-link:hover,
.sidebar-link:focus{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.16);color:#fff}
.sidebar-link:hover i,
.sidebar-link:focus i{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.24);color:#fff}
.sidebar-link.active{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.22);color:#fff}
.sidebar-link.active i{background:#00bc96;border-color:#00bc96;color:#fff}
.sidebar-toggle{background:#fff;border-color:#f6f7fb;color:#182230}

.sidebar-footer{
  border-top:1px solid var(--app-border-soft);
  display:flex;
  flex-direction:column;
  gap:.25rem;
  padding-top:.8rem;
}

.sidebar-theme{
  cursor:pointer;
  justify-content:flex-start;
}

body.sidebar-collapsed .app-sidebar{
  flex-basis:var(--sidebar-collapsed-width);
  width:var(--sidebar-collapsed-width);
}

body.sidebar-collapsed .sidebar-brand{
  padding-left:0;
  padding-right:0;
  text-align:center;
}

body.sidebar-collapsed .sidebar-brand a{
  justify-content:center;
}

body.sidebar-collapsed .sidebar-brand span,
body.sidebar-collapsed .sidebar-brand small,
body.sidebar-collapsed .sidebar-label,
body.sidebar-collapsed .sidebar-link span{
  display:none;
}

body.sidebar-collapsed .sidebar-link{
  justify-content:center;
  padding:.5rem;
}

body.sidebar-collapsed .sidebar-link i{
  font-size:1.08rem;
  width:34px;
}

body.sidebar-collapsed .sidebar-nav .sidebar-link::after{
  display:none;
}

body.sidebar-collapsed .sidebar-toggle{
  transform:rotate(180deg);
}

body.sidebar-collapsed .badge.ms-auto{
  margin-left:0!important;
  position:absolute;
  right:10px;
  top:6px;
}



.sidebar-user span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

a{color:#00a584;text-decoration:none}
a:hover{color:#00bc96;text-decoration:underline}

main.container-fluid{
  max-width:1440px;
  padding:1.25rem 1.5rem 2rem!important;
}

h1,h2,h3,h4,h5,h6{color:var(--app-text);font-weight:700;letter-spacing:0}
h4{font-size:1.25rem;margin-bottom:0}
h5{font-size:1rem}
label{color:#344054;font-size:.86rem;font-weight:600;margin-bottom:.35rem}

/* SBC header band — St. Bridget College style */
.sbc-topbar{
  background:rgba(0,0,0,.2);
  border-bottom:1px solid rgba(0,0,0,.05);
  color:#ddd;
  font-size:12px;
  padding:8px 1.5rem;
}

.sbc-topbar a{color:#fff}
.sbc-topbar a:hover{color:#00bc96}

.sbc-masthead{
  background:rgba(30,58,138,.94);
  border-bottom:1px solid rgba(255,255,255,.08);
  color:#fff;
  padding:.55rem 1.5rem;
}

.sbc-masthead .sbc-title{
  color:#fff;
  font-size:1.25rem;
  font-weight:400;
  letter-spacing:.02em;
  text-decoration:none;
}

.sbc-masthead .sbc-tagline{
  color:rgba(255,255,255,.72);
  font-size:.74rem;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.sbc-masthead img{height:38px;width:38px;object-fit:contain}

.navbar{
  background:#1e3a8a!important;
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 8px 24px rgba(16,24,40,.16)!important;
}

.navbar .navbar-brand,
.navbar .sbc-title{color:#fff}
.navbar .navbar-brand i{color:#00bc96}

.navbar .container-fluid{max-width:1440px}
.navbar-brand{font-size:1rem;letter-spacing:.01em}
.navbar-brand i{color:#8ddad5}

.navbar-dark .navbar-nav .nav-link{
  border-radius:6px;
  color:rgba(255,255,255,.78);
  font-weight:600;
  margin:.2rem .1rem;
  padding:.55rem .75rem;
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-nav .show>.nav-link{
  background:rgba(255,255,255,.1);
  color:#fff;
  text-decoration:none;
}

.navbar .dropdown-menu{
  border:1px solid rgba(16,24,40,.08);
  border-radius:8px;
  box-shadow:var(--app-shadow);
  margin-top:.45rem;
  padding:.4rem;
}

.dropdown-item{
  border-radius:6px;
  color:#344054;
  font-size:.9rem;
  padding:.55rem .7rem;
}

.dropdown-item:hover,
.dropdown-item:focus{
  background:#eef6f6;
  color:#0b4d49;
  text-decoration:none;
}

.dropdown-header{
  color:#667085;
  font-size:.76rem;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.card{
  background:var(--app-surface);
  border:1px solid var(--app-border-soft);
  border-radius:var(--app-radius);
  box-shadow:var(--app-shadow-sm);
}

.card:hover{box-shadow:var(--app-shadow)}

.card-header{
  background:linear-gradient(180deg,#fff 0,#fbfcfe 100%);
  border-bottom:1px solid var(--app-border-soft);
  border-radius:var(--app-radius) var(--app-radius) 0 0!important;
  color:#344054;
  font-weight:700;
  padding:.9rem 1rem;
}

.card-body{padding:1rem}

.stat-card{
  border:1px solid rgba(255,255,255,.22);
  border-radius:var(--app-radius);
  box-shadow:var(--app-shadow-sm);
  color:#fff;
  min-height:118px;
  overflow:hidden;
  padding:1.25rem;
  position:relative;
}

.stat-card h2{color:#fff;font-size:2rem;font-weight:800;margin-bottom:.15rem}
.stat-card div{font-weight:600;opacity:.92}
.stat-card i{bottom:8px;font-size:3.4rem;opacity:.22;position:absolute;right:12px}
.stat-card.bg-success{background:linear-gradient(135deg,#0f766e,#14b8a6)!important}
.stat-card.bg-info{background:linear-gradient(135deg,#4f5e70,#6b7d92)!important}
.stat-card.bg-warning{background:linear-gradient(135deg,#b54708,#f59e0b)!important}
.stat-card.bg-primary{background:linear-gradient(135deg,#00a584,#00bc96)!important}
.stat-card.bg-danger{background:linear-gradient(135deg,#b42318,#ef4444)!important}

.table{
  color:#344054;
  margin-bottom:0;
  vertical-align:middle;
}

.table>:not(caption)>*>*{
  border-bottom-color:var(--app-border-soft);
  padding:.78rem .85rem;
}

.table thead th,
.table th{
  background:#f8fafc;
  border-top:none;
  color:#475467;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.035em;
  text-transform:uppercase;
}

.table-hover tbody tr:hover{background:#fbfdff}
.table strong{color:#182230}

.form-control,
.form-select{
  background-color:#fff;
  border:1px solid #cfd6e0;
  border-radius:7px;
  color:var(--app-text);
  font-size:.92rem;
  min-height:40px;
  padding:.55rem .72rem;
  transition:border-color .15s ease,box-shadow .15s ease;
}

.form-control:focus,
.form-select:focus{
  border-color:#00bc96;
  box-shadow:0 0 0 .2rem rgba(0,188,150,.16);
}

textarea.form-control{min-height:88px}

.btn{
  border-radius:7px;
  font-size:.88rem;
  font-weight:700;
  padding:.5rem .85rem;
}

.btn-sm{
  border-radius:6px;
  font-size:.8rem;
  padding:.35rem .6rem;
}

.btn-primary{
  background:var(--app-primary);
  border-color:var(--app-primary);
}

.btn-primary:hover,
.btn-primary:focus{
  background:var(--app-primary-hover);
  border-color:var(--app-primary-hover);
}

.btn-success{background:#0f766e;border-color:#0f766e}
.btn-success:hover{background:#0b5f59;border-color:#0b5f59}
.btn-outline-primary{border-color:#98b8ce;color:var(--app-primary)}
.btn-outline-primary:hover{background:var(--app-primary);border-color:var(--app-primary);color:#fff}
.btn-outline-info{border-color:#7dd3fc;color:#0369a1}
.btn-outline-info:hover{background:#0369a1;border-color:#0369a1;color:#fff}
.btn-outline-danger{border-color:#f0a8a1;color:var(--app-danger)}
.btn-outline-danger:hover{background:var(--app-danger);border-color:var(--app-danger);color:#fff}

.badge{
  border-radius:999px;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.01em;
  padding:.42em .72em;
}

.bg-primary{background:#00bc96!important}
.bg-info{background:#2563eb!important}
.bg-success{background:#0f766e!important}
.bg-warning{background:#b54708!important;color:#fff!important}
.bg-danger{background:#b42318!important}
.bg-secondary{background:#667085!important}

.alert{
  border:1px solid transparent;
  border-radius:var(--app-radius);
  box-shadow:var(--app-shadow-sm);
  font-weight:600;
}

.alert-success{background:#ecfdf3;border-color:#abefc6;color:#067647}
.alert-danger{background:#fef3f2;border-color:#fecdca;color:#b42318}
.alert-warning{background:#fffaeb;border-color:#fedf89;color:#93370d}

.nav-tabs{
  border-bottom:1px solid var(--app-border);
  gap:.25rem;
}

.nav-tabs .nav-link{
  border:0;
  border-radius:7px 7px 0 0;
  color:#667085;
  font-weight:700;
  padding:.7rem .95rem;
}

.nav-tabs .nav-link:hover{
  background:#eef6f6;
  color:#0b4d49;
  text-decoration:none;
}

.nav-tabs .nav-link.active{
  background:#fff;
  border:1px solid var(--app-border);
  border-bottom-color:#fff;
  color:#00876d;
}

.modal-content{
  border:1px solid rgba(16,24,40,.1);
  border-radius:10px;
  box-shadow:0 20px 48px rgba(16,24,40,.18);
}

.modal-header{
  border-bottom:1px solid var(--app-border-soft);
  padding:1rem 1.1rem;
}

.modal-header h5{margin:0}
.modal-body{padding:1.1rem}
.modal-footer{border-top:1px solid var(--app-border-soft);padding:.9rem 1.1rem}

.login-page{
  align-items:center;
  display:flex;
  justify-content:center;
  min-height:100vh;
  padding:1.25rem;
  position:relative;
  background:url('../images/bg_hd.jpg') center/cover no-repeat fixed;
  z-index:0;
}
.login-page::before{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(20,35,53,.55);
  z-index:-1;
}

.login-card{
  position:relative;
  z-index:1;
  border:1px solid rgba(255,255,255,.42);
  border-radius:12px;
  box-shadow:0 24px 70px rgba(16,24,40,.26)!important;
  padding:2rem;
  width:420px;
}

.login-card h3{font-size:1.35rem;margin-bottom:.25rem}
.login-card .bi-building,
.login-card .bi-person-plus{color:var(--app-accent)!important}

.signup-card{
  max-width:calc(100vw - 2rem);
  width:640px;
}

.map-container{
  border:1px solid var(--app-border);
  border-radius:var(--app-radius);
  box-shadow:var(--app-shadow-sm);
  height:500px;
  overflow:hidden;
}

.avatar{
  border-radius:50%;
  height:40px;
  object-fit:cover;
  width:40px;
}

.toast-container{
  bottom:20px;
  position:fixed;
  right:20px;
  z-index:9999;
}

.notification-dropdown{
  min-width:320px;
}

.footer{
  background:#fff!important;
  border-top:1px solid var(--app-border-soft)!important;
  color:#667085;
}

/* Shared production UI layer */
.sbc-masthead{
  background:#0229BD!important;
  box-shadow:0 4px 18px rgba(15,23,42,.13);
  min-height:62px;
}

.app-role-context{
  color:rgba(255,255,255,.82);
  font-size:.82rem;
  font-weight:700;
}

.app-role-badge{
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  color:#fff;
  font-size:.72rem;
  letter-spacing:.025em;
  padding:.32rem .65rem;
}

.page-content{
  animation:page-enter .22s ease-out;
  min-height:calc(100vh - 156px);
}

.auth-content .page-content{min-height:0}

.page-content > h4,
.page-content > .d-flex:first-child{
  border-bottom:1px solid var(--app-border-soft);
  margin-bottom:1.25rem!important;
  padding-bottom:.95rem;
}

.page-content > h4{
  align-items:center;
  display:flex;
  gap:.45rem;
}

.page-content > .d-flex:first-child > h4{
  margin-bottom:0;
}

.page-content > .d-flex:first-child .text-muted{
  font-size:.86rem;
}

.card{
  overflow:hidden;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}

.row > [class*="col"] > .card.h-100:hover,
.tab-pane .row > [class*="col"] > .card:hover{
  border-color:#c6e8df;
  box-shadow:0 14px 30px rgba(16,24,40,.10);
  transform:translateY(-2px);
}

.card-header{
  align-items:center;
  min-height:52px;
}

.card-header .btn{
  margin-top:-.15rem;
}

.table-responsive,
.card-body.p-0{
  -webkit-overflow-scrolling:touch;
}

.table td .btn + .btn,
.table td form + .btn,
.table td .btn + form{
  margin-left:.2rem;
}

.table td .d-flex .btn + .btn,
.table td .d-flex form + .btn,
.table td .d-flex .btn + form{
  margin-left:0;
}

.table td:has(.badge){
  white-space:nowrap;
}

.form-control::placeholder{
  color:#98a2b3;
  opacity:1;
}

.form-control:disabled,
.form-select:disabled{
  background:#f2f4f7;
  color:#667085;
  cursor:not-allowed;
}

input[type="file"].form-control{
  padding:.38rem .55rem;
}

input[type="file"].form-control::file-selector-button{
  background:#eef6f6;
  border:0;
  border-radius:5px;
  color:#0b5f59;
  font-weight:700;
  margin-right:.65rem;
  padding:.34rem .55rem;
}

.btn{
  align-items:center;
  display:inline-flex;
  gap:.35rem;
  justify-content:center;
  line-height:1.25;
  transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease;
}

.btn:hover{
  box-shadow:0 4px 10px rgba(16,24,40,.10);
  transform:translateY(-1px);
}

.btn:active{transform:translateY(0)}

.btn-outline-secondary{
  border-color:#cbd5e1;
  color:#475467;
}

.btn-outline-secondary:hover{
  background:#475467;
  border-color:#475467;
  color:#fff;
}

.nav-tabs{
  overflow-x:auto;
  scrollbar-width:thin;
  white-space:nowrap;
}

.nav-tabs .nav-link{
  flex:0 0 auto;
}

.modal-dialog{
  margin:1.25rem auto;
}

.modal-footer{
  background:#fbfcfe;
}

.dropdown-menu{
  border:1px solid var(--app-border-soft);
  box-shadow:0 12px 28px rgba(16,24,40,.13);
}

.sidebar-nav::-webkit-scrollbar{width:5px}
.sidebar-nav::-webkit-scrollbar-thumb{background:#d0d5dd;border-radius:999px}

.sidebar-link:focus-visible,
.btn:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible,
.nav-link:focus-visible{
  outline:3px solid rgba(0,188,150,.28);
  outline-offset:2px;
}

@keyframes page-enter{
  from{opacity:0;transform:translateY(4px)}
  to{opacity:1;transform:translateY(0)}
}

@media (max-width:767.98px){
  body{font-size:13px}
  .app-shell{display:block}
  .app-sidebar{
    flex-basis:auto!important;
    min-height:auto;
    position:relative;
    width:100%;
  }
  body.sidebar-collapsed .app-sidebar{
    flex-basis:auto;
    width:100%;
  }
  body.sidebar-collapsed .sidebar-brand span,
  body.sidebar-collapsed .sidebar-brand small,
  body.sidebar-collapsed .sidebar-label,
  body.sidebar-collapsed .sidebar-link span{
    display:inline;
  }
  body.sidebar-collapsed .sidebar-brand small,
  body.sidebar-collapsed .sidebar-label{
    display:block;
  }
  body.sidebar-collapsed .sidebar-link{
    justify-content:flex-start;
    padding:.6rem .7rem;
  }
  .sidebar-nav{
    max-height:none;
    overflow:visible;
  }
  .sidebar-footer{margin-top:.75rem}
  main.container-fluid{padding:1rem!important}
  .login-card{padding:1.35rem;width:100%}
  .signup-card{width:100%}
  .card-body{padding:.9rem}
  .table-responsive,
  .card-body.p-0{overflow-x:auto}
  .table{min-width:680px}
  .map-container{height:360px}
  .navbar-dark .navbar-nav .nav-link{padding:.65rem .75rem}
  .footer .text-end{text-align:left!important;margin-top:.35rem}
  .sbc-masthead{min-height:56px;padding:.45rem 1rem}
  .sbc-masthead .sbc-title{font-size:1.05rem}
  .sbc-masthead img{height:32px;width:32px}
  .page-content > h4,
  .page-content > .d-flex:first-child{margin-bottom:1rem!important;padding-bottom:.75rem}
  .table td .btn + .btn,
  .table td form + .btn,
  .table td .btn + form{margin-left:.1rem}
}

/* Records document download screen */
.records-document-section{align-items:flex-start;background:var(--app-bg);border-radius:12px;display:flex;gap:.8rem;height:100%;padding:1rem}
.records-document-section > i{align-items:center;background:#eaf4ff;border-radius:10px;color:var(--app-primary);display:inline-flex;flex:0 0 38px;font-size:1.05rem;height:38px;justify-content:center}
.records-document-section h6{color:var(--app-text);font-size:.9rem;margin:0 0 .18rem}
.records-document-section p{color:var(--app-muted);font-size:.8rem;margin:0}

/* Dashboard shortcuts are integrated with the summary icons. */
.dashboard-stat-link{display:block;text-decoration:none}
.dashboard-stat-link:hover{text-decoration:none}
.dashboard-stat-link .stat-card{transition:transform .18s ease,box-shadow .18s ease}
.dashboard-stat-link:hover .stat-card,.dashboard-stat-link:focus-visible .stat-card{box-shadow:0 10px 20px rgba(15,23,42,.18);transform:translateY(-3px)}
.dashboard-icon-nav{display:flex;flex-wrap:wrap;gap:.75rem}
.dashboard-icon-nav a{align-items:center;background:var(--app-surface);border-radius:14px;color:var(--app-text);display:flex;flex:1 1 180px;font-size:.82rem;font-weight:600;gap:.65rem;min-height:58px;padding:.65rem .85rem;text-decoration:none}
.dashboard-icon-nav a i{align-items:center;background:#eaf4ff;border-radius:10px;color:var(--app-primary);display:inline-flex;font-size:1.15rem;height:36px;justify-content:center;width:36px}
.dashboard-icon-nav a:hover{background:#eaf4ff;color:var(--app-primary);text-decoration:none}

/* High-contrast request navigation on the admin dashboard. */
.request-attention{background:var(--app-surface)!important;color:var(--app-text)}
.request-attention .card-body{padding:20px 24px}
.request-attention h6{color:var(--app-text)}
.request-attention .text-muted{color:var(--app-muted)!important}
.request-attention-nav{display:flex;flex-wrap:wrap;gap:.55rem}
.request-attention-nav a{align-items:center;background:transparent;border:1px solid #171717;border-radius:10px;color:#171717;display:flex;gap:.55rem;min-height:42px;padding:.45rem .6rem;text-decoration:none;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.request-attention-nav a strong{align-items:center;background:#171717;border-radius:50%;color:#fff;display:inline-flex;font-size:.75rem;height:24px;justify-content:center;min-width:24px;padding:0 5px}
.request-attention-nav a span{font-size:.78rem;font-weight:600;white-space:nowrap}
.request-attention-nav a i{color:#171717;font-size:.72rem}
.request-attention-nav a:hover{background:#171717;border-color:#171717;color:#fff;text-decoration:none;transform:translateY(-1px)}
.request-attention-nav a:hover strong{background:#fff;color:#171717}.request-attention-nav a:hover i{color:#fff}
.request-attention-nav a.has-pending{background:#fff1f1;border-color:#dc3545;color:#b02a37}
.request-attention-nav a.has-pending strong{background:#dc3545;color:#fff}
.request-attention-nav a.has-pending i{color:#dc3545}
.request-attention-nav a.has-pending:hover{background:#dc3545;border-color:#dc3545;color:#fff}
.request-attention-nav a.has-pending:hover strong{background:#fff;color:#dc3545}.request-attention-nav a.has-pending:hover i{color:#fff}
.facility-usage-chart{display:grid;gap:.8rem}
.facility-usage-row{align-items:center;display:grid;gap:.8rem;grid-template-columns:minmax(110px,220px) minmax(80px,1fr) 36px}
.facility-usage-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.facility-usage-track{background:#e9eef5;border-radius:999px;height:14px;overflow:hidden}
.facility-usage-bar{background:linear-gradient(90deg,#198754,#39b980);border-radius:inherit;height:100%;min-width:0;transition:width .25s ease}
.facility-usage-count{text-align:right}
.facility-usage-filters .form-select{width:auto;min-width:105px}
@media(max-width:575.98px){.facility-usage-row{gap:.5rem;grid-template-columns:minmax(85px,125px) minmax(40px,1fr) 28px;font-size:.85rem}}

.equipment-request-details{background:#eef6ff;border:1px solid #bfdbfe;border-radius:10px;padding:.75rem .85rem}
.equipment-request-list{display:grid;gap:.55rem;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.equipment-choice{background:var(--app-bg);border:1px solid var(--app-border);border-radius:10px;padding:.65rem}
.equipment-choice .form-control{max-width:96px;min-height:32px;padding:.25rem .45rem}

/* Dashboard visual system — based on the supplied blue sidebar reference. */

:root{
  --app-bg:#eee;
  --app-surface:#f9f9f9;
  --app-surface-2:#f9f9f9;
  --app-border:#e5e7eb;
  --app-border-soft:#eee;
  --app-text:#342e37;
  --app-muted:#aaa;
  --app-primary:#3c91e6;
  --app-primary-hover:#267bcf;
  --app-accent:#3c91e6;
  --app-radius:20px;
  --app-shadow:none;
  --app-shadow-sm:none;
  --sidebar-width:220px;
  --sidebar-collapsed-width:60px;
}

html{overflow-x:hidden}
body{
  background:var(--app-bg);
  color:var(--app-text);
  font-family:var(--poppins);
  overflow-x:hidden;
}

/* The sidebar is the persistent dashboard navigation on desktop. */
.sbc-masthead{
  background:#0229BD!important;
  box-shadow:0 3px 12px rgba(15,23,42,.16);
  display:flex;
  min-height:62px;
  padding:.55rem 1.5rem;
  left:0;
  position:fixed;
  right:0;
  top:0;
  z-index:3000;
}
.sbc-masthead .sbc-title{color:#fff}
.sbc-masthead .sbc-tagline{color:rgba(255,255,255,.78)}
.app-shell{display:flex;min-height:100vh;padding-top:62px}
.app-sidebar{
  background:#0229BD;
  border:0;
  border-radius:0;
  box-shadow:none;
  color:#fff;
  flex:0 0 var(--sidebar-width);
  height:calc(100vh - 62px);
  left:0;
  margin:0;
  overflow-x:hidden;
  overflow-y:auto;
  padding:0 6px 12px;
  position:fixed;
  top:62px;
  width:var(--sidebar-width);
  z-index:2000;
}
.app-content{
  flex:1;
  margin-left:var(--sidebar-width);
  min-height:100vh;
  transition:margin-left .3s ease;
}
.sidebar-brand{
  background:transparent;
  border-bottom:0;
  margin:0;
  min-height:76px;
  padding:13px 10px;
}
.sidebar-brand a{color:#fff;font-family:var(--lato);font-size:1.1rem;gap:.55rem}
.sidebar-brand .site-logo{height:26px;width:26px}
.sidebar-brand small{color:rgba(255,255,255,.75);font-size:.67rem;margin:.1rem 0 0 2.7rem}
.sidebar-toggle{
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  color:#fff;
  height:48px;
  left:auto;
  right:8px;
  top:14px;
  width:48px;
}
.sidebar-toggle:hover{background:rgba(255,255,255,.18);color:#fff}
.sidebar-nav{font-family:var(--lato);gap:0;margin-top:44px;overflow:visible;padding:0}
.sidebar-label{color:rgba(255,255,255,.7);font-size:.68rem;margin:16px 10px 4px;padding-left:48px}
.sidebar-link{
  border:0;
  border-radius:48px;
  color:#fff;
  font-weight:700;
  gap:0;
  min-height:48px;
  padding:4px;
}
.sidebar-link i{
  background:transparent;
  border:0;
  border-radius:0;
  color:inherit;
  flex:0 0 52px;
  font-size:1.1rem;
  height:40px;
  width:52px;
}
.sidebar-nav .sidebar-link::after{display:none}
.sidebar-link:hover,.sidebar-link:focus{background:rgba(255,255,255,.18);border:0;box-shadow:none;color:#fff}
.sidebar-link:hover i,.sidebar-link:focus i{background:transparent;border:0;color:#fff}
.sidebar-link.active{background:rgba(255,255,255,.22);border:0;box-shadow:none;color:#fff}
.sidebar-link.active i{background:transparent;border:0;color:#fff}
.sidebar-footer{border-top:1px solid rgba(255,255,255,.2);gap:0;margin-top:auto;padding-top:12px}
.sidebar-footer .sidebar-link{color:#fff}
.sidebar-footer .sidebar-theme{color:#fff}
.dropdown-menu{border:0;border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.12)}

body.sidebar-collapsed .app-sidebar{width:var(--sidebar-collapsed-width)}
body.sidebar-collapsed .app-content{margin-left:var(--sidebar-collapsed-width)}
body.sidebar-collapsed .sidebar-brand{padding-left:5px;padding-right:5px}
body.sidebar-collapsed .sidebar-toggle{transform:rotate(180deg)}
body.sidebar-collapsed .sidebar-link{padding:4px}
body.sidebar-collapsed .sidebar-link i{flex-basis:48px;width:48px}

main.container-fluid{max-width:none;padding:36px 24px!important}
.page-content{animation:page-enter .25s ease-out;min-height:calc(100vh - 120px)}
.page-content > h4,.page-content > .d-flex:first-child{
  border:0;
  margin-bottom:24px!important;
  padding-bottom:0;
}
.page-content h4{color:var(--app-text);font-family:var(--poppins);font-size:1.65rem;font-weight:600}
.page-content h4 i{color:var(--app-primary)}
.card{
  background:var(--app-surface);
  border:0;
  border-radius:var(--app-radius);
  box-shadow:none;
}
.card:hover{box-shadow:none}
.card-header{
  background:var(--app-surface);
  border-bottom:1px solid var(--app-bg);
  border-radius:var(--app-radius) var(--app-radius) 0 0!important;
  color:var(--app-text);
  font-family:var(--poppins);
  font-weight:600;
  min-height:64px;
  padding:20px 24px;
}
.card-body{padding:24px}
.row > [class*="col"] > .card.h-100:hover,.tab-pane .row > [class*="col"] > .card:hover{border-color:transparent;box-shadow:none;transform:none}
.stat-card{border:0;border-radius:20px;box-shadow:none;min-height:128px;padding:24px}
.stat-card.bg-primary{background:#3c91e6!important}
.stat-card.bg-success{background:#ffce26!important;color:#342e37}
.stat-card.bg-info{background:#fd7238!important}
.stat-card.bg-warning{background:#6b7280!important}
.stat-card h2{font-family:var(--poppins);font-size:2rem;font-weight:600}
.stat-card.bg-success h2{color:#342e37}.stat-card.bg-success div{color:#342e37}
.table{color:var(--app-text)}
.table>:not(caption)>*>*{border-bottom-color:var(--app-bg);padding:16px 14px}
.table thead th,.table th{background:transparent;color:var(--app-muted);font-size:.75rem}
.table-hover tbody tr:hover{background:var(--app-bg)}
.form-control,.form-select{border-color:var(--app-border);border-radius:10px;min-height:42px}
.form-control:focus,.form-select:focus{border-color:var(--app-primary);box-shadow:0 0 0 .2rem rgba(60,145,230,.16)}
.btn{border-radius:36px;font-family:var(--poppins);font-weight:500}
.btn-primary{background:var(--app-primary);border-color:var(--app-primary)}
.btn-primary:hover,.btn-primary:focus{background:var(--app-primary-hover);border-color:var(--app-primary-hover)}
.btn-outline-primary{border-color:var(--app-primary);color:var(--app-primary)}
.btn-outline-primary:hover{background:var(--app-primary);border-color:var(--app-primary)}
.footer{background:transparent!important;border-top:0!important;margin:0 24px}
/* Admin dashboard calendar */
.dashboard-calendar .card-header{min-height:70px}
.calendar-controls{align-items:center;display:flex;gap:.65rem}
.calendar-controls strong{color:var(--app-text);font-size:.94rem;min-width:138px;text-align:center}
.calendar-controls .btn{height:32px;padding:.2rem .55rem;width:32px}
.calendar-legend{display:flex;flex-wrap:wrap;gap:1rem}
.calendar-legend span{align-items:center;color:var(--app-muted);display:inline-flex;font-size:.78rem;font-weight:600;gap:.35rem}
.calendar-dot{border-radius:50%;display:inline-block;height:9px;width:9px}
.calendar-dot.facility{background:#3c91e6}.calendar-dot.equipment{background:#ffce26}.calendar-dot.trip{background:#fd7238}
.dashboard-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));overflow:hidden}
.calendar-weekday{color:var(--app-muted);font-family:var(--lato);font-size:.72rem;font-weight:700;padding:0 0 .6rem;text-align:center;text-transform:uppercase}
.calendar-day{background:var(--app-surface);border:1px solid var(--app-bg);min-height:112px;padding:7px;position:relative}
.calendar-day.is-outside{background:transparent}
.calendar-day.is-today{background:#eaf4ff;box-shadow:inset 0 0 0 1px #3c91e6}
.calendar-date{color:var(--app-text);display:block;font-size:.78rem;font-weight:700;margin:0 0 5px 2px}
.calendar-event{border-left:3px solid;display:block;font-family:var(--lato);font-size:.7rem;line-height:1.2;margin:3px 0;overflow:hidden;padding:4px 5px;text-decoration:none;text-overflow:ellipsis;white-space:nowrap}
.calendar-event span{display:block;font-weight:700;overflow:hidden;text-overflow:ellipsis}
.calendar-event small{display:block;font-size:.64rem;overflow:hidden;text-overflow:ellipsis}
.calendar-event.facility{background:#eaf4ff;border-color:#3c91e6;color:#1b5f9f}
.calendar-event.equipment{background:#fff7d6;border-color:#ffce26;color:#765b00}
.calendar-event.trip{background:#ffe8de;border-color:#fd7238;color:#a54017}
.calendar-event:hover{filter:brightness(.96);text-decoration:none}
/* Entries are buttons: they open the details pop-up. */
button.calendar-event{border-top:0;border-right:0;border-bottom:0;border-left-style:solid;border-left-width:3px;border-radius:2px;cursor:pointer;text-align:left;width:100%}
.calendar-event.is-pending{background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.55) 0 4px,transparent 4px 8px);border-left-style:dashed;opacity:.85}
.calendar-event.is-mine{box-shadow:inset 0 0 0 1px currentColor}
.calendar-dot.pending{background:repeating-linear-gradient(135deg,#adb5bd 0 2px,#fff 2px 4px);border:1px dashed #6c757d}
.calendar-more{background:none;border:0;color:#3c91e6;cursor:pointer;display:block;font-size:.7rem;font-weight:700;padding:2px 4px;text-align:left;width:100%}
.calendar-more:hover{text-decoration:underline}
.calendar-upcoming-title{font-size:.85rem;font-weight:700;margin-bottom:.5rem}
.calendar-upcoming{max-height:560px;overflow:auto}
.calendar-upcoming-item{border-left:3px solid #adb5bd!important;font-size:.8rem}
.calendar-upcoming-item span{display:block;font-weight:700}
.calendar-upcoming-item small{color:var(--app-muted);display:block}
.calendar-upcoming-item.facility{border-left-color:#3c91e6!important}
.calendar-upcoming-item.trip{border-left-color:#fd7238!important}
.calendar-upcoming-item.equipment{border-left-color:#ffce26!important}
.calendar-details dt{color:var(--app-muted);font-weight:600}
.calendar-details dd{white-space:pre-line}
/* Request details page: status steps */
.request-steps{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:0}
.request-steps li{align-items:flex-start;border:1px solid var(--app-bg);border-radius:.5rem;display:flex;flex:1 1 160px;gap:.5rem;padding:.6rem .75rem}
.request-steps li i{font-size:1.1rem}
.request-steps li.done{background:#e9f7ef;border-color:#b7e1c6}.request-steps li.done i{color:#198754}
.request-steps li.current{background:#fff8e1;border-color:#ffe08a}.request-steps li.current i{color:#b58100}
.request-steps li.failed{background:#fdecee;border-color:#f5c2c7}.request-steps li.failed i{color:#dc3545}
.request-steps li small{color:var(--app-muted);display:block}
.my-request-item{align-items:center;display:flex;gap:.75rem}
.my-request-item .my-request-icon{align-items:center;border-radius:.5rem;display:flex;flex:0 0 38px;font-size:1.1rem;height:38px;justify-content:center}
.my-request-item .my-request-icon.facility{background:#eaf4ff;color:#1b5f9f}.my-request-item .my-request-icon.trip{background:#ffe8de;color:#a54017}
.facility-slot-list{font-size:.8rem}

@media (max-width:767.98px){
  .dashboard-calendar .card-body{padding:14px 8px}
  .dashboard-calendar .card-header{padding:16px}
  .calendar-weekday{font-size:.62rem}
  .calendar-day{min-height:76px;padding:4px}
  .calendar-date{font-size:.7rem;margin-bottom:2px}
  .calendar-event{border-left-width:2px;font-size:0;margin:2px 0;min-height:7px;padding:0}
  .calendar-event span,.calendar-event small{display:none}
  .calendar-event.facility{background:#3c91e6}.calendar-event.equipment{background:#ffce26}.calendar-event.trip{background:#fd7238}
  .calendar-event.is-pending{opacity:.5}
  .calendar-more{font-size:.6rem;padding:0}
}

/* ============ Facility cards – image cover + hover effects ============ */
.fac-card{
  border:0;border-radius:1rem;overflow:hidden;
  background:var(--app-surface,#fff);
  box-shadow:0 4px 16px rgba(15,23,42,.08);
  transition:transform .28s ease,box-shadow .28s ease;
}
.fac-card:hover{
  transform:translateY(-6px);
  box-shadow:0 18px 32px -12px rgba(2,41,189,.35);
}
.fac-img-wrap{position:relative;height:190px;overflow:hidden;background:#e2e8f0}
.fac-img-wrap img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .5s ease;
}
.fac-card:hover .fac-img-wrap img{transform:scale(1.08)}
.fac-overlay{
  position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;
  padding:14px 16px;gap:6px;
  background:linear-gradient(180deg,rgba(2,41,189,0) 0%,rgba(2,41,189,.45) 55%,rgba(2,41,189,.88) 100%);
}
.fac-name{color:#fff;font-weight:700;margin:0;font-family:var(--poppins),'Poppins',sans-serif;text-shadow:0 2px 8px rgba(0,0,0,.4)}
.fac-badge{
  align-self:flex-start;display:inline-flex;align-items:center;gap:.35rem;
  background:rgba(255,255,255,.18);backdrop-filter:blur(6px);
  color:#fff;font-size:.75rem;font-weight:600;
  padding:.25rem .6rem;border-radius:999px;border:1px solid rgba(255,255,255,.35);
}
.fac-meta{font-size:.85rem;color:var(--app-muted,#64748b);font-weight:600}
.fac-btn{border-radius:.75rem;font-weight:600}
.fac-btn:active{transform:scale(.97)}