:root {
  --admin-primary: #2563eb;
  --admin-primary-dark: #1d4ed8;
  --admin-accent: #14b8a6;
  --admin-ink: #182230;
  --admin-muted: #667085;
  --admin-surface: #ffffff;
  --admin-page: #f5f7fb;
  --admin-border: #e7ebf3;
  --admin-radius: 14px;
  --admin-shadow: 0 8px 24px rgba(16, 24, 40, .06);
}

html, body { background: var(--admin-page); color: var(--admin-ink); }
body { font-size: 14px; line-height: 1.55; }
a { color: var(--admin-primary); }

/* App frame */
.pcoded-header {
  background: rgba(255,255,255,.95) !important;
  border-bottom: 1px solid var(--admin-border);
  box-shadow: 0 2px 12px rgba(16,24,40,.04);
  backdrop-filter: blur(14px);
}
.pcoded-header .topbar-title { color: var(--admin-ink); font-size: 17px; font-weight: 700; letter-spacing: -.2px; }
.pcoded-header a, .pcoded-header .dropdown-toggle { color: #475467 !important; }
.pcoded-navbar {
  background: linear-gradient(180deg, #12233f 0%, #172d50 100%) !important;
  box-shadow: 4px 0 20px rgba(16,24,40,.10);
}
.pcoded-navbar .header-logo { background: rgba(255,255,255,.04) !important; border-bottom: 1px solid rgba(255,255,255,.08); }
.pcoded-navbar .pcoded-inner-navbar li > a { color: rgba(255,255,255,.72); border-radius: 9px; margin: 2px 10px; width: calc(100% - 20px); transition: .18s ease; }
.pcoded-navbar .pcoded-inner-navbar li > a:hover,
.pcoded-navbar .pcoded-inner-navbar li.active > a,
.pcoded-navbar .pcoded-inner-navbar li.pcoded-trigger > a { background: rgba(255,255,255,.12); color: #fff; }
.pcoded-navbar .pcoded-inner-navbar li.pcoded-hasmenu .pcoded-submenu { background: rgba(0,0,0,.10); }
.school-simple-mode .pcoded-navbar .pcoded-inner-navbar li.pcoded-hasmenu.pcoded-trigger > .pcoded-submenu { display: block; }
.pcoded-navbar .pcoded-inner-navbar li.pcoded-hasmenu .pcoded-submenu li > a { margin-left: 18px; width: calc(100% - 28px); font-size: 13px; }

/* The legacy sidebar absolutely positioned menu text beside an inline icon.
   Long menus in College and Super Admin panels could therefore start on top
   of the icon. Keep the icon in a fixed column and let the label use the
   remaining width. */
.pcoded-navbar .pcoded-inner-navbar > li > a,
.pcoded-navbar .pcoded-inner-navbar .pcoded-submenu > li > a {
  display: flex;
  align-items: center;
  min-height: 42px;
  box-sizing: border-box;
}
.pcoded-navbar .pcoded-inner-navbar > li > a > .pcoded-micon {
  flex: 0 0 30px;
  width: 30px;
  margin-right: 10px;
  padding: 4px 6px;
  box-sizing: border-box;
  justify-content: center;
}
.pcoded-navbar .pcoded-inner-navbar > li > a > .pcoded-micon + .pcoded-mtext {
  position: static !important;
  top: auto;
  min-width: 0;
  flex: 1 1 auto;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.pcoded-navbar .pcoded-inner-navbar > li.pcoded-hasmenu > a {
  padding-right: 34px;
}
.pcoded-navbar .pcoded-inner-navbar > li.pcoded-hasmenu > a:after {
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
}
.pcoded-main-container { background: var(--admin-page); }
.pcoded-content { padding: 28px 30px; }
.page-wrapper { min-height: calc(100vh - 76px); }

/* Shared page components */
.card { border: 1px solid var(--admin-border); border-radius: var(--admin-radius); box-shadow: var(--admin-shadow); overflow: hidden; }
.card .card-header { padding: 17px 20px; border-bottom: 1px solid var(--admin-border); background: #fff; }
.card .card-header h5 { color: var(--admin-ink); font-size: 15px; font-weight: 700; }
.card .card-header h5:after { content: none; display: none; }
.card .card-block, .card .card-body { padding: 20px; }
.card .card-footer { padding: 14px 20px; border-top: 1px solid var(--admin-border); background: #fbfcfe; }
.page-header { margin-bottom: 20px; }
.admin-page-heading { display: flex; align-items: center; justify-content: space-between; min-height: 60px; margin: -2px 0 20px; }
.admin-page-heading .breadcrumb { padding: 0; background: transparent; font-size: 12px; }
.admin-page-heading .breadcrumb-item + .breadcrumb-item:before { color: #98a2b3; }
.admin-page-heading .breadcrumb a { color: var(--admin-muted); text-decoration: none; }
.admin-page-heading h1 { margin: 0; color: var(--admin-ink); font-size: 24px; line-height: 1.25; font-weight: 750; letter-spacing: -.45px; }

.btn { border-radius: 8px; font-weight: 600; padding: 8px 14px; box-shadow: none; transition: transform .15s ease, box-shadow .15s ease; }
.btn:hover { transform: translateY(-1px); box-shadow: 0 5px 12px rgba(16,24,40,.12); }
.btn-primary, .bg-c-blue { background: linear-gradient(135deg, var(--admin-primary), #4f8cff) !important; border-color: var(--admin-primary) !important; }
.btn-success { background: #0f9d79; border-color: #0f9d79; }
.btn-danger { background: #e5484d; border-color: #e5484d; }
.btn-outline-primary { color: var(--admin-primary); border-color: #aac6ff; }

.form-control, .custom-select, select.form-control, .select2-selection {
  border: 1px solid #d6dce8 !important; border-radius: 8px !important; min-height: 40px; background: #fff; color: var(--admin-ink);
}
.form-control:focus, .custom-select:focus, select.form-control:focus { border-color: #7aa7ff !important; box-shadow: 0 0 0 3px rgba(37,99,235,.12) !important; }
textarea.form-control { min-height: 96px; }
label { color: #344054; font-weight: 600; margin-bottom: 6px; }
.form-group { margin-bottom: 18px; }
.select2-container--default .select2-selection--single { padding: 5px 10px; }

.table { margin-bottom: 0; }
.table thead th { border-top: 0; border-bottom: 1px solid var(--admin-border); color: #475467; font-size: 12px; font-weight: 700; letter-spacing: .025em; text-transform: uppercase; background: #f8fafc; white-space: nowrap; }
.table td { border-color: #eef1f6; vertical-align: middle; }
.table-hover tbody tr:hover { background: #f8fbff; }
.dataTables_wrapper .dataTables_filter input, .dataTables_wrapper .dataTables_length select { border: 1px solid #d6dce8; border-radius: 7px; padding: 6px 9px; }
.dataTables_wrapper .dataTables_paginate .paginate_button { border-radius: 7px !important; border: 1px solid var(--admin-border) !important; background: #fff !important; color: #475467 !important; }
.dataTables_wrapper .dataTables_paginate .paginate_button.current { background: #eaf1ff !important; color: var(--admin-primary) !important; border-color: #bfd3ff !important; }
.badge { border-radius: 999px; padding: 5px 9px; font-weight: 700; }
.alert { border: 0; border-radius: 10px; }
.modal-content { border: 0; border-radius: 14px; box-shadow: 0 22px 55px rgba(16,24,40,.18); }
.delete-confirmation-modal { z-index: 1072; pointer-events: auto; }
.modal-header { border-bottom-color: var(--admin-border); padding: 18px 20px; }
.modal-footer { border-top-color: var(--admin-border); padding: 14px 20px; }

/* Dashboard */
.dashboard-welcome { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 24px 28px; margin: 0 0 22px; color: #fff; border-radius: 16px; background: linear-gradient(115deg, #173b78, #2563eb 58%, #13a9a1); box-shadow: 0 15px 28px rgba(37,99,235,.20); }
.dashboard-welcome h2 { margin: 5px 0 3px; color: #fff; font-size: 25px; font-weight: 750; letter-spacing: -.4px; }
.dashboard-welcome p { margin: 0; color: rgba(255,255,255,.82); }
.dashboard-eyebrow { display: inline-flex; align-items: center; gap: 7px; color: #dceaff; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.dashboard-date { padding: 10px 13px; border: 1px solid rgba(255,255,255,.22); border-radius: 9px; background: rgba(255,255,255,.12); white-space: nowrap; font-weight: 600; }
.dashboard-stat { position: relative; border: 0; color: #fff; overflow: hidden; }
.dashboard-stat:before { position: absolute; right: -20px; top: -46px; width: 136px; height: 136px; border: 24px solid rgba(255,255,255,.10); border-radius: 50%; content: ''; }
.dashboard-stat .card-block { position: relative; z-index: 1; }
.dashboard-stat h5, .dashboard-stat h2 { color: #fff !important; }
.dashboard-stat i { right: 21px !important; bottom: 18px !important; opacity: .20 !important; }
.dashboard-stat.stat-primary { background: linear-gradient(135deg, #2563eb, #4f8cff) !important; }
.dashboard-stat.stat-indigo { background: linear-gradient(135deg, #4f46e5, #7c74ff) !important; }
.dashboard-stat.stat-teal { background: linear-gradient(135deg, #0f9d79, #23c6b7) !important; }
.dashboard-stat.stat-amber { background: linear-gradient(135deg, #e27b19, #f7ad3a) !important; }
.dashboard-stat.stat-violet { background: linear-gradient(135deg, #7c3aed, #a778f7) !important; }
.dashboard-stat.stat-cyan { background: linear-gradient(135deg, #087ea4, #26b9d8) !important; }
.dashboard-stat.stat-rose { background: linear-gradient(135deg, #d94670, #f06d8f) !important; }
.dashboard-stat.stat-slate { background: linear-gradient(135deg, #334155, #66768e) !important; }

/* jQuery Steps: the legacy wizard stylesheet collapses the content area because
   every step body is absolutely positioned. Keep the active form in document
   flow so long admission/staff forms remain visible and scroll naturally. */
.wizard { overflow: visible; }
.wizard > .content { position: relative; float: none; width: auto; height: auto !important; min-height: 320px; margin: 10px 0; overflow: visible; border: 1px solid var(--admin-border); border-radius: 12px; }
.wizard > .content > .body { position: relative; float: none; width: 100%; height: auto; min-height: 300px; padding: 22px; }
.wizard > .actions { position: static; margin: 16px 0 0; padding: 12px 0 0; border-top: 1px solid var(--admin-border); text-align: right; }
.wizard > .actions > ul { display: inline-flex; gap: 8px; }
.wizard > .actions > ul > li { margin: 0; }
.wizard > .actions a, .wizard > .actions a:hover, .wizard > .actions a:active { border-radius: 8px; padding: 9px 15px; }
.wizard .scheduler-border { padding: 18px 14px 4px; border: 1px solid var(--admin-border); border-radius: 10px; }
.wizard .scheduler-border legend { width: auto; padding: 0 7px; color: var(--admin-primary); font-size: 14px; font-weight: 700; }

/* Dashboard cards */
.bitcoin-wallet { border: 0; border-radius: 16px; box-shadow: 0 12px 22px rgba(37,99,235,.18); }
.bitcoin-wallet .card-block { min-height: 130px; }
.bitcoin-wallet i { opacity: .22; }

.admin-nav-backdrop { display: none; }
.pwa-install-button { display: none; }
.school-menu-label { margin: 16px 20px 8px; color: rgba(255,255,255,.38); font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.school-simple-mode .pcoded-navbar .pcoded-inner-navbar > li > a { min-height: 44px; display: flex; align-items: center; }
.school-simple-mode .pcoded-navbar .pcoded-inner-navbar .pcoded-micon { width: 32px; flex: 0 0 32px; margin-right: 8px; padding: 4px; justify-content: center; }
.school-simple-mode .pcoded-navbar .pcoded-inner-navbar > li > a > .pcoded-micon + .pcoded-mtext { position: static !important; top: auto; min-width: 0; }
.school-simple-mode .admin-page-heading h1 { color: #173b78; }
.school-simple-mode .form-group label span { color: #dc3545; }
.school-simple-mode .card-header h5 { text-transform: none; }
.school-simple-mode .wizard > .steps > ul > li { max-width: 220px; }
.school-quick-actions .row { row-gap: 14px; }
.school-action { display: flex; min-height: 112px; padding: 18px; flex-direction: column; align-items: center; justify-content: center; gap: 10px; border: 1px solid #dce7fb; border-radius: 13px; background: #f7faff; color: #173b78; font-size: 14px; font-weight: 700; text-align: center; transition: .18s ease; }
.school-action i { font-size: 27px; color: var(--admin-primary); }
.school-action:hover { transform: translateY(-2px); border-color: #9dbcf5; background: #edf4ff; color: var(--admin-primary); box-shadow: 0 8px 18px rgba(37,99,235,.10); }

@media (max-width: 1199.98px) {
  .pcoded-content { padding: 22px; }
}

@media (max-width: 991.98px) {
  body { background: #f7f9fc; }
  .pcoded-header { min-height: 60px; }
  .pcoded-header .m-header { background: transparent; }
  .pcoded-header .collapse.navbar-collapse { background: #fff; border-top: 1px solid var(--admin-border); }
  .pcoded-navbar { width: 288px; left: -288px; }
  .pcoded-navbar.mob-open { left: 0; box-shadow: 12px 0 30px rgba(16,24,40,.28); }
  .admin-nav-open .admin-nav-backdrop { display: block; position: fixed; inset: 0; z-index: 1030; background: rgba(16,24,40,.42); backdrop-filter: blur(2px); }
  .pcoded-main-container { padding: 0 !important; }
  .pcoded-content { padding: 16px 12px 28px; }
  .page-wrapper { min-height: calc(100vh - 60px); }
  .card { border-radius: 12px; }
  .card .card-header, .card .card-block, .card .card-body { padding: 16px; }
  .row { margin-left: -6px; margin-right: -6px; }
  .row > [class*="col-"] { padding-left: 6px; padding-right: 6px; }
  .table-responsive, .dataTables_wrapper { border: 1px solid var(--admin-border); border-radius: 9px; }
  .dataTables_wrapper .row { min-width: 560px; }
  .pwa-install-button { display: inline-flex; align-items: center; gap: 6px; }
  .dashboard-welcome { padding: 20px; }
  .wizard > .content > .body { padding: 16px; }
}

@media (max-width: 575.98px) {
  body { font-size: 13px; }
  .pcoded-header .topbar-title { max-width: 44vw; font-size: 15px; }
  .pcoded-header .navbar-nav.me-auto { margin-right: 0; }
  .pcoded-header .navbar-nav.ms-auto > li { padding: 0 3px; }
  .pcoded-header .navbar-nav.ms-auto > li:not(:last-child):not(.pwa-install) { display: none; }
  .pcoded-content { padding: 12px 8px 24px; }
  .card { margin-bottom: 12px; }
  .card .card-header { padding: 14px; }
  .card .card-block, .card .card-body { padding: 14px; }
  .card .card-footer { padding: 12px 14px; }
  .btn { min-height: 42px; padding: 8px 12px; }
  .btn-sm { min-height: 34px; padding: 5px 9px; }
  .form-control, .custom-select, select.form-control { min-height: 44px; font-size: 16px; }
  .form-group { margin-bottom: 14px; }
  .page-header-title h5, .card .card-header h5 { font-size: 15px; }
  .admin-page-heading { min-height: 48px; margin-bottom: 14px; }
  .admin-page-heading h1 { font-size: 20px; }
  .dashboard-welcome { display: block; padding: 20px; margin-bottom: 16px; border-radius: 13px; }
  .dashboard-welcome h2 { font-size: 21px; }
  .dashboard-date { display: inline-flex; margin-top: 15px; }
  .wizard > .steps > ul { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; }
  .wizard > .steps > ul > li { flex: 0 0 175px; width: auto; }
  .wizard > .steps a, .wizard > .steps a:hover, .wizard > .steps a:active { margin: 0; min-height: 44px; padding: 10px; }
  .wizard > .content > .body { min-height: 260px; padding: 14px 8px; }
  .wizard > .actions { text-align: stretch; }
  .wizard > .actions > ul { display: flex; width: 100%; }
  .wizard > .actions > ul > li { flex: 1; }
  .wizard > .actions a, .wizard > .actions a:hover, .wizard > .actions a:active { text-align: center; }
  .bitcoin-wallet .card-block { min-height: 110px; padding: 16px; }
  .bitcoin-wallet h2 { font-size: 24px; }
  .modal-dialog { margin: 10px; }
  .modal-content { border: 0; border-radius: 14px; }
  .pagination { flex-wrap: wrap; gap: 4px; }
  .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_length { text-align: left; margin: 8px 0; }
}

@media (display-mode: standalone) {
  .pcoded-header { padding-top: env(safe-area-inset-top); }
  .pcoded-content { padding-bottom: calc(28px + env(safe-area-inset-bottom)); }
}

/* School mode: plain, task-oriented forms with optional details tucked away. */
.school-simple-mode .school-extra-details {
  width: 100%; flex: 0 0 100%; max-width: 100%; margin: 4px 0 14px;
  padding: 0 12px; border: 1px solid #dfe8f5; border-radius: 10px; background: #f8faff;
}
.school-simple-mode .school-extra-details summary {
  min-height: 44px; padding: 12px 0; color: #315586; cursor: pointer; font-weight: 600;
}
.school-simple-mode .school-extra-details summary:focus-visible { outline: 3px solid #93b4ff; outline-offset: 2px; }
.school-simple-mode .school-extra-fields { padding-top: 6px; }
.school-simple-mode .pcoded-inner-navbar .pcoded-submenu a[aria-current="page"] { background: #ffffff1c; color: #fff; font-weight: 700; }
.school-simple-mode .pcoded-main-container a.btn[hidden] { display: none !important; }
.school-page-help { margin: -4px 0 14px; color: #5b6c83; font-size: 13px; line-height: 1.5; }
@media print { .school-extra-details > .school-extra-fields { display: flex; } }