﻿/* ============================================================
   THEME COLOR OVERRIDES
   - Navbar/sidebar accent: #001F54 (unchanged)
   - Table headings + primary buttons: #5172C9
   - Cards + faded areas: rgba(0,31,84,0.06) tint of main color
   ============================================================ */

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

/* Global clean UI font, matching the student profile/report pages. */
:root {
  --cmis-font: "Inter", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

html,
body,
button,
input,
select,
textarea,
label,
th, td,
p, span, a,
h1, h2, h3, h4, h5, h6,
.pcoded-main-container,
.pcoded-navbar,
.pcoded-header,
.card,
.table,
.form-control,
.nav-link,
.dropdown-item,
.btn {
  font-family: var(--cmis-font) !important;
  letter-spacing: 0 !important;
}

body {
  color: #0f2544;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}


label,
.form-label,
.col-form-label {
  font-size: 14.5px !important;
  font-weight: 500 !important;
}

.form-control,
select.form-control,
input.form-control,
textarea.form-control {
  font-size: 14.5px !important;
  font-weight: 400 !important;
}

h1 { font-size: 22px !important; font-weight: 700 !important; }
h2 { font-size: 19px !important; font-weight: 700 !important; }
h3 { font-size: 17px !important; font-weight: 600 !important; }
h4 { font-size: 15px !important; font-weight: 600 !important; }
h5, .card .card-header h5 { font-size: 14.5px !important; font-weight: 600 !important; }
h6 { font-size: 13px !important; font-weight: 600 !important; }

.btn { font-size: 13px !important; font-weight: 500 !important; height: auto!important;}
.btn-sm { font-size: 13px !important; }
.btn-xs { font-size: 11.5px !important; }

.nav-link { font-size: 13px !important; font-weight: 400 !important; }
.dropdown-item { font-size: 13px !important; }

.table th { font-size: 14.5px !important; font-weight: 700 !important; }
.table td { font-size: 14px !important; font-weight: 400 !important; }
/* ── Table headings ─────────────────────────────────────── */
.table thead th {
  background: #5172C9!important;
  color: #fff !important;
  border-bottom: 2px solid #5172C9;
}

/* ── Primary buttons — force override over style.css pink ── */
.btn-primary,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-info,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary.disabled,
.btn-primary:disabled,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
  color: #fff !important;
  background-color: #5172C9 !important;
  border-color: #5172C9 !important;
}

.btn-outline-primary {
  color: #5172C9 !important;
  border-color: #5172C9 !important;
  background-color: transparent !important;
}
.btn-outline-primary:hover,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.show > .btn-outline-primary.dropdown-toggle {
  color: #fff !important;
  background-color: #5172C9 !important;
  border-color: #5172C9 !important;
}

/* ── Glow variant ───────────────────────────────────────── */
.btn-glow-primary {
  box-shadow:
    0 1px 6px 2px rgba(87, 181, 227, 0.5),
    0 6px 11px 2px rgba(87, 181, 227, 0.18);
}
.btn-glow-primary:hover {
  box-shadow:
    0 1px 4px 2px rgba(87, 181, 227, 0.5),
    0 4px 9px 2px rgba(87, 181, 227, 0.1);
}

/* ── Card header accent bar ─────────────────────────────── */
.card .card-header h5:after {
  background-color: #5172C9;
}

/* ── Card header background (faded main-color tint) ─────── */
.card .card-header {
  background-color: rgba(0, 31, 84, 0.04);
  border-bottom: 1px solid rgba(0, 31, 84, 0.1);
}

/* ── Card body / block subtle tint ─────────────────────── */
.card {
  border-top: 3px solid rgba(0, 31, 84, 0.12);
}

/* ── Active nav/sidebar indicator ──────────────────────── */
.pcoded-navbar .pcoded-inner-navbar > li.active:after,
.pcoded-navbar .pcoded-inner-navbar > li.pcoded-trigger:after {
  background-color: #1a8fba;
}

/* ── Pagination active ──────────────────────────────────── */
.page-item.active .page-link {
  background-color: #5172C9;
  border-color: #5172C9;
}

/* ── Progress bar default ───────────────────────────────── */
.progress-bar {
  background-color: #5172C9;
}
.progress-bar.progress-c-blue {
  background: #001F54;
}

/* ── Modal header ───────────────────────────────────────── */
.modal-header {
  background: #5172C9;
}

/* ── Badges ─────────────────────────────────────────────── */
.badge-primary {
  background-color: #5172C9;
}

/* ── Labels ─────────────────────────────────────────────── */
.label.label-primary {
  background: #5172C9;
}

/* ── Text helpers ───────────────────────────────────────── */
.text-primary {
  color: #5172C9 !important;
}
.text-c-blue {
  color: var(--cmis-theme-dark, #001F54);
}
.bg-c-blue {
  background: linear-gradient(135deg, var(--cmis-theme, #5172C9), var(--cmis-theme-dark, #1a6fa8));
  border-radius: 10px!important;
}

/* ── Card top-border helper ─────────────────────────────── */
.card-border-c-blue {
  border-top: 4px solid var(--cmis-theme, #5172C9);
}

.nav-link.active{

    color: #FFF !important;
}

/* ── Search button in header ────────────────────────────── */
.pcoded-header .main-search.open .input-group .search-btn {
  background: #5172C9;
  border-color: #5172C9;
}
.pcoded-header .main-search .search-close > .input-group-text {
  color: #5172C9;
}

/* ── DataTables export buttons ──────────────────────────── */
.dataTables_wrapper .dt-buttons .btn {
  color: #5172C9 !important;
  border-color: #5172C9 !important;
}

/* ── Form focus border ──────────────────────────────────── */
.custom-select:focus,
.form-select:focus,
.form-control:focus {
  border-bottom: 1px solid #5172C9;
}
.form-control.is-valid,
.form-control.is-valid:focus,
.was-validated .form-control:valid:focus,
.was-validated .form-control:valid {
  border-color: #5172C9 !important;
}

/* ── Card loader spinner ────────────────────────────────── */
.card.card-load .card-loader i {
  color: #5172C9;
}

/* ── Task container top border ──────────────────────────── */
#task-container li {
  border-top: 5px solid #5172C9;
}

/* ── Datta example copy button ──────────────────────────── */
.datta-example .datta-example-btns .datta-example-btn {
  background: #5172C9;
}

/* ════════════════════════════════════════════════════════
   EXTENDED LOOK & FEEL IMPROVEMENTS
   ════════════════════════════════════════════════════════ */

/* ── Page loader bar ────────────────────────────────────── */
.loader-fill {
  background: #5172C9 !important;
}

/* ── Top header — flat override blue, no gradient ───────── */
.pcoded-header.header-lightblue,
.pcoded-header {
  background: #5172C9 !important;
  box-shadow: 0 2px 8px rgba(87, 181, 227, 0.35) !important;
}
.pcoded-header .title-medium {
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: 0.3px;
}
/* keep all header links/icons white */
.pcoded-header.header-lightblue a,
.pcoded-header.header-lightblue .dropdown-toggle,
.pcoded-header .dropdown-toggle.text-white,
.pcoded-header .icon.feather,
.pcoded-header .feather {
  color: #fff !important;
}
.pcoded-header.header-lightblue a:hover,
.pcoded-header.header-lightblue .dropdown-toggle:hover {
  color: rgba(255,255,255,0.8) !important;
}
/* mobile header stripe */
.pcoded-header .m-header {
  background: #4da8d6;
}

/* ── Sidebar ─────────────────────────────────────────────── */
/* navbar-lightblue base → override blue body, white logo */
.pcoded-navbar.navbar-lightblue {
  background: #001F54 !important;
  box-shadow: 3px 0 10px rgba(0, 0, 0, 0.15);
}
/* logo area stays white as designed */
.pcoded-navbar.navbar-lightblue .navbar-brand,
.navbar-wrapper .navbar-brand.header-logo {
  background: #fff !important;
  border-bottom: 1px solid rgba(87, 181, 227, 0.2);
}
.pcoded-navbar .navbar-brand.header-logo img,
.pcoded-header.cmis-admin-topbar .cmis-header-logo {
  object-fit: contain !important;
}
.pcoded-navbar .navbar-brand.header-logo img {
  max-width: 150px !important;
  max-height: 115px !important;
  width: auto !important;
  height: auto !important;
  display: block !important;
}
/* menu text */
.pcoded-navbar.navbar-lightblue .pcoded-inner-navbar li > a {
  color: #000 !important;
  transition: color 0.18s ease, background 0.18s ease;
}
/* hover — deeper blue for text/icon */
.pcoded-navbar.navbar-lightblue .pcoded-inner-navbar li:hover > a,
.pcoded-navbar.navbar-lightblue .pcoded-inner-navbar li:focus > a {
  color: #1a8fba !important;
  background: rgba(26, 143, 186, 0.08) !important;
}
/* active & triggered parent */
.pcoded-navbar.navbar-lightblue .pcoded-inner-navbar > li.active > a,
.pcoded-navbar.navbar-lightblue .pcoded-inner-navbar > li.pcoded-trigger > a {
  color: #1a8fba !important;
  background: rgba(26, 143, 186, 0.12) !important;
  border-left: 3px solid #1a8fba !important;
  box-shadow: none !important;
}
/* submenu */
.pcoded-navbar.navbar-lightblue .pcoded-submenu {
  background: rgba(26, 143, 186, 0.06) !important;
}
.pcoded-navbar.navbar-lightblue .pcoded-submenu li > a {
  color: #000 !important;
}
.pcoded-navbar.navbar-lightblue .pcoded-submenu li:hover > a,
.pcoded-navbar.navbar-lightblue .pcoded-submenu li.active > a {
  color: #1a8fba !important;
}
/* dot before sub-item on hover/active */
.pcoded-navbar.navbar-lightblue .pcoded-inner-navbar li .pcoded-submenu > li.active > a:before,
.pcoded-navbar.navbar-lightblue .pcoded-inner-navbar li .pcoded-submenu > li:hover > a:before {
  background: #1a8fba !important;
}

/* ── Sidebar icons — consistent size & alignment ────────── */
.pcoded-navbar .pcoded-inner-navbar li > a > .pcoded-micon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  font-size: 15px !important;
  border-radius: 6px !important;
  color: #000;
  background: rgba(0,0,0,0.06) !important;
  transition: background 0.18s ease, color 0.18s ease;
}
.pcoded-navbar .pcoded-inner-navbar li > a > .pcoded-micon i,
.pcoded-navbar .pcoded-inner-navbar li > a > .pcoded-micon .feather {
  font-size: 15px !important;
  line-height: 1 !important;
  vertical-align: middle;
}
.pcoded-navbar .pcoded-inner-navbar li:hover > a > .pcoded-micon,
.pcoded-navbar .pcoded-inner-navbar li.active > a > .pcoded-micon,
.pcoded-navbar .pcoded-inner-navbar li.pcoded-trigger > a > .pcoded-micon {
  background: rgba(26, 143, 186, 0.18) !important;
  color: #1a8fba !important;
}

/* ── Cards with elevation ────────────────────────────────── */
.card {
  border-radius: 10px !important;
  box-shadow: 0 2px 10px rgba(0, 31, 84, 0.08) !important;
  border: none !important;
  transition: box-shadow 0.25s ease, transform 0.15s ease;
}
.card:hover {
  box-shadow: 0 6px 20px rgba(0, 31, 84, 0.13) !important;
}
.card .card-header {
  border-radius: 10px 10px 0 0 !important;
  padding: 14px 20px !important;
  background-color: #fff !important;
  border-bottom: 2px solid rgba(87, 181, 227, 0.18) !important;
}
.card .card-header h5 {
  font-weight: 600;
  font-size: 15px;
  color: #001F54;
}
.card .card-block,
.card .card-body {
  padding: 20px !important;
}

/* ── Breadcrumb bar ──────────────────────────────────────── */
.page-header {
  background: #fff;
  border-radius: 10px;
  padding: 14px 20px;
  box-shadow: 0 1px 6px rgba(0, 31, 84, 0.07);
  margin-bottom: 20px;
}
.breadcrumb {
  background: transparent;
  margin-bottom: 0;
  padding: 0;
}
.breadcrumb-item + .breadcrumb-item::before {
  color: #5172C9;
}
.breadcrumb-item a {
  color: #5172C9 !important;
  font-weight: 500;
}
.breadcrumb-item.active {
  color: #001F54;
  font-weight: 500;
}

/* ── Tables ──────────────────────────────────────────────── */
.table-hover tbody tr:hover {
  background-color: rgba(87, 181, 227, 0.05);
}
.table td,
.table th {
  vertical-align: middle;
}
.dataTables_wrapper .dataTables_filter input {
  border: 1px solid #d0d8e4;
  border-radius: 6px;
  padding: 4px 10px;
  transition: border-color 0.2s;
}
.dataTables_wrapper .dataTables_filter input:focus {
  border-color: #5172C9;
  outline: none;
  box-shadow: 0 0 0 0.15rem rgba(87, 181, 227, 0.2);
}

/* ── Buttons ─────────────────────────────────────────────── */
.btn {
  border-radius: 6px;
  font-weight: 500;
  letter-spacing: 0.2px;
  transition: all 0.2s ease;
}
.btn-primary:focus,
.btn-primary:active:focus {
  box-shadow: 0 0 0 0.2rem rgba(87, 181, 227, 0.35);
}
.btn-sm {
  border-radius: 5px;
}
.btn-xs {
  border-radius: 4px;
}

/* ── Form controls ───────────────────────────────────────── */
.form-control {
  border-radius: 6px !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.form-control:focus {
  box-shadow: 0 0 0 0.15rem rgba(87, 181, 227, 0.2) !important;
}
.input-group-text {
  background-color: rgba(87, 181, 227, 0.08);
  border-color: #d0d8e4;
  color: #5172C9;
}

/* ── Nav tabs ─────────────────────────────────────────────── */
.nav-tabs .nav-link {
  border-radius: 6px 6px 0 0;
  color: #555;
  font-weight: 500;
  transition: all 0.2s;
}
.nav-tabs .nav-link:hover {
  color: #5172C9;
  background: rgba(87, 181, 227, 0.06);
}
.nav-tabs .nav-link.active {
  color: #fff !important;
  background: #5172C9 !important;
  border-color: #5172C9 #5172C9 transparent !important;
}

/* ── Modals ──────────────────────────────────────────────── */
.modal-content {
  border-radius: 10px !important;
  border: none !important;
  box-shadow: 0 10px 40px rgba(0, 31, 84, 0.2);
}
.modal-header {
  border-radius: 10px 10px 0 0 !important;
}
.modal-footer {
  border-top: 1px solid #e9ecef;
  border-radius: 0 0 10px 10px;
}

/* ── Alert strips ─────────────────────────────────────────── */
.alert {
  border-radius: 8px;
  border-left: 4px solid;
  border-top: none;
  border-right: none;
  border-bottom: none;
}
.alert-success { border-left-color: #28a745; }
.alert-danger   { border-left-color: #dc3545; }
.alert-warning  { border-left-color: #ffc107; }
.alert-info     { border-left-color: #5172C9; }

/* ── Notifications dropdown head ─────────────────────────── */
.noti-head {
  background: linear-gradient(135deg, #001F54, #5172C9) !important;
  border-radius: 8px 8px 0 0;
}
.noti-head h6 {
  color: #fff !important;
}

/* ── Profile dropdown head ───────────────────────────────── */
.pro-head {
  background: linear-gradient(135deg, var(--cmis-theme, #5172C9), var(--cmis-theme-dark, #001F54)) !important;
  color: #fff !important;
}
.pro-head span,
.pro-head a,
.pro-head i {
  color: #fff !important;
}

/* ── Quick actions toggle icon sizing ────────────────────── */
.quick-actions-toggle {
  padding: 6px 10px;
}
.quick-actions-toggle .feather {
  font-size: 18px;
}

/* ── Quick Actions Dropdown ──────────────────────────────── */
.quick-actions-menu {
  min-width: 300px;
  padding: 0;
  border-radius: 10px;
  box-shadow: 0 8px 28px rgba(0, 31, 84, 0.22);
  border: none;
  overflow: hidden;
  margin-top: 8px !important;
}
.quick-actions-header {
  padding: 13px 18px;
  background: linear-gradient(135deg, #001F54, #5172C9);
}
.quick-actions-header h6 {
  color: #fff;
  margin: 0;
  font-weight: 600;
  letter-spacing: 0.4px;
  font-size: 13px;
}
.quick-actions-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1px;
  background: #dde6ef;
}
.quick-action-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 18px 10px;
  background: #fff;
  color: #3a3a5c;
  text-decoration: none !important;
  transition: background 0.18s ease, color 0.18s ease;
  text-align: center;
  cursor: pointer;
}
.quick-action-item:hover {
  background: #f0f8fe;
  color: #001F54;
}
.quick-action-item i {
  font-size: 22px;
  margin-bottom: 8px;
  color: #5172C9;
  display: block;
  transition: transform 0.18s ease, color 0.18s ease;
}
.quick-action-item:hover i {
  color: #001F54;
  transform: scale(1.12);
}
.quick-action-item span {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.3;
  display: block;
}

/* ── Stat / overview widget cards ───────────────────────── */
.card .card-block .h2,
.card .card-block h2,
.card .card-body .h2,
.card .card-body h2 {
  font-weight: 700;
  color: #001F54;
}
.bg-c-blue {
  background: linear-gradient(135deg, var(--cmis-theme, #5172C9), var(--cmis-theme-dark, #1a6fa8)) !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 14px rgba(0, 31, 84, 0.22);
}

/* ── Scrollbar (WebKit) ──────────────────────────────────── */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: #f1f4f8;
}
::-webkit-scrollbar-thumb {
  background: rgba(87, 181, 227, 0.5);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: #5172C9;
}

/* ── Global icon normalisation ───────────────────────────── */
/* Feather icon font (used in header, modals, nav arrows) */
i.feather,
.icon.feather,
[class^="icon-"].feather,
[class*=" icon-"].feather {
  line-height: 1 !important;
  vertical-align: -0.1em;
}
/* FontAwesome (used in sidebar, buttons, tables) */
i.fas, i.far, i.fab, i.fal {
  line-height: 1;
  vertical-align: -0.1em;
}
/* Icons inside buttons — uniform size & spacing */
.btn > i.fas,
.btn > i.far,
.btn > i.fab,
.btn > i.feather,
.btn > .feather {
  font-size: 13px;
  vertical-align: middle;
  margin-right: 3px;
}
.btn-sm > i.fas,
.btn-sm > i.far,
.btn-sm > i.feather {
  font-size: 12px;
}
/* standalone icon-only buttons */
.btn > i:only-child {
  margin-right: 0;
}
/* top-bar action icons */
.pcoded-header .feather,
.pcoded-header i.fas,
.pcoded-header i.far {
  font-size: 18px !important;
  vertical-align: middle;
}
/* notification bell specifically */
.pcoded-header .icon.feather.icon-bell {
  font-size: 20px !important;
}

/* ── Flush pink remnants that style.css hardcodes ───────── */
/* active-lightblue sidebar indicator after-element */
.pcoded-navbar .pcoded-inner-navbar > li.active:after,
.pcoded-navbar .pcoded-inner-navbar > li.pcoded-trigger:after {
  background-color: #1a8fba !important;
}
/* search-btn in header */
.pcoded-header .main-search.open .input-group .search-btn {
  background: #5172C9 !important;
  border-color: #5172C9 !important;
}
/* any remaining EB257C-sourced bg on .label-primary, .bg-primary */
.bg-primary { background-color: #5172C9 !important; }
.label-primary, .label.label-primary { background: #5172C9 !important; }

/* ── btn-view / btn-info catch — some themes map view to pink */
a.btn-primary, button.btn-primary,
input[type="submit"].btn-primary {
  background-color: #5172C9 !important;
  border-color: #5172C9 !important;
  color: #fff !important;
}

/* ════════════════════════════════════════════════════════
   SELECT2 — global height & vertical centering fix
   ════════════════════════════════════════════════════════ */
.select2-container--default .select2-selection--single {
  height: 38px !important;
  border-radius: 6px !important;
  border: 1px solid #ddd !important;
  display: flex !important;
  align-items: center !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 1 !important;
  padding: 0 28px 0 10px !important;
  font-size: 13px;
  color: #333;
  flex: 1;
  display: flex;
  align-items: center;
  height: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: #aaa;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 36px !important;
  top: 1px !important;
}
.select2-container--default .select2-selection--single .select2-selection__clear {
  margin-right: 4px;
  line-height: 1;
  color: #999;
}
.select2-dropdown {
  border-radius: 6px !important;
  font-size: 13px;
  border: 1px solid #ddd !important;
  box-shadow: 0 4px 14px rgba(0,0,0,0.1);
}
.select2-search--dropdown .select2-search__field {
  font-size: 13px !important;
  border-radius: 4px !important;
}
.select2-results__option--highlighted {
  background-color: #5172C9 !important;
}

/* ════════════════════════════════════════════════════════
   REQUISITION FORM — layout classes
   ════════════════════════════════════════════════════════ */
.req-label {
  font-size: 12px;
  font-weight: 600;
  color: #555;
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 5px;
  display: block;
}
.req-section-title {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #5172C9;
  margin: 0;
}
.req-items-wrap {
  margin-top: 2rem;
}
.req-items-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}
.req-items-scroll {
  overflow-x: auto;
}
.req-items-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.req-items-table thead tr {
  background: #F8F7FF;
  border-bottom: 1px solid #ebebf5;
}
.req-items-table thead th {
  padding: 9px 12px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #555;
  background: #F8F7FF !important;
}
.req-items-table thead th.th-item   { min-width: 280px; }
.req-items-table thead th.th-unit   { width: 80px;  text-align: center; }
.req-items-table thead th.th-qty    { width: 100px; text-align: center; }
.req-items-table thead th.th-notes  { min-width: 160px; }
.req-items-table thead th.th-action { width: 44px; }
.req-item-row td {
  padding: 8px 12px;
  vertical-align: middle;
  border-bottom: 0.5px solid #f0f0f0;
}
.req-item-row td.td-unit   { text-align: center; }
.req-item-row td.td-qty    { text-align: center; }
.req-item-row td.td-action { text-align: center; }
.req-unit-lbl {
  font-size: 12px;
  color: #5172C9;
  font-weight: 600;
  min-width: 40px;
  display: inline-block;
}
.req-qty-input {
  width: 80px;
  margin: auto;
  display: block;
}
.req-remove-btn {
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: 6px;
  background: #FCEBEB;
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #E24B4A;
  font-size: 11px;
  transition: background 0.15s;
}
.req-remove-btn:hover { background: #f5c5c5; }
.req-actions {
  margin-top: 1.5rem;
  display: flex;
  gap: 10px;
}
/* ════════════════════════════════════════════════════════
   CURRICULUM MODULES (CBC / Exams) — shared helpers
   (pages themselves carry no inline CSS; Bootstrap + these)
   ════════════════════════════════════════════════════════ */

/* expandable strand/sub-strand rows under a learning area */
.cbc-sub { background:#f8fafc; border-top:1px solid #eef2f7; padding:12px 16px 16px 34px; }
.cbc-strand-row { display:flex; align-items:center; gap:10px; padding:7px 10px; border-radius:7px; }
.cbc-strand-row:hover { background:#eef2f7; }
.cbc-inline-form { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-top:8px; }

/* lightweight livewire overlay modal */
.cbc-ov { position:fixed; inset:0; background:rgba(15,23,42,.5); z-index:1060; display:flex; align-items:center; justify-content:center; padding:20px; }
.cbc-ov-card { background:#fff; border-radius:10px; width:100%; max-width:480px; box-shadow:0 24px 70px rgba(0,0,0,.3); }
.cbc-ov-head { padding:16px 20px; border-bottom:1px solid #e5e7eb; font-weight:700; display:flex; justify-content:space-between; align-items:center; }
.cbc-ov-body { padding:20px; }
.cbc-ov-foot { padding:14px 20px; border-top:1px solid #e5e7eb; display:flex; justify-content:flex-end; gap:10px; }

/* CBC rubric chips (EE/ME/AE/BE) */
.rub-group { display:flex; gap:5px; }
.rub { border:1.5px solid #e5e7eb; background:#fff; border-radius:6px; padding:4px 9px; font-size:11.5px; font-weight:700; cursor:pointer; color:#6b7280; }
.rub:hover { border-color:#94a3b8; }
.rub.on-EE { background:#16a34a; color:#fff; border-color:#16a34a; }
.rub.on-ME { background:#2563eb; color:#fff; border-color:#2563eb; }
.rub.on-AE { background:#d97706; color:#fff; border-color:#d97706; }
.rub.on-BE { background:#dc2626; color:#fff; border-color:#dc2626; }
.rub-legend { display:flex; gap:14px; flex-wrap:wrap; font-size:12px; color:#6b7280; margin:6px 0 14px; }

/* exam builder question rows */
.ex-qitem { display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border:1px solid #eef2f7; border-radius:8px; margin-bottom:8px; background:#fff; }
.cbc-inline-form input { padding:7px 11px; border:1.5px solid #d1d5db; border-radius:6px; font-size:13px; }

/* Current report pages: cleaner filters, export buttons and data tables. */
.page-wrapper #report-table {
  border-collapse: separate !important;
  border-spacing: 0;
  width: 100% !important;
  color: #17213f;
}
.page-wrapper #report-table thead th {
  background: #f7f9fc !important;
  color: #5d6b82 !important;
  border-bottom: 1px solid #e8edf5 !important;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em !important;
  padding: 12px 14px !important;
}
.page-wrapper #report-table tbody td {
  border-bottom: 1px solid #edf1f7;
  padding: 12px 14px !important;
  font-size: 13.5px;
}
.page-wrapper #report-table tbody tr:hover td {
  background: #fbfcff !important;
}
.page-wrapper #report-table a {
  color: #2512c9;
  font-weight: 700;
}
.dataTables_wrapper {
  color: #526077;
}
.dataTables_wrapper .dt-buttons {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.dataTables_wrapper .dt-buttons .dt-button,
.dataTables_wrapper .dt-buttons .btn {
  border: 1px solid #e2e8f0 !important;
  background: #fff !important;
  color: #2512c9 !important;
  border-radius: 8px !important;
  min-width: 36px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 20px rgba(21,24,51,.05);
}
.dataTables_wrapper .dt-buttons .dt-button:hover,
.dataTables_wrapper .dt-buttons .btn:hover {
  background: #f3f5ff !important;
  border-color: #2512c9 !important;
}
.dataTables_wrapper .dataTables_filter {
  margin-bottom: 14px;
}
.dataTables_wrapper .dataTables_filter label {
  color: #7a748f;
  font-weight: 700;
}
.dataTables_wrapper .dataTables_filter input {
  height: 38px;
  min-width: 240px;
  border: 1px solid #e2e8f0 !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  margin-left: 8px !important;
  background: #fff;
}
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
  padding-top: 14px !important;
  color: #7a748f !important;
  font-size: 12.5px;
}
.page-wrapper .card:has(#report-table),
.page-wrapper .card:has(form.needs-validation) {
  border: 1px solid #edf1f7 !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 35px rgba(21,24,51,.055) !important;
}
.page-wrapper .card:has(form.needs-validation) .card-block {
  background: #fff;
}
.page-wrapper form.needs-validation label {
  color: #526077;
  font-size: 12px;
  font-weight: 800;
}
.page-wrapper form.needs-validation .btn-filter,
.page-wrapper form.needs-validation button[type="submit"] {
  margin-top: 27px;
  border-radius: 9px !important;
  min-height: 38px;
}
.report-card-shell,
.report-cards-page {
  font-family: var(--cmis-font, "Inter", "Segoe UI", Arial, sans-serif);
}

/* Slightly wider admin sidebar, keeping collapsed layout unchanged. */
@media screen and (min-width: 992px) {
  .pcoded-navbar,
  .pcoded-navbar .header-logo {
    width: 272px !important;
  }

  .pcoded-header,
  .pcoded-main-container {
    margin-left: 272px !important;
    width: calc(100% - 272px) !important;
  }

  .pcoded-navbar.navbar-collapsed ~ .pcoded-header,
  .pcoded-navbar.navbar-collapsed ~ .pcoded-main-container {
    margin-left: 80px !important;
    width: calc(100% - 80px) !important;
  }
}

/* Admin topbar: force SaaS-style header over Datta/tenant theme CSS. */
body .pcoded-header.cmis-admin-topbar,
body .pcoded-header.header-lightblue.cmis-admin-topbar,
body .pcoded-navbar ~ .pcoded-header.cmis-admin-topbar {
  background: #fff !important;
  border-bottom: 1px solid #edf1f7 !important;
  box-shadow: 0 8px 24px rgba(21,24,51,.06) !important;
  min-height: 74px !important;
  color: #1f2937 !important;
}
body .pcoded-header.cmis-admin-topbar > .collapse.navbar-collapse,
body .pcoded-header.cmis-admin-topbar .collapse.navbar-collapse {
  display: grid !important;
  grid-template-columns: minmax(260px, 1fr) minmax(260px, 430px) auto !important;
  align-items: center !important;
  gap: 18px !important;
  width: 100% !important;
  background: #fff !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-header-left {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-header-title {
  display: block !important;
  margin: 0 !important;
  color: #0f3460 !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 420px !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-header-search {
  display: flex !important;
  align-items: center !important;
  background: #faf8f8 !important;
  border: 1px solid #f1eeee !important;
  border-radius: 18px !important;
  box-shadow: 0 8px 20px rgba(15,23,42,.04) !important;
  height: 42px !important;
  padding: 0 12px 0 16px !important;
  min-width: 0 !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-header-search input {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  height: 100% !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  color: #1f2937 !important;
  font-size: 13px !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-header-search button {
  width: 32px !important;
  height: 32px !important;
  border: 0 !important;
  border-left: 1px solid #d7d2d2 !important;
  background: transparent !important;
  color: #24145c !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  padding: 0 !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-header-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 14px !important;
  min-width: 0 !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-quick-icons {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding-right: 4px !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-top-icon {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  border-radius: 10px !important;
  border: 1px solid #eef2f7 !important;
  background: #fff !important;
  color: #2414c8 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  position: relative !important;
  padding: 0 !important;
  line-height: 1 !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-top-icon:hover,
body .pcoded-header.cmis-admin-topbar .cmis-top-icon:focus,
body .pcoded-header.cmis-admin-topbar .cmis-top-icon:active {
  background: var(--cmis-theme, #5172C9) !important;
  color: #fff !important;
  border-color: var(--cmis-theme, #5172C9) !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-top-icon:hover svg,
body .pcoded-header.cmis-admin-topbar .cmis-top-icon:focus svg,
body .pcoded-header.cmis-admin-topbar .cmis-top-icon:active svg {
  color: #fff !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-top-icon.green {
  color: #22bf7d !important;
}
body .pcoded-header.cmis-admin-topbar svg {
  width: 17px !important;
  height: 17px !important;
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  display: block !important;
  margin: 0 !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-top-dot {
  position: absolute !important;
  right: 7px !important;
  top: 7px !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #2fd182 !important;
  border: 2px solid #fff !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-profile-toggle {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  background: none !important;
  border: none !important;
  cursor: pointer !important;
  padding: 4px 6px !important;
  border-radius: 9px !important;
  color: #1f2937 !important;
  text-decoration: none !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-profile-avatar {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg,#0f3460,#60a5fa) !important;
  color: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  flex-shrink: 0 !important;
  overflow: hidden !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-profile-avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-profile-meta {
  text-align: left !important;
  line-height: 1.2 !important;
  display: block !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-profile-name {
  display: block !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #1f2937 !important;
  white-space: nowrap !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-profile-role {
  display: block !important;
  font-size: 11px !important;
  color: #6b7280 !important;
  white-space: nowrap !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-profile-caret {
  width: 15px !important;
  height: 15px !important;
  stroke: #6b7280 !important;
}
body .pcoded-header.cmis-admin-topbar .dropdown-toggle::after,
body .pcoded-header.cmis-admin-topbar .dropdown .dropdown-toggle:after {
  display: none !important;
  content: none !important;
}
body .pcoded-header.cmis-admin-topbar .m-header {
  background: #fff !important;
  display: none !important;
  align-items: center !important;
  justify-content: flex-start !important;
  height: 74px !important;
  padding: 0 14px 0 10px !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}
body .pcoded-header.cmis-admin-topbar .b-brand {
  margin-left: 0 !important;
}
body .pcoded-header.cmis-admin-topbar .m-header a,
body .pcoded-header.cmis-admin-topbar .mobile-menu {
  color: #241d50 !important;
}
body .pcoded-header.cmis-admin-topbar .m-header .mobile-menu {
  position: static !important;
  right: auto !important;
  left: auto !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
}
body .pcoded-header.cmis-admin-topbar .m-header .b-brand {
  margin-left: 8px !important;
  flex: 0 0 auto !important;
}
body .pcoded-header.cmis-admin-topbar #mobile-header {
  display: none !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-sidebar-trigger {
  display: none !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 0 12px 12px 0 !important;
  border: 1px solid #e8edf5 !important;
  background: #fff !important;
  box-shadow: 0 8px 18px rgba(15,23,42,.08) !important;
  align-items: center !important;
  justify-content: center !important;
  position: static !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-header-logo {
  display: none !important;
  height: 42px !important;
  width: auto !important;
  max-width: 132px !important;
  object-fit: contain !important;
}
body .pcoded-header.cmis-admin-topbar .cmis-profile-shortcuts a,
body .pcoded-header.cmis-admin-topbar .cmis-profile-shortcuts a span,
body .pcoded-header.cmis-admin-topbar .cmis-profile-shortcuts i,
body .pcoded-header.cmis-admin-topbar .cmis-profile-shortcuts svg {
  color: #000 !important;
}
body .pcoded-header.cmis-admin-topbar .profile-notification {
  width: min(340px, calc(100vw - 24px)) !important;
}
body .pcoded-header.cmis-admin-topbar ~ .pcoded-main-container,
body .pcoded-main-container {
  padding-top: 18px !important;
}
@media (max-width: 991px) {
  body .pcoded-header.cmis-admin-topbar,
  body .pcoded-header.header-lightblue.cmis-admin-topbar,
  body .pcoded-navbar ~ .pcoded-header.cmis-admin-topbar {
    left: 0 !important;
    margin-left: 0 !important;
    width: 100% !important;
    min-height: 76px !important;
    display: flex !important;
    align-items: center !important;
  }
  body .pcoded-navbar.mob-open ~ .pcoded-header.cmis-admin-topbar {
    margin-left: 240px !important;
    width: calc(100% - 240px) !important;
  }
  body .pcoded-navbar.mob-open .navbar-brand.header-logo {
    display: flex !important;
  }
  body .pcoded-navbar .navbar-brand {
    display: flex !important;
  }
  body .pcoded-header.cmis-admin-topbar .m-header {
    display: flex !important;
    min-width: auto !important;
    width: auto !important;
    flex: 0 0 auto !important;
    padding: 0 8px 0 10px !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }
  body .pcoded-header.cmis-admin-topbar .m-header .mobile-menu {
    position: static !important;
    right: auto !important;
    left: auto !important;
  }
  body .pcoded-header.cmis-admin-topbar .cmis-sidebar-trigger {
    display: inline-flex !important;
  }
  body .pcoded-navbar .sidebar-close-btn {
    display: inline-flex !important;
  }
  body .pcoded-header.cmis-admin-topbar .cmis-header-logo {
    display: block !important;
  }
  body .pcoded-header.cmis-admin-topbar > .collapse.navbar-collapse,
  body .pcoded-header.cmis-admin-topbar .collapse.navbar-collapse {
    grid-template-columns: minmax(0, 1fr) auto !important;
    padding: 10px 12px 10px 10px !important;
    gap: 10px !important;
    flex: 1 1 auto !important;
    background: var(--cmis-theme, #5172C9) !important;
    min-height: 76px !important;
  }
  body .pcoded-header.cmis-admin-topbar .cmis-header-search {
    display: none !important;
    grid-column: 1 / -1 !important;
    order: 3 !important;
  }
  body .pcoded-header.cmis-admin-topbar .cmis-profile-meta,
  body .pcoded-header.cmis-admin-topbar .cmis-profile-caret {
    display: none !important;
  }
  body .pcoded-header.cmis-admin-topbar .cmis-header-title {
    max-width: min(46vw, 260px) !important;
    font-size: 17px !important;
    line-height: 1.2 !important;
    color: #fff !important;
  }
  body .pcoded-main-container,
  body .pcoded-header.cmis-admin-topbar ~ .pcoded-main-container {
    padding-top: 112px !important;
  }
  body .pcoded-navbar.mob-open ~ .pcoded-main-container {
    margin-left: 240px !important;
    width: calc(100% - 240px) !important;
  }
}
@media (max-width: 540px) {
  body .pcoded-header.cmis-admin-topbar .cmis-quick-icons {
    display: none !important;
  }
  body .pcoded-header.cmis-admin-topbar .cmis-header-title {
    max-width: 40vw !important;
    font-size: 15px !important;
  }
  body .pcoded-header.cmis-admin-topbar .cmis-profile-avatar {
    width: 40px !important;
    height: 40px !important;
  }
  body .pcoded-header.cmis-admin-topbar .cmis-profile-shortcuts {
    grid-template-columns: 1fr !important;
  }
}
