/* UNICOHS Staff Portal — shared professional interface */
:root {
  --primary: #96292c !important;
  --primary-dark: #741f22 !important;
  --primary-light: #f8eded !important;
  --secondary: #741f22 !important;
  --accent: #b13a3e !important;
  --surface: #fff;
  --canvas: #f4f6f9;
  --sidebar: #2b2d42;
  --text: #2b2d42;
  --muted: #6f7b8f;
  --line: #e6eaf0;
  --success: #4cc9f0 !important;
  --warning: #f72585 !important;
  --danger: #dc3545 !important;
  --gray-50: #f8fafc !important;
  --gray-100: #f1f4f8 !important;
  --gray-200: #e5e9f0 !important;
  --gray-300: #d1d7e1 !important;
  --gray-400: #a4adbd !important;
  --gray-500: #778398 !important;
  --gray-600: #5d697d !important;
  --gray-700: #414d61 !important;
  --gray-800: #29364a !important;
  --gray-900: #17233a !important;
  --gradient-primary: #96292c !important;
  --gradient-secondary: #96292c !important;
  --gradient-accent: #96292c !important;
  --shadow: 0 10px 30px rgba(20,43,78,.07) !important;
  --shadow-lg: 0 22px 55px rgba(15,29,52,.16) !important;
  --border-radius: 14px !important;
  --font-ui: Inter,"Segoe UI",Roboto,Arial,sans-serif;
}

* { box-sizing: border-box; }
html { background: var(--canvas); }
body { margin: 0 !important; padding-top: 0 !important; color: var(--text) !important; background: var(--canvas) !important; background-image: none !important; font: 13px/1.55 var(--font-ui) !important; }
body.animated { animation: none !important; }
h1,h2,h3,h4,h5,h6,.card-title,.section-title,.page-title,.panel-title,.nav-brand { color: var(--text) !important; font-family: var(--font-ui) !important; font-weight: 700 !important; letter-spacing: -.02em !important; }
button,input,select,textarea,.btn,.form-control,.form-select,table,.table,.badge { font-family: var(--font-ui) !important; }
a { text-decoration: none !important; }

/* Staff application frame */
.main-navbar { top: 0 !important; left: 250px !important; width: calc(100% - 250px) !important; height: 72px !important; background: rgba(255,255,255,.97) !important; border: 0 !important; box-shadow: 0 2px 16px rgba(20,43,78,.055) !important; backdrop-filter: blur(14px); }
.nav-container { height: 72px !important; padding: 0 26px !important; }
.nav-brand { color: var(--text) !important; font-size: 17px !important; }
.nav-logo { width: 52px !important; height: 52px !important; margin: 0 7px 0 0 !important; padding: 2px !important; border-radius: 10px !important; box-shadow: none !important; }
.nav-toggle { width: 40px !important; height: 40px !important; color: var(--primary) !important; background: var(--gray-100) !important; border: 0 !important; border-radius: 10px !important; box-shadow: none !important; }
.admin-icons-container,.staff-icons-container { gap: 9px !important; }
.icon-wrapper { width: 39px !important; height: 39px !important; color: var(--gray-600) !important; background: var(--gray-50) !important; border: 0 !important; border-radius: 10px !important; box-shadow: none !important; }
.icon-wrapper:hover { color: var(--primary) !important; background: var(--primary-light) !important; transform: none !important; box-shadow: none !important; }
.icon-wrapper:hover i { color: var(--primary) !important; }
.notification-badge { background: var(--danger) !important; border-radius: 7px !important; box-shadow: none !important; }
.user-dropdown-toggle { min-height: 44px; padding: 5px 11px 5px 5px !important; color: var(--text) !important; background: var(--gray-50) !important; border: 0 !important; border-radius: 12px !important; box-shadow: none !important; }
.user-dropdown-toggle:hover { background: var(--primary-light) !important; transform: none !important; box-shadow: none !important; }
.user-avatar { width: 34px !important; height: 34px !important; color: #fff !important; background: var(--gradient-primary) !important; border-radius: 9px !important; box-shadow: none !important; }
.user-name,.user-chevron { color: var(--text) !important; }
.user-role { color: var(--muted) !important; }
.user-dropdown-menu { padding: 9px !important; background: #fff !important; border: 0 !important; border-radius: 15px !important; box-shadow: var(--shadow-lg) !important; }
.user-dropdown-item { color: var(--text) !important; border-radius: 8px !important; }
.user-dropdown-item:hover { color: var(--primary) !important; background: var(--primary-light) !important; }

#sidebar { width: 250px !important; height: 100vh !important; padding: 0 !important; background:#96292c !important; border: 0 !important; box-shadow: 10px 0 35px rgba(86,22,25,.12) !important; overflow-y: auto !important; }
#sidebar::-webkit-scrollbar { width: 4px; }
#sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,.16); border-radius: 10px; }
.sidebar-header { padding: 23px 18px 19px !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid rgba(255,255,255,.08) !important; }
.sidebar-close { color: #fff !important; background: rgba(255,255,255,.08) !important; border-radius: 8px !important; }
.sidebar-profile { text-align: left !important; }
.sidebar-profile-name { color: #fff !important; font: 700 13px var(--font-ui) !important; }
.sidebar-profile-role,.sidebar-profile-id { color: #aebbd0 !important; }
.sidebar-profile-img { border-color: rgba(255,255,255,.18) !important; border-radius: 12px !important; box-shadow: none !important; }
.sidebar-nav { padding: 14px 11px 28px !important; }
.sidebar-nav-item { margin: 3px 0 !important; }
.sidebar-nav-link { min-height: 43px; padding: 10px 12px !important; color: #bdc7d8 !important; background: transparent !important; border: 0 !important; border-radius: 9px !important; font-size: 12px !important; }
.sidebar-nav-link:hover,.sidebar-nav-link.active { color: #fff !important; background: #244b7e !important; transform: none !important; }
.sidebar-nav-link i { color: #91a0b9 !important; }
.sidebar-nav-link:hover i,.sidebar-nav-link.active i { color: #fff !important; }
.sidebar-dropdown { padding: 5px !important; background: rgba(4,11,22,.22) !important; border-radius: 9px !important; }
.sidebar-dropdown-link { padding: 8px 10px 8px 38px !important; color: #aeb9cb !important; border-radius: 7px !important; font-size: 11px !important; }
.sidebar-dropdown-link:hover,.sidebar-dropdown-link.active { color: #fff !important; background: rgba(255,255,255,.07) !important; }

.content { width: auto !important; min-height: calc(100vh - 72px); margin: 72px 0 0 250px !important; padding: 24px 27px 54px !important; background: var(--canvas) !important; }
.content>.container,.content>.container-fluid { max-width: 1440px !important; }

/* Shared page surfaces */
.card,.stat-card,.metric-card,.dashboard-card,.content-card,.panel,.table-container,.table-responsive,.form-container,.filter-section,.summary-card,.modal-content,.list-group-item { background: #fff !important; border: 0 !important; border-radius: 15px !important; box-shadow: var(--shadow) !important; }
.card:hover,.stat-card:hover,.metric-card:hover { transform: translateY(-1px) !important; box-shadow: 0 13px 34px rgba(20,43,78,.09) !important; }
.card-header,.table-header,.panel-header,.modal-header { padding: 16px 19px !important; color: var(--text) !important; background: #fff !important; border: 0 !important; border-radius: 15px 15px 0 0 !important; }
.card-body,.panel-body { padding: 19px !important; }
.page-header,.header-card,.header-section,.top-bar,.premium-header { margin: 0 0 18px !important; padding: 18px 2px !important; color: var(--text) !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
.page-header h1,.header-card h1,.header-section h1,.top-bar h1,.premium-header h1 { color: var(--text) !important; }
.page-header p,.header-card p,.header-section p,.top-bar p,.premium-header p { color: var(--muted) !important; }

/* Tables */
.table-container,.table-responsive { overflow-x: auto !important; }
table,.table { width: 100%; margin: 0 !important; color: var(--text) !important; background: #fff !important; border: 0 !important; border-collapse: separate !important; border-spacing: 0 !important; }
thead,.table thead { background: var(--gray-100) !important; }
thead th,.table thead th { padding: 11px 13px !important; color: var(--muted) !important; background: var(--gray-100) !important; border: 0 !important; font-size: 9px !important; font-weight: 800 !important; text-transform: uppercase; letter-spacing: .065em; white-space: nowrap; }
tbody td,.table tbody td { padding: 12px 13px !important; color: var(--text) !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; font-size: 11px; }
tbody tr:hover { background: #fafbfd !important; }

/* Forms and actions */
label,.form-label { color: var(--text) !important; font-size: 11px !important; font-weight: 700 !important; }
.form-control,.form-select,input,select,textarea { min-height: 42px; padding: 9px 11px !important; color: var(--text) !important; background: #f7f9fc !important; border: 0 !important; border-radius: 9px !important; box-shadow: none !important; }
.form-control:focus,.form-select:focus,input:focus,select:focus,textarea:focus { background: #fff !important; box-shadow: 0 0 0 3px rgba(150,41,44,.12) !important; outline: none !important; }
.btn,button:not(.nav-toggle):not(.sidebar-close) { min-height: 38px; padding: 8px 15px !important; border-radius: 9px !important; box-shadow: none !important; font-size: 11px; font-weight: 700; }
.btn-primary,.btn-login,.btn-submit,.submit-btn { color: #fff !important; background: var(--primary) !important; border: 0 !important; }
.btn-primary:hover,.btn-login:hover,.btn-submit:hover,.submit-btn:hover { color: #fff !important; background: var(--primary-dark) !important; transform: none !important; }
.btn-secondary { color: var(--text) !important; background: var(--gray-100) !important; border: 0 !important; }
.btn-danger { color: #fff !important; background: var(--danger) !important; border: 0 !important; }
.btn-success { color: #fff !important; background: var(--success) !important; border: 0 !important; }
.badge,.status-badge,.status { border: 0 !important; border-radius: 7px !important; }
.alert { border: 0 !important; border-radius: 11px !important; }
.modal-content { border-radius: 18px !important; box-shadow: var(--shadow-lg) !important; }
.progress,.progress-bar { border-radius: 99px !important; }
.progress-bar,.progress-fill { background: var(--primary) !important; }

/* Dashboard */
.dashboard-header,.dashboard-header .top-nav { background: transparent !important; border: 0 !important; box-shadow: none !important; }
.dashboard-header .top-nav { padding: 18px 2px !important; }
.dashboard-content { gap: 18px !important; padding: 0 !important; }
.stats-grid,.metrics-grid { gap: 12px !important; }
.stat-card { min-height: 132px; padding: 17px !important; color: var(--text) !important; background: #fff !important; }
.stat-icon,.action-icon,.icon-box { color: var(--primary) !important; background: var(--primary-light) !important; border-radius: 10px !important; }
.quick-actions-sidebar { padding: 19px !important; background: #fff !important; border: 0 !important; border-radius: 15px !important; box-shadow: var(--shadow) !important; }
.action-item { padding: 12px !important; background: var(--gray-50) !important; border: 0 !important; border-radius: 11px !important; box-shadow: none !important; }
.action-item:hover { background: var(--primary-light) !important; transform: translateX(2px) !important; }

.bottom-nav { background: rgba(255,255,255,.98) !important; border: 0 !important; box-shadow: 0 -6px 22px rgba(20,43,78,.08) !important; }
.bottom-nav-link.active,.bottom-nav-link:hover,.bottom-nav-icon { color: var(--primary) !important; }

@media (max-width: 1200px) {
  .main-navbar { left: 0 !important; width: 100% !important; }
  #sidebar { left: -250px !important; transform: none !important; }
  #sidebar.active { left: 0 !important; }
  .content { margin-left: 0 !important; }
  .nav-toggle { display: flex !important; }
}

@media (max-width: 768px) {
  .main-navbar { height: 64px !important; }
  .nav-container { height: 64px !important; padding: 0 12px !important; }
  .nav-logo { width: 45px !important; height: 45px !important; }
  .nav-brand span,.user-info,.user-chevron { display: none !important; }
  .admin-icons-container .icon-wrapper,.staff-icons-container .icon-wrapper { display: none !important; }
  .user-dropdown-toggle { padding: 4px !important; }
  .content { margin-top: 64px !important; padding: 14px 11px 80px !important; }
  .dashboard-content { display: block !important; }
  .stats-grid,.metrics-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .card-body { padding: 14px !important; }
  table,.table { min-width: 680px; }
  .table-responsive table,.table-container table { min-width: 680px; }
}

/* Staff sign-in */
body:has(.login-container) { display: grid !important; place-items: center !important; min-height: 100vh; padding: 28px 18px !important; background: #f1f4f8 !important; }
.login-container { width: 100% !important; max-width: 420px !important; }
.login-card { padding: 38px 38px 31px !important; background: #fff !important; border: 0 !important; border-radius: 20px !important; box-shadow: 0 24px 65px rgba(15,29,52,.13) !important; }
.login-card:hover { transform: none !important; box-shadow: 0 24px 65px rgba(15,29,52,.13) !important; }
.login-title { color: var(--text) !important; font-family: var(--font-ui) !important; font-size: 23px !important; }
.login-title i { color: var(--primary) !important; }
.login-card .form-control { width: 100% !important; min-height: 48px; background: var(--gray-50) !important; }
.login-card .btn-login { width: 100%; min-height: 48px; }

@media print {
  .main-navbar,#sidebar,.sidebar-overlay,.bottom-nav { display: none !important; }
  .content { margin: 0 !important; padding: 0 !important; background: #fff !important; }
}

/* Staff portal assistant */
.staff-chat-launcher { position: fixed; right: 22px; bottom: 22px; z-index: 2100; width: 56px; height: 56px; display: grid; place-items: center; color: #fff !important; background: var(--primary) !important; border: 0 !important; border-radius: 12px !important; box-shadow: 0 13px 28px rgba(15,36,68,.28) !important; cursor: pointer; }
.staff-chat-launcher:hover { background: var(--primary-dark) !important; transform: translateY(-2px); }
.staff-chat-launcher > i { font-size: 22px; }
.staff-chat-launcher > span { position: absolute; top: 4px; right: 4px; width: 11px; height: 11px; background: #2ab879; border: 2px solid #fff; border-radius: 50%; }
.staff-chat-panel { position: fixed; right: 22px; bottom: 91px; z-index: 2099; width: min(380px,calc(100vw - 28px)); height: min(570px,calc(100vh - 118px)); display: flex; flex-direction: column; overflow: hidden; visibility: hidden; opacity: 0; transform: translateY(16px) scale(.98); transform-origin: bottom right; background: #fff; border: 0; border-radius: 14px; box-shadow: 0 24px 65px rgba(15,29,52,.23); transition: opacity .18s ease,transform .18s ease,visibility .18s; }
.staff-chat-panel.open { visibility: visible; opacity: 1; transform: none; }
.staff-chat-header { display: flex; align-items: center; gap: 11px; padding: 15px 16px; color: #fff; background: var(--primary); }
.staff-chat-avatar { width: 40px; height: 40px; display: grid; place-items: center; flex: 0 0 auto; background: rgba(255,255,255,.14); border-radius: 9px; font-size: 17px; }
.staff-chat-header h2 { margin: 0; color: #fff !important; font: 800 15px var(--font-ui) !important; }
.staff-chat-header p { margin: 2px 0 0; color: rgba(255,255,255,.78); font-size: 10px; }
.staff-chat-header p span { display: inline-block; width: 7px; height: 7px; margin-right: 4px; background: #39d993; border-radius: 50%; }
.staff-chat-header > button { width: 33px; height: 33px; display: grid; place-items: center; margin-left: auto; padding: 0 !important; color: #fff !important; background: rgba(255,255,255,.12) !important; border: 0 !important; border-radius: 8px !important; }
.staff-chat-messages { flex: 1; overflow-y: auto; padding: 15px; background: #f5f7fa; }
.staff-chat-message { width: fit-content; max-width: 86%; margin: 0 0 10px; padding: 10px 12px; overflow-wrap: anywhere; border-radius: 11px; font-size: 11px; line-height: 1.5; }
.staff-chat-message.bot { color: var(--text); background: #fff; border: 1px solid var(--line); border-bottom-left-radius: 3px; }
.staff-chat-message.user { margin-left: auto; color: #fff; background: var(--primary); border-bottom-right-radius: 3px; }
.staff-chat-message a { display: block; width: fit-content; margin-top: 7px; color: var(--primary); font-weight: 800; }
.staff-chat-suggestions { display: flex; gap: 6px; padding: 9px 11px 7px; overflow-x: auto; background: #fff; border-top: 1px solid var(--line); }
.staff-chat-suggestions button { flex: 0 0 auto; min-height: 29px; padding: 5px 8px !important; color: var(--primary) !important; background: var(--primary-light) !important; border: 0 !important; border-radius: 6px !important; font-size: 9px; }
.staff-chat-form { display: flex; gap: 7px; padding: 9px 11px 11px; background: #fff; }
.staff-chat-form input { flex: 1; min-width: 0; min-height: 42px; }
.staff-chat-form button { width: 42px; height: 42px; flex: 0 0 auto; padding: 0 !important; color: #fff !important; background: var(--primary) !important; border: 0 !important; border-radius: 8px !important; }
@media(max-width:768px){.staff-chat-launcher{right:14px;bottom:74px;width:50px;height:50px}.staff-chat-panel{right:14px;bottom:132px;height:min(530px,calc(100vh - 150px))}}
@media print {.staff-chat-launcher,.staff-chat-panel { display:none !important; }}

/* Reference-style staff sidebar */
#sidebar {
  width: 280px !important;
  color: #c4cee0 !important;
  background:#96292c !important;
  border: 0 !important;
  box-shadow: 9px 0 28px rgba(15,31,55,.11) !important;
}
#sidebar::-webkit-scrollbar { width: 4px !important; }
#sidebar::-webkit-scrollbar-track { background: transparent !important; }
#sidebar::-webkit-scrollbar-thumb { background: rgba(204,216,235,.32) !important; border-radius: 8px !important; }
.sidebar-header {
  min-height: 130px;
  padding: 32px 58px 24px 20px !important;
  text-align: left !important;
  background: transparent !important;
  border-bottom: 1px solid rgba(255,255,255,.1) !important;
}
.sidebar-close {
  top: 32px !important;
  right: 18px !important;
  width: 43px !important;
  height: 43px !important;
  color: #fff !important;
  background: rgba(255,255,255,.09) !important;
  border: 0 !important;
  border-radius: 11px !important;
}
.sidebar-profile {
  display: grid !important;
  grid-template-columns: 62px minmax(0,1fr);
  grid-template-rows: auto auto auto;
  column-gap: 12px;
  align-items: center;
  padding: 0 !important;
  text-align: left !important;
}
.sidebar-profile-img {
  grid-column: 1;
  grid-row: 1 / 4;
  width: 62px !important;
  height: 62px !important;
  margin: 0 !important;
  padding: 3px !important;
  object-fit: cover;
  background: rgba(255,255,255,.08) !important;
  border: 2px solid rgba(126,166,207,.7) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
.sidebar-profile-name {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  margin: 0 0 2px !important;
  overflow: hidden;
  color: #fff !important;
  font: 700 18px/1.25 var(--font-ui) !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sidebar-profile-role {
  grid-column: 2;
  grid-row: 2;
  justify-self: start;
  padding: 3px 9px !important;
  color: #cbd7e8 !important;
  background: rgba(255,255,255,.08) !important;
  border-radius: 5px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .12em;
  text-transform: uppercase;
  backdrop-filter: none !important;
}
.sidebar-profile-id {
  grid-column: 2;
  grid-row: 3;
  max-width: 156px;
  margin: 5px 0 0 !important;
  overflow: hidden;
  color: #8292aa !important;
  font-size: 12px !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sidebar-nav { padding: 16px 10px 30px !important; }
.sidebar-nav-item { position: relative; margin: 2px 0 !important; }
.sidebar-nav-link {
  min-height: 50px !important;
  padding: 12px 14px !important;
  color: #c4cee0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 7px !important;
  overflow: visible !important;
}
.sidebar-nav-link::before { display: none !important; }
.sidebar-nav-link:hover,.sidebar-nav-link.active {
  color: #fff !important;
  background: rgba(255,255,255,.065) !important;
  border: 0 !important;
}
.sidebar-nav-link i {
  width: 24px !important;
  margin-right: 13px !important;
  color: #9cacc7 !important;
  font-size: 16px !important;
  transform: none !important;
}
.sidebar-nav-link:hover i,.sidebar-nav-link.active i { color: #fff !important; transform: none !important; }
.sidebar-nav-text { color: inherit !important; font-size: 16px !important; font-weight: 400 !important; letter-spacing: -.01em; }
.sidebar-chevron { width: auto !important; margin: 0 0 0 8px !important; color: #8294af !important; font-size: 10px !important; }
.sidebar-nav-item:has(> .sidebar-dropdown)::after { content: ""; display: block !important; height: 10px; margin: 3px 1px 7px; background: rgba(4,17,34,.28); border-radius: 7px; }
.sidebar-dropdown {
  margin: 0 3px 4px !important;
  padding: 0 !important;
  background: rgba(4,17,34,.28) !important;
  border-radius: 7px !important;
}
.sidebar-dropdown.active { max-height: 650px !important; padding: 5px !important; }
.sidebar-dropdown-link {
  min-height: 40px;
  padding: 9px 12px 9px 41px !important;
  color: #aebbd0 !important;
  border-radius: 5px !important;
  font-size: 11px !important;
}
.sidebar-dropdown-link::before { display: none !important; }
.sidebar-dropdown-link:hover { padding-left: 41px !important; color: #fff !important; background: rgba(255,255,255,.065) !important; }
.sidebar-dropdown-link i { width: 18px !important; margin-right: 10px !important; color: #8799b5 !important; font-size: 11px !important; }
.main-navbar { left: 280px !important; width: calc(100% - 280px) !important; }
.content { margin-left: 280px !important; }

@media (max-width:1200px) {
  #sidebar { left: -280px !important; }
  #sidebar.active { left: 0 !important; }
  .main-navbar { left: 0 !important; width: 100% !important; }
  .content { margin-left: 0 !important; }
}
@media (max-width:480px) {
  #sidebar { width: min(280px,88vw) !important; left: min(-280px,-88vw) !important; }
  #sidebar.active { left: 0 !important; }
}

/* Exact navigation treatment disabled; screenshot-style sidebar above is active. */
/*
#sidebar { width: 280px !important; color: #fff !important; background: var(--primary) !important; box-shadow: var(--shadow-lg) !important; }
#sidebar::-webkit-scrollbar { width: 6px !important; }
#sidebar::-webkit-scrollbar-track { background: rgba(255,255,255,.1) !important; }
#sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,.3) !important; border-radius: 3px !important; }
.sidebar-header { min-height: 0; padding: 15px !important; text-align: center !important; border-bottom: 1px solid rgba(255,255,255,.1) !important; }
.sidebar-close { top: 25px !important; right: 25px !important; width: 35px !important; height: 35px !important; background: rgba(255,255,255,.1) !important; border-radius: 10px !important; }
.sidebar-close:hover { background: rgba(255,255,255,.2) !important; transform: rotate(90deg) !important; }
.sidebar-profile { display: block !important; padding: 0 0 20px !important; text-align: center !important; }
.sidebar-profile-img { display: block; width: 90px !important; height: 90px !important; margin: 0 auto 15px !important; padding: 5px !important; background: #fff !important; border: 1px solid rgba(255,255,255,.3) !important; border-radius: 15px !important; box-shadow: 0 8px 25px rgba(0,0,0,.2) !important; }
.sidebar-profile-name { display: block !important; margin: 0 0 5px !important; overflow: visible; color: #fff !important; font: 700 18px/1.3 var(--font-ui) !important; white-space: normal; }
.sidebar-profile-role { display: inline-block !important; padding: 4px 12px !important; color: #fff !important; background: rgba(255,255,255,.2) !important; border-radius: 20px !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0; text-transform: none; backdrop-filter: blur(10px) !important; }
.sidebar-profile-id { display: block !important; max-width: 100%; margin: 8px 0 0 !important; overflow: visible; color: rgba(255,255,255,.9) !important; font-size: 13px !important; white-space: normal; }
.sidebar-nav { padding: 20px 0 !important; }
.sidebar-nav-item { margin: 0 0 5px !important; }
.sidebar-nav-link { min-height: 50px !important; padding: 15px 25px !important; color: rgba(255,255,255,.9) !important; background: transparent !important; border: 0 !important; border-left: 4px solid transparent !important; border-radius: 0 !important; overflow: hidden !important; }
.sidebar-nav-link::before { display: block !important; width: 4px !important; background: #fff !important; }
.sidebar-nav-link:hover,.sidebar-nav-link.active { color: #fff !important; background: var(--hover) !important; border-left-color: #fff !important; }
.sidebar-nav-link i { width: 20px !important; margin-right: 15px !important; color: inherit !important; font-size: 18px !important; }
.sidebar-nav-link:hover i,.sidebar-nav-link.active i { color: #fff !important; transform: scale(1.1) !important; }
.sidebar-nav-text { font-size: 15px !important; font-weight: 500 !important; }
.sidebar-chevron { width: auto !important; margin-left: auto !important; color: inherit !important; font-size: 12px !important; }
.sidebar-nav-item:has(> .sidebar-dropdown)::after { display: none !important; }
.sidebar-dropdown { margin: 0 !important; padding: 0 !important; background: rgba(0,0,0,.1) !important; border-radius: 0 !important; }
.sidebar-dropdown.active { max-height: 650px !important; padding: 0 !important; }
.sidebar-dropdown-link { min-height: 42px; padding: 12px 25px 12px 55px !important; color: rgba(255,255,255,.8) !important; border-radius: 0 !important; font-size: 14px !important; }
.sidebar-dropdown-link::before { display: block !important; }
.sidebar-dropdown-link:hover { padding-left: 60px !important; color: #fff !important; background: var(--hover) !important; }
.sidebar-dropdown-link i { width: 20px !important; margin-right: 12px !important; color: inherit !important; font-size: 14px !important; }
.main-navbar { left: 280px !important; width: calc(100% - 280px) !important; height: 80px !important; }
.nav-container { height: 80px !important; padding: 0 30px !important; }
.nav-logo { width: 70px !important; height: 70px !important; margin-left: 25px !important; padding: 8px !important; border-radius: 0 !important; }
.nav-brand { font-size: 22px !important; }
.icon-wrapper { width: 45px !important; height: 45px !important; border-radius: 12px !important; }
.user-dropdown-toggle { padding: 10px !important; color: #fff !important; background: var(--primary) !important; border-radius: 50px !important; box-shadow: 0 4px 15px rgba(67,97,238,.3) !important; }
.user-avatar { width: 40px !important; height: 40px !important; color: var(--primary) !important; background: #fff !important; border-radius: 50% !important; }
.user-name,.user-chevron { color: #fff !important; }
.user-role { color: rgba(255,255,255,.8) !important; }
.content { margin: 80px 0 0 280px !important; }

@media (max-width:1200px) {
  #sidebar { left: -280px !important; }
  #sidebar.active { left: 0 !important; }
  .main-navbar { left: 0 !important; width: 100% !important; }
  .content { margin-left: 0 !important; }
}
@media (max-width:480px) {
  #sidebar { width: min(280px,88vw) !important; left: min(-280px,-88vw) !important; }
  #sidebar.active { left: 0 !important; }
}

*/
/* Staff dashboard — focused, professional overview */
.staff-dashboard .content { max-width: none !important; padding: 28px 32px 56px !important; }
.staff-dashboard .dashboard-header { max-width: 1480px; margin: 0 auto 22px !important; }
.staff-dashboard .dashboard-header .top-nav {
  min-height: 112px;
  margin: 0 0 22px !important;
  padding: 22px 25px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: var(--shadow) !important;
}
.staff-dashboard .dashboard-eyebrow {
  display: block;
  margin-bottom: 4px;
  color: var(--primary);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.staff-dashboard .welcome-section h1 { margin: 0 !important; color: var(--text) !important; font-size: clamp(20px,2vw,28px) !important; }
.staff-dashboard .welcome-section h1 i { margin-right: 5px; color: #c17b0b; font-size: .8em; }
.staff-dashboard .welcome-section p { margin: 5px 0 0 !important; color: var(--muted) !important; font-size: 13px !important; }
.staff-dashboard .profile-btn { min-width: 210px; min-height: 56px; padding: 7px 10px 7px 7px !important; gap: 10px !important; background: #fff !important; border: 1px solid var(--line) !important; border-radius: 12px !important; box-shadow: 0 5px 16px rgba(20,43,78,.045) !important; }
.staff-dashboard .profile-btn:hover { background: var(--gray-50) !important; border-color: #d8dee8 !important; }
.staff-dashboard .profile-avatar-wrap { position: relative; display: block; flex: 0 0 auto; width: 40px; height: 40px; }
.staff-dashboard .profile-img { width: 40px !important; height: 40px !important; border: 0 !important; border-radius: 10px !important; }
.staff-dashboard .profile-status { position: absolute; right: -1px; bottom: -1px; width: 10px; height: 10px; background: var(--success); border: 2px solid #fff; border-radius: 50%; }
.staff-dashboard .profile-info { min-width: 0; flex: 1; }
.staff-dashboard .profile-info .name { max-width: 125px; overflow: hidden; color: var(--text) !important; font-size: 11px !important; font-weight: 800 !important; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.staff-dashboard .profile-info .id { margin-top: 2px; color: var(--muted) !important; font-size: 9px !important; font-weight: 500; line-height: 1.3; text-transform: capitalize; }
.staff-dashboard .profile-chevron { margin-left: 2px; color: var(--gray-400); font-size: 10px; }
.staff-dashboard .dashboard-content { max-width: 1480px; margin: 0 auto; grid-template-columns: minmax(0,1fr) 340px !important; gap: 22px !important; align-items: start; }
.staff-dashboard .stats-grid { grid-template-columns: repeat(4,minmax(0,1fr)) !important; gap: 14px !important; margin-bottom: 22px !important; }
.staff-dashboard .stat-card { position: relative; min-height: 146px !important; padding: 20px !important; overflow: hidden; }
.staff-dashboard .stat-card::after { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--primary); }
.staff-dashboard .stat-header { margin-bottom: 15px !important; }
.staff-dashboard .stat-icon { width: 38px !important; height: 38px !important; font-size: 16px !important; }
.staff-dashboard .stat-title { color: var(--muted) !important; font-size: 13px !important; font-weight: 700 !important; }
.staff-dashboard .stat-value { margin: 0 0 1px !important; color: var(--text) !important; font-size: 31px !important; line-height: 1.15; }
.staff-dashboard .stat-subtext { color: var(--muted) !important; font-size: 12px !important; }
.staff-dashboard .management-overview { margin: 0 0 22px; padding: 22px; background: #fff; border-radius: 16px; box-shadow: var(--shadow); }
.staff-dashboard .section-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 17px; }
.staff-dashboard .section-heading h2 { margin: 0 !important; font-size: 19px !important; }
.staff-dashboard .section-date { padding: 6px 10px; color: var(--muted); background: var(--gray-100); border-radius: 8px; font-size: 11px; font-weight: 700; }
.staff-dashboard .overview-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 11px; }
.staff-dashboard .overview-card { display: flex; align-items: center; min-width: 0; padding: 15px; color: var(--text); background: var(--gray-50); border-radius: 12px; transition: background .18s ease; }
.staff-dashboard .overview-card:hover { color: var(--text); background: var(--primary-light); }
.staff-dashboard .overview-icon { display: grid; flex: 0 0 40px; width: 40px; height: 40px; margin-right: 11px; place-items: center; color: var(--primary); background: #fff; border-radius: 10px; font-size: 17px; }
.staff-dashboard .overview-copy { display: block; min-width: 0; flex: 1; }
.staff-dashboard .overview-copy strong { display: block; margin-bottom: 3px; color: var(--text); font-size: 13px; }
.staff-dashboard .overview-copy small { display: block; color: var(--muted); font-size: 11px; line-height: 1.45; }
.staff-dashboard .overview-arrow { margin-left: 8px; color: var(--gray-400); font-size: 12px; }
.staff-dashboard .finance-card { padding: 22px !important; background: #fff !important; border: 0 !important; border-radius: 16px !important; box-shadow: var(--shadow) !important; }
.staff-dashboard .finance-card section { font-family: var(--font-ui) !important; }
.staff-dashboard .finance-details { gap: 12px !important; }
.staff-dashboard .detail-item { padding: 18px !important; background: var(--gray-50) !important; border: 0 !important; border-radius: 12px !important; }
.staff-dashboard .detail-value { color: var(--text) !important; }
.staff-dashboard .detail-label { color: var(--muted) !important; }
.staff-dashboard .quick-actions-sidebar { position: sticky; top: 94px; padding: 21px !important; }
.staff-dashboard .quick-actions-sidebar > h3 { margin: 0 0 14px !important; font-size: 18px !important; }
.staff-dashboard .action-list { display: grid; gap: 8px; }
.staff-dashboard .action-item { min-height: 70px; padding: 12px 13px !important; background: #fff !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; border-radius: 0 !important; }
.staff-dashboard .action-item:last-child { border-bottom: 0 !important; }
.staff-dashboard .action-item:hover { background: var(--gray-50) !important; transform: none !important; }
.staff-dashboard .action-icon,.staff-dashboard .action-icon[style] { width: 38px !important; height: 38px !important; color: var(--primary) !important; background: var(--primary-light) !important; }
.staff-dashboard .action-content h4 { margin: 0 0 2px !important; color: var(--text) !important; font-size: 13px !important; }
.staff-dashboard .action-content p { margin: 0 !important; color: var(--muted) !important; font-size: 11px !important; line-height: 1.4; }
.staff-dashboard .action-item > .bi-arrow-right { color: var(--gray-400) !important; }

@media (max-width: 1100px) {
  .staff-dashboard .dashboard-content { grid-template-columns: 1fr !important; }
  .staff-dashboard .quick-actions-sidebar { position: static; }
}
@media (max-width: 760px) {
  .staff-dashboard .content { padding: 15px 11px 82px !important; }
  .staff-dashboard .dashboard-header .top-nav { min-height: auto; padding: 18px !important; }
  .staff-dashboard .top-actions { display: none !important; }
  .staff-dashboard .stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 10px !important; }
  .staff-dashboard .overview-grid { grid-template-columns: 1fr !important; }
  .staff-dashboard .stat-card { min-height: 126px !important; padding: 16px !important; }
  .staff-dashboard .finance-details { grid-template-columns: 1fr !important; }
}

/* Classic institutional dashboard */
.staff-dashboard .content { padding: 26px 30px 58px !important; background: #f5f6f8 !important; }
.staff-dashboard .dashboard-header .top-nav {
  min-height: 112px;
  padding: 23px 25px !important;
  color: #fff !important;
  background: var(--primary) !important;
  border: 0 !important;
  border-radius: 2px !important;
  box-shadow: none !important;
}
.staff-dashboard .dashboard-eyebrow { color: #c8d4e5 !important; }
.staff-dashboard .welcome-section h1 { color: #fff !important; font-family: Georgia,"Times New Roman",serif !important; font-size: 27px !important; font-weight: 700 !important; letter-spacing: 0 !important; }
.staff-dashboard .welcome-section p { color: #d7e0ec !important; font-size: 12px !important; }
.staff-dashboard .profile-btn { min-width: 210px; background: rgba(255,255,255,.1) !important; border: 1px solid rgba(255,255,255,.2) !important; border-radius: 2px !important; }
.staff-dashboard .profile-btn:hover { background: rgba(255,255,255,.15) !important; }
.staff-dashboard .profile-img { border-radius: 2px !important; }
.staff-dashboard .profile-status { display: none; }
.staff-dashboard .profile-info .name { color: #fff !important; }
.staff-dashboard .profile-info .id { color: #d7e0ec !important; }
.staff-dashboard .profile-chevron { color: #fff !important; }
.staff-dashboard .dashboard-content { grid-template-columns: minmax(0,1fr) 350px !important; gap: 18px !important; }
.staff-dashboard .stats-grid {
  grid-template-columns: repeat(4,minmax(0,1fr)) !important;
  gap: 0 !important;
  margin-bottom: 18px !important;
  overflow: hidden;
  background: #fff;
  border-top: 3px solid var(--primary);
  border-radius: 2px;
}
.staff-dashboard .stat-card {
  min-height: 132px !important;
  padding: 19px 20px !important;
  background: #fff !important;
  border: 0 !important;
  border-right: 1px solid #e2e6ec !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.staff-dashboard .stat-card:last-child { border-right: 0 !important; }
.staff-dashboard .stat-card:hover { background: #fafbfc !important; box-shadow: none !important; }
.staff-dashboard .stat-icon { width: 34px !important; height: 34px !important; color: var(--primary) !important; background: transparent !important; border: 1px solid #cdd5e0 !important; border-radius: 0 !important; }
.staff-dashboard .stat-title { font-size: 10px !important; }
.staff-dashboard .stat-value { color: #132b4d !important; font-family: Georgia,"Times New Roman",serif; font-size: 28px !important; }
.staff-dashboard .management-overview,
.staff-dashboard .finance-card,
.staff-dashboard .quick-actions-sidebar {
  background: #fff !important;
  border: 0 !important;
  border-top: 3px solid var(--primary) !important;
  border-radius: 2px !important;
  box-shadow: none !important;
}
.staff-dashboard .management-overview { padding: 20px !important; }
.staff-dashboard .section-heading { padding-bottom: 13px !important; }
.staff-dashboard .section-heading h2,.staff-dashboard .quick-actions-sidebar > h3 { font-family: Georgia,"Times New Roman",serif !important; font-size: 19px !important; letter-spacing: 0 !important; }
.staff-dashboard .overview-grid { display: block !important; }
.staff-dashboard .overview-card {
  min-height: 72px;
  padding: 13px 0 !important;
  align-items: center;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid #e2e6ec !important;
  border-radius: 0 !important;
}
.staff-dashboard .overview-card:last-child { border-bottom: 0 !important; }
.staff-dashboard .overview-icon { color: var(--primary); background: #eef2f7; border-radius: 1px !important; }
.staff-dashboard .quick-actions-sidebar { padding: 20px !important; }
.staff-dashboard .action-list { display: block; }
.staff-dashboard .action-item {
  min-height: 76px;
  padding: 12px 0 !important;
  background: #fff !important;
  border: 0 !important;
  border-bottom: 1px solid #e2e6ec !important;
  border-radius: 0 !important;
}
.staff-dashboard .action-item:last-child { border-bottom: 0 !important; }
.staff-dashboard .action-icon,.staff-dashboard .action-icon[style] { color: var(--primary) !important; background: #eef2f7 !important; border-radius: 1px !important; }
.staff-dashboard .action-content h4 { font-family: var(--font-ui) !important; }

@media (max-width: 1180px) {
  .staff-dashboard .dashboard-content { grid-template-columns: 1fr !important; }
}
@media (max-width: 760px) {
  .staff-dashboard .content { padding: 13px 10px 82px !important; }
  .staff-dashboard .dashboard-header .top-nav { min-height: 102px; padding: 18px !important; }
  .staff-dashboard .stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .staff-dashboard .stat-card:nth-child(2) { border-right: 0 !important; }
  .staff-dashboard .stat-card { border-bottom: 1px solid #e2e6ec !important; }
}

/* Dashboard visual direction based on the approved portal reference */
.staff-dashboard .content { padding: 30px 34px 60px !important; background: #f3f6fb !important; }
.staff-dashboard .dashboard-header { margin-bottom: 25px !important; }
.staff-dashboard .dashboard-header .top-nav {
  position: relative;
  min-height: 136px;
  margin: 0 !important;
  padding: 28px 30px !important;
  overflow: hidden;
  color: #fff !important;
  background: var(--primary) !important;
  border: 0 !important;
  border-radius: 22px !important;
  box-shadow: 0 18px 34px rgba(23,52,95,.16) !important;
}
.staff-dashboard .dashboard-header .top-nav::before,
.staff-dashboard .dashboard-header .top-nav::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}
.staff-dashboard .dashboard-header .top-nav::before { right: -38px; bottom: -92px; width: 230px; height: 230px; background: rgba(5,20,43,.34); }
.staff-dashboard .dashboard-header .top-nav::after { right: 140px; top: -70px; width: 120px; height: 190px; background: rgba(255,255,255,.06); transform: rotate(13deg); border-radius: 22px; }
.staff-dashboard .welcome-section,.staff-dashboard .top-actions { position: relative; z-index: 2; }
.staff-dashboard .dashboard-eyebrow { color: #c7d4e8 !important; font: 700 10px var(--font-ui) !important; }
.staff-dashboard .welcome-section h1 { color: #fff !important; font-family: var(--font-ui) !important; font-size: 28px !important; font-weight: 800 !important; letter-spacing: -.025em !important; }
.staff-dashboard .welcome-section p { color: #d5deeb !important; font-size: 12px !important; }
.staff-dashboard .profile-btn { min-width: 220px; padding: 8px 13px 8px 8px !important; background: rgba(255,255,255,.13) !important; border: 0 !important; border-radius: 13px !important; box-shadow: none !important; backdrop-filter: blur(8px); }
.staff-dashboard .profile-btn:hover { background: rgba(255,255,255,.19) !important; }
.staff-dashboard .profile-img { width: 45px !important; height: 45px !important; border: 1px solid rgba(255,255,255,.5) !important; border-radius: 11px !important; }
.staff-dashboard .profile-status { border-color: #29466e; }
.staff-dashboard .profile-info .name { color: #fff !important; font-size: 12px !important; }
.staff-dashboard .profile-info .id { color: #dce5f1 !important; font-size: 10px !important; }
.staff-dashboard .profile-chevron { color: #fff !important; }
.staff-dashboard .dashboard-content { grid-template-columns: minmax(0,1fr) 400px !important; gap: 25px !important; }
.staff-dashboard .stats-grid { gap: 17px !important; overflow: visible; background: transparent; border-radius: 0; }
.staff-dashboard .stat-card {
  min-height: 166px !important;
  padding: 23px 22px !important;
  overflow: hidden;
  background: #fff !important;
  border: 0 !important;
  border-radius: 18px !important;
  box-shadow: 0 11px 26px rgba(22,45,79,.075) !important;
}
.staff-dashboard .stat-card:hover { transform: translateY(-2px) !important; box-shadow: 0 15px 30px rgba(22,45,79,.11) !important; }
.staff-dashboard .stat-card::after { inset: auto -34px -42px auto; width: 106px; height: 106px; background: #f0f3f8; border-radius: 50%; }
.staff-dashboard .stat-header { gap: 12px !important; }
.staff-dashboard .stat-icon { width: 48px !important; height: 48px !important; color: var(--primary) !important; background: #edf2f8 !important; border-radius: 13px !important; font-size: 19px !important; }
.staff-dashboard .stat-title { color: #5d697d !important; font-size: 13px !important; }
.staff-dashboard .stat-value { position: relative; z-index: 1; color: #11284b !important; font-family: var(--font-ui); font-size: 32px !important; font-weight: 800; }
.staff-dashboard .stat-subtext { position: relative; z-index: 1; font-size: 12px !important; }
.staff-dashboard .management-overview,
.staff-dashboard .finance-card,
.staff-dashboard .quick-actions-sidebar { border: 0 !important; border-radius: 18px !important; box-shadow: 0 11px 28px rgba(22,45,79,.07) !important; }
.staff-dashboard .management-overview { padding: 0 !important; overflow: hidden; }
.staff-dashboard .section-heading { padding: 21px 23px 17px; }
.staff-dashboard .section-heading h2,.staff-dashboard .quick-actions-sidebar > h3 { font-family: var(--font-ui) !important; font-size: 19px !important; font-weight: 800 !important; }
.staff-dashboard .overview-grid { grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 12px; padding: 18px 22px 22px; }
.staff-dashboard .overview-card { min-height: 118px; padding: 16px; align-items: flex-start; background: #f7f9fc; border: 1px solid #e4e9f1; border-radius: 14px; }
.staff-dashboard .overview-card:hover { background: #edf2f8; border-color: #d8e0eb; }
.staff-dashboard .overview-icon { flex-basis: 39px; width: 39px; height: 39px; color: var(--primary); background: #e9eff7; border-radius: 10px; }
.staff-dashboard .overview-copy strong { margin-top: 2px; font-size: 13px; }
.staff-dashboard .overview-copy small { font-size: 11px; }
.staff-dashboard .finance-card { padding: 24px !important; }
.staff-dashboard .detail-item { background: #f6f8fb !important; border: 1px solid #e3e8f0 !important; border-radius: 14px !important; }
.staff-dashboard .quick-actions-sidebar { padding: 24px !important; background: #fff !important; }
.staff-dashboard .quick-actions-sidebar > h3 { margin: 0 0 18px !important; padding: 0; border: 0; }
.staff-dashboard .action-list { gap: 12px; }
.staff-dashboard .action-item { min-height: 104px; padding: 16px !important; background: #fff !important; border: 1px solid #e1e6ef !important; border-radius: 15px !important; }
.staff-dashboard .action-item:last-child { border-bottom: 1px solid #e1e6ef !important; }
.staff-dashboard .action-item:hover { background: #f8fafd !important; border-color: #ccd6e4 !important; }
.staff-dashboard .action-icon,.staff-dashboard .action-icon[style] { width: 46px !important; height: 46px !important; color: var(--primary) !important; background: #edf2f8 !important; border-radius: 12px !important; }
.staff-dashboard .action-content h4 { font-size: 14px !important; font-weight: 800 !important; }
.staff-dashboard .action-content p { font-size: 11px !important; }

@media (max-width: 1250px) {
  .staff-dashboard .dashboard-content { grid-template-columns: 1fr 340px !important; }
  .staff-dashboard .overview-grid { grid-template-columns: 1fr !important; }
  .staff-dashboard .overview-card { min-height: 82px; }
}
@media (max-width: 1100px) {
  .staff-dashboard .dashboard-content { grid-template-columns: 1fr !important; }
}
@media (max-width: 760px) {
  .staff-dashboard .content { padding: 16px 11px 84px !important; }
  .staff-dashboard .dashboard-header .top-nav { min-height: 118px; padding: 22px 19px !important; border-radius: 16px !important; }
  .staff-dashboard .welcome-section h1 { font-size: 23px !important; }
  .staff-dashboard .stat-card { min-height: 145px !important; padding: 18px !important; }
  .staff-dashboard .overview-grid { padding: 13px; }
  .staff-dashboard .quick-actions-sidebar { padding: 19px !important; }
}

/* Classic treatment while preserving the reference layout */
.staff-dashboard .dashboard-header .top-nav { border-radius: 8px !important; box-shadow: 0 8px 20px rgba(23,52,95,.12) !important; }
.staff-dashboard .dashboard-header .top-nav::after { display: none; }
.staff-dashboard .welcome-section h1,
.staff-dashboard .section-heading h2,
.staff-dashboard .quick-actions-sidebar > h3 { font-family: Georgia,"Times New Roman",serif !important; letter-spacing: 0 !important; }
.staff-dashboard .profile-btn { border-radius: 6px !important; }
.staff-dashboard .profile-img { border-radius: 5px !important; }
.staff-dashboard .stat-card { border-radius: 7px !important; box-shadow: 0 4px 12px rgba(22,45,79,.06) !important; }
.staff-dashboard .stat-card:hover { transform: none !important; box-shadow: 0 5px 14px rgba(22,45,79,.08) !important; }
.staff-dashboard .stat-card::after { opacity: .55; }
.staff-dashboard .stat-icon { border-radius: 5px !important; }
.staff-dashboard .management-overview,
.staff-dashboard .finance-card,
.staff-dashboard .quick-actions-sidebar { border-radius: 7px !important; box-shadow: 0 4px 13px rgba(22,45,79,.055) !important; }
.staff-dashboard .overview-card,
.staff-dashboard .detail-item,
.staff-dashboard .action-item { border-radius: 6px !important; }
.staff-dashboard .overview-icon,
.staff-dashboard .action-icon,
.staff-dashboard .action-icon[style] { border-radius: 5px !important; }
.staff-dashboard .section-date { border-radius: 4px; }
@media (max-width: 760px) {
  .staff-dashboard .dashboard-header .top-nav { border-radius: 7px !important; }
}

/* Professional dashboard panel polish */
.staff-dashboard .management-overview,
.staff-dashboard .quick-actions-sidebar {
  background: #fff !important;
  border: 0 !important;
  border-radius: 10px !important;
  box-shadow: 0 6px 18px rgba(22,45,79,.06) !important;
}
.staff-dashboard .management-overview { padding: 22px !important; }
.staff-dashboard .section-heading { margin: 0 0 18px !important; padding: 0 0 14px !important; border-bottom: 1px solid var(--line); }
.staff-dashboard .section-heading .dashboard-eyebrow { margin-bottom: 3px; color: var(--primary) !important; font: 800 9px var(--font-ui) !important; letter-spacing: .1em; }
.staff-dashboard .section-heading h2,
.staff-dashboard .quick-actions-sidebar > h3 {
  color: var(--text) !important;
  font-family: var(--font-ui) !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  letter-spacing: -.015em !important;
}
.staff-dashboard .section-date { padding: 5px 9px; color: var(--muted); background: var(--gray-100); border-radius: 5px; font-size: 10px; }
.staff-dashboard .overview-grid { grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 10px; padding: 0 !important; }
.staff-dashboard .overview-card {
  min-height: 108px;
  padding: 15px !important;
  align-items: flex-start;
  background: #f7f9fc !important;
  border: 0 !important;
  border-radius: 9px !important;
}
.staff-dashboard .overview-card:hover { background: #edf2f8 !important; }
.staff-dashboard .overview-icon {
  flex-basis: 38px;
  width: 38px;
  height: 38px;
  margin-right: 10px;
  color: var(--primary);
  background: #e7eef7;
  border: 0;
  border-radius: 8px !important;
}
.staff-dashboard .overview-copy strong { color: var(--text); font-family: var(--font-ui); font-size: 13px; font-weight: 800; }
.staff-dashboard .overview-copy small { color: var(--muted); font-size: 10px; line-height: 1.5; }
.staff-dashboard .quick-actions-sidebar { padding: 22px !important; }
.staff-dashboard .quick-actions-sidebar > h3 { margin: 0 0 15px !important; padding: 0 0 13px !important; border-bottom: 1px solid var(--line); }
.staff-dashboard .action-list { display: grid; gap: 9px; }
.staff-dashboard .action-item {
  min-height: 82px;
  padding: 13px !important;
  background: #f8fafc !important;
  border: 0 !important;
  border-radius: 9px !important;
}
.staff-dashboard .action-item:last-child { border: 0 !important; }
.staff-dashboard .action-item:hover { background: #edf2f8 !important; }
.staff-dashboard .action-icon,
.staff-dashboard .action-icon[style] {
  width: 40px !important;
  height: 40px !important;
  color: var(--primary) !important;
  background: #e7eef7 !important;
  border: 0 !important;
  border-radius: 8px !important;
}
.staff-dashboard .action-content h4 { color: var(--text) !important; font-family: var(--font-ui) !important; font-size: 13px !important; font-weight: 800 !important; }
.staff-dashboard .action-content p { color: var(--muted) !important; font-size: 10px !important; }

@media (max-width: 1250px) {
  .staff-dashboard .overview-grid { grid-template-columns: 1fr !important; }
  .staff-dashboard .overview-card { min-height: 76px; align-items: center; }
}
@media (max-width: 760px) {
  .staff-dashboard .management-overview,.staff-dashboard .quick-actions-sidebar { padding: 17px !important; }
}

/* Executive administration dashboard */
.staff-dashboard .content { padding: 27px 31px 58px !important; background: #eef2f7 !important; }
.staff-dashboard .dashboard-header { margin-bottom: 20px !important; }
.staff-dashboard .dashboard-header .top-nav {
  min-height: 104px;
  padding: 20px 22px 20px 26px !important;
  color: var(--text) !important;
  background: #fff !important;
  border: 0 !important;
  border-left: 5px solid var(--primary) !important;
  border-radius: 10px !important;
  box-shadow: 0 5px 17px rgba(20,43,78,.06) !important;
}
.staff-dashboard .dashboard-header .top-nav::before,
.staff-dashboard .dashboard-header .top-nav::after { display: none !important; }
.staff-dashboard .dashboard-eyebrow { color: var(--primary) !important; font: 800 9px var(--font-ui) !important; letter-spacing: .12em; }
.staff-dashboard .welcome-section h1 { color: var(--text) !important; font-family: var(--font-ui) !important; font-size: 25px !important; font-weight: 800 !important; letter-spacing: -.025em !important; }
.staff-dashboard .welcome-section p { color: var(--muted) !important; font-size: 11px !important; }
.staff-dashboard .profile-btn {
  min-width: 218px;
  background: #f4f6f9 !important;
  border: 0 !important;
  border-radius: 8px !important;
  backdrop-filter: none;
}
.staff-dashboard .profile-btn:hover { background: #e9eef5 !important; }
.staff-dashboard .profile-img { border: 0 !important; border-radius: 7px !important; }
.staff-dashboard .profile-status { border-color: #f4f6f9; }
.staff-dashboard .profile-info .name { color: var(--text) !important; }
.staff-dashboard .profile-info .id { color: var(--muted) !important; }
.staff-dashboard .profile-chevron { color: var(--gray-500) !important; }
.staff-dashboard .dashboard-content { grid-template-columns: minmax(0,1fr) 360px !important; gap: 20px !important; }
.staff-dashboard .stats-grid { gap: 12px !important; margin-bottom: 20px !important; }
.staff-dashboard .stat-card {
  min-height: 135px !important;
  padding: 18px !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 15px rgba(20,43,78,.05) !important;
}
.staff-dashboard .stat-card::after { display: none; }
.staff-dashboard .stat-card:hover { transform: none !important; box-shadow: 0 6px 18px rgba(20,43,78,.075) !important; }
.staff-dashboard .stat-header { margin-bottom: 11px !important; }
.staff-dashboard .stat-icon {
  width: 38px !important;
  height: 38px !important;
  color: #fff !important;
  background: var(--primary) !important;
  border-radius: 7px !important;
  font-size: 15px !important;
}
.staff-dashboard .stat-title { font-size: 11px !important; text-transform: uppercase; letter-spacing: .045em; }
.staff-dashboard .stat-value { font-size: 27px !important; }
.staff-dashboard .stat-subtext { font-size: 10px !important; }
.staff-dashboard .management-overview,
.staff-dashboard .finance-card,
.staff-dashboard .quick-actions-sidebar {
  border-radius: 10px !important;
  box-shadow: 0 4px 15px rgba(20,43,78,.05) !important;
}
.staff-dashboard .management-overview { padding: 20px !important; }
.staff-dashboard .overview-card { min-height: 94px; background: #f4f6f9 !important; border-radius: 8px !important; }
.staff-dashboard .overview-icon { color: #fff; background: var(--primary); border-radius: 7px !important; }
.staff-dashboard .quick-actions-sidebar { padding: 20px !important; }
.staff-dashboard .action-item { min-height: 74px; padding: 11px !important; background: #f4f6f9 !important; border-radius: 8px !important; }
.staff-dashboard .action-icon,.staff-dashboard .action-icon[style] { width: 38px !important; height: 38px !important; color: #fff !important; background: var(--primary) !important; border-radius: 7px !important; }

@media (max-width: 1180px) {
  .staff-dashboard .dashboard-content { grid-template-columns: 1fr !important; }
}
@media (max-width: 760px) {
  .staff-dashboard .content { padding: 14px 10px 82px !important; }
  .staff-dashboard .dashboard-header .top-nav { min-height: 96px; padding: 17px !important; }
  .staff-dashboard .welcome-section h1 { font-size: 21px !important; }
  .staff-dashboard .welcome-section p { max-width: 280px; }
}

/* Final institutional presentation */
.staff-dashboard .content { background: #f5f6f8 !important; }
.staff-dashboard .dashboard-header .top-nav { min-height: 112px; padding: 23px 25px !important; color: #fff !important; background: var(--primary) !important; border: 0 !important; border-radius: 2px !important; box-shadow: none !important; }
.staff-dashboard .dashboard-eyebrow { color: #c8d4e5 !important; }
.staff-dashboard .welcome-section h1 { color: #fff !important; font-family: Georgia,"Times New Roman",serif !important; font-size: 27px !important; letter-spacing: 0 !important; }
.staff-dashboard .welcome-section p,.staff-dashboard .profile-info .id { color: #d7e0ec !important; }
.staff-dashboard .profile-btn { background: rgba(255,255,255,.1) !important; border: 1px solid rgba(255,255,255,.2) !important; border-radius: 2px !important; }
.staff-dashboard .profile-info .name,.staff-dashboard .profile-chevron { color: #fff !important; }
.staff-dashboard .stats-grid { gap: 0 !important; overflow: hidden; background: #fff; border-top: 3px solid var(--primary); border-radius: 2px; }
.staff-dashboard .stat-card { min-height: 132px !important; background: #fff !important; border: 0 !important; border-right: 1px solid #e2e6ec !important; border-radius: 0 !important; box-shadow: none !important; }
.staff-dashboard .stat-card:last-child { border-right: 0 !important; }
.staff-dashboard .stat-icon { color: var(--primary) !important; background: transparent !important; border: 1px solid #cdd5e0 !important; border-radius: 0 !important; }
.staff-dashboard .stat-value { font-family: Georgia,"Times New Roman",serif; }
.staff-dashboard .management-overview,.staff-dashboard .finance-card,.staff-dashboard .quick-actions-sidebar { border-top: 3px solid var(--primary) !important; border-radius: 2px !important; box-shadow: none !important; }
.staff-dashboard .section-heading h2,.staff-dashboard .quick-actions-sidebar > h3 { font-family: Georgia,"Times New Roman",serif !important; letter-spacing: 0 !important; }
.staff-dashboard .overview-grid,.staff-dashboard .action-list { display: block !important; }
.staff-dashboard .overview-card,.staff-dashboard .action-item { min-height: 74px; padding: 12px 0 !important; background: #fff !important; border: 0 !important; border-bottom: 1px solid #e2e6ec !important; border-radius: 0 !important; }
.staff-dashboard .overview-card:last-child,.staff-dashboard .action-item:last-child { border-bottom: 0 !important; }
.staff-dashboard .overview-icon,.staff-dashboard .action-icon,.staff-dashboard .action-icon[style] { color: var(--primary) !important; background: #eef2f7 !important; border-radius: 1px !important; }
@media (max-width: 760px) {
  .staff-dashboard .dashboard-header .top-nav { min-height: 102px; padding: 18px !important; }
  .staff-dashboard .stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}

/* Shared student/staff navigation dimensions and visual language. */
:root {
  --font-ui: Inter,"Segoe UI",Roboto,Arial,sans-serif;
  --primary: #96292c !important;
  --primary-dark: #741f22 !important;
  --primary-light: #f8eded !important;
  --sidebar: #741f22;
  --text: #172033;
  --muted: #6f7890;
  --line: #e6e9f0;
  --gray-50: #f8f9fc !important;
  --gray-100: #f1f3f8 !important;
  --gray-600: #5e687d !important;
  --gradient-primary:#96292c !important;
}

.main-navbar {
  left: 260px !important;
  width: calc(100% - 260px) !important;
  height: 76px !important;
  background: rgba(255,255,255,.96) !important;
  border-bottom: 1px solid var(--line) !important;
  box-shadow: 0 2px 14px rgba(38,50,80,.045) !important;
}
.nav-container { height: 76px !important; padding: 0 28px !important; }
.nav-left { gap: 12px !important; }
.nav-brand { color: var(--text) !important; font-family: var(--font-ui) !important; font-size: 18px !important; text-transform: none !important; letter-spacing: -.015em !important; }
.nav-logo { width: 56px !important; height: 56px !important; margin: 0 8px 0 0 !important; padding: 2px !important; }
.nav-toggle { width: 40px !important; height: 40px !important; color: var(--text) !important; background: var(--gray-100) !important; border: 0 !important; border-radius: 11px !important; box-shadow: none !important; }
.admin-icons-container,.student-icons-container { gap: 10px !important; }
.icon-wrapper { width: 40px !important; height: 40px !important; color: var(--gray-600) !important; background: var(--gray-50) !important; border: 1px solid var(--line) !important; border-radius: 11px !important; box-shadow: none !important; }
.icon-wrapper:hover { color: var(--primary) !important; background: var(--primary-light) !important; transform: translateY(-1px) !important; box-shadow: none !important; }
.icon-wrapper:hover i { color: var(--primary) !important; }
.notification-badge { top: -5px !important; right: -5px !important; width: 19px !important; height: 19px !important; background: var(--danger) !important; border-radius: 7px !important; box-shadow: none !important; }
.user-dropdown-toggle { min-height: 44px; padding: 5px 12px 5px 5px !important; color: var(--text) !important; background: var(--gray-50) !important; border: 1px solid var(--line) !important; border-radius: 13px !important; box-shadow: none !important; }
.user-dropdown-toggle:hover { background: var(--primary-light) !important; transform: none !important; box-shadow: none !important; }
.user-avatar { width: 34px !important; height: 34px !important; display: grid !important; place-items: center; color: #fff !important; background: var(--gradient-primary) !important; border-radius: 10px !important; box-shadow: none !important; }
.user-name,.user-chevron { color: var(--text) !important; }
.user-role { color: var(--muted) !important; }
.user-dropdown-menu { padding: 10px !important; border: 1px solid var(--line) !important; border-radius: 16px !important; }
.user-dropdown-item { color: var(--text) !important; border-radius: 9px !important; }

#sidebar {
  width: 260px !important;
  background:#96292c !important;
}
.sidebar-header { min-height: 0; padding: 26px 20px 21px !important; }
.sidebar-profile {
  position: relative;
  display: block !important;
  min-height: 54px;
  padding: 2px 0 0 64px !important;
  text-align: left !important;
}
.sidebar-profile-img {
  position: absolute;
  left: 0;
  top: 0;
  width: 50px !important;
  height: 50px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 3px solid rgba(255,255,255,.17) !important;
  border-radius: 14px !important;
}
.sidebar-profile-name { display: block !important; margin: 2px 0 1px !important; color: #fff !important; font: 700 14px/1.4 var(--font-ui) !important; white-space: nowrap; }
.sidebar-profile-role { display: inline-block !important; padding: 2px 7px !important; color: #b8c6ef !important; background: rgba(111,139,224,.14) !important; border-radius: 5px !important; font-size: 9px !important; text-transform: uppercase; letter-spacing: .12em; }
.sidebar-profile-id { display: block !important; margin-top: 4px !important; color: #8793ad !important; font-size: 10px !important; white-space: nowrap; }
.sidebar-nav { padding: 16px 12px 30px !important; }
.sidebar-nav-item { margin: 3px 0 !important; }
.sidebar-nav-item:has(> .sidebar-dropdown)::after { content: none !important; display: none !important; }
.sidebar-nav-link { min-height: 45px !important; margin: 0 !important; padding: 11px 13px !important; color: #bfc8da !important; background: transparent !important; border: 0 !important; border-radius: 10px !important; font-size: 13px !important; overflow: hidden !important; }
.sidebar-nav-link::before,.sidebar-dropdown-link::before { content: none !important; display: none !important; }
.sidebar-nav-link:hover,.sidebar-nav-link.active { color: #fff !important; background: #741f22 !important; border: 0 !important; transform: none !important; }
.sidebar-nav-link i { width: 24px !important; margin-right: 15px !important; color: #95a4c4 !important; font-size: 14px !important; transform: none !important; }
.sidebar-nav-link:hover i,.sidebar-nav-link.active i { color: #fff !important; transform: none !important; }
.sidebar-nav-text { font-family: var(--font-ui) !important; font-size: 13px !important; font-weight: 500 !important; }
.sidebar-chevron { width: auto !important; margin-left: auto !important; font-size: 10px !important; opacity: .65; }
.sidebar-dropdown { margin: 4px 0 7px !important; padding: 5px !important; background: rgba(5,10,20,.22) !important; border-radius: 10px !important; }
.sidebar-dropdown.active { max-height: 650px !important; padding: 5px !important; }
.sidebar-dropdown-link { padding: 9px 10px 9px 40px !important; color: #aab5cb !important; border-radius: 8px !important; font-family: var(--font-ui) !important; font-size: 12px !important; }
.sidebar-dropdown-link:hover { padding-left: 40px !important; color: #fff !important; background: rgba(255,255,255,.07) !important; transform: none !important; }

/* Navigation links stay continuous: no separators between href items. */
.sidebar-nav-item,
.sidebar-dropdown-item {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
.sidebar-nav-item::before,
.sidebar-nav-item::after,
.sidebar-dropdown-item::before,
.sidebar-dropdown-item::after {
  content: none !important;
  display: none !important;
}
.sidebar-nav-link,
.sidebar-dropdown-link {
  border: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}
.content { min-height: calc(100vh - 76px); margin: 76px 0 0 260px !important; }

@media (max-width: 1200px) {
  #sidebar { left: -260px !important; }
  #sidebar.active { left: 0 !important; }
  .main-navbar { left: 0 !important; width: 100% !important; }
  .content { margin-left: 0 !important; }
}
@media (max-width: 768px) {
  .main-navbar,.nav-container { height: 64px !important; }
  .content { margin-top: 64px !important; }
}
@media (max-width: 480px) {
  #sidebar { width: min(260px,88vw) !important; left: min(-260px,-88vw) !important; }
  #sidebar.active { left: 0 !important; }
}

/* Shared application typography and colour scale. */
html,body{color:#172033 !important;font-family:var(--font-ui) !important;font-size:14px !important}
body,p,span,div,a,li,td,th,label,input,select,textarea,button{font-family:var(--font-ui) !important}
p,.text-muted,.muted,.subtitle,.description,small{color:#6f7890}
h1,.h1,.page-title{color:#172033 !important;font-size:28px !important}
h2,.h2,.section-title{color:#172033 !important;font-size:22px !important}
h3,.h3,.card-title,.panel-title{color:#172033 !important;font-size:18px !important}
h4,.h4{color:#172033 !important;font-size:16px !important}
h5,.h5,h6,.h6{color:#172033 !important;font-size:14px !important}
.btn,button,input,select,textarea,.form-control,.form-select{font-size:13px !important}
table,.table,tbody td,.table tbody td{color:#172033 !important;font-size:13px !important}
thead th,.table thead th{color:#6f7890 !important;font-size:11px !important}
.main-navbar,.nav-brand,.user-dropdown-menu,#sidebar,.sidebar-nav-link,.sidebar-dropdown-link{font-family:var(--font-ui) !important}

/* Final flat-colour system override: legacy modules cannot restore gradients. */
body *,body *::before,body *::after{background-image:none!important}
#sidebar,.sidebar,.mobile-sidebar{background-color:#96292c!important}
.page-header,.dashboard-header .top-nav,.dashboard-hero,.hero-section,.hero-banner,
[class$="-hero"],.card-header.bg-primary,.table-header,.modal-header,
.btn-primary,.btn-add,.primary-action{background-color:#96292c!important;background-image:none!important}
.sidebar-nav-link:hover,.sidebar-nav-link.active,
.sidebar-dropdown-link:hover,.sidebar-dropdown-link.active{background-color:#741f22!important}

/* Preserve readable headings on solid brand-colour surfaces. */
:is(.page-header,.dashboard-header .top-nav,.dashboard-hero,.hero-section,.hero-banner,[class$="-hero"],.table-header,.modal-header,.card-header.bg-primary)
:is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,.page-title,.card-title,.panel-title){color:#fff!important}

/* One button treatment across every staff page. */
body :is(button,.btn,input[type="button"],input[type="submit"],input[type="reset"]):not(#portal-button-specificity){
  color:#fff!important;
  background-color:#96292c!important;
  background-image:none!important;
  border-color:#96292c!important;
}
body :is(button,.btn,input[type="button"],input[type="submit"],input[type="reset"]):not(#portal-button-specificity) :is(i,span,strong){color:#fff!important}
body :is(button,.btn,input[type="button"],input[type="submit"],input[type="reset"]):not(#portal-button-specificity):is(:hover,:focus,:active){
  color:#fff!important;
  background-color:#741f22!important;
  border-color:#741f22!important;
}

/* Buttons on brand-colour headers use the inverse treatment for contrast. */
body :is(.page-header,.repository-header,.dashboard-header .top-nav,.dashboard-hero,.hero-section,.hero-banner,[class$="-hero"],.table-header,.modal-header)
:is(button,.btn,input[type="button"],input[type="submit"],input[type="reset"]):not(#portal-button-specificity){
  color:#96292c!important;
  background-color:#fff!important;
  border-color:#fff!important;
}
body :is(.page-header,.repository-header,.dashboard-header .top-nav,.dashboard-hero,.hero-section,.hero-banner,[class$="-hero"],.table-header,.modal-header)
:is(button,.btn,input[type="button"],input[type="submit"],input[type="reset"]):not(#portal-button-specificity) :is(i,span,strong){color:#96292c!important}
body :is(.page-header,.repository-header,.dashboard-header .top-nav,.dashboard-hero,.hero-section,.hero-banner,[class$="-hero"],.table-header,.modal-header)
:is(button,.btn,input[type="button"],input[type="submit"],input[type="reset"]):not(#portal-button-specificity):is(:hover,:focus,:active){
  color:#741f22!important;
  background-color:#f8eded!important;
  border-color:#f8eded!important;
}
/* White copy on every solid brand-colour heading area. */
body :is(.page-header,.repository-header,.dashboard-header .top-nav,.dashboard-hero,.hero-section,.hero-banner,[class$="-hero"],.table-header,.modal-header)
:is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,.page-title,.card-title,.panel-title,p){color:#fff!important}
body :is(.page-header,.repository-header,.dashboard-header .top-nav,.dashboard-hero,.hero-section,.hero-banner,[class$="-hero"],.table-header,.modal-header)
:is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,.page-title,.card-title,.panel-title,p) i{color:#fff!important}

/* Final system colour contract. */
body:not(#theme-specificity){background-color:#f3f6fb!important;color:#172033!important}
body:not(#theme-specificity) :is(.content,.main-content,#main-content,.dashboard-content,.page-content){background-color:#f3f6fb!important}
body:not(#theme-specificity) :is(.card,.main-card,.panel,.filter-section,.search-section,.table-container,.modal-content){background-color:#fff!important;color:#172033!important}
body:not(#theme-specificity) :is(.page-header,.repository-header,.dashboard-header .top-nav,.dashboard-hero,.hero-section,.hero-banner,.page-hero,.repo-hero,.library-hero,.notes-hero,.results-hero,.graduation-hero,.assignments-hero,.video-library-hero,.welcome-banner,.notification-page-header,.group-chat-header,.timetable-hero,.table-header,.modal-header.bg-primary){background-color:#96292c!important;background-image:none!important;color:#fff!important}
body:not(#theme-specificity) :is(.page-header,.repository-header,.dashboard-header .top-nav,.dashboard-hero,.hero-section,.hero-banner,.page-hero,.repo-hero,.library-hero,.notes-hero,.results-hero,.graduation-hero,.assignments-hero,.video-library-hero,.welcome-banner,.notification-page-header,.group-chat-header,.timetable-hero,.table-header,.modal-header.bg-primary) :is(h1,h2,h3,h4,h5,h6,p,i,.page-title,.section-title,.card-title,.subtitle,small){color:#fff!important}
body:not(#theme-specificity) :is(.bg-primary,.text-bg-primary){background-color:#96292c!important;color:#fff!important}
body:not(#theme-specificity) .text-primary{color:#96292c!important}

/* Identical navigation typography and reliable mobile drawer behavior. */
body:not(#nav-specificity) .main-navbar{font-size:13px!important}
body:not(#nav-specificity) .nav-brand span{font-size:18px!important}
body:not(#nav-specificity) .sidebar-nav-link{font-size:13px!important}
body:not(#nav-specificity) .sidebar-nav-text{font-size:13px!important;line-height:1.35!important}
body:not(#nav-specificity) .sidebar-nav-link>i{font-size:14px!important}
body:not(#nav-specificity) .sidebar-dropdown-link{font-size:12px!important;line-height:1.35!important}
body:not(#nav-specificity) .sidebar-profile-name{font-size:14px!important}
@media(max-width:1200px){
  body:not(#nav-specificity) .nav-toggle{display:flex!important}
  body:not(#nav-specificity) #sidebar{left:-280px!important;transform:none!important}
  body:not(#nav-specificity) #sidebar.active{left:0!important;transform:none!important}
  body:not(#nav-specificity) .sidebar-overlay{display:none!important}
  body:not(#nav-specificity) .sidebar-overlay.active{display:block!important}
}

/* Consistent framed profile images in both navigation areas. */
body:not(#profile-border-specificity) .sidebar-profile-img,
body:not(#profile-border-specificity) .user-avatar {
  border:3px solid #fff!important;
  outline:none!important;
}

/* Navigation labels use the named white colour across staff navigation. */
#sidebar :is(.sidebar-nav-link,.sidebar-dropdown-link,.sidebar-nav-text,.sidebar-chevron),
#sidebar :is(.sidebar-nav-link,.sidebar-dropdown-link) > i,
.main-navbar .user-dropdown-toggle :is(.user-name,.user-role,.user-chevron) {
  color:white!important;
}