/* Shared interface layer for SchoolMIS back-office and auth screens. */
:root,
[data-theme="gold"] {
  --smis-font: "Inter", "Nunito", "Segoe UI", Roboto, Arial, sans-serif;
  --smis-bg: #F5F6F8;
  --smis-surface: #ffffff;
  --smis-surface-2: #f8fafc;
  --smis-text: #222222;
  --smis-muted: #64748b;
  --smis-border: #dbe3ef;
  --smis-border-soft: rgba(15, 23, 42, 0.08);
  --smis-primary: #ECAB1E;
  --smis-primary-dark: #C88D11;
  --smis-primary-contrast: #111827;
  --smis-primary-dark-contrast: #111827;
  --smis-primary-soft: #FFF4D6;
  --smis-sidebar: #302E2F;
  --smis-info: #2563eb;
  --smis-warning: #c78312;
  --smis-danger: #dc2626;
  --smis-radius: 8px;
  --smis-radius-sm: 6px;
  --smis-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
  --smis-shadow-soft: 0 6px 18px rgba(15, 23, 42, 0.06);
  --smis-focus: 0 0 0 0.2rem rgba(236, 171, 30, 0.22);
  --school-primary: var(--smis-primary);
  --school-primary-dark: var(--smis-primary-dark);
  --school-soft: var(--smis-primary-soft);
  --school-ink: var(--smis-text);
  --school-border: var(--smis-border);
}

[data-theme="teal"] {
  --smis-bg: #F6FAF9;
  --smis-surface: #FFFFFF;
  --smis-surface-2: #F1F7F5;
  --smis-text: #1F2937;
  --smis-muted: #64748b;
  --smis-border: #D7E8E3;
  --smis-border-soft: rgba(31, 111, 99, 0.13);
  --smis-primary: #56BAA2;
  --smis-primary-dark: #1F6F63;
  --smis-primary-contrast: #111827;
  --smis-primary-dark-contrast: #FFFFFF;
  --smis-primary-soft: rgba(86, 186, 162, 0.16);
  --smis-sidebar: #56BAA2;
  --smis-sidebar-dark: #1F6F63;
  --smis-focus: 0 0 0 0.2rem rgba(86, 186, 162, 0.22);
}

[data-theme="green"] {
  --smis-bg: #F6F8F7;
  --smis-surface: #FFFFFF;
  --smis-surface-2: #F1F6F3;
  --smis-text: #1F2937;
  --smis-muted: #64748b;
  --smis-border: #DDE7E1;
  --smis-border-soft: rgba(26, 109, 61, 0.13);
  --smis-primary: #1A6D3D;
  --smis-primary-dark: #0F4F2B;
  --smis-primary-contrast: #FFFFFF;
  --smis-primary-dark-contrast: #FFFFFF;
  --smis-primary-soft: rgba(26, 109, 61, 0.13);
  --smis-sidebar: #1A6D3D;
  --smis-sidebar-dark: #0F4F2B;
  --smis-focus: 0 0 0 0.2rem rgba(26, 109, 61, 0.22);
}

[data-theme="blue"] {
  --smis-bg: #F6F8FC;
  --smis-surface: #FFFFFF;
  --smis-surface-2: #F2F6FD;
  --smis-text: #1F2937;
  --smis-muted: #64748b;
  --smis-border: #D8E2F3;
  --smis-border-soft: rgba(30, 58, 138, 0.13);
  --smis-primary: #2563EB;
  --smis-primary-dark: #1E3A8A;
  --smis-primary-contrast: #FFFFFF;
  --smis-primary-dark-contrast: #FFFFFF;
  --smis-primary-soft: rgba(37, 99, 235, 0.12);
  --smis-sidebar: #1E3A8A;
  --smis-sidebar-dark: #172554;
  --smis-focus: 0 0 0 0.2rem rgba(37, 99, 235, 0.22);
}

html,
body {
  font-family: var(--smis-font) !important;
  color: var(--smis-text);
  background: var(--smis-bg);
  letter-spacing: 0;
}

body,
button,
input,
select,
textarea,
.form-control,
.form-select,
.dropdown-menu,
.modal-content {
  font-family: var(--smis-font) !important;
}

a {
  color: var(--smis-primary);
}

a:hover {
  color: var(--smis-primary-dark);
}

/* Shared JamboFix shell colors for legacy Blade screens. */
.sidebar {
  background: var(--smis-sidebar) !important;
}

.sidebar .logo-details .logo_name,
.sidebar .nav-links > li:hover .arrow,
.sidebar .nav-links > li:hover .link_name,
.sidebar .nav-links > li.showMenu .iocn-link a .link_name,
.sidebar .nav-links > li .sMenu-title .link_name {
  color: #fff !important;
}

.sidebar .nav-links > li .iocn-link::before,
.sidebar .nav-links > li.showMenu .iocn-link::before {
  background: var(--smis-primary) !important;
}

.sidebar .nav-links > li .sub-menu {
  background: #242223 !important;
}

.sidebar.close .nav-links li .sub-menu {
  background: var(--smis-sidebar) !important;
}

.sidebar .nav-links > li .sidebar_icon,
.sidebar .nav-links > li .icon-link,
.sidebar .nav-links > li .sidebar_icon i,
.sidebar .nav-links > li .icon-link i {
  color: rgba(255, 255, 255, 0.78) !important;
}

.sidebar .nav-links > li .sidebar_icon svg,
.sidebar .nav-links > li .icon-link svg {
  fill: rgba(255, 255, 255, 0.78) !important;
}

.sidebar .nav-links > li:hover .sidebar_icon,
.sidebar .nav-links > li.showMenu .sidebar_icon,
.sidebar .nav-links > li:hover .sidebar_icon i,
.sidebar .nav-links > li.showMenu .sidebar_icon i {
  color: #fff !important;
}

.sidebar .nav-links > li:hover .sidebar_icon svg,
.sidebar .nav-links > li.showMenu .sidebar_icon svg {
  fill: #fff !important;
}

.home-section,
.main_content,
.eMain,
main.py-4 {
  background: var(--smis-bg);
}

.mainSection-title {
  margin-bottom: 18px;
}

.mainSection-title h4,
.eSection-wrap .title h3,
.eSection-wrap-2 .title h3,
.modal-title,
.card-title {
  color: var(--smis-text) !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}

.mainSection-title h4 {
  font-size: 20px !important;
  line-height: 1.25 !important;
  margin: 0;
}

.eBreadcrumb,
.eBreadcrumb-2 {
  gap: 10px !important;
  margin: 6px 0 0 !important;
  padding: 0 !important;
}

.eBreadcrumb li,
.eBreadcrumb-2 li,
.eBreadcrumb li a,
.eBreadcrumb-2 li a {
  color: var(--smis-muted) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.eSection-wrap,
.eSection-wrap-2,
.card,
.feedback-card,
.dashboard_report {
  background: var(--smis-surface) !important;
  border: 1px solid var(--smis-border-soft) !important;
  border-radius: var(--smis-radius) !important;
  box-shadow: var(--smis-shadow-soft) !important;
}

.eSection-wrap,
.eSection-wrap-2 {
  padding: 18px !important;
  margin-bottom: 18px !important;
}

.eSection-wrap .title,
.eSection-wrap-2 .title {
  border-bottom: 1px solid var(--smis-border-soft) !important;
  margin-bottom: 18px !important;
  padding-bottom: 14px !important;
}

.eSection-wrap .title p,
.eSection-wrap-2 .title p,
.text-muted,
.small,
small {
  color: var(--smis-muted) !important;
}

.search-filter-area,
.report-filter-area,
.filter-area {
  gap: 12px !important;
  padding: 12px !important;
  margin-bottom: 14px;
  background: var(--smis-surface-2);
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
}

.search-filter-area form,
.report-filter-area form,
.filter-area form {
  gap: 10px !important;
  align-items: end !important;
}

.search-input,
.search-filter-area .search-input,
.search-filter-area .form-group {
  min-width: min(260px, 100%) !important;
}

.eForm-label,
.form-label,
label {
  color: var(--smis-text) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  margin-bottom: 7px !important;
}

.eForm-label small,
.form-label small {
  display: block;
  margin-top: 2px;
  color: var(--smis-muted) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

.form-control,
.form-select,
.eForm-control,
.eForm-select,
.eForm-control-file[type="file"],
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple,
.daterangepicker .input-mini {
  min-height: 42px !important;
  border: 1px solid var(--smis-border) !important;
  border-radius: var(--smis-radius-sm) !important;
  background-color: #fff !important;
  color: var(--smis-text) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  box-shadow: none !important;
}

.form-control,
.form-select,
.eForm-control,
.eForm-select {
  padding: 10px 12px !important;
}

textarea.form-control,
textarea.eForm-control {
  min-height: 112px !important;
}

.form-control:focus,
.form-select:focus,
.eForm-control:focus,
.eForm-select:focus,
.select2-container--focus .select2-selection,
.select2-container--open .select2-selection {
  border-color: var(--smis-primary) !important;
  box-shadow: var(--smis-focus) !important;
  outline: 0 !important;
}

.form-control::placeholder,
.eForm-control::placeholder {
  color: #94a3b8 !important;
  font-weight: 600 !important;
}

.select2-container {
  width: 100% !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--smis-text) !important;
  line-height: 40px !important;
  padding-left: 12px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 40px !important;
  right: 8px !important;
}

.select2-dropdown,
.dropdown-menu {
  border: 1px solid var(--smis-border-soft) !important;
  border-radius: var(--smis-radius) !important;
  box-shadow: var(--smis-shadow) !important;
}

.select2-results__option,
.dropdown-item {
  color: var(--smis-text) !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable,
.dropdown-item:hover,
.dropdown-item:focus {
  background: var(--smis-primary-soft) !important;
  color: var(--smis-sidebar) !important;
}

.btn,
.eBtn,
.btn-form,
.export_btn,
.lv-btn,
.lt-btn,
.py-actions .btn,
.py-actions .export_btn {
  min-height: 40px;
  border-radius: var(--smis-radius-sm) !important;
  font-size: 12.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.btn-form,
.export_btn,
.eBtn-green,
.btn-primary,
.btn-success,
.lv-btn-green,
.lt-btn-green {
  border: 1px solid var(--smis-primary) !important;
  background: var(--smis-primary) !important;
  color: var(--smis-primary-contrast) !important;
}

.btn-form:hover,
.export_btn:hover,
.eBtn-green:hover,
.btn-primary:hover,
.btn-success:hover,
.lv-btn-green:hover,
.lt-btn-green:hover {
  border-color: var(--smis-primary-dark) !important;
  background: var(--smis-primary-dark) !important;
  color: var(--smis-primary-dark-contrast) !important;
  box-shadow: 0 8px 18px rgba(236, 171, 30, 0.24) !important;
  transform: translateY(-1px);
}

.btn-secondary,
.btn-outline-secondary,
.lv-btn-white,
.lt-btn-white {
  border: 1px solid var(--smis-border) !important;
  background: #fff !important;
  color: var(--smis-text) !important;
}

.btn-secondary:hover,
.btn-outline-secondary:hover,
.lv-btn-white:hover,
.lt-btn-white:hover {
  border-color: var(--smis-primary) !important;
  background: var(--smis-primary-soft) !important;
  color: var(--smis-sidebar) !important;
}

.btn-danger,
.btn-light-danger {
  border-color: var(--smis-danger) !important;
  background: var(--smis-danger) !important;
  color: #fff !important;
}

.btn-icon,
.dropdown-btn,
.table-action-btn,
.table-action-btn-2 {
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
}

.table-responsive {
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  background: #fff;
}

.table,
.eTable,
.eTable-2 {
  margin-bottom: 0 !important;
  color: var(--smis-text) !important;
}

.table > :not(caption) > * > *,
.eTable > :not(caption) > * > *,
.eTable-2 > :not(caption) > * > * {
  padding: 12px 14px !important;
  border-bottom-color: var(--smis-border-soft) !important;
  vertical-align: middle !important;
}

.table thead th,
.eTable thead th,
.eTable-2 thead th {
  background: var(--smis-surface-2) !important;
  color: var(--smis-muted) !important;
  font-size: 11.5px !important;
  font-weight: 900 !important;
  text-transform: uppercase;
  letter-spacing: 0 !important;
  border-bottom: 1px solid var(--smis-border-soft) !important;
}

.table tbody td,
.table tbody th,
.eTable tbody td,
.eTable tbody th,
.eTable-2 tbody td,
.eTable-2 tbody th {
  color: var(--smis-text) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
}

.table-hover > tbody > tr:hover > *,
.eTable.table-hover > tbody > tr:hover > *,
.eTable-2.table-hover > tbody > tr:hover > * {
  background: var(--smis-primary-soft) !important;
  color: var(--smis-text) !important;
}

.badge,
.eBadge,
.status-badge {
  border-radius: 999px !important;
  padding: 5px 9px !important;
  font-size: 11px !important;
  font-weight: 850 !important;
}

.nav-tabs {
  gap: 8px;
  border-bottom: 1px solid var(--smis-border-soft) !important;
}

.nav-tabs .nav-link {
  border: 1px solid transparent !important;
  border-radius: var(--smis-radius-sm) var(--smis-radius-sm) 0 0 !important;
  color: var(--smis-muted) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
  border-color: var(--smis-border-soft) var(--smis-border-soft) #fff !important;
  color: var(--smis-primary-dark) !important;
  background: #fff !important;
}

.modal-content {
  border: 1px solid var(--smis-border-soft) !important;
  border-radius: var(--smis-radius) !important;
  box-shadow: 0 22px 55px rgba(15, 23, 42, 0.18) !important;
  overflow: hidden;
}

.modal-header,
.modal-footer {
  border-color: var(--smis-border-soft) !important;
  background: #fff !important;
}

.modal-body {
  background: var(--smis-bg) !important;
}

.eBeautifulModal .modal-content,
.eConfirmModal .modal-content,
.eSweetModal .modal-content {
  border-radius: var(--smis-radius) !important;
}

.eBeautifulModal .modal-header,
.eConfirmModal .modal-header,
.eSweetModal .modal-body {
  background: #fff !important;
}

.eBeautifulModal .eModalShell {
  border-radius: var(--smis-radius) !important;
  border-color: var(--smis-border-soft) !important;
  box-shadow: var(--smis-shadow-soft) !important;
}

.alert,
.toast,
.accordion-item {
  border-radius: var(--smis-radius) !important;
  border-color: var(--smis-border-soft) !important;
}

.accordion-button {
  color: var(--smis-text) !important;
  font-weight: 800 !important;
}

.accordion-button:not(.collapsed) {
  background: var(--smis-primary-soft) !important;
  color: var(--smis-primary-dark) !important;
}

.fpb-7 {
  margin-bottom: 14px;
}

.required,
.text-danger {
  color: var(--smis-danger) !important;
}

.packageBox {
  min-width: 0;
}

.total_std {
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 650;
}

.packageFeatures {
  padding-bottom: 15px;
}

.packageFeatures li {
  padding-bottom: 1px;
}

/* Shared list/filter workspace used by HR, exams, marks, users, staff, fees, and wallets. */
.sl-grid,
.lt-grid {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 14px;
  align-items: start;
}

.lt-grid {
  grid-template-columns: 340px 1fr;
}

.sl-sticky {
  position: sticky;
  top: 92px;
}

.sl-panel,
.sl-surface,
.lt-card,
.sl-card {
  background: var(--smis-surface) !important;
  border: 1px solid var(--smis-border-soft) !important;
  border-radius: var(--smis-radius) !important;
  box-shadow: var(--smis-shadow-soft) !important;
  overflow: hidden;
}

.sl-card-header {
  padding: 16px;
  border-bottom: 1px solid var(--smis-border-soft);
  color: var(--smis-text);
  font-weight: 900;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.sl-card-body {
  padding: 18px;
}

.sl-info {
  background: rgba(37, 99, 235, 0.08);
  border: 1px solid rgba(37, 99, 235, 0.18);
  color: var(--smis-info);
}

.sl-box {
  margin-top: 10px;
  padding: 12px;
  border-radius: var(--smis-radius-sm);
  font-size: 12px;
  font-weight: 650;
}

.sl-success {
  background: var(--smis-primary-soft);
  border: 1px solid rgba(26, 109, 61, 0.18);
  color: var(--smis-primary-dark);
}

.sl-danger {
  background: rgba(220, 38, 38, 0.08);
  border: 1px solid rgba(220, 38, 38, 0.18);
  color: var(--smis-danger);
}

.sl-panel-h,
.lt-h {
  padding: 14px 16px !important;
  border-bottom: 1px solid var(--smis-border-soft) !important;
  background: #fff !important;
}

.sl-panel-h {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}

.lt-h {
  padding: 16px 18px !important;
}

.sl-panel-h .t,
.lt-h h5 {
  margin: 0 !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  color: var(--smis-text) !important;
  letter-spacing: 0 !important;
}

.lt-h h5 {
  font-size: 15px !important;
}

.sl-panel-h .s,
.lt-h p {
  margin: 4px 0 0 !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  color: var(--smis-muted) !important;
}

.sl-panel-h > .t + .s {
  flex-basis: 100%;
  margin-top: -6px !important;
}

.sl-panel-b,
.lt-b {
  padding: 14px !important;
  background: #fff !important;
}

.lt-b {
  padding: 18px !important;
}

.sl-input,
.lt-input {
  min-height: 42px !important;
  border-radius: var(--smis-radius-sm) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.lt-input {
  min-height: 44px !important;
}

textarea.lt-input {
  min-height: 110px !important;
  resize: vertical;
}

.lt-label {
  color: var(--smis-text) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  margin-bottom: 7px !important;
}

.sl-help {
  margin-top: 8px;
  color: var(--smis-muted) !important;
  font-size: 11.5px !important;
  font-weight: 650 !important;
  line-height: 1.4;
}

.sl-chipbar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.sl-chip {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 6px 10px;
  border: 1px solid var(--smis-border-soft);
  border-radius: 999px;
  background: var(--smis-surface-2);
  color: var(--smis-text);
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}

.sl-topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 14px;
  border-bottom: 1px solid var(--smis-border-soft);
  background: #fff;
}

.sl-title h5 {
  margin: 0;
  color: var(--smis-text);
  font-size: 14px;
  font-weight: 900;
}

.sl-title p {
  margin: 2px 0 0;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 750;
}

.sl-tools,
.sl-actions,
.sl-top-actions,
.lt-top-actions,
.lt-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.lt-actions {
  margin-top: 16px;
}

.sl-search {
  min-width: 320px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--smis-border-soft);
  border-radius: 999px;
  padding: 10px 12px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
}

.sl-search input {
  width: 100%;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  background: transparent !important;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 600;
}

.sl-search input::placeholder {
  color: #94a3b8 !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}

.sl-table-wrap,
.lt-table-wrap {
  background: var(--smis-surface-2);
  padding: 12px;
  min-width: 0;
  overflow: visible;
}

.sl-body {
  background: var(--smis-surface-2);
  padding: 12px;
  min-width: 0;
  overflow: visible;
}

.sl-metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
  gap: 10px;
}

.sl-metric {
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  background: #fff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.045);
}

.sl-metric span {
  display: block;
  color: var(--smis-muted);
  font-size: 11px;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.sl-metric strong {
  display: block;
  margin-top: 7px;
  color: var(--smis-text);
  font-size: 16px;
  font-weight: 950;
  line-height: 1.25;
  word-break: break-word;
}

.attendance_content {
  min-width: 0;
}

.sl-empty {
  background: #fff;
  border: 1px dashed rgba(15, 23, 42, 0.18);
  border-radius: var(--smis-radius);
  padding: 22px 10px;
  text-align: center;
}

.sl-empty span {
  display: block;
  color: var(--smis-muted);
  font-weight: 850;
  margin-top: 6px;
}

.sl-export {
  position: relative;
  z-index: 50;
}

.sl-export-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.sl-export-btn {
  min-height: 42px;
  padding: 0 16px;
  border-radius: var(--smis-radius-sm);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none !important;
  font-size: 12.5px;
  font-weight: 850;
  background: #fff;
  color: var(--smis-primary-dark) !important;
  border: 1px solid var(--smis-primary);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
}

.sl-export-btn:hover {
  background: var(--smis-primary);
  color: var(--smis-primary-contrast) !important;
}

.sl-export .dropdown-menu {
  z-index: 9999 !important;
}

.sl-content-wrap {
  background: var(--smis-surface-2);
  padding: 12px;
}

.sl-list-card {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
  overflow: hidden;
}

.sl-table,
.lt-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 10px;
  table-layout: auto;
}

.sl-table thead th,
.lt-table thead th {
  padding: 8px 10px;
  color: var(--smis-muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0;
  white-space: nowrap;
}

.sl-row,
.lt-row {
  position: relative;
  z-index: 1;
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
}

.sl-row:hover,
.lt-row:hover {
  box-shadow: var(--smis-shadow-soft);
}

.sl-row td,
.lt-row td {
  padding: 10px 12px;
  vertical-align: middle;
  color: var(--smis-text);
  font-size: 12.5px;
  font-weight: 600;
}

.lt-row td {
  padding: 12px;
}

.sl-row td:first-child,
.lt-row td:first-child {
  width: 70px;
  border-top-left-radius: var(--smis-radius);
  border-bottom-left-radius: var(--smis-radius);
}

.sl-row td:last-child,
.lt-row td:last-child {
  border-top-right-radius: var(--smis-radius);
  border-bottom-right-radius: var(--smis-radius);
}

.sl-num,
.lt-num {
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 900;
}

.sl-person,
.sl-student {
  display: flex;
  gap: 12px;
  align-items: center;
  min-width: 240px;
}

.sl-avatar {
  width: 46px;
  height: 46px;
  border-radius: 999px;
  background: var(--smis-primary-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--smis-primary-dark);
  border: 4px solid #fff;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08);
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 900;
  object-fit: cover;
  text-transform: uppercase;
}

.sl-meta {
  min-width: 0;
}

.sl-name,
.lt-name {
  margin: 0;
  color: var(--smis-text);
  font-size: 14px;
  font-weight: 850;
  line-height: 1.35;
  max-width: 520px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sl-sub,
.sl-email,
.lt-desc {
  margin-top: 2px;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.45;
  max-width: 520px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sl-badges {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 7px;
}

.sl-note {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  padding: 10px 12px;
  border: 1px solid var(--smis-border-soft);
  border-radius: 8px;
  background: rgba(26, 109, 61, 0.05);
  color: var(--smis-muted);
  font-size: 12px;
  line-height: 1.45;
}

.sl-note strong {
  color: var(--smis-text);
}

.sl-badge {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 5px 9px;
  border: 1px solid var(--smis-border-soft);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.95);
  color: var(--smis-text);
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}

.sl-badge.blue {
  border-color: rgba(37, 99, 235, 0.18);
  background: rgba(37, 99, 235, 0.08);
  color: var(--smis-info);
}

.sl-badge-soft {
  border-color: rgba(26, 109, 61, 0.18);
  background: var(--smis-primary-soft);
  color: var(--smis-primary-dark);
}

.sl-badge-system,
.sl-badge-new {
  border-color: rgba(37, 99, 235, 0.18);
  background: rgba(37, 99, 235, 0.08);
  color: var(--smis-info);
}

.sl-badge-custom,
.sl-badge-hired {
  border-color: rgba(26, 109, 61, 0.18);
  background: var(--smis-primary-soft);
  color: var(--smis-primary-dark);
}

.sl-badge-shortlisted {
  border-color: rgba(199, 131, 18, 0.22);
  background: rgba(199, 131, 18, 0.1);
  color: #8a5b0a;
}

.sl-badge-interview {
  border-color: rgba(124, 58, 237, 0.18);
  background: rgba(124, 58, 237, 0.08);
  color: #6d28d9;
}

.sl-badge-offered {
  border-color: rgba(8, 145, 178, 0.18);
  background: rgba(8, 145, 178, 0.08);
  color: #087990;
}

.sl-badge-rejected {
  border-color: rgba(220, 38, 38, 0.18);
  background: rgba(220, 38, 38, 0.08);
  color: var(--smis-danger);
}

.sl-exam {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-width: 220px;
}

.sl-exam .nm {
  margin: 0;
  color: var(--smis-text);
  font-size: 14px;
  font-weight: 900;
}

.sl-exam .sb {
  margin: 0;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 750;
}

.sl-money {
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 850;
  white-space: nowrap;
}

.sl-status-cell {
  width: 160px;
  white-space: nowrap;
}

.sl-actions-cell {
  width: 180px;
  text-align: right;
  white-space: nowrap;
  position: relative;
  z-index: 20;
}

.sl-actions-btn {
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: var(--smis-radius-sm);
  border: 1px solid var(--smis-border-soft);
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--smis-text);
  font-size: 18px;
  line-height: 1;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
  padding: 0;
}

.sl-actions-btn::after {
  display: none !important;
}

.sl-actions-btn:hover {
  background: var(--smis-surface-2);
  color: var(--smis-text);
}

.sl-footer {
  padding: 12px 14px;
  border-top: 1px solid var(--smis-border-soft);
  background: #fff;
}

.sl-panel-b .d-flex.gap-2 .eBtn,
.sl-panel-b .d-flex.gap-2 a.eBtn {
  width: 100%;
  min-height: 42px;
}

.marks-template-info {
  display: none;
  margin: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: var(--smis-radius);
  background: #eff8ff;
  color: #175cd3;
  font-size: 13px;
  font-weight: 750;
  line-height: 1.45;
}

.marks-template-info strong {
  color: #1849a9;
}

.hide {
  display: none !important;
}

.table-responsive.tScrollFix,
.sl-table-wrap .table-responsive {
  overflow-x: auto;
  overflow-y: visible;
}

.lt-days {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 64px;
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--smis-primary-soft);
  color: var(--smis-primary-dark);
  border: 1px solid rgba(26, 109, 61, 0.18);
  font-size: 11px;
  font-weight: 900;
}

.sl-btn,
.lt-btn {
  min-height: 42px;
  padding: 0 16px;
  border-radius: var(--smis-radius-sm) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 112px;
  text-decoration: none !important;
  font-size: 12.5px;
  font-weight: 850;
  line-height: 1.2;
  white-space: nowrap;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
  border: 1px solid var(--smis-primary);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
}

.sl-btn-green,
.lt-btn-green,
.sl-btn-success,
.sl-btn-blue {
  background: var(--smis-primary);
  border-color: var(--smis-primary);
  color: var(--smis-primary-contrast) !important;
  box-shadow: 0 10px 22px rgba(236, 171, 30, 0.24);
}

.sl-btn-green:hover,
.lt-btn-green:hover,
.sl-btn-success:hover,
.sl-btn-blue:hover {
  background: var(--smis-primary-dark);
  border-color: var(--smis-primary-dark);
  color: var(--smis-primary-dark-contrast) !important;
  box-shadow: 0 8px 18px rgba(236, 171, 30, 0.22);
  transform: translateY(-1px);
}

.sl-top-actions .sl-btn {
  min-height: 44px;
  padding: 0 18px;
  font-size: 13px;
}

.sl-btn-white,
.lt-btn-white,
.sl-btn-outline {
  background: #fff;
  color: var(--smis-primary-dark) !important;
}

.sl-btn-white:hover,
.lt-btn-white:hover,
.sl-btn-outline:hover {
  background: var(--smis-primary-soft);
  color: var(--smis-primary-dark) !important;
}

.sl-btn-black {
  border-color: var(--smis-text);
  background: var(--smis-text);
  color: #fff !important;
}

.sl-btn-black:hover {
  border-color: #000;
  background: #000;
  color: #fff !important;
}

.sl-modal-input,
.sl-select,
.sl-textarea {
  width: 100%;
  min-height: 42px !important;
  border-radius: var(--smis-radius-sm) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.sl-textarea {
  min-height: 120px !important;
  resize: vertical;
}

.sl-wrap {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.sl-block {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04);
  padding: 14px;
}

.sl-block + .sl-block {
  margin-top: 12px;
}

.sl-label {
  display: block;
  margin-bottom: 7px;
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 800;
}

.sl-wrap {
  background: var(--smis-surface-2);
  padding: 16px;
  border-radius: var(--smis-radius);
}

.sl-form label {
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 7px;
}

.sl-form .form-control,
.sl-form .form-select {
  border-radius: var(--smis-radius-sm);
  padding: 10px 12px;
  font-size: 13px;
}

.child-box {
  border: 1px dashed rgba(15, 23, 42, 0.18);
  border-radius: var(--smis-radius);
  padding: 10px;
  margin-bottom: 10px;
  background: #fff;
}

.form-card {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  padding: 14px;
}

.form-card-title {
  margin-bottom: 12px;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 900;
}

.sl-grid-2,
.sl-check-grid,
.sl-meta,
.sl-doc-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.sl-check-item,
.sl-meta-card,
.sl-doc {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04);
  padding: 12px 14px;
}

.sl-check-item .form-check {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 0;
}

.sl-check-item .form-check-input {
  width: 18px;
  height: 18px;
  margin-top: 2px;
  border-color: rgba(15, 23, 42, 0.18);
  cursor: pointer;
}

.sl-check-item .form-check-input:checked {
  background-color: var(--smis-primary);
  border-color: var(--smis-primary);
}

.sl-check-item .form-check-label {
  color: var(--smis-text);
  cursor: pointer;
  font-size: 12.5px;
  font-weight: 850;
  line-height: 1.35;
}

.sl-check-item .sl-sub {
  margin-top: 8px;
  white-space: normal;
}

.sl-divider-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}

.sl-divider-title span {
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.sl-divider-title::after {
  content: "";
  width: 100%;
  height: 1px;
  background: var(--smis-border-soft);
}

.sl-detail-grid {
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.8fr);
}

.sl-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: wrap;
  width: 100%;
}

.sl-head-left h5 {
  margin: 0;
  color: var(--smis-text);
  font-size: 18px;
  font-weight: 900;
}

.sl-head-left p,
.sl-meta-label,
.sl-doc-sub {
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 700;
}

.sl-head-left p {
  margin: 4px 0 0;
}

.sl-meta-card {
  min-width: 0;
}

.sl-meta-label {
  margin: 0 0 4px;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.sl-meta-value {
  margin: 0;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 750;
  word-break: break-word;
}

.sl-section-title {
  margin: 0 0 12px;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 900;
}

.sl-copy {
  color: var(--smis-text);
  font-size: 13px;
  line-height: 1.6;
  white-space: pre-line;
  word-break: break-word;
}

.sl-doc {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.sl-doc-info {
  min-width: 0;
}

.sl-doc-title {
  margin: 0;
  color: var(--smis-text);
  font-size: 12.5px;
  font-weight: 850;
}

.sl-doc-sub {
  margin: 4px 0 0;
  font-size: 11.5px;
}

.sl-doc-action {
  flex: 0 0 auto;
}

.sl-form-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.sl-primary,
.sl-job {
  min-width: 0;
  max-width: 100%;
}

.sl-job {
  display: flex;
  flex-direction: column;
}

.sl-gradebook-table {
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: auto;
  font-size: 12px;
}

.sl-gradebook-table th {
  height: 130px;
  padding: 4px;
  border: 1px solid var(--smis-border);
  background: var(--smis-surface-2);
  vertical-align: bottom;
}

.sl-gradebook-table td {
  padding: 6px;
  border: 1px solid var(--smis-border-soft);
  text-align: center;
}

.sl-gradebook-table .sl-name {
  min-width: 180px;
  padding-left: 10px;
  text-align: left !important;
}

.sl-vertical {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-size: 10px;
  font-weight: 800;
}

.sl-index {
  min-width: 45px;
  font-weight: 850;
}

.sl-grade {
  display: inline-block;
  min-width: 38px;
  text-align: center;
  padding: 6px 10px;
  border-radius: 999px;
  font-weight: 850;
  font-size: 12px;
}

.grade-A {
  background: #dcfce7;
  color: #166534;
}

.grade-B {
  background: #dbeafe;
  color: #1e40af;
}

.grade-C {
  background: #fef9c3;
  color: #854d0e;
}

.grade-D {
  background: #fed7aa;
  color: #9a3412;
}

.grade-E,
.grade-F {
  background: #fee2e2;
  color: #7f1d1d;
}

.grade-S {
  background: #e0e7ff;
  color: #3730a3;
}

.tp-card,
.tp-surface {
  background: var(--smis-surface);
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: var(--smis-shadow-soft);
  overflow: hidden;
}

.tp-card-h,
.tp-topbar {
  padding: 14px;
  border-bottom: 1px solid var(--smis-border-soft);
  background: #fff;
}

.tp-card-h h5,
.tp-topbar h5,
.tp-card-h .t {
  margin: 0;
  color: var(--smis-text);
  font-size: 14px;
  font-weight: 900;
}

.tp-card-h .s {
  margin: 4px 0 0;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 750;
}

.tp-card-b,
.tp-body {
  background: #fff;
  padding: 14px;
}

.tp-label {
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 7px;
}

.tp-input {
  min-height: 42px !important;
  border-radius: var(--smis-radius-sm) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.profile_img,
.student_simg {
  display: flex;
  justify-content: center;
}

.name_title h4,
.text h4 {
  color: var(--smis-text);
  font-size: 14px;
}

.name_title h4 {
  font-weight: 650;
}

.text {
  border-top: 1px solid var(--smis-border-soft);
}

.text h4 {
  border-bottom: 1px solid var(--smis-border-soft);
  padding: 8px 0;
  font-weight: 600;
}

.text h4:last-child {
  border-bottom: 0;
}

/* Legacy academic/accounting prefixes kept as compatibility aliases. */
.cl-surface,
.ec-surface,
.cb-card,
.cb-panel,
.cb-table-wrap {
  background: var(--smis-surface);
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: var(--smis-shadow-soft);
  overflow: hidden;
}

.cl-topbar,
.ec-topbar,
.cb-card-h,
.cb-panel-h,
.cb-table-h {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  flex-wrap: wrap;
  padding: 14px;
  border-bottom: 1px solid var(--smis-border-soft);
  background: #fff;
}

.cl-title h5,
.ec-title h5,
.cb-card-h .t,
.cb-panel-h .t,
.cb-table-h .t {
  margin: 0;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 900;
}

.cl-title p,
.ec-title p,
.cb-card-h .s,
.cb-panel-h .s,
.cb-table-h .s {
  margin: 4px 0 0;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 750;
}

.cl-actions,
.cb-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.cl-body,
.ec-content-wrap {
  background: var(--smis-surface-2);
  padding: 12px;
  overflow: visible;
}

.cb-card-b,
.cb-panel-b {
  background: #fff;
  padding: 14px;
}

.cl-search {
  flex: 1;
  min-width: 260px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: var(--smis-radius-sm);
  border: 1px solid var(--smis-border-soft);
  background: #fff;
}

.cl-search input {
  width: 100%;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 600;
}

.cl-tablewrap,
.ec-table-card {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  overflow: hidden;
}

.cl-table,
.ec-table,
.cb-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 10px;
  margin: 0;
}

.cl-table thead th,
.ec-table thead th,
.cb-table thead th {
  padding: 8px 10px;
  color: var(--smis-muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0;
  white-space: nowrap;
}

.cl-table tbody td,
.ec-row td,
.cb-row td {
  padding: 12px;
  vertical-align: middle;
  color: var(--smis-text);
  font-size: 12.5px;
  font-weight: 600;
}

.ec-row,
.cb-row {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
}

.ec-row td:first-child,
.cb-row td:first-child {
  border-top-left-radius: var(--smis-radius);
  border-bottom-left-radius: var(--smis-radius);
}

.ec-row td:last-child,
.cb-row td:last-child {
  border-top-right-radius: var(--smis-radius);
  border-bottom-right-radius: var(--smis-radius);
}

.cl-name,
.ec-main,
.cb-name {
  margin: 0;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 850;
}

.ec-sub,
.cb-sub {
  margin-top: 2px;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 650;
}

.cl-sections {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.cl-chip {
  display: inline-flex;
  padding: 6px 10px;
  border: 1px solid var(--smis-border-soft);
  border-radius: 999px;
  background: var(--smis-surface-2);
  color: var(--smis-text);
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}

.cl-actions-cell,
.ec-action-cell {
  width: 120px;
  text-align: right;
  white-space: nowrap;
  overflow: visible !important;
}

.cl-menu {
  position: relative;
  z-index: 60;
  display: inline-flex;
  justify-content: flex-end;
}

.cl-kebab {
  width: 38px;
  height: 38px;
  border-radius: var(--smis-radius-sm);
  border: 1px solid var(--smis-border-soft);
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ec-shell {
  max-width: 980px;
  margin: 0 auto;
}

.ec-btn {
  min-height: 42px;
  padding: 0 16px;
  border-radius: var(--smis-radius-sm);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none !important;
  font-size: 12.5px;
  font-weight: 850;
  border: 1px solid var(--smis-primary);
  background: var(--smis-primary);
  color: var(--smis-primary-contrast) !important;
}

.ec-btn:hover {
  background: var(--smis-primary-dark);
  border-color: var(--smis-primary-dark);
  color: var(--smis-primary-dark-contrast) !important;
}

.ec-name {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 220px;
}

.ec-avatar {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: var(--smis-primary-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--smis-primary-dark);
  border: 4px solid #fff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.ec-meta {
  min-width: 0;
}

.ec-pagination,
.cl-pagination {
  padding-top: 12px;
}

.cl-empty,
.ec-empty,
.cb-empty {
  background: #fff;
  border: 1px dashed rgba(15, 23, 42, 0.18);
  border-radius: var(--smis-radius);
  padding: 22px 10px;
  text-align: center;
}

.cl-empty span,
.cb-empty span {
  display: block;
  color: var(--smis-muted);
  font-weight: 850;
  margin-top: 6px;
}

.cb-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}

.cb-head h4 {
  margin: 0;
  color: var(--smis-text);
  font-weight: 900;
}

.cb-head small {
  display: block;
  margin-top: 4px;
  color: var(--smis-muted);
  font-weight: 750;
}

.cb-grid {
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 14px;
  align-items: start;
}

.cb-input {
  border-radius: var(--smis-radius-sm) !important;
  font-weight: 600 !important;
}

.cb-help {
  margin-top: 8px;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.35;
}

.cb-badges .badge {
  display: inline-block;
  margin: 0 6px 6px 0;
  font-size: 11px;
  font-weight: 850;
}

.fs-grid,
.gp-layout,
.gp-wrap {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 14px;
  align-items: start;
}

.gp-wrap {
  max-width: 1100px;
  margin: 0 auto;
}

.fs-panel,
.fs-surface,
.fs-card,
.gp-card,
.gp-pass,
.gp-paper {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: var(--smis-shadow-soft);
  overflow: hidden;
}

.fs-panel-h,
.fs-topbar,
.fs-card-h,
.gp-card-h,
.gp-h {
  padding: 14px;
  border-bottom: 1px solid var(--smis-border-soft);
  background: #fff;
}

.fs-panel-h h5,
.fs-topbar h5,
.fs-card-h,
.gp-card-h h5,
.gp-h .t {
  margin: 0;
  color: var(--smis-text);
  font-size: 14px;
  font-weight: 900;
}

.fs-panel-h p,
.fs-topbar p,
.gp-h .s {
  margin: 4px 0 0;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 750;
}

.fs-panel-b,
.gp-card-b,
.gp-b {
  background: #fff;
  padding: 14px;
}

.fs-input,
.gp-input {
  min-height: 42px !important;
  border-radius: var(--smis-radius-sm) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.fs-row,
.gp-field {
  background: var(--smis-surface-2);
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  padding: 10px 12px;
}

.fs-label,
.gp-k,
.gp-field .k,
.gp-no .label {
  color: var(--smis-muted);
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.fs-btn,
.gp-btn {
  min-height: 42px;
  border-radius: var(--smis-radius-sm);
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-decoration: none !important;
  font-size: 12.5px;
  font-weight: 850;
  border: 1px solid transparent;
}

.fs-btn-blue,
.fs-btn-green {
  border-color: var(--smis-primary);
  background: var(--smis-primary);
  color: var(--smis-primary-contrast) !important;
}

.fs-btn-light {
  border-color: var(--smis-border);
  background: #fff;
  color: var(--smis-text) !important;
}

.fs-actions,
.gp-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.fs-content,
.gp-preview {
  background: var(--smis-surface-2);
  padding: 12px;
}

.fs-table th {
  color: var(--smis-muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.fs-table td {
  color: var(--smis-text);
  font-size: 12.5px;
  font-weight: 650;
  vertical-align: middle;
}

.fs-title {
  color: var(--smis-text);
  font-weight: 850;
}

.fs-money {
  color: var(--smis-text);
  font-weight: 850;
}

.fs-muted {
  color: var(--smis-muted);
  font-size: 11.5px;
  font-weight: 650;
}

.gp-sticky {
  position: sticky;
  top: 92px;
}

.gp-paper,
.gp-pass {
  padding: 18px;
  box-shadow: none;
}

.gp-head,
.gp-pass-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--smis-border-soft);
  margin-bottom: 12px;
}

.gp-brand {
  display: flex;
  gap: 12px;
  align-items: center;
  min-width: 0;
}

.gp-logo,
.gp-logo-wrap {
  width: 54px;
  height: 54px;
  border-radius: var(--smis-radius);
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.gp-logo img,
.gp-logo-wrap img {
  max-width: 44px;
  max-height: 44px;
  object-fit: contain;
}

.gp-title,
.gp-brand h4 {
  margin: 0;
  color: var(--smis-text);
  font-size: 15px;
  font-weight: 900;
}

.gp-sub,
.gp-brand p {
  margin: 2px 0 0;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 750;
}

.gp-meta,
.gp-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.gp-v,
.gp-field .v,
.gp-no .val {
  margin-top: 4px;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 800;
}

.gp-sign {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--smis-border-soft);
}

.gp-line {
  flex: 1;
  text-align: center;
}

.gp-line .line {
  height: 1px;
  background: rgba(15, 23, 42, 0.25);
  margin-top: 26px;
}

.gp-line p {
  margin: 8px 0 0;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 750;
}

.gp-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 850;
  border: 1px solid var(--smis-border-soft);
  background: #fff;
}

.gp-status.pending {
  color: #b45309;
  background: rgba(245, 158, 11, 0.1);
  border-color: rgba(245, 158, 11, 0.18);
}

.gp-status.approved {
  color: var(--smis-primary-dark);
  background: var(--smis-primary-soft);
  border-color: rgba(26, 109, 61, 0.18);
}

.gp-status.rejected {
  color: var(--smis-danger);
  background: rgba(220, 38, 38, 0.08);
  border-color: rgba(220, 38, 38, 0.18);
}

.gh-wrap {
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 14px;
  align-items: start;
}

.gh-sticky {
  position: sticky;
  top: 92px;
}

.gh-card,
.gv-card,
.gh-filter-card,
.gv-pass {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: var(--smis-shadow-soft);
  overflow: hidden;
}

.gh-h,
.gv-h {
  padding: 18px 22px;
  border-bottom: 1px solid var(--smis-border-soft);
  background: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.gh-h h5,
.gv-h h5 {
  margin: 0;
  color: var(--smis-text);
  font-size: 18px;
  font-weight: 850;
}

.gh-h p,
.gv-h p {
  margin: 6px 0 0;
  color: var(--smis-muted);
  font-size: 14px;
  font-weight: 650;
}

.gh-b,
.gv-b {
  padding: 20px;
  background: var(--smis-surface-2);
}

.gh-filter-card {
  padding: 18px;
  box-shadow: none;
}

.gh-input {
  min-height: 44px !important;
  border-radius: var(--smis-radius-sm) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.gh-actions,
.gv-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

.gh-btn,
.gv-btn {
  min-height: 44px;
  border-radius: var(--smis-radius-sm);
  padding: 0 16px;
  border: 1px solid transparent;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 850;
}

.gh-primary,
.gh-btn.gh-primary,
.gv-approve,
.gv-download {
  background: var(--smis-primary);
  border-color: var(--smis-primary);
  color: var(--smis-primary-contrast) !important;
}

.gh-outline,
.gv-back {
  background: #fff;
  color: var(--smis-primary-dark) !important;
  border-color: rgba(26, 109, 61, 0.28);
}

.gv-reject {
  background: var(--smis-danger);
  border-color: var(--smis-danger);
  color: #fff !important;
}

.gv-disabled {
  background: #e5e7eb;
  color: var(--smis-muted);
  cursor: not-allowed;
}

.gh-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 10px;
}

.gh-table thead th {
  padding: 8px 10px;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}

.gh-row {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04);
}

.gh-row td {
  padding: 12px;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 650;
  vertical-align: middle;
}

.gh-row td:first-child {
  border-top-left-radius: var(--smis-radius);
  border-bottom-left-radius: var(--smis-radius);
  width: 70px;
}

.gh-row td:last-child {
  border-top-right-radius: var(--smis-radius);
  border-bottom-right-radius: var(--smis-radius);
  width: 160px;
  text-align: right;
}

.gh-gp {
  color: var(--smis-primary-dark);
  font-size: 14px;
  font-weight: 850;
}

.gh-badge {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 750;
  border: 1px solid var(--smis-border-soft);
}

.gh-badge.pending {
  color: #b45309;
  background: rgba(245, 158, 11, 0.1);
}

.gh-badge.approved {
  color: var(--smis-primary-dark);
  background: var(--smis-primary-soft);
}

.gh-badge.rejected {
  color: var(--smis-danger);
  background: rgba(220, 38, 38, 0.08);
}

.gh-foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 14px;
  gap: 12px;
}

.gh-foot p {
  margin: 0;
  color: var(--smis-muted);
  font-size: 13px;
  font-weight: 650;
}

.gv-pass.accent-approved {
  border-left: 7px solid var(--smis-primary);
}

.gv-pass.accent-pending {
  border-left: 7px solid #f59e0b;
}

.gv-pass.accent-rejected {
  border-left: 7px solid var(--smis-danger);
}

.gv-top,
.gv-brand {
  display: flex;
  align-items: center;
  gap: 14px;
}

.gv-top {
  padding: 20px;
  justify-content: space-between;
  border-bottom: 1px solid var(--smis-border-soft);
}

.gv-logo {
  width: 52px;
  height: 52px;
  border-radius: var(--smis-radius-sm);
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  display: flex;
  align-items: center;
  justify-content: center;
}

.gv-logo img {
  width: 38px;
  height: 38px;
  object-fit: contain;
}

.gv-brand h4 {
  margin: 0;
  color: var(--smis-text);
  font-size: 16px;
  font-weight: 850;
}

.gv-brand p,
.gv-no .label {
  margin: 4px 0 0;
  color: var(--smis-muted);
  font-size: 13px;
  font-weight: 650;
}

.gv-no .val {
  color: var(--smis-primary-dark);
  font-size: 20px;
  font-weight: 900;
}

.gv-body {
  padding: 20px;
}

.gv-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.gv-field {
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  padding: 16px;
  background: #fff;
}

.gv-field .k {
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 750;
  text-transform: uppercase;
}

.gv-field .v {
  margin-top: 6px;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 800;
}

.ta-surface,
.ar-wrap,
.ar-table,
.ar-grid {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: var(--smis-shadow-soft);
  overflow: hidden;
}

.ta-header,
.ar-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  flex-wrap: wrap;
  padding: 14px;
  border-bottom: 1px solid var(--smis-border-soft);
  background: #fff;
}

.ta-title,
.ar-title {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 220px;
}

.ta-title h5,
.ar-title h5 {
  margin: 0;
  color: var(--smis-text);
  font-size: 14px;
  font-weight: 900;
}

.ta-title p,
.ar-title p {
  margin: 0;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 750;
}

.ta-body,
.ar-body {
  background: var(--smis-surface-2);
  padding: 14px;
}

.ta-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 12px;
  align-items: end;
}

.ta-col-4 {
  grid-column: span 4;
}

.ta-col-12 {
  grid-column: span 12;
}

.ta-field,
.ta-students {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  padding: 12px;
}

.ta-label {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 8px;
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 800;
}

.ta-input {
  min-height: 42px !important;
  border-radius: var(--smis-radius-sm) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.ta-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 12px 14px;
  border-top: 1px solid var(--smis-border-soft);
  background: #fff;
}

.ta-btn {
  min-height: 40px;
  border-radius: var(--smis-radius-sm);
  font-weight: 850;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.ta-empty,
.ar-empty {
  border: 1px dashed rgba(15, 23, 42, 0.18);
  border-radius: var(--smis-radius);
  padding: 18px 10px;
  text-align: center;
  background: #fff;
}

.ta-empty span {
  display: block;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 850;
  margin-top: 6px;
}

.ar-meta,
.ar-legend,
.ar-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

.ar-meta {
  justify-content: flex-end;
}

.ar-pill {
  display: inline-flex;
  padding: 6px 10px;
  border: 1px solid var(--smis-border-soft);
  border-radius: 999px;
  background: #fff;
  color: var(--smis-text);
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}

.ar-grid-scroll {
  --ar-left-width: 260px;
  width: 100%;
  max-width: 100%;
  display: block;
  overflow-x: auto;
  overflow-y: hidden;
  border-radius: var(--smis-radius);
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.ar-grid {
  width: max(100%, calc(var(--ar-left-width, 260px) + var(--ar-days-width, 1054px)));
  min-width: calc(var(--ar-left-width, 260px) + var(--ar-days-width, 1054px));
  max-width: none;
}

.ar-grid-head,
.ar-row {
  display: flex;
  border-bottom: 1px solid var(--smis-border-soft);
  background: #fff;
}

.ar-grid-head .left,
.ar-row .left {
  width: var(--ar-left-width);
  flex: 0 0 var(--ar-left-width);
  border-right: 1px solid var(--smis-border-soft);
  position: sticky;
  left: 0;
  background: #fff;
  box-shadow: 10px 0 16px rgba(15, 23, 42, 0.04);
}

.ar-grid-head .left {
  z-index: 3;
  padding: 12px;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 900;
}

.ar-row .left {
  z-index: 2;
  padding: 10px 12px;
  overflow: hidden;
}

.ar-grid-head .days,
.ar-row .cells {
  flex: 1;
  display: flex;
}

.ar-day,
.ar-cell {
  width: 34px;
  min-width: 34px;
  border-right: 1px solid var(--smis-border-soft);
  display: flex;
  align-items: center;
  justify-content: center;
}

.ar-day {
  flex-direction: column;
  gap: 2px;
  padding: 8px 0;
}

.ar-day .w {
  color: var(--smis-muted);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
}

.ar-day .d,
.ar-name {
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 850;
  line-height: 1;
}

.ar-name {
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ar-cell {
  padding: 6px 0;
}

.ar-dot {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  border: 2px solid rgba(15, 23, 42, 0.18);
  background: #fff;
}

.ar-dot.p {
  background: rgba(26, 109, 61, 0.18);
  border-color: rgba(26, 109, 61, 0.45);
}

.ar-dot.a {
  background: rgba(220, 38, 38, 0.14);
  border-color: rgba(220, 38, 38, 0.45);
}

.ar-legend {
  margin-top: 10px;
}

.ar-legend .i {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 750;
}

.ar-actions {
  justify-content: space-between;
  margin-bottom: 10px;
}

.ar-thead,
.ar-row {
  display: flex;
}

.ar-th,
.ar-td {
  padding: 10px 12px;
  display: flex;
  align-items: center;
}

.ar-th {
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 900;
}

.ar-th.name,
.ar-td.name {
  width: 55%;
  border-right: 1px solid var(--smis-border-soft);
  overflow: hidden;
}

.ar-th.status,
.ar-td.status {
  flex: 1;
}

.ar-td.status {
  gap: 12px;
  flex-wrap: wrap;
}

.ar-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--smis-border-soft);
  border-radius: 999px;
  background: var(--smis-surface-2);
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 850;
  cursor: pointer;
}

.ar-radio {
  width: 14px;
  height: 14px;
  accent-color: var(--smis-primary);
}

.ar-chip.present.active {
  border-color: rgba(26, 109, 61, 0.25);
  background: var(--smis-primary-soft);
}

.ar-chip.absent.active {
  border-color: rgba(220, 38, 38, 0.25);
  background: rgba(220, 38, 38, 0.08);
}

.notification-picker,
.notification-rule-panel,
.notification-filter-bar,
.notification-summary-card,
.notification-message-box {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
}

.notification-picker {
  overflow: hidden;
}

.notification-picker-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  padding: 10px 12px;
  border-bottom: 1px solid var(--smis-border-soft);
  background: var(--smis-surface-2);
}

.notification-picker-actions,
.notification-template-actions,
.notification-manager-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.notification-picker-list {
  max-height: 230px;
  overflow-y: auto;
  padding: 8px;
}

.notification-recipient-row {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 8px;
  align-items: start;
  padding: 8px;
  border-radius: var(--smis-radius-sm);
  cursor: pointer;
  margin: 0;
}

.notification-recipient-row:hover {
  background: var(--smis-primary-soft);
}

.notification-recipient-name {
  display: block;
  color: var(--smis-text);
  font-size: 12.5px;
  font-weight: 800;
  line-height: 1.25;
}

.notification-recipient-meta,
.notification-picker-count {
  color: var(--smis-muted);
  font-size: 11.5px;
  font-weight: 650;
  line-height: 1.25;
  word-break: break-word;
}

.notification-picker-count {
  font-size: 12px;
  font-weight: 800;
}

.notification-template-pill {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 800;
  background: var(--smis-surface-2);
  color: var(--smis-text);
}

.notification-template-pill.custom {
  background: var(--smis-primary-soft);
  color: var(--smis-primary-dark);
}

.notification-variable-list {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 6px;
}

.notification-variable-list code {
  background: var(--smis-surface-2);
  border-radius: var(--smis-radius-sm);
  color: var(--smis-text);
  padding: 3px 6px;
}

.notification-rule-panel,
.notification-filter-bar {
  padding: 14px;
  background: var(--smis-surface-2);
}

.notification-rule-panel {
  margin-bottom: 16px;
}

.notification-tab-panel {
  display: none;
}

.notification-tab-panel.active {
  display: block;
}

.notification-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}

.notification-summary-card {
  padding: 14px 16px;
  min-height: 92px;
}

.notification-summary-label {
  display: block;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 8px;
  text-transform: uppercase;
}

.notification-summary-value {
  color: var(--smis-text);
  font-size: 24px;
  font-weight: 850;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.notification-summary-note {
  color: var(--smis-muted);
  font-size: 12px;
  margin-top: 6px;
  overflow-wrap: anywhere;
}

.notification-message-box {
  background: var(--smis-surface-2);
  padding: 14px 16px;
}

.notification-message-box p {
  color: var(--smis-text);
  font-size: 13px;
  line-height: 1.6;
  margin-bottom: 0;
  white-space: pre-line;
}

.notification-error-link {
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

.notification-error-text {
  background: var(--smis-text);
  border-radius: var(--smis-radius);
  color: #f9fafb;
  font-size: 12px;
  line-height: 1.6;
  margin: 0;
  max-height: 420px;
  overflow: auto;
  padding: 14px;
  white-space: pre-wrap;
  word-break: break-word;
}

.rwMsgPage {
  padding: 2px 2px 0;
}

.rwHeaderCard,
.rwShell,
.rwEmptyCard {
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: var(--smis-shadow-soft);
}

.rwHeaderCard {
  padding: 18px;
  margin-bottom: 14px;
}

.rwTitle {
  margin: 0;
  color: var(--smis-text);
  font-weight: 900;
  letter-spacing: 0;
}

.rwCrumbs {
  margin-top: 6px;
  color: var(--smis-muted);
  font-weight: 750;
  font-size: 12px;
}

.rwShell {
  overflow: hidden;
}

.rwLeft,
.rwRight {
  background: #fff;
  min-height: 680px;
}

.rwLeft {
  border-right: 1px solid var(--smis-border-soft);
}

.rwSearchWrap,
.rwTop,
.chat_write_box {
  padding: 14px;
  border-bottom: 1px solid var(--smis-border-soft);
  background: #fff;
}

.rwSearch {
  min-height: 46px !important;
  border-radius: var(--smis-radius-sm) !important;
  font-weight: 650 !important;
  padding: 0 14px !important;
}

#user-results {
  margin-top: 10px;
  border-radius: var(--smis-radius);
  overflow: hidden;
  border: 1px solid var(--smis-border-soft);
  background: #fff;
  box-shadow: var(--smis-shadow-soft);
}

.chat_users {
  padding: 10px;
  max-height: calc(680px - 86px);
  overflow-y: auto;
}

.chat_users a.list-group-item {
  border: 1px solid var(--smis-border-soft);
  background: #fff;
  border-radius: var(--smis-radius);
  margin: 10px 4px;
  padding: 12px;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
  transition: box-shadow 0.15s ease, transform 0.15s ease;
  position: relative;
}

.chat_users a.list-group-item:hover {
  transform: translateY(-1px);
  box-shadow: var(--smis-shadow-soft);
}

.chat_users img,
.rwChatHead img {
  width: 44px !important;
  height: 44px !important;
  border-radius: var(--smis-radius) !important;
  border: 2px solid var(--smis-border-soft);
  object-fit: cover;
}

.user_list_username,
.rwUserName,
.chat_user_name {
  color: var(--smis-text) !important;
  font-weight: 900 !important;
}

.user_list_username {
  padding-top: 10px;
}

.chat_users .badge {
  position: absolute;
  top: 10px;
  right: 10px;
  border-radius: 999px;
  padding: 6px 10px;
  font-weight: 900;
  background: var(--smis-primary) !important;
  border: 2px solid #fff;
}

.rwChatHead {
  display: flex;
  align-items: center;
  gap: 12px;
}

.rwUserHint,
.rwSubHead,
.rwEmptySub {
  margin: 2px 0 0;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 750;
}

.sfm-table-wrap {
  background: var(--smis-surface-2);
  padding: 12px;
}

.sfm-table-responsive {
  overflow-x: auto !important;
}

.sfm-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 10px;
  min-width: 100%;
}

.sfm-table thead th {
  padding: 8px 10px;
  color: var(--smis-muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0;
  white-space: nowrap;
  border: 0 !important;
  background: transparent !important;
}

.sfm-row {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
  position: relative;
  z-index: 1;
}

.sfm-row td {
  padding: 12px;
  vertical-align: middle;
  color: var(--smis-text);
  font-size: 12.5px;
  border: 0 !important;
  background: #fff !important;
}

.sfm-row td:first-child {
  border-top-left-radius: var(--smis-radius);
  border-bottom-left-radius: var(--smis-radius);
}

.sfm-row td:last-child {
  border-top-right-radius: var(--smis-radius);
  border-bottom-right-radius: var(--smis-radius);
}

.sfm-invoice-no,
.sfm-money {
  color: var(--smis-text);
  font-size: 12.5px;
  font-weight: 850;
  white-space: nowrap;
}

.sfm-invoice-no {
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 900;
}

.sfm-student {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 230px;
}

.sfm-avatar {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: var(--smis-primary-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--smis-primary-dark);
  border: 4px solid #fff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.sfm-student-meta {
  min-width: 0;
}

.sfm-student-name {
  margin: 0;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.25;
}

.sfm-sub,
.sfm-small {
  margin-top: 2px;
  color: var(--smis-muted);
  font-size: 11.5px;
  font-weight: 650;
  line-height: 1.45;
}

.sfm-small {
  display: block;
  margin-top: 3px;
  font-size: 11px;
}

.sfm-title {
  color: var(--smis-text);
  font-size: 12.5px;
  font-weight: 800;
  min-width: 150px;
}

.sfm-status-cell {
  white-space: nowrap;
  min-width: 110px;
}

.sfm-action-cell {
  position: sticky;
  right: 0;
  background: #fff;
  z-index: 10;
}

.sfm-empty {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: var(--smis-shadow-soft);
  padding: 26px 18px;
}

.sfm-print,
.sfm-paid {
  color: var(--smis-primary-dark) !important;
}

.sfm-edit {
  color: var(--smis-info) !important;
}

.sfm-delete {
  color: var(--smis-danger) !important;
}

.sf-form {
  padding: 2px 0;
}

.sf-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.sf-field {
  display: flex;
  flex-direction: column;
}

.sf-field-full {
  grid-column: 1 / -1;
}

.sf-label {
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 850;
  margin-bottom: 8px;
}

.sf-input {
  min-height: 46px !important;
  border-radius: var(--smis-radius-sm) !important;
  border: 1px solid var(--smis-border) !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04);
  color: var(--smis-text) !important;
  background: #fff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.sf-help,
.sf-discount-note {
  margin-top: 7px;
  color: var(--smis-muted);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.45;
}

.sf-discount-note #discounted_percentage {
  color: var(--smis-danger) !important;
  font-weight: 900;
}

.sf-submit-wrap {
  padding-top: 16px;
}

.sf-submit {
  min-height: 46px;
  border: 1px solid var(--smis-primary);
  background: var(--smis-primary);
  color: var(--smis-primary-contrast);
  border-radius: var(--smis-radius-sm);
  padding: 0 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-size: 12.5px;
  font-weight: 850;
}

.sf-submit:hover {
  background: var(--smis-primary-dark);
  border-color: var(--smis-primary-dark);
  color: var(--smis-primary-dark-contrast);
}

.sf-card-note {
  margin-bottom: 14px;
  padding: 12px 14px;
  border-radius: var(--smis-radius);
  border: 1px solid var(--smis-border-soft);
  background: #fff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04);
}

.sf-card-note-title {
  margin: 0;
  color: var(--smis-text);
  font-size: 12.5px;
  font-weight: 900;
}

.sf-card-note-sub {
  margin: 4px 0 0;
  color: var(--smis-muted);
  font-size: 11.5px;
  font-weight: 700;
}

.loan-grid {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 14px;
  align-items: start;
}

.loan-grid.loan-grid-full {
  grid-template-columns: 1fr;
}

.loan-panel,
.loan-surface,
.loan-card,
.loan-stat,
.notice-ui-card,
.noticeboard_shell {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: var(--smis-shadow-soft);
  overflow: hidden;
}

.loan-panel-h,
.loan-topbar,
.notice-ui-head {
  padding: 14px;
  border-bottom: 1px solid var(--smis-border-soft);
  background: #fff;
}

.loan-panel-h h5,
.loan-topbar h5 {
  margin: 0;
  color: var(--smis-text);
  font-size: 14px;
  font-weight: 900;
}

.loan-panel-h p,
.loan-topbar p {
  margin: 4px 0 0;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 750;
}

.loan-panel-b,
.notice-ui-body {
  padding: 14px;
  background: #fff;
}

.loan-input {
  min-height: 42px !important;
  border-radius: var(--smis-radius-sm) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.loan-label {
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 6px;
}

.loan-btn,
.notice-ui-btn {
  min-height: 42px;
  border-radius: var(--smis-radius-sm);
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-decoration: none !important;
  font-size: 12.5px;
  font-weight: 850;
  border: 1px solid transparent;
}

.loan-btn-blue,
.loan-btn-green,
.notice-ui-btn {
  border-color: var(--smis-primary);
  background: var(--smis-primary);
  color: var(--smis-primary-contrast) !important;
}

.loan-btn-light {
  border-color: var(--smis-border);
  background: #fff;
  color: var(--smis-text) !important;
}

.loan-actions,
.loan-row-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.loan-content {
  background: var(--smis-surface-2);
  padding: 12px;
}

.loan-table th {
  color: var(--smis-muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.loan-table td {
  color: var(--smis-text);
  font-size: 12.5px;
  font-weight: 650;
  vertical-align: top;
}

.loan-title {
  color: var(--smis-text);
  font-weight: 850;
}

.loan-muted {
  color: var(--smis-muted);
  font-size: 11.5px;
  font-weight: 650;
}

.loan-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 12px;
}

.loan-stat {
  padding: 12px;
}

.loan-stat span {
  display: block;
  color: var(--smis-muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.loan-stat strong {
  display: block;
  margin-top: 4px;
  color: var(--smis-text);
  font-size: 16px;
}

.loan-badge {
  display: inline-flex;
  border-radius: 999px;
  padding: 5px 9px;
  font-size: 11px;
  font-weight: 850;
  text-transform: capitalize;
}

.loan-badge.active {
  background: rgba(199, 131, 18, 0.1);
  color: #8a5b0a;
}

.loan-badge.paid {
  background: var(--smis-primary-soft);
  color: var(--smis-primary-dark);
}

.loan-filter {
  display: grid;
  grid-template-columns: 1fr 140px auto;
  gap: 8px;
}

.loan-repay {
  min-width: 320px;
}

.notice-ui-title {
  margin: 0;
  color: var(--smis-text);
  font-weight: 900;
}

.notice-ui-breadcrumbs {
  margin: 6px 0 0;
}

.noticeboard_shell {
  padding: 14px;
}

.notice-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.notice-locale {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  padding: 8px 12px;
}

.notice-locale label {
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 850;
  margin: 0;
  white-space: nowrap;
}

#locale-selector {
  height: 34px;
  border-radius: var(--smis-radius-sm);
  border: 1px solid var(--smis-border-soft);
  background: #fff;
  color: var(--smis-text);
  font-weight: 650;
  padding: 0 10px;
}

#calendar {
  max-width: 1200px;
  margin: 0 auto;
}

.fc .fc-toolbar {
  gap: 10px;
  flex-wrap: wrap;
}

.fc .fc-toolbar-title {
  color: var(--smis-text);
  font-weight: 900;
}

.fc .fc-button {
  border-radius: var(--smis-radius-sm) !important;
  border: 1px solid var(--smis-border-soft) !important;
  background: #fff !important;
  color: var(--smis-text) !important;
  font-weight: 800 !important;
  box-shadow: var(--smis-shadow-soft) !important;
}

.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active {
  background: var(--smis-primary-soft) !important;
  border-color: rgba(26, 109, 61, 0.2) !important;
  color: var(--smis-primary-dark) !important;
}

.fc-theme-standard td,
.fc-theme-standard th {
  border-color: var(--smis-border-soft) !important;
}

.fc .fc-scrollgrid {
  border-radius: var(--smis-radius);
  overflow: hidden;
  border: 1px solid var(--smis-border-soft);
  background: #fff;
  box-shadow: var(--smis-shadow-soft);
}

.fc .fc-daygrid-day-number,
.fc .fc-col-header-cell-cushion {
  color: var(--smis-text);
  font-weight: 800;
  text-decoration: none;
}

.fc .fc-col-header-cell-cushion {
  color: var(--smis-muted);
}

.fc .fc-daygrid-day.fc-day-today {
  background: var(--smis-primary-soft) !important;
}

.fc .fc-event {
  border: 0 !important;
  border-radius: var(--smis-radius-sm) !important;
  padding: 4px 8px !important;
  background: var(--smis-primary) !important;
}

.sp-page {
  padding: 10px 6px;
  color: var(--smis-text);
}

.sp-card,
.sp-kpi,
.sp-box,
.sp-mini,
.sp-doc-card,
.sp-summary,
.sp-salary-card {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: var(--smis-shadow-soft);
}

.sp-card {
  overflow: hidden;
}

.sp-card.sp-profile-card {
  position: sticky;
  top: 18px;
  border-color: color-mix(in srgb, var(--smis-primary) 24%, var(--smis-border));
}

.sp-card-h {
  padding: 14px 16px;
  border-bottom: 1px solid var(--smis-border-soft);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  color: var(--smis-text);
  font-weight: 900;
}

.sp-card-b,
.sp-acc .accordion-body {
  padding: 16px;
}

.sp-cover {
  min-height: 132px;
  position: relative;
  background:
    linear-gradient(135deg, var(--smis-sidebar-dark), var(--smis-sidebar) 62%, var(--smis-primary));
  border-bottom: 1px solid var(--smis-border-soft);
  overflow: hidden;
}

.sp-cover::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,0)),
    repeating-linear-gradient(135deg, rgba(255,255,255,.10) 0 1px, transparent 1px 18px);
  opacity: .55;
  pointer-events: none;
}

.sp-avatar {
  width: 108px;
  height: 108px;
  border-radius: 18px;
  object-fit: cover;
  border: 5px solid #fff;
  background: #fff;
  position: absolute;
  left: 18px;
  bottom: -44px;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1);
}

.sp-name-wrap {
  padding-top: 56px;
}

.sp-name {
  color: var(--smis-text);
  font-size: 24px;
  line-height: 1.1;
  font-weight: 950;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.sp-identity-sub {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 6px;
}

.sp-identity-dot {
  width: 4px;
  height: 4px;
  border-radius: 999px;
  background: var(--smis-border);
}

.sp-muted,
.sp-muted-sm {
  color: var(--smis-muted);
  font-size: 12px;
}

.sp-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 8px;
}

.sp-badge,
.sp-soft-badge,
.sp-pill,
.sp-salary-chip,
.sp-grade-pill .g,
.sp-grade-pill .r {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 850;
  border: 1px solid transparent;
  white-space: nowrap;
}

.sp-badge,
.sp-pill-success,
.sp-salary-chip {
  background: var(--smis-primary);
  color: var(--smis-primary-contrast);
}

.sp-badge.secondary,
.sp-pill-primary {
  background: rgba(37, 99, 235, 0.1);
  border-color: rgba(37, 99, 235, 0.18);
  color: var(--smis-info);
}

.sp-badge.danger,
.sp-pill-danger {
  background: rgba(220, 38, 38, 0.08);
  border-color: rgba(220, 38, 38, 0.18);
  color: var(--smis-danger);
}

.sp-soft-badge {
  background: var(--smis-primary-soft);
  border-color: var(--smis-border-soft);
  color: var(--smis-primary-dark);
  margin: 6px 6px 0 0;
}

.sp-list {
  margin-top: 14px;
  border-top: 1px solid var(--smis-border-soft);
}

.sp-profile-card .sp-list {
  display: grid;
  gap: 8px;
  margin-top: 16px;
  border-top: 0;
}

.sp-list .rowline {
  border-bottom: 1px solid var(--smis-border-soft);
  padding: 12px 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  font-size: 14px;
}

.sp-profile-card .sp-list .rowline {
  border: 1px solid var(--smis-border-soft);
  border-radius: 10px;
  padding: 10px 12px;
  background: var(--smis-surface-2);
}

.sp-list .rowline:last-child {
  border-bottom: 0;
}

.sp-profile-card .sp-list .rowline:last-child {
  border-bottom: 1px solid var(--smis-border-soft);
}

.sp-profile-card .sp-badges {
  margin-top: 12px;
}

.sp-l,
.sp-kpi .t,
.sp-kpi .s,
.sp-doc-sub,
.sp-summary-item .k,
.sp-summary-item .s {
  color: var(--smis-muted);
  font-weight: 750;
}

.sp-v,
.sp-kpi .v,
.sp-doc-name,
.sp-summary-item .v {
  color: var(--smis-text);
  font-weight: 900;
}

.sp-v {
  text-align: right;
  min-width: 0;
  overflow-wrap: anywhere;
}

.sp-kpi,
.sp-box,
.sp-mini,
.sp-doc-card,
.sp-summary,
.sp-salary-card {
  padding: 14px;
}

.sp-kpi {
  height: 100%;
}

.sp-kpi .v,
.sp-salary-card .amt {
  font-size: 24px;
  line-height: 1.1;
  margin-top: 6px;
}

.sp-tabs .nav-link {
  border: 1px solid var(--smis-border-soft);
  border-radius: 999px;
  padding: 8px 14px;
  color: var(--smis-text);
  background: #fff;
  font-weight: 850;
  white-space: nowrap;
}

.sp-tabs .nav-link.active {
  background: var(--smis-primary);
  border-color: var(--smis-primary);
  color: var(--smis-primary-contrast);
}

.sp-table th {
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 850;
}

.sp-table td {
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 650;
}

.sp-section-title {
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 900;
  margin-bottom: 10px;
}

.sp-chart-panel {
  background: var(--smis-surface-2);
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  padding: 14px;
}

.sp-charts-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.sp-mini {
  min-height: 220px;
  display: flex;
  flex-direction: column;
}

.sp-mini-top,
.sp-overall {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}

.sp-mini-top {
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px dashed var(--smis-border-soft);
}

.sp-mini .ttl {
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
  line-height: 1.2;
}

.sp-mini .val {
  border-radius: 999px;
  padding: 6px 10px;
  background: var(--smis-primary-soft);
  color: var(--smis-primary-dark);
  font-size: 13px;
  font-weight: 900;
}

.sp-mini canvas {
  width: 100% !important;
  height: 145px !important;
}

.sp-doc-card {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.sp-doc-ic {
  width: 40px;
  height: 40px;
  border-radius: var(--smis-radius-sm);
  background: var(--smis-primary-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--smis-primary-dark);
  font-weight: 900;
  flex: 0 0 auto;
}

.sp-doc-meta {
  flex: 1 1 auto;
  min-width: 0;
}

.sp-doc-name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sp-doc-actions {
  flex: 0 0 auto;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.sp-btn-pill {
  border: 1px solid var(--smis-border-soft);
  background: var(--smis-surface-2);
  border-radius: 999px;
  padding: 6px 10px;
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 850;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}

.sp-summary-item {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border-radius: var(--smis-radius-sm);
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  height: 100%;
}

.sp-matrix-wrap {
  overflow: auto;
}

.sp-matrix {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  min-width: 980px;
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  overflow: hidden;
}

.sp-matrix th,
.sp-matrix td {
  border-right: 1px solid var(--smis-border-soft);
  border-bottom: 1px solid var(--smis-border-soft);
  padding: 9px 10px;
  font-size: 13px;
  white-space: nowrap;
}

.sp-matrix thead th {
  background: var(--smis-surface-2);
  color: var(--smis-muted);
  font-weight: 900;
  text-transform: uppercase;
  font-size: 12px;
  position: sticky;
  top: 0;
  z-index: 1;
}

.sp-matrix .rowhdr {
  font-weight: 900;
  background: #fff;
  position: sticky;
  left: 0;
  z-index: 1;
}

.sp-matrix .t-center {
  text-align: center;
}

.sp-badge-a,
.sp-badge-b,
.sp-badge-c,
.sp-badge-d,
.sp-badge-e,
.sp-badge-f,
.sp-badge-neutral {
  border: 1px solid var(--smis-border-soft);
  background: #fff;
  color: var(--smis-text);
}

.sp-badge-a {
  background: var(--smis-primary-soft);
  color: var(--smis-primary-dark);
}

.sp-badge-c {
  background: rgba(37, 99, 235, 0.08);
  color: var(--smis-info);
}

.sp-badge-d {
  background: rgba(199, 131, 18, 0.1);
  color: #8a5b0a;
}

.sp-badge-f {
  background: rgba(220, 38, 38, 0.08);
  color: var(--smis-danger);
}

.tp-sec-wrap {
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  padding: 10px;
  background: #fff;
  max-height: 132px;
  overflow: auto;
}

.tp-sec-top,
.tp-sec-actions,
.tp-sec-item {
  display: flex;
  gap: 10px;
  align-items: center;
}

.tp-sec-top {
  justify-content: space-between;
  margin-bottom: 6px;
}

.tp-sec-actions {
  gap: 8px;
  flex-wrap: wrap;
}

.tp-sec-actions button {
  border: 1px solid var(--smis-border-soft);
  background: var(--smis-surface-2);
  border-radius: 999px;
  padding: 4px 10px;
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 850;
}

.tp-sec-item {
  padding: 6px;
  border-top: 1px dashed var(--smis-border-soft);
}

.tp-sec-item:first-child {
  border-top: 0;
}

.sp-block-title {
  color: var(--smis-text);
  font-weight: 900;
  margin: 18px 0 10px;
}

.profileWrap {
  padding: 18px 18px 26px;
}

.profileShell,
.profileCard,
.infoRow {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: var(--smis-shadow-soft);
}

.profileShell,
.profileCard {
  overflow: hidden;
}

.profileTop,
.profileCardHead {
  padding: 16px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid var(--smis-border-soft);
}

.profileTitle,
.profileActions,
.avatarBox {
  display: flex;
  align-items: center;
  gap: 12px;
}

.profileBadge {
  width: 46px;
  height: 46px;
  border-radius: var(--smis-radius);
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--smis-primary-soft);
  border: 1px solid rgba(26, 109, 61, 0.14);
}

.profileBadge svg {
  width: 22px;
  height: 22px;
  fill: var(--smis-primary-dark);
}

.profileTitleText,
.avatarMeta {
  min-width: 0;
}

.profileTitleText h4,
.profileCardHead h5,
.avatarMeta .name {
  margin: 0;
  color: var(--smis-text);
  font-weight: 900;
}

.profileTitleText h4 {
  font-size: 16px;
}

.profileTitleText p,
.avatarMeta .role,
.infoRow .k {
  margin: 2px 0 0;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 750;
}

.pBtn,
.pMini,
.pSave {
  min-height: 42px;
  border-radius: var(--smis-radius-sm);
  border: 1px solid var(--smis-border-soft);
  background: #fff;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--smis-text);
  text-decoration: none !important;
  font-size: 12px;
  font-weight: 850;
}

.pBtnGold,
.pSave {
  border-color: var(--smis-primary);
  background: var(--smis-primary);
  color: var(--smis-primary-contrast) !important;
}

.profileBody {
  padding: 18px;
}

.profileGrid {
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 16px;
}

.profileCardBody {
  padding: 14px;
}

.avatarImg {
  width: 64px;
  height: 64px;
  border-radius: var(--smis-radius);
  object-fit: cover;
  border: 3px solid #fff;
  box-shadow: var(--smis-shadow-soft);
}

.infoList {
  margin-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.infoRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  box-shadow: none;
}

.infoRow .v {
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 850;
  text-align: right;
  word-break: break-word;
}

.formGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.pLabel {
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 850;
  margin: 0 0 6px 2px;
}

.pInput,
.pSelect,
.pTextarea {
  width: 100% !important;
  border-radius: var(--smis-radius-sm) !important;
  border: 1px solid var(--smis-border) !important;
  background: #fff !important;
  padding: 12px !important;
  color: var(--smis-text) !important;
  font-weight: 650 !important;
  outline: none !important;
}

.pTextarea {
  min-height: 120px;
  resize: vertical;
}

.inport_btn {
  min-height: 34px;
  padding: 8px 14px;
  border: 1px solid var(--smis-border);
  border-radius: var(--smis-radius-sm);
  background: #fff;
  color: var(--smis-text);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  font-size: 13px;
  font-weight: 750;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.inport_btn:hover {
  background: var(--smis-primary-soft);
  border-color: rgba(26, 109, 61, 0.2);
  color: var(--smis-primary-dark);
}

.sp-divider {
  background-color: var(--smis-border);
  opacity: 1;
  margin: 18px 0;
}

.parent-card {
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  padding: 18px;
  margin-bottom: 18px;
  background: #fff;
}

.parent-title {
  color: var(--smis-text);
  font-weight: 900;
  font-size: 15px;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.eForm-layouts {
  max-width: 1100px;
  margin: auto;
}

.admission-stepper {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 10px;
  margin-bottom: 20px;
}

.admission-step {
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius-sm);
  background: #fff;
  color: var(--smis-muted);
  cursor: pointer;
  min-height: 64px;
  padding: 10px;
  text-align: left;
}

.admission-step span {
  width: 24px;
  height: 24px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
  background: rgba(37, 99, 235, 0.08);
  color: var(--smis-info);
  font-size: 12px;
  font-weight: 850;
}

.admission-step strong {
  display: block;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 850;
  line-height: 1.25;
}

.admission-step.active {
  background: var(--smis-primary-soft);
  border-color: rgba(26, 109, 61, 0.22);
  color: var(--smis-primary-dark);
  box-shadow: var(--smis-shadow-soft);
}

.admission-step.completed span {
  background: var(--smis-primary-soft);
  color: var(--smis-primary-dark);
}

.admission-step-panel {
  display: none !important;
  width: 100%;
}

.admission-step-panel.active {
  display: block !important;
}

.admission-step-actions {
  width: 100%;
}

.admission-step-alert,
.admission-required-info,
.csv-required-guide,
.csv-upload-check {
  border-radius: var(--smis-radius);
  font-size: 13px;
  font-weight: 650;
  margin-bottom: 16px;
  padding: 12px 14px;
}

.admission-step-alert {
  display: none;
  background: rgba(199, 131, 18, 0.1);
  border: 1px solid rgba(199, 131, 18, 0.2);
  color: #8a5b0a;
}

.admission-step-alert.show {
  display: block;
}

.admission-required-info {
  background: rgba(37, 99, 235, 0.08);
  border: 1px solid rgba(37, 99, 235, 0.18);
  color: var(--smis-info);
}

.admission-validation-error {
  border-color: var(--smis-danger) !important;
  box-shadow: 0 0 0 0.2rem rgba(220, 38, 38, 0.12) !important;
}

.csv-error-shell,
.csv-required-guide {
  border: 1px solid rgba(220, 38, 38, 0.18);
  border-radius: var(--smis-radius);
  background: rgba(220, 38, 38, 0.04);
  max-width: 100%;
  min-width: 0;
  margin-bottom: 18px;
  overflow: hidden;
}

.csv-error-shell-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(220, 38, 38, 0.18);
  background: rgba(220, 38, 38, 0.06);
}

.csv-error-shell-title,
.csv-required-guide h5 {
  color: var(--smis-danger);
  font-size: 15px;
  font-weight: 900;
  margin: 0 0 6px;
}

.csv-error-shell-subtitle,
.csv-required-guide p {
  color: #991b1b;
  font-size: 13px;
  line-height: 1.55;
  margin: 0;
}

.csv-error-table-wrap,
.csv-preview-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  width: 100%;
}

.csv-error-table-wrap {
  max-height: 360px;
}

.csv-error-table,
.csv-preview-table {
  margin: 0;
  min-width: 100%;
  width: max-content;
}

.csv-error-table th {
  background: rgba(220, 38, 38, 0.06);
  color: #991b1b;
  font-size: 12px;
  position: sticky;
  top: 0;
  z-index: 1;
}

.csv-error-table td,
.csv-preview-table td,
.csv-preview-table th {
  font-size: 13px;
  white-space: nowrap;
}

.csv-error-cell-badge {
  background: rgba(220, 38, 38, 0.08);
  border: 1px solid rgba(220, 38, 38, 0.2);
  border-radius: 999px;
  color: var(--smis-danger);
  display: inline-block;
  font-weight: 850;
  min-width: 54px;
  padding: 3px 8px;
  text-align: center;
}

.csv-error-value {
  background: var(--smis-surface-2);
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius-sm);
  color: var(--smis-text);
  display: inline-block;
  max-width: 260px;
  min-height: 26px;
  padding: 4px 8px;
  word-break: break-word;
}

.csv-required-guide {
  background: rgba(199, 131, 18, 0.08);
  border-color: rgba(199, 131, 18, 0.22);
}

.csv-required-guide h5,
.csv-required-guide p,
.csv-required-chip {
  color: #8a5b0a;
}

.csv-required-chip-list,
.csv-template-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.csv-required-chip {
  background: #fff;
  border: 1px solid rgba(199, 131, 18, 0.22);
  border-radius: 999px;
  display: inline-flex;
  max-width: 100%;
  min-width: 0;
  font-size: 12px;
  font-weight: 750;
  gap: 6px;
  padding: 7px 10px;
}

.csv-upload-check {
  display: none;
  overflow-wrap: anywhere;
}

.csv-upload-check.show {
  display: block;
}

.csv-upload-check.ok {
  background: var(--smis-primary-soft);
  border: 1px solid rgba(26, 109, 61, 0.18);
  color: var(--smis-primary-dark);
}

.csv-upload-check.error {
  background: rgba(220, 38, 38, 0.05);
  border: 1px solid rgba(220, 38, 38, 0.18);
  color: var(--smis-danger);
}

.csv-preview-wrap,
#student_admission_csv_form,
.offline-admission-wrap,
.offline-admission-wrap .user-profile-area,
.offline-admission-wrap .user-details-info,
.offline-admission-wrap .eNav-Tabs-content,
.offline-admission-wrap .tab-pane {
  box-sizing: border-box;
  max-width: 100%;
  min-width: 0;
}

.offline-admission-wrap,
.csv-preview-wrap,
#student_admission_csv_form {
  overflow-x: hidden;
}

.offline-admission-wrap .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100%;
}

.offline-admission-wrap .user-profile-area {
  display: block !important;
  width: 100%;
}

.offline-admission-wrap .user-details-info {
  flex: 1 1 100% !important;
  width: 100%;
}

.py-wrap {
  max-width: 1100px;
}

.py-card,
.py-section,
.py-summary,
.stmt-wrap,
.stmt-card,
.stmt-stat {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: var(--smis-shadow-soft);
}

.py-card,
.stmt-wrap {
  overflow: hidden;
}

.py-card-h,
.stmt-head {
  padding: 16px 18px;
  border-bottom: 1px solid var(--smis-border-soft);
  background: #fff;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  flex-wrap: wrap;
}

.py-card-h h5,
.stmt-title h4 {
  margin: 0;
  color: var(--smis-text);
  font-size: 15px;
  font-weight: 900;
}

.stmt-title h4 {
  font-size: 18px;
}

.py-card-h p,
.stmt-title p {
  margin: 4px 0 0;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 750;
}

.py-card-b {
  padding: 20px 18px;
  background: #fff;
}

.py-section {
  padding: 16px;
  margin-bottom: 16px;
  box-shadow: none;
}

.py-section-title {
  margin: 0 0 14px;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 900;
}

.py-label {
  color: var(--smis-text);
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 7px;
}

.py-input {
  min-height: 44px !important;
  border-radius: var(--smis-radius-sm) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

textarea.py-input {
  min-height: 100px;
  resize: vertical;
}

.py-help,
.py-note {
  color: var(--smis-muted);
  font-size: 11.5px;
  font-weight: 650;
  line-height: 1.45;
}

.py-help {
  margin-top: 6px;
}

.py-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(199, 131, 18, 0.22);
  background: rgba(199, 131, 18, 0.1);
  color: #8a5b0a;
  font-size: 11.5px;
  font-weight: 800;
}

.py-pill-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #c78312;
  display: inline-block;
}

.py-summary {
  background: var(--smis-surface-2);
  padding: 16px;
  height: 100%;
  box-shadow: none;
}

.py-summary h6 {
  margin: 0 0 12px;
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 900;
}

.py-summary-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px dashed var(--smis-border-soft);
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 700;
}

.py-summary-row strong {
  color: var(--smis-text);
  font-weight: 900;
}

.py-actions,
.stmt-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.py-actions {
  margin-top: 22px;
}

.ta-page {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 14px;
  align-items: start;
}

.ta-panel,
.ta-list,
.ta-kpi,
.ta-subject-box {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius);
  box-shadow: var(--smis-shadow-soft);
}

.ta-head {
  padding: 14px;
  border-bottom: 1px solid var(--smis-border-soft);
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.ta-head h5 {
  margin: 0;
  color: var(--smis-text);
  font-size: 14px;
  font-weight: 900;
}

.ta-head p {
  margin: 2px 0 0;
  color: var(--smis-muted);
  font-size: 12px;
  font-weight: 700;
}

.ta-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.ta-kpi {
  background: var(--smis-surface-2);
  padding: 12px;
  box-shadow: none;
}

.ta-kpi strong {
  display: block;
  color: var(--smis-text);
  font-size: 20px;
  line-height: 1;
}

.ta-kpi span,
.ta-muted,
.ta-subject-tools span,
.ta-subject-empty {
  color: var(--smis-muted);
  font-size: 11px;
  font-weight: 800;
}

.ta-kpi span {
  display: block;
  margin-top: 6px;
  text-transform: uppercase;
}

.ta-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 0;
}

.ta-table th {
  background: var(--smis-surface-2);
  color: var(--smis-muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  padding: 11px 12px;
  border-bottom: 1px solid var(--smis-border-soft);
  white-space: nowrap;
}

.ta-table td {
  padding: 12px;
  border-bottom: 1px solid var(--smis-border-soft);
  color: var(--smis-text);
  vertical-align: middle;
  font-size: 13px;
}

.ta-name {
  color: var(--smis-text);
  font-weight: 900;
}

.ta-chip {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(37, 99, 235, 0.18);
  background: rgba(37, 99, 235, 0.08);
  color: var(--smis-info);
  border-radius: 999px;
  padding: 5px 9px;
  font-size: 11px;
  font-weight: 850;
}

.ta-filter,
.ta-subject-tools,
.ta-subject-actions,
.ta-subject-row {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.ta-filter select {
  min-width: 240px;
}

.ta-subject-tools {
  justify-content: space-between;
  margin-bottom: 8px;
}

.ta-mini-btn {
  border: 1px solid var(--smis-border-soft);
  background: #fff;
  border-radius: var(--smis-radius-sm);
  padding: 5px 8px;
  color: var(--smis-text);
  font-size: 11px;
  font-weight: 850;
}

.ta-subject-box {
  min-height: 132px;
  max-height: 220px;
  overflow: auto;
  background: var(--smis-surface-2);
  padding: 8px;
  box-shadow: none;
}

.ta-subject-row {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
  border-radius: var(--smis-radius-sm);
  padding: 9px 10px;
  margin-bottom: 7px;
  cursor: pointer;
}

.ta-subject-row span {
  color: var(--smis-text);
  font-size: 13px;
  font-weight: 800;
}

.stmt-btn {
  min-height: 42px;
  border: 1px solid var(--smis-border);
  border-radius: var(--smis-radius-sm);
  padding: 0 14px;
  background: #fff;
  color: var(--smis-text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-size: 12px;
  font-weight: 850;
}

.stmt-btn-blue,
.stmt-btn-green {
  border-color: var(--smis-primary);
  background: var(--smis-primary);
  color: var(--smis-primary-contrast);
}

.stmt-body {
  background: var(--smis-surface-2);
  padding: 14px;
}

.stmt-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 12px;
}

.stmt-stat {
  padding: 12px;
  box-shadow: none;
}

.stmt-stat span,
.stmt-muted {
  color: var(--smis-muted);
  font-size: 11.5px;
  font-weight: 750;
}

.stmt-stat span {
  display: block;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.stmt-stat strong {
  display: block;
  margin-top: 4px;
  color: var(--smis-text);
  font-size: 16px;
}

.stmt-table th {
  color: var(--smis-muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.stmt-table td {
  color: var(--smis-text);
  font-size: 12.5px;
  font-weight: 650;
  vertical-align: middle;
}

.stmt-badge {
  display: inline-flex;
  border-radius: 999px;
  padding: 5px 9px;
  font-size: 11px;
  font-weight: 850;
  text-transform: capitalize;
}

.stmt-badge.active {
  background: rgba(199, 131, 18, 0.1);
  color: #8a5b0a;
}

.stmt-badge.paid {
  background: var(--smis-primary-soft);
  color: var(--smis-primary-dark);
}

.stmt-notes {
  padding: 14px;
  border-top: 1px solid var(--smis-border-soft);
  color: var(--smis-text);
  font-size: 12.5px;
  font-weight: 750;
}

.chat-messages {
  height: calc(680px - 62px - 78px);
  overflow-y: auto;
  padding: 18px !important;
}

.chat-message-right,
.chat-message-left {
  display: flex;
  gap: 10px;
  align-items: flex-end;
}

.chat-message-right {
  justify-content: flex-end;
}

.chat-message-right .flex-shrink-1,
.chat-message-left .msg_text_body .flex-shrink-1 {
  max-width: 74%;
  padding: 12px 14px;
  border-radius: var(--smis-radius);
  color: var(--smis-text);
  font-weight: 700;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
  white-space: pre-wrap;
  word-break: break-word;
}

.chat-message-right .flex-shrink-1 {
  background: var(--smis-primary-soft);
  border: 1px solid rgba(26, 109, 61, 0.16);
}

.chat-message-left .msg_text_body .flex-shrink-1 {
  background: #fff;
  border: 1px solid var(--smis-border-soft);
}

.chat-message-right .text-muted,
.chat-message-left .text-muted {
  color: var(--smis-muted) !important;
  font-size: 11px;
  font-weight: 750;
}

.seen_meesage {
  display: flex;
  justify-content: flex-end;
  padding: 0 6px 10px;
}

.seen_meesage img {
  width: 22px !important;
  height: 22px !important;
  border-radius: 999px !important;
  border: 2px solid var(--smis-border-soft);
}

.chat_write_box {
  border-top: 1px solid var(--smis-border-soft);
  border-bottom: 0;
}

.chat_write_box .input-group {
  gap: 10px;
  align-items: flex-end;
}

.chat_write_box_text_area {
  min-height: 48px !important;
  max-height: 120px;
  resize: vertical;
  border-radius: var(--smis-radius) !important;
  padding: 12px 14px !important;
  font-weight: 650 !important;
}

.chat_submit {
  width: 52px;
  height: 52px;
  border-radius: var(--smis-radius) !important;
  border: 1px solid var(--smis-primary) !important;
  background: var(--smis-primary) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
}

.chat_submit path {
  stroke: #fff;
}

.rwEmpty {
  min-height: 520px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 22px;
}

.rwEmptyCard {
  width: 100%;
  max-width: 460px;
  padding: 26px 18px;
}

.rwEmptyCard img {
  width: 140px;
  max-width: 55%;
}

.rwEmptyTitle {
  margin: 10px 0 0;
  color: var(--smis-text);
  font-weight: 900;
}

.sl-approve,
.sl-paid {
  color: var(--smis-primary-dark) !important;
}

.sl-process,
.sl-view,
.sl-print {
  color: var(--smis-info) !important;
}

.sl-reject,
.sl-cancel {
  color: var(--smis-danger) !important;
}

@media (max-width: 767.98px) {
  .mainSection-title h4 {
    font-size: 18px !important;
  }

  .eSection-wrap,
  .eSection-wrap-2 {
    padding: 14px !important;
  }

  .search-filter-area,
  .report-filter-area,
  .filter-area {
    align-items: stretch !important;
  }

  .search-filter-area form,
  .report-filter-area form,
  .filter-area form,
  .export-btn-area {
    width: 100%;
  }

  .export_btn,
  .btn-form,
  .search-filter-area .btn,
  .search-filter-area button {
    width: 100%;
  }

  .table > :not(caption) > * > *,
  .eTable > :not(caption) > * > *,
  .eTable-2 > :not(caption) > * > * {
    padding: 10px 12px !important;
  }
}

@media (max-width: 991.98px) {
  .sl-grid,
  .lt-grid,
  .sl-detail-grid,
  .cb-grid,
  .fs-grid,
  .gp-layout,
  .gp-wrap,
  .gh-wrap,
  .loan-grid,
  .loan-filter,
  .ta-page {
    grid-template-columns: 1fr;
  }

  .sl-sticky {
    position: static !important;
    top: auto !important;
  }

  .sl-search {
    min-width: 100%;
  }

  .sl-actions-cell {
    width: auto;
    text-align: left;
  }

  .sl-top-actions,
  .lt-top-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .cl-actions-cell,
  .ec-action-cell,
  .sfm-action-cell {
    width: auto;
    text-align: left;
  }

  .gp-sticky {
    position: static !important;
    top: auto !important;
  }

  .gh-sticky {
    position: static !important;
    top: auto !important;
  }

  .ta-col-4 {
    grid-column: span 12;
  }

  .rwLeft,
  .rwRight {
    min-height: 520px;
  }

  .chat_users {
    max-height: none;
  }

  .chat-messages {
    height: calc(520px - 62px - 78px);
  }

  .loan-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .sf-form-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 575.98px) {
  .ar-grid-scroll {
    --ar-left-width: 210px;
  }

  .notice-ui-btn {
    width: 100%;
  }
}

@media (max-width: 767.98px) {
  .loan-stats {
    grid-template-columns: 1fr;
  }

  .sp-charts-grid {
    grid-template-columns: 1fr;
  }

  .admission-stepper {
    grid-template-columns: 1fr;
  }

  .ta-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 575.98px) {
  .stmt-stats,
  .ta-kpis {
    grid-template-columns: 1fr;
  }

  .stmt-actions,
  .stmt-btn {
    width: 100%;
  }

  .gv-grid {
    grid-template-columns: 1fr;
  }

  .formGrid,
  .profileGrid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1199.98px) {
  .sp-charts-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 767.98px) {
  .sp-charts-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767.98px) {
  .sl-grid-2,
  .sl-check-grid,
  .sl-meta,
  .sl-doc-grid {
    grid-template-columns: 1fr;
  }
}

/* Reports */
.export_btn {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 9px 14px;
  border: 1px solid var(--school-primary);
  border-radius: 10px;
  background: var(--school-primary) !important;
  color: #fff !important;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none;
}

.export_btn:hover {
  background: var(--school-primary-dark) !important;
  border-color: var(--school-primary-dark);
  color: #fff !important;
  text-decoration: none;
}

.export_btn.outline {
  background: #fff !important;
  color: var(--school-ink) !important;
  border-color: var(--school-border) !important;
}

.export_btn.outline:hover {
  background: var(--school-soft) !important;
}

.badge-soft {
  min-width: 85px;
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}

.filter-card,
.report-header,
.table-card,
.rw-topbar,
.rw-card {
  background: #fff;
  border: 1px solid var(--school-border);
}

.filter-card {
  padding: 16px 18px;
  border-radius: 12px;
}

.report-header {
  padding: 14px 16px;
  border-left: 4px solid var(--school-primary);
  border-radius: 12px;
}

.report-title h4,
.report-header h4 {
  margin: 0;
  color: var(--school-ink);
  font-weight: 900;
  line-height: 1.2;
}

.report-title small,
.report-header small {
  color: var(--school-muted);
  font-size: 12px;
  font-weight: 600;
}

.table-card {
  overflow: hidden;
  border-top: 4px solid var(--school-primary);
  border-radius: 14px;
  box-shadow: var(--school-shadow-sm);
}

.table-card-body {
  padding: 14px;
}

.table-card .table {
  overflow: hidden;
  border-radius: 12px;
}

.table-card .table thead th {
  background: #f8fafc;
  border-bottom: 2px solid rgba(15, 23, 42, 0.06);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.table-card .table tbody tr:hover {
  background: #f9fbfd;
}

.exam-dropdown {
  position: absolute;
  z-index: 999;
  width: 100%;
  max-height: 200px;
  overflow: auto;
  padding: 10px;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.08);
}

.exam-item {
  display: flex;
  gap: 8px;
  padding: 6px;
  font-size: 13px;
}

.rank-table-wrap {
  overflow: auto;
}

#rankTable {
  width: 100%;
  min-width: 1000px;
  border-collapse: separate;
  border-spacing: 0;
}

#rankTable th,
#rankTable td {
  padding: 8px;
  border: 1px solid #d6d6d6;
  background: #fff;
  font-size: 12px;
  text-align: center;
  white-space: nowrap;
}

#rankTable thead th {
  position: sticky;
  top: 0;
  z-index: 5;
  background: #f8fafc;
  font-weight: 900;
}

#rankTable .sticky-1,
#rankTable .sticky-2,
#rankTable .sticky-3 {
  position: sticky;
  background: #fff;
}

#rankTable .sticky-1 {
  left: 0;
  z-index: 6;
}

#rankTable .sticky-2 {
  left: 50px;
  z-index: 6;
}

#rankTable .sticky-3 {
  left: 160px;
  z-index: 6;
}

.vhead {
  height: 120px;
  font-weight: 900;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

.rank-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  border-radius: 999px;
  background: #d1e7dd;
  color: #0f5132;
  font-weight: 900;
}

#rankTable tbody tr:nth-child(even) td {
  background: #fafafa;
}

.rw-page {
  padding-bottom: 10px;
}

.rw-topbar {
  margin-bottom: 14px;
  padding: 14px 16px;
  border-radius: 16px;
  box-shadow: var(--school-shadow-sm);
}

.rw-title {
  margin: 0;
  color: var(--school-ink);
  font-weight: 900;
  line-height: 1.2;
}

.rw-sub {
  margin-top: 4px;
  color: var(--school-muted);
  font-size: 12px;
}

.rw-search-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
}

.rw-input {
  flex: 1 1 260px;
  min-width: 220px;
  padding: 10px 12px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 14px;
  background: #fff;
  color: var(--school-ink);
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.04);
  outline: none;
}

.rw-input::placeholder {
  color: rgba(100, 116, 139, 0.9);
}

.rw-section {
  margin-top: 14px;
}

.rw-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
  margin: 10px 2px;
}

.rw-section-title {
  margin: 0;
  color: var(--school-ink);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0;
}

.rw-section-line {
  flex: 1;
  height: 1px;
  margin-left: 12px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.1);
  transform: translateY(-6px);
}

.rw-card {
  height: 100%;
  overflow: hidden;
  border-radius: 16px;
  box-shadow: var(--school-shadow-sm);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.rw-card:hover {
  border-color: rgba(26, 109, 61, 0.22);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1);
  transform: translateY(-2px);
}

.rw-report {
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  text-align: left;
}

.rw-report-top {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.rw-icon {
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(26, 109, 61, 0.12);
  border-radius: 14px;
  background: rgba(26, 109, 61, 0.1);
  color: var(--school-primary);
}

.rw-icon.gold {
  border-color: rgba(201, 162, 39, 0.18);
  background: rgba(201, 162, 39, 0.14);
  color: #ECAB1E;
}

.rw-icon.gray {
  border-color: rgba(15, 23, 42, 0.08);
  background: rgba(15, 23, 42, 0.06);
  color: rgba(15, 23, 42, 0.55);
}

.rw-icon i {
  font-size: 20px;
}

.rw-card-title {
  margin: 0;
  color: var(--school-ink);
  font-size: 14px;
  font-weight: 900;
  line-height: 1.2;
}

.rw-desc {
  margin-top: 4px;
  color: var(--school-muted);
  font-size: 12px;
}

.rw-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding-top: 8px;
}

.rw-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border: 1px solid rgba(26, 109, 61, 0.15);
  border-radius: 999px;
  background: rgba(26, 109, 61, 0.1);
  color: var(--school-primary);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.rw-chip.soon {
  border-color: rgba(15, 23, 42, 0.1);
  background: rgba(15, 23, 42, 0.06);
  color: rgba(15, 23, 42, 0.55);
}

.btn-rw,
.btn-rw-outline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
  white-space: nowrap;
}

.btn-rw {
  border: 1px solid var(--school-primary);
  background: var(--school-primary);
  color: #fff !important;
}

.btn-rw:hover {
  border-color: var(--school-primary-dark);
  background: var(--school-primary-dark);
  color: #fff !important;
  text-decoration: none;
}

.btn-rw-outline {
  border: 1px solid rgba(26, 109, 61, 0.35);
  background: transparent;
  color: var(--school-primary) !important;
}

.btn-rw-outline:hover {
  background: rgba(26, 109, 61, 0.08);
  text-decoration: none;
}

.btn-disabled {
  pointer-events: none;
  opacity: 0.65;
}

.limitst {
  padding-top: 12px;
  padding-bottom: 0;
}

.limitedst {
  display: none;
}

.razorpay-payment-button {
  max-width: 175px;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 50px;
  margin-left: auto;
  padding: 12px 18px;
  border: 1px solid transparent;
  border-radius: 8px;
  background-color: #00a3ff;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  transition: all 0.3s ease;
}

.admit-card {
  position: relative;
}

.admit-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: var(--admit-watermark, none) no-repeat center;
  background-size: 60%;
  opacity: 0.1;
  pointer-events: none;
}

.admit-card > * {
  position: relative;
  z-index: 1;
}

@media (max-width: 767.98px) {
  .rw-actions,
  .rw-search-wrap {
    align-items: stretch;
  }

  .btn-rw,
  .btn-rw-outline,
  .rw-chip {
    justify-content: center;
  }
}

/* Admin dashboard shared UI */
:root{
        --rw-green:#ECAB1E;
        --rw-green-2:#C88D11;
        --rw-gold:#ECAB1E;
        --rw-ink:#0f172a;
        --rw-muted:#64748b;
        --rw-card:#ffffff;
        --rw-bg:#f5f7fb;
        --rw-border:rgba(15,23,42,.08);
        --rw-shadow: 0 10px 25px rgba(2,6,23,.08);
        --rw-shadow-soft: 0 6px 16px rgba(2,6,23,.06);
        --rw-radius:16px;
    }

    .rw-dashboard{ padding-bottom: 10px; }

    .rw-hero{
        background:
            radial-gradient(800px 240px at 15% 0%, rgba(236,171,30,.18), transparent 55%),
            radial-gradient(900px 280px at 85% 15%, rgba(26,109,61,.22), transparent 55%),
            linear-gradient(135deg, var(--rw-green), var(--rw-green-2));
        border-radius: var(--rw-radius);
        color:#fff;
        padding: 18px;
        position: relative;
        overflow:hidden;
        box-shadow: var(--rw-shadow);
    }
    .rw-hero:before{
        content:"";
        position:absolute;
        inset:-40px -40px auto auto;
        width: 240px;
        height: 240px;
        background: radial-gradient(circle at center, rgba(255,255,255,.16), transparent 60%);
        transform: rotate(15deg);
        border-radius: 999px;
        pointer-events:none;
    }

    .rw-hero-kicker{
        display:flex;
        flex-wrap:wrap;
        gap:10px;
        align-items:center;
        margin-bottom: 8px;
    }
    .rw-hero-badge{
        display:inline-flex;
        align-items:center;
        gap:8px;
        padding: 6px 10px;
        border-radius: 999px;
        font-size: 12px;
        font-weight: 800;
        background: rgba(255,255,255,.14);
        border: 1px solid rgba(255,255,255,.18);
        color: #fff;
    }
    .rw-hero-date{
        display:inline-flex;
        align-items:center;
        gap:8px;
        font-size: 12px;
        font-weight: 700;
        color: rgba(255,255,255,.85);
        padding: 6px 10px;
        border-radius: 999px;
        background: rgba(0,0,0,.10);
        border: 1px solid rgba(255,255,255,.10);
    }

    .rw-bismillah{
        font-size: 11px;
        letter-spacing:.12em;
        text-transform: uppercase;
        color: rgba(255,255,255,.82);
        display:flex;
        align-items:center;
        gap:10px;
        margin-top: 6px;
    }
    .rw-bismillah .line{
        height:1px;
        flex:1;
        background: rgba(255,255,255,.22);
    }

    .rw-hero-right{
        min-width: 320px;
        max-width: 520px;
    }
    .rw-hero-stats{
        display:grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }
    .rw-hero-stat{
        background: rgba(255,255,255,.12);
        border: 1px solid rgba(255,255,255,.18);
        border-radius: 16px;
        padding: 10px;
        box-shadow: 0 18px 40px rgba(0,0,0,.18);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }
    .rw-hero-stat-label{
        font-size: 11px;
        font-weight: 800;
        color: rgba(255,255,255,.82);
        letter-spacing: .03em;
        text-transform: uppercase;
    }
    .rw-hero-stat-value{
        font-size: 16px;
        font-weight: 900;
        color: #fff;
        margin-top: 4px;
        line-height: 1.1;
        word-break: break-word;
    }
    .rw-hero-stat-sub{
        font-size: 12px;
        color: rgba(255,255,255,.75);
        margin-top: 2px;
    }

    @media(max-width: 991px){
        .rw-hero-right{ min-width: 100%; max-width:100%; }
        .rw-hero-stats{ grid-template-columns:1fr; }
    }

    .rw-kpi{
        display:flex;
        gap:12px;
        align-items:center;
        padding:14px;
        border-radius: var(--rw-radius);
        background: var(--rw-card);
        border: 1px solid var(--rw-border);
        box-shadow: var(--rw-shadow-soft);
        text-decoration:none;
        color: inherit;
        transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
        height:100%;
    }
    .rw-kpi:hover{
        transform: translateY(-2px);
        border-color: rgba(26,109,61,.25);
        box-shadow: 0 12px 30px rgba(2,6,23,.10);
        text-decoration:none;
    }
    .rw-kpi-icon{
        width:42px;height:42px;
        border-radius: 14px;
        display:flex;align-items:center;justify-content:center;
        background: rgba(26,109,61,.10);
        color: var(--rw-green);
        flex: 0 0 auto;
    }
    .rw-kpi-icon.gold{
        background: rgba(236,171,30,.14);
        color: var(--rw-gold);
    }
    .rw-kpi-label{
        font-size: 11px;
        color: var(--rw-muted);
        font-weight: 700;
        letter-spacing: .02em;
        text-transform: uppercase;
        margin-bottom: 2px;
    }
    .rw-kpi-value{
        font-size: 22px;
        font-weight: 900;
        color: var(--rw-ink);
        line-height: 1.1;
    }
    .rw-kpi-sub{
        font-size: 12px;
        color: var(--rw-muted);
        margin-top: 2px;
    }
    .rw-kpi-arrow{
        margin-left:auto;
        opacity:.45;
        transition: transform .15s ease, opacity .15s ease;
        color: var(--rw-green);
    }
    .rw-kpi:hover .rw-kpi-arrow{
        opacity:1;
        transform: translateX(2px);
    }

    .rw-card{
        background: var(--rw-card);
        border: 1px solid var(--rw-border);
        border-radius: var(--rw-radius);
        box-shadow: var(--rw-shadow-soft);
        overflow:hidden;
    }
    .rw-card-header{
        padding:14px 16px;
        border-bottom: 1px solid var(--rw-border);
        display:flex;
        justify-content: space-between;
        align-items:flex-start;
        gap: 10px;
        background:
            radial-gradient(600px 200px at 10% 0%, rgba(236,171,30,.10), transparent 55%),
            radial-gradient(700px 260px at 90% 40%, rgba(26,109,61,.08), transparent 55%),
            #fff;
    }
    .rw-card-title{
        font-weight: 900;
        color: var(--rw-ink);
        margin:0;
    }
    .rw-card-sub{
        font-size: 12px;
        color: var(--rw-muted);
        margin-top: 2px;
    }
    .rw-card-body{
        padding: 14px 16px;
    }

    .rw-pill{
        display:inline-flex;
        align-items:center;
        gap:8px;
        padding: 7px 10px;
        border-radius: 999px;
        font-size: 12px;
        font-weight: 800;
        background: rgba(26,109,61,.10);
        color: var(--rw-green);
        border: 1px solid rgba(26,109,61,.15);
        white-space:nowrap;
    }
    .rw-pill.gold{
        background: rgba(236,171,30,.14);
        color: #7a5f11;
        border-color: rgba(236,171,30,.25);
    }

    .rw-percent{
        display:inline-flex;
        align-items:center;
        gap:6px;
        padding: 6px 10px;
        border-radius: 999px;
        font-size: 12px;
        font-weight: 900;
        background: rgba(26,109,61,.12);
        border: 1px solid rgba(26,109,61,.18);
        color: var(--rw-green);
    }

    .rw-event{
        display:flex;
        gap: 12px;
        padding: 8px 0;
        border-bottom: 1px dashed rgba(15,23,42,.12);
    }
    .rw-event:last-child{ border-bottom: none; padding-bottom: 0; }
    .rw-dot{
        width:10px;height:10px;border-radius:999px;
        background: var(--rw-gold);
        box-shadow: 0 0 0 4px rgba(236,171,30,.14);
        margin-top: 6px;
        flex: 0 0 auto;
    }
    .rw-event-title{ font-weight: 900; color: var(--rw-ink); }
    .rw-event-date{ font-size: 12px; color: var(--rw-muted); }

    .rw-chart{
        height: 400px;
        width: 100%;
    }
    @media(max-width: 991px){
        .rw-chart{ height: 320px; }
    }

    .btn-rw{
        background: var(--rw-green);
        border-color: var(--rw-green);
        color:#fff !important;
        font-weight: 800;
        border-radius: 12px;
        padding: 8px 12px;
    }
    .btn-rw:hover{
        background: var(--rw-green-2);
        border-color: var(--rw-green-2);
    }
    .btn-rw-outline{
        background: transparent;
        border: 1px solid rgba(26,109,61,.35);
        color: var(--rw-green) !important;
        font-weight: 900;
        border-radius: 12px;
        padding: 8px 12px;
    }
    .btn-rw-outline:hover{
        background: rgba(26,109,61,.08);
    }
    .btn-rw-ghost{
        background: rgba(255,255,255,.14);
        border: 1px solid rgba(255,255,255,.18);
        color:#fff !important;
        font-weight: 900;
        border-radius: 12px;
        padding: 8px 12px;
    }
    .btn-rw-ghost:hover{
        background: rgba(255,255,255,.20);
        border-color: rgba(255,255,255,.24);
    }

    .sp-kpi{
        background:#fff;
        border:1px solid rgba(15,23,42,.08);
        border-radius:16px;
        padding:16px;
        box-shadow:0 6px 16px rgba(2,6,23,.06);
        height:100%;
    }
    .sp-kpi .t{
        font-size:11px;
        font-weight:800;
        color:#64748b;
        text-transform:uppercase;
        letter-spacing:.03em;
    }
    .sp-kpi .v{
        font-size:24px;
        font-weight:900;
        color:#0f172a;
        margin-top:6px;
        line-height:1.1;
    }
    .sp-kpi .s{
        font-size:12px;
        color:#64748b;
        margin-top:4px;
    }
    .sp-card{
        background:#fff;
        border:1px solid rgba(15,23,42,.08);
        border-radius:16px;
        box-shadow:0 6px 16px rgba(2,6,23,.06);
        overflow:hidden;
    }
    .sp-card-h{
        padding:14px 16px;
        border-bottom:1px solid rgba(15,23,42,.08);
        display:flex;
        justify-content:space-between;
        align-items:center;
        font-weight:900;
        color:#0f172a;
        background:
            radial-gradient(600px 200px at 10% 0%, rgba(236,171,30,.10), transparent 55%),
            radial-gradient(700px 260px at 90% 40%, rgba(26,109,61,.08), transparent 55%),
            #fff;
    }
    .sp-card-b{
        padding:16px;
    }
    .sp-box{
        background:#fff;
        border:1px solid rgba(15,23,42,.08);
        border-radius:14px;
        padding:14px;
    }
    .sp-muted{
        color:#64748b;
        font-size:12px;
    }
    .sp-summary-item{
        display:flex;
        justify-content:space-between;
        align-items:center;
        gap:12px;
        border:1px solid rgba(15,23,42,.08);
        border-radius:14px;
        padding:14px;
        background:#fff;
        height:100%;
    }
    .sp-summary-item .k{
        font-size:12px;
        font-weight:900;
        color:#0f172a;
    }
    .sp-summary-item .s{
        font-size:11px;
        color:#64748b;
    }
    .sp-summary-item .v{
        font-size:20px;
        font-weight:900;
        color:#302E2F;
        line-height:1;
    }
    .tp-sec-wrap{
        border:1px solid rgba(15,23,42,.08);
        border-radius:14px;
        padding:10px;
        background:#fff;
        min-height:42px;
    }
    .tp-sec-top{
        display:flex;
        justify-content:space-between;
        align-items:center;
        gap:10px;
        margin-bottom:8px;
    }
    .tp-sec-actions{
        display:flex;
        gap:8px;
    }
    .tp-sec-actions button{
        border:none;
        background:transparent;
        color:#302E2F;
        font-size:12px;
        font-weight:800;
        padding:0;
    }
    #tpSectionsBox{
        display:flex;
        flex-wrap:wrap;
        gap:8px;
    }
    .tp-sec-item{
        display:inline-flex;
        align-items:center;
        gap:6px;
        padding:7px 10px;
        border-radius:999px;
        background:#f8fafc;
        border:1px solid rgba(15,23,42,.08);
        font-size:12px;
        font-weight:700;
        color:#0f172a;
        cursor:pointer;
    }
    .tp-sec-item input{ margin:0; }

    .sp-table th{
        font-size:12px;
        font-weight:900;
        white-space:nowrap;
    }
    .sp-table td{
        font-size:13px;
        vertical-align:middle;
    }

    @media (max-width: 767px){
        .rw-hero{ padding:14px; }
        .rw-card-header{ flex-direction:column; align-items:stretch; }
        .rw-kpi{ padding:12px; }
        .rw-kpi-value{ font-size:20px; }
        .sp-card-b{ padding:12px; }
        .sp-summary-item{ padding:12px; }
        .tp-sec-top{ flex-direction:column; align-items:flex-start; }
        .rw-chart{ height:280px; }
    }


/* Superadmin dashboard shared UI */
:root{
        --rw-green:#ECAB1E;
        --rw-green-2:#C88D11;
        --rw-gold:#ECAB1E;
        --rw-ink:#0f172a;
        --rw-muted:#64748b;
        --rw-card:#ffffff;
        --rw-bg:#f5f7fb;
        --rw-border:rgba(15,23,42,.08);
        --rw-shadow: 0 10px 25px rgba(2,6,23,.08);
        --rw-shadow-soft: 0 6px 16px rgba(2,6,23,.06);
        --rw-radius:16px;
    }

    .rw-dashboard{ padding-bottom:10px; }

    .rw-hero{
        background:
            radial-gradient(800px 240px at 15% 0%, rgba(236,171,30,.18), transparent 55%),
            radial-gradient(900px 280px at 85% 15%, rgba(26,109,61,.22), transparent 55%),
            linear-gradient(135deg, var(--rw-green), var(--rw-green-2));
        border-radius: var(--rw-radius);
        color:#fff;
        padding: 18px 18px;
        position: relative;
        overflow:hidden;
        box-shadow: var(--rw-shadow);
    }
    .rw-hero:before{
        content:"";
        position:absolute;
        inset:-40px -40px auto auto;
        width:240px;
        height:240px;
        background: radial-gradient(circle at center, rgba(255,255,255,.16), transparent 60%);
        transform: rotate(15deg);
        border-radius: 999px;
        pointer-events:none;
    }

    .rw-hero-kicker{
        display:flex;
        flex-wrap:wrap;
        gap:10px;
        align-items:center;
        margin-bottom:8px;
    }
    .rw-hero-badge{
        display:inline-flex;
        align-items:center;
        gap:8px;
        padding:6px 10px;
        border-radius:999px;
        font-size:12px;
        font-weight:800;
        background: rgba(255,255,255,.14);
        border: 1px solid rgba(255,255,255,.18);
        color:#fff;
    }
    .rw-hero-date{
        display:inline-flex;
        align-items:center;
        gap:8px;
        font-size:12px;
        font-weight:700;
        color:rgba(255,255,255,.85);
        padding:6px 10px;
        border-radius:999px;
        background: rgba(0,0,0,.10);
        border:1px solid rgba(255,255,255,.10);
    }
    .rw-bismillah{
        font-size:11px;
        letter-spacing:.12em;
        text-transform:uppercase;
        color: rgba(255,255,255,.82);
        display:flex;
        align-items:center;
        gap:10px;
        margin-top:6px;
    }
    .rw-bismillah .line{
        height:1px;
        flex:1;
        background: rgba(255,255,255,.22);
    }

    .rw-hero-right{
        min-width:320px;
        max-width:520px;
    }
    .rw-hero-stats{
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:10px;
    }
    .rw-hero-stat{
        background: rgba(255,255,255,.12);
        border:1px solid rgba(255,255,255,.18);
        border-radius:16px;
        padding:10px 10px;
        box-shadow: 0 18px 40px rgba(0,0,0,.18);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }
    .rw-hero-stat-label{
        font-size:11px;
        font-weight:800;
        color: rgba(255,255,255,.82);
        letter-spacing:.03em;
        text-transform:uppercase;
    }
    .rw-hero-stat-value{
        font-size:16px;
        font-weight:900;
        color:#fff;
        margin-top:4px;
        line-height:1.1;
        word-break: break-word;
    }
    .rw-hero-stat-sub{
        font-size:12px;
        color: rgba(255,255,255,.75);
        margin-top:2px;
    }

    .rw-kpi{
        display:flex;
        gap:12px;
        align-items:center;
        padding:14px 14px;
        border-radius: var(--rw-radius);
        background: var(--rw-card);
        border:1px solid var(--rw-border);
        box-shadow: var(--rw-shadow-soft);
        text-decoration:none;
        color:inherit;
        transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
        height:100%;
    }
    .rw-kpi:hover{
        transform: translateY(-2px);
        border-color: rgba(26,109,61,.25);
        box-shadow: 0 12px 30px rgba(2,6,23,.10);
        text-decoration:none;
    }
    .rw-kpi-icon{
        width:42px;
        height:42px;
        border-radius:14px;
        display:flex;
        align-items:center;
        justify-content:center;
        background: rgba(26,109,61,.10);
        color: var(--rw-green);
        flex: 0 0 auto;
    }
    .rw-kpi-icon.gold{
        background: rgba(236,171,30,.14);
        color: var(--rw-gold);
    }
    .rw-kpi-label{
        font-size:11px;
        color: var(--rw-muted);
        font-weight:700;
        letter-spacing:.02em;
        text-transform:uppercase;
        margin-bottom:2px;
    }
    .rw-kpi-value{
        font-size:22px;
        font-weight:900;
        color: var(--rw-ink);
        line-height:1.1;
    }
    .rw-kpi-sub{
        font-size:12px;
        color: var(--rw-muted);
        margin-top:2px;
    }
    .rw-kpi-arrow{
        margin-left:auto;
        opacity:.45;
        transition: transform .15s ease, opacity .15s ease;
        color: var(--rw-green);
    }
    .rw-kpi:hover .rw-kpi-arrow{
        opacity:1;
        transform: translateX(2px);
    }

    .rw-card{
        background: var(--rw-card);
        border:1px solid var(--rw-border);
        border-radius: var(--rw-radius);
        box-shadow: var(--rw-shadow-soft);
        overflow:hidden;
    }
    .rw-card-header{
        padding:14px 16px;
        border-bottom:1px solid var(--rw-border);
        display:flex;
        justify-content:space-between;
        align-items:flex-start;
        gap:10px;
        background:
            radial-gradient(600px 200px at 10% 0%, rgba(236,171,30,.10), transparent 55%),
            radial-gradient(700px 260px at 90% 40%, rgba(26,109,61,.08), transparent 55%),
            #fff;
    }
    .rw-card-title{
        font-weight:900;
        color: var(--rw-ink);
        margin:0;
    }
    .rw-card-sub{
        font-size:12px;
        color: var(--rw-muted);
        margin-top:2px;
    }
    .rw-card-body{
        padding:14px 16px;
    }

    .rw-pill{
        display:inline-flex;
        align-items:center;
        gap:8px;
        padding:7px 10px;
        border-radius:999px;
        font-size:12px;
        font-weight:800;
        background: rgba(26,109,61,.10);
        color: var(--rw-green);
        border:1px solid rgba(26,109,61,.15);
        white-space:nowrap;
    }
    .rw-pill.gold{
        background: rgba(236,171,30,.14);
        color:#7a5f11;
        border-color: rgba(236,171,30,.25);
    }
    .rw-percent{
        display:inline-flex;
        align-items:center;
        gap:6px;
        padding:6px 10px;
        border-radius:999px;
        font-size:12px;
        font-weight:900;
        background: rgba(26,109,61,.12);
        border:1px solid rgba(26,109,61,.18);
        color: var(--rw-green);
    }

    .rw-event{
        display:flex;
        gap:12px;
        padding:8px 0;
        border-bottom:1px dashed rgba(15,23,42,.12);
    }
    .rw-event:last-child{
        border-bottom:none;
        padding-bottom:0;
    }
    .rw-dot{
        width:10px;
        height:10px;
        border-radius:999px;
        background: var(--rw-gold);
        box-shadow: 0 0 0 4px rgba(236,171,30,.14);
        margin-top:6px;
        flex:0 0 auto;
    }
    .rw-event-title{
        font-weight:900;
        color: var(--rw-ink);
    }
    .rw-event-date{
        font-size:12px;
        color: var(--rw-muted);
    }

    .rw-chart{
        height:400px;
        width:100%;
    }

    .btn-rw{
        background: var(--rw-green);
        border-color: var(--rw-green);
        color:#fff !important;
        font-weight:800;
        border-radius:12px;
        padding:8px 12px;
    }
    .btn-rw:hover{
        background: var(--rw-green-2);
        border-color: var(--rw-green-2);
    }
    .btn-rw-outline{
        background:transparent;
        border:1px solid rgba(26,109,61,.35);
        color: var(--rw-green) !important;
        font-weight:900;
        border-radius:12px;
        padding:8px 12px;
    }
    .btn-rw-outline:hover{
        background: rgba(26,109,61,.08);
    }
    .btn-rw-ghost{
        background: rgba(255,255,255,.14);
        border:1px solid rgba(255,255,255,.18);
        color:#fff !important;
        font-weight:900;
        border-radius:12px;
        padding:8px 12px;
    }
    .btn-rw-ghost:hover{
        background: rgba(255,255,255,.20);
        border-color: rgba(255,255,255,.24);
    }

    .rw-mini-table .item{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:12px;
        padding:10px 0;
        border-bottom:1px dashed rgba(15,23,42,.10);
    }
    .rw-mini-table .item:last-child{
        border-bottom:none;
        padding-bottom:0;
    }
    .rw-mini-table .name{
        font-size:13px;
        color: var(--rw-ink);
        font-weight:700;
    }
    .rw-mini-table .meta{
        font-size:12px;
        color: var(--rw-muted);
    }
    .rw-status-badge{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        padding:6px 10px;
        border-radius:999px;
        font-size:11px;
        font-weight:900;
        background: rgba(26,109,61,.10);
        color: var(--rw-green);
        border:1px solid rgba(26,109,61,.18);
        white-space:nowrap;
    }
    .rw-status-badge.expired{
        background: rgba(220,53,69,.10);
        color:#dc3545;
        border-color: rgba(220,53,69,.18);
    }

    @media(max-width:991px){
        .rw-hero-right{ min-width:100%; }
        .rw-hero-stats{ grid-template-columns:1fr; }
        .rw-chart{ height:340px; }
    }

/* Final theme aliases. Keep this at the end so older module-local helpers
   inherit the active school palette even when they define legacy variables. */
:root,
[data-theme] {
  --rw-green: var(--smis-primary);
  --rw-green-2: var(--smis-primary-dark);
  --rw-gold: var(--smis-primary);
  --rw-primary-soft: var(--smis-primary-soft);
  --rw-primary-contrast: var(--smis-primary-contrast);
  --rw-primary-dark-contrast: var(--smis-primary-dark-contrast);
  --rw-ink: var(--smis-text);
  --rw-bg: var(--smis-bg);
  --rw-card: var(--smis-surface);
  --sb-bg: var(--smis-sidebar);
  --sb-border: rgba(255, 255, 255, 0.10);
  --sb-text: rgba(255, 255, 255, 0.94);
  --sb-text-muted: rgba(255, 255, 255, 0.74);
  --sb-hover: rgba(255, 255, 255, 0.10);
  --sb-active-bg: rgba(255, 255, 255, 0.16);
  --sb-active-border: rgba(255, 255, 255, 0.24);
}

.sidebar {
  background: var(--smis-sidebar) !important;
}

.rw-hero {
  background:
    radial-gradient(800px 240px at 15% 0%, var(--smis-primary-soft), transparent 55%),
    radial-gradient(900px 280px at 85% 15%, var(--smis-primary-soft), transparent 55%),
    linear-gradient(135deg, var(--smis-primary), var(--smis-primary-dark));
  color: var(--smis-primary-dark-contrast);
}

.rw-hero .text-white,
.rw-hero .text-white-50,
.rw-hero-badge,
.rw-hero-date,
.rw-bismillah,
.rw-hero-stat-label,
.rw-hero-stat-value,
.rw-hero-stat-sub,
.btn-rw-ghost {
  color: var(--smis-primary-dark-contrast) !important;
}

.rw-kpi:hover {
  border-color: var(--smis-primary);
}

.rw-kpi-icon,
.rw-kpi-icon.gold,
.rw-pill,
.rw-pill.gold,
.rw-percent,
.rw-status-badge {
  background: var(--smis-primary-soft);
  border-color: var(--smis-primary);
  color: var(--smis-primary-dark) !important;
}

.rw-card-header {
  background:
    radial-gradient(600px 200px at 10% 0%, var(--smis-primary-soft), transparent 55%),
    radial-gradient(700px 260px at 90% 40%, var(--smis-primary-soft), transparent 55%),
    var(--smis-surface);
}

.rw-dot {
  background: var(--smis-primary);
  box-shadow: 0 0 0 4px var(--smis-primary-soft);
}

.btn-rw {
  color: var(--smis-primary-contrast) !important;
}

.btn-rw:hover {
  color: var(--smis-primary-dark-contrast) !important;
}

.btn-rw-outline {
  border-color: var(--smis-primary);
  color: var(--smis-primary-dark) !important;
}

.btn-rw-outline:hover {
  background: var(--smis-primary-soft);
}

.sidebar .nav-links > li .iocn-link::before,
.sidebar .nav-links > li.showMenu .iocn-link::before {
  background: var(--smis-primary) !important;
}

.sidebar .nav-links > li .sub-menu {
  background: var(--smis-sidebar-dark, var(--smis-sidebar)) !important;
}

.sidebar.close .nav-links li .sub-menu {
  background: var(--smis-sidebar) !important;
}

.btn-primary,
.btn-success,
.btn-form,
.export_btn,
.eBtn-green,
.sl-btn-green,
.sl-btn-success,
.sl-btn-blue,
.lt-btn-green,
.lv-btn-green,
.btn-rw,
.authBtn {
  background: var(--smis-primary) !important;
  border-color: var(--smis-primary) !important;
  color: var(--smis-primary-contrast) !important;
  box-shadow: 0 10px 22px rgba(236, 171, 30, 0.24) !important;
}

.btn-primary:hover,
.btn-success:hover,
.btn-form:hover,
.export_btn:hover,
.eBtn-green:hover,
.sl-btn-green:hover,
.sl-btn-success:hover,
.sl-btn-blue:hover,
.lt-btn-green:hover,
.lv-btn-green:hover,
.btn-rw:hover,
.authBtn:hover {
  background: var(--smis-primary-dark) !important;
  border-color: var(--smis-primary-dark) !important;
  color: var(--smis-primary-dark-contrast) !important;
}

.btn-secondary,
.btn-outline-secondary,
.btn-rw-outline,
.sl-btn-white,
.lt-btn-white,
.lv-btn-white,
.authBackBtn {
  background: #fff !important;
  border-color: var(--smis-border) !important;
  color: var(--smis-text) !important;
}

.btn-secondary:hover,
.btn-outline-secondary:hover,
.btn-rw-outline:hover,
.sl-btn-white:hover,
.lt-btn-white:hover,
.lv-btn-white:hover,
.authBackBtn:hover {
  background: var(--smis-primary-soft) !important;
  border-color: var(--smis-primary) !important;
  color: var(--smis-sidebar) !important;
}

.eLogut_btn,
.eLogut_btn.btn {
  background: var(--smis-sidebar) !important;
  border-color: var(--smis-sidebar) !important;
  color: #fff !important;
}

.eLogut_btn:hover,
.eLogut_btn.btn:hover {
  background: #242223 !important;
  border-color: #242223 !important;
  color: var(--smis-primary) !important;
}

a,
.authLinks a,
.authLink,
.authLinkBtn,
.tp-sec-actions button {
  color: var(--smis-sidebar) !important;
}

a:hover,
.authLinks a:hover,
.authLink:hover,
.authLinkBtn:hover,
.tp-sec-actions button:hover {
  color: var(--smis-primary-dark) !important;
}

.form-control:focus,
.form-select:focus,
.eForm-control:focus,
.eForm-select:focus,
.authInput:focus {
  border-color: var(--smis-primary) !important;
  box-shadow: var(--smis-focus) !important;
}

.authAddon,
.rw-kpi-icon.gold,
.rw-pill.gold {
  background: var(--smis-primary-soft) !important;
  color: var(--smis-sidebar) !important;
  border-color: var(--smis-primary) !important;
}

.sp-page .export_btn,
.sp-page .btn-form {
  background: var(--smis-primary) !important;
  border-color: var(--smis-primary) !important;
  color: var(--smis-primary-contrast) !important;
}

.sp-page .export_btn:hover,
.sp-page .btn-form:hover {
  background: var(--smis-primary-dark) !important;
  border-color: var(--smis-primary-dark) !important;
  color: var(--smis-primary-dark-contrast) !important;
}

.rw-dashboard .btn-rw-outline {
  background: transparent !important;
  border-color: var(--smis-primary) !important;
  color: var(--smis-primary-dark) !important;
}

.rw-dashboard .btn-rw-outline:hover {
  background: var(--smis-primary-soft) !important;
}