/* Theme switch. Light is the default. Dark rules are scoped to html[data-theme="dark"].
   Admin pages also set data-theme-version="dark" so the existing admin skin dark rules apply.
   School-colored bars and the colored dashboard tiles stay as they are. */

.nav-cluster {
  display: flex;
  align-items: center;
  gap: 4px;
}

.theme-toggle {
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 1;
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
  background: rgba(255, 255, 255, 0.28);
  outline: none;
}

.theme-icon { display: inline-flex; }
.theme-icon svg {
  width: 1.15rem;
  height: 1.15rem;
  display: block;
}
.theme-icon-moon svg { fill: currentColor; }
.theme-icon-sun { display: none; }
.theme-icon-sun svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
html[data-theme="dark"] .theme-icon-moon { display: none; }
html[data-theme="dark"] .theme-icon-sun { display: inline-flex; }

.theme-toggle-item { display: flex; align-items: center; list-style: none; }
.navbar .theme-toggle { position: relative; z-index: 1003; }
.header .theme-toggle,
.navbar-menu-wrapper .theme-toggle { margin-right: 4px; }

.theme-toggle-fixed {
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 10050;
}
.theme-toggle-fixed .theme-toggle {
  background: rgba(15, 23, 42, 0.78);
  color: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
}

.navbar .theme-toggle {
  background: rgba(15, 23, 42, 0.55);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.28);
}
.navbar.scrolled .theme-toggle {
  background: rgba(24, 118, 48, 0.12);
  color: var(--school-primary, #187630);
  border-color: transparent;
}
.navbar.menu-open .theme-toggle,
html[data-theme="dark"] .navbar.scrolled .theme-toggle {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
  border-color: transparent;
}
@media (max-width: 1100px) {
  .nav-links a { padding-left: 10px; padding-right: 10px; }
  .navbar .theme-toggle { width: 36px; height: 36px; }
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bs-body-bg: #0b1220;
  --bs-body-color: #e2e8f0;
  --nav-headbg: #111827;
  --sidebar-bg: #111827;
  --headerbg: #0b1220;
  --inline-surface: #1e293b;
  --inline-sunken: #111827;
  --inline-text: #e2e8f0;
  --inline-highlight: #3f2e12;
}

html[data-theme="dark"] body {
  background-color: #0b1220 !important;
  color: #e2e8f0;
}

/* Keep the school bar and brand text. Beats the admin skin's white heading rule. */
html[data-theme="dark"] .SchoolPrimaryColor,
html[data-theme="dark"] .SchoolPrimaryGradient {
  background-color: var(--school-primary) !important;
  color: #fff !important;
}
html[data-theme="dark"] .SchoolPrimaryFont,
html[data-theme="dark"] h1.SchoolPrimaryFont,
html[data-theme="dark"] h2.SchoolPrimaryFont,
html[data-theme="dark"] h3.SchoolPrimaryFont,
html[data-theme="dark"] h4.SchoolPrimaryFont,
html[data-theme="dark"] h5.SchoolPrimaryFont,
html[data-theme="dark"] h6.SchoolPrimaryFont,
html[data-theme="dark"] .h1.SchoolPrimaryFont,
html[data-theme="dark"] .h2.SchoolPrimaryFont,
html[data-theme="dark"] .h3.SchoolPrimaryFont,
html[data-theme="dark"] .h4.SchoolPrimaryFont,
html[data-theme="dark"] .h5.SchoolPrimaryFont,
html[data-theme="dark"] .h6.SchoolPrimaryFont {
  color: var(--school-primary) !important;
}
html[data-theme="dark"] .text-primary { color: var(--school-primary-light, #4db865) !important; }

/* Colored dashboard tiles stay solid. */
html[data-theme="dark"] .dash-kpi,
html[data-theme="dark"] .dash-stat-card,
html[data-theme="dark"] .dash-rate-card { color: #fff; }
html[data-theme="dark"] .dash-kpi-navy,
html[data-theme="dark"] .dash-stat-due { background: #1b4f82 !important; }
html[data-theme="dark"] .dash-kpi-teal,
html[data-theme="dark"] .dash-stat-extra { background: #0f6d68 !important; }
html[data-theme="dark"] .dash-kpi-indigo,
html[data-theme="dark"] .dash-stat-info { background: #3d4ea6 !important; }
html[data-theme="dark"] .dash-kpi-amber,
html[data-theme="dark"] .dash-stat-rate,
html[data-theme="dark"] .dash-rate-card { background: #c05621 !important; }
html[data-theme="dark"] .dash-kpi-emerald,
html[data-theme="dark"] .dash-stat-paid { background: #18775a !important; }
html[data-theme="dark"] .dash-kpi-slate { background: #3d5168 !important; }
html[data-theme="dark"] .dash-kpi-alert,
html[data-theme="dark"] .dash-stat-unpaid { background: #b42318 !important; }

html[data-theme="dark"] .content-body,
html[data-theme="dark"] .content-wrapper,
html[data-theme="dark"] .main-panel,
html[data-theme="dark"] .container-scroller,
html[data-theme="dark"] .footer,
html[data-theme="dark"] .page-wrapper {
  background: #0b1220;
  color: #e2e8f0;
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .card-header,
html[data-theme="dark"] .card-footer,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .list-group-item,
html[data-theme="dark"] .bg-white,
html[data-theme="dark"] .bg-light,
html[data-theme="dark"] .authincation-content,
html[data-theme="dark"] .auth-form {
  background-color: #1e293b;
  color: #e2e8f0;
  border-color: #334155;
}

html[data-theme="dark"] .card-title,
html[data-theme="dark"] .card-header,
html[data-theme="dark"] label,
html[data-theme="dark"] .form-label,
html[data-theme="dark"] .text-dark,
html[data-theme="dark"] .text-black { color: #e2e8f0 !important; }
html[data-theme="dark"] .bg-white,
html[data-theme="dark"] .bg-light {
  background-color: var(--inline-surface) !important;
  color: var(--inline-text) !important;
}
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .text-secondary { color: #94a3b8 !important; }

html[data-theme="dark"] .dropdown-menu .dropdown-item { color: #e2e8f0; }
html[data-theme="dark"] .dropdown-menu .dropdown-item:hover,
html[data-theme="dark"] .dropdown-menu .dropdown-item:focus,
html[data-theme="dark"] .dropdown-item.active,
html[data-theme="dark"] .dropdown-item:active {
  background: #334155;
  color: #fff;
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-control:hover,
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-control:active,
html[data-theme="dark"] .form-control:disabled,
html[data-theme="dark"] .form-control[readonly],
html[data-theme="dark"] .form-select,
html[data-theme="dark"] .custom-select,
html[data-theme="dark"] .modern-form-field .form-control,
html[data-theme="dark"] .input-icon-wrapper .form-control,
html[data-theme="dark"] textarea,
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="password"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="number"],
html[data-theme="dark"] input[type="search"],
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] input[type="time"],
html[data-theme="dark"] input[type="tel"],
html[data-theme="dark"] select,
html[data-theme="dark"] .content-wrapper .card:not(.SchoolPrimaryColor):not(.dash-stat-card):not(.dash-rate-card):not([class*="dash-kpi"]),
html[data-theme="dark"] .content-body .card:not(.SchoolPrimaryColor):not(.dash-stat-card):not(.dash-rate-card):not([class*="dash-kpi"]),
html[data-theme="dark"] .main-panel .card:not(.SchoolPrimaryColor):not(.dash-stat-card):not(.dash-rate-card):not([class*="dash-kpi"]),
html[data-theme="dark"] .card-body,
html[data-theme="dark"] .card-header:not(.SchoolPrimaryColor),
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .modal-body,
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer,
html[data-theme="dark"] .app-footer,
html[data-theme="dark"] .create-post-card,
html[data-theme="dark"] .feed-post,
html[data-theme="dark"] .feed-post-dropdown,
html[data-theme="dark"] .edit-post-dialog,
html[data-theme="dark"] .load-more-btn,
html[data-theme="dark"] .momo-provider,
html[data-theme="dark"] .momo-bal-card,
html[data-theme="dark"] .momo-status-box,
html[data-theme="dark"] .lc-pane,
html[data-theme="dark"] .lc-tabs button:not(.active),
html[data-theme="dark"] .cl-card,
html[data-theme="dark"] .shop-toolbar,
html[data-theme="dark"] .product-card,
html[data-theme="dark"] .cart-drawer,
html[data-theme="dark"] .order-tile,
html[data-theme="dark"] .child-card,
html[data-theme="dark"] .mini-stat {
  background-color: #111827 !important;
  background-image: none !important;
  color: #e2e8f0;
  border-color: #334155;
}
html[data-theme="dark"] .card-body,
html[data-theme="dark"] .card-header:not(.SchoolPrimaryColor),
html[data-theme="dark"] .create-post-card,
html[data-theme="dark"] .feed-post,
html[data-theme="dark"] .product-card,
html[data-theme="dark"] .cart-drawer,
html[data-theme="dark"] .momo-provider,
html[data-theme="dark"] .lc-pane,
html[data-theme="dark"] .cl-card,
html[data-theme="dark"] .app-footer {
  background-color: #1e293b !important;
}
html[data-theme="dark"] .form-control::placeholder,
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: #94a3b8 !important; }
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus {
  border-color: var(--school-primary, #187630) !important;
}
html[data-theme="dark"] select.form-control,
html[data-theme="dark"] .custom-select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23e2e8f0' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat !important;
  background-position: right 0.75rem center !important;
  background-size: 8px 10px !important;
}

/* Full-screen loader is painted after the theme file with a light gradient. */
html[data-theme="dark"] #preloader {
  background: #0b1220 !important;
  background-image: none !important;
}
html[data-theme="dark"] .loadingCentermain {
  background: transparent !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  border-top-color: var(--school-primary, #187630) !important;
  box-shadow: none;
}

/* Registration and edit forms */
html[data-theme="dark"] .modern-registration-body,
html[data-theme="dark"] .modern-registration-card,
html[data-theme="dark"] .family-person-card,
html[data-theme="dark"] .family-portal-strip,
html[data-theme="dark"] .reg-doc-card,
html[data-theme="dark"] .reg-doc-drop,
html[data-theme="dark"] .reg-doc-file,
html[data-theme="dark"] .modern-edit-form .form-check,
html[data-theme="dark"] .teacher-history-body,
html[data-theme="dark"] .teacher-history-card,
html[data-theme="dark"] .file-upload-wrapper {
  background: #1e293b !important;
  background-color: #1e293b !important;
  color: #e2e8f0;
  border-color: #334155;
}
html[data-theme="dark"] .photo-preview-container {
  background: #111827 !important;
  background-image: none !important;
  color: #e2e8f0;
}
html[data-theme="dark"] .preview-placeholder {
  background: #243044 !important;
  background-image: none !important;
  border-color: #475569;
  color: #94a3b8;
}
html[data-theme="dark"] .preview-details h4,
html[data-theme="dark"] .student-preview-grade,
html[data-theme="dark"] .student-preview-extra,
html[data-theme="dark"] .reg-doc-card-head strong,
html[data-theme="dark"] .file-upload-text {
  color: #e2e8f0 !important;
}
html[data-theme="dark"] .reg-doc-card,
html[data-theme="dark"] .reg-doc-file,
html[data-theme="dark"] .file-upload-wrapper {
  background: #111827 !important;
  background-color: #111827 !important;
}
html[data-theme="dark"] h4.student-preview-name { color: var(--school-primary-light, #4db865) !important; }
html[data-theme="dark"] .reg-doc-card-head .reg-doc-hint,
html[data-theme="dark"] .reg-doc-file small,
html[data-theme="dark"] .reg-doc-note { color: #94a3b8 !important; }
html[data-theme="dark"] .reg-doc-drop:hover,
html[data-theme="dark"] .reg-doc-card.has-file .reg-doc-drop,
html[data-theme="dark"] .file-upload-wrapper:hover {
  background: #243044 !important;
  border-color: var(--school-primary, #187630) !important;
}
html[data-theme="dark"] .modern-form-field .form-control,
html[data-theme="dark"] .modern-form-field .form-select,
html[data-theme="dark"] .modern-form-field .form-control:focus,
html[data-theme="dark"] .modern-form-field .form-select:focus,
html[data-theme="dark"] .modern-edit-form .form-control,
html[data-theme="dark"] .modern-edit-form .form-select,
html[data-theme="dark"] .modern-edit-form .form-control:focus,
html[data-theme="dark"] .modern-edit-form .form-select:focus,
html[data-theme="dark"] .modern-edit-form textarea.form-control {
  background-color: #111827 !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .modern-form-field label,
html[data-theme="dark"] .modern-edit-form .mb-3 > label,
html[data-theme="dark"] .student-info-cell .student-name,
html[data-theme="dark"] .person-name-wrap,
html[data-theme="dark"] .student-name-cell {
  color: #e2e8f0 !important;
}
html[data-theme="dark"] .modern-edit-subtitle {
  background: rgba(var(--school-primary-rgb), 0.22);
  color: #d1fae5;
}
html[data-theme="dark"] .form-section,
html[data-theme="dark"] .reg-doc-drop,
html[data-theme="dark"] .family-role-btn:hover {
  border-color: #334155;
}
html[data-theme="dark"] .family-role-btn:hover {
  background: #334155 !important;
  color: #e2e8f0 !important;
}

/* Frozen first and last table columns */
html[data-theme="dark"] .sticky-actions-table > thead > tr > th:first-child,
html[data-theme="dark"] .sticky-actions-table > thead > tr > th:last-child,
html[data-theme="dark"] .student-records-table > thead > tr > th:first-child,
html[data-theme="dark"] .student-records-table > thead > tr > th:last-child,
html[data-theme="dark"] .inv-table.sticky-actions-table > thead > tr > th:first-child,
html[data-theme="dark"] .inv-table.sticky-actions-table > thead > tr > th:last-child {
  background: var(--school-primary) !important;
  background-color: var(--school-primary) !important;
  color: #fff !important;
}
html[data-theme="dark"] .sticky-actions-table > tbody > tr > td:first-child,
html[data-theme="dark"] .sticky-actions-table > tbody > tr > td:last-child,
html[data-theme="dark"] .student-records-table > tbody > tr > td:first-child,
html[data-theme="dark"] .student-records-table > tbody > tr > td:last-child,
html[data-theme="dark"] .inv-table.sticky-actions-table > tbody > tr > td:first-child,
html[data-theme="dark"] .inv-table.sticky-actions-table > tbody > tr > td:last-child {
  background: #1e293b !important;
  background-color: #1e293b !important;
  color: #e2e8f0;
}
html[data-theme="dark"] .sticky-actions-table.table-hover > tbody > tr:hover > td:first-child,
html[data-theme="dark"] .sticky-actions-table.table-hover > tbody > tr:hover > td:last-child,
html[data-theme="dark"] .student-records-table.table-hover > tbody > tr:hover > td:first-child,
html[data-theme="dark"] .student-records-table.table-hover > tbody > tr:hover > td:last-child,
html[data-theme="dark"] .sticky-actions-table > tbody > tr:hover > td:first-child,
html[data-theme="dark"] .sticky-actions-table > tbody > tr:hover > td:last-child,
html[data-theme="dark"] .student-records-table > tbody > tr:hover > td:first-child,
html[data-theme="dark"] .student-records-table > tbody > tr:hover > td:last-child,
html[data-theme="dark"] .table tbody tr:hover,
html[data-theme="dark"] .table-hover tbody tr:hover > td:first-child,
html[data-theme="dark"] .table-hover tbody tr:hover > td:last-child {
  background: #334155 !important;
  background-color: #334155 !important;
  color: #f8fafc !important;
}

html[data-theme="dark"] .table,
html[data-theme="dark"] .table td,
html[data-theme="dark"] .table th {
  color: #e2e8f0;
  border-color: #334155;
}
html[data-theme="dark"] .table thead th,
html[data-theme="dark"] .table thead td {
  background: #111827;
  color: #f8fafc;
  border-color: #334155;
}
html[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd),
html[data-theme="dark"] .table-hover tbody tr:hover {
  background-color: rgba(255, 255, 255, 0.04);
  color: #e2e8f0;
}
html[data-theme="dark"] td:first-child {
  background-color: #1e293b;
  color: #e2e8f0;
}

html[data-theme="dark"] .page-titles .breadcrumb {
  background: #1e293b;
  color: #e2e8f0;
  box-shadow: none;
}
html[data-theme="dark"] .page-titles .breadcrumb-item,
html[data-theme="dark"] .page-titles .breadcrumb-item a { color: #94a3b8; }
html[data-theme="dark"] .page-titles .breadcrumb-item.active a { color: #f8fafc; }

html[data-theme="dark"] .header-find-panel,
html[data-theme="dark"] .dash-find-results,
html[data-theme="dark"] .dash-panel {
  background: #1e293b;
  color: #e2e8f0;
  border-color: #334155;
}
html[data-theme="dark"] .dash-find-box,
html[data-theme="dark"] .header-find-panel .dash-find-box input,
html[data-theme="dark"] .dash-home .dash-find-box input {
  background: #111827;
  color: #e2e8f0;
  border-color: #334155;
}
html[data-theme="dark"] .dash-find-hit {
  color: #e2e8f0;
  border-bottom-color: #334155;
}
html[data-theme="dark"] .dash-find-hit:hover,
html[data-theme="dark"] .dash-find-hit.is-active {
  background: #334155;
  color: #fff;
}
html[data-theme="dark"] .dash-find-icon,
html[data-theme="dark"] .dash-person-kind,
html[data-theme="dark"] .dash-person-photo { background: #334155; }
html[data-theme="dark"] .dash-find-hit small,
html[data-theme="dark"] .dash-find-empty,
html[data-theme="dark"] .dash-find-section { color: #94a3b8; }
html[data-theme="dark"] .dash-person-main { color: #e2e8f0; }
html[data-theme="dark"] .dash-inbox-row,
html[data-theme="dark"] .dash-quick-btn,
html[data-theme="dark"] .dash-person-link {
  background: #111827 !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .dash-inbox-row:hover,
html[data-theme="dark"] .dash-quick-btn:hover,
html[data-theme="dark"] .dash-person-link:hover,
html[data-theme="dark"] .dash-person-link.is-active {
  background: var(--school-primary, #187630) !important;
  color: #fff !important;
  border-color: var(--school-primary, #187630) !important;
}
html[data-theme="dark"] .dash-inbox-row.is-hot {
  background: rgba(var(--school-primary-rgb), 0.22) !important;
  color: #e2e8f0 !important;
}
html[data-theme="dark"] .dash-inbox-icon {
  background: #334155 !important;
  color: var(--school-primary-light, #4db865) !important;
}
html[data-theme="dark"] .dash-inbox-count { color: var(--school-primary-light, #4db865) !important; }
html[data-theme="dark"] .dash-inbox-row.is-hot .dash-inbox-count { color: #fdba74 !important; }
html[data-theme="dark"] .dash-quick-label,
html[data-theme="dark"] .dash-stat-list span,
html[data-theme="dark"] .dash-section-label { color: #94a3b8; }
html[data-theme="dark"] .dash-stat-list li { border-bottom-color: #334155; }
html[data-theme="dark"] .dash-stat-list strong { color: #f8fafc; }
html[data-theme="dark"] .dash-census-wrap,
html[data-theme="dark"] .dash-census-table tr.is-total td {
  background: #111827 !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .dash-census-table,
html[data-theme="dark"] .dash-census-table .is-class { color: #e2e8f0; }
html[data-theme="dark"] .dash-census-table thead th {
  background: #1e293b !important;
  color: #94a3b8 !important;
  border-color: #334155;
}
html[data-theme="dark"] .dash-census-table tbody tr:hover td { background: #334155 !important; }

/* Help manuals inject their own light stylesheet after this file. */
html[data-theme="dark"] .sc-help-toolbar,
html[data-theme="dark"] .sc-help-toc,
html[data-theme="dark"] .sc-help-howto,
html[data-theme="dark"] .sc-help-feature,
html[data-theme="dark"] .sc-help-explain,
html[data-theme="dark"] .sc-help-tab {
  background: #111827 !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .sc-help-tab { border-left-color: #f87171 !important; }
html[data-theme="dark"] .sc-help-howto,
html[data-theme="dark"] .sc-help-feature,
html[data-theme="dark"] .sc-help-explain { border-left-color: #60a5fa !important; }
html[data-theme="dark"] .sc-help-sub,
html[data-theme="dark"] .sc-help-body,
html[data-theme="dark"] .sc-help-intro,
html[data-theme="dark"] .sc-help-steps li,
html[data-theme="dark"] .sc-help-notes li,
html[data-theme="dark"] .sc-help-bullet,
html[data-theme="dark"] .sc-help-facts dd,
html[data-theme="dark"] .sc-help-menu { color: #e2e8f0 !important; }
html[data-theme="dark"] .sc-help-toc h5,
html[data-theme="dark"] .sc-help-toc a,
html[data-theme="dark"] .sc-help-howto h3,
html[data-theme="dark"] .sc-help-feature h4,
html[data-theme="dark"] .sc-help-explain h4,
html[data-theme="dark"] .sc-help-label,
html[data-theme="dark"] .sc-help-facts dt { color: #93c5fd !important; }
html[data-theme="dark"] .sc-help-tab h4,
html[data-theme="dark"] .sc-help-label.notes { color: #fca5a5 !important; }
html[data-theme="dark"] .sc-help-benefit { color: #86efac !important; }
html[data-theme="dark"] .sc-help-tip {
  background: #3f2e12 !important;
  border-color: #854d0e !important;
  color: #fde68a !important;
}
html[data-theme="dark"] .sc-help-tip strong { color: #fde68a !important; }
html[data-theme="dark"] .sc-help-warn {
  background: #3f1d1d !important;
  border-color: #7f1d1d !important;
  color: #fecaca !important;
}
html[data-theme="dark"] .sc-help-warn strong { color: #fecaca !important; }
html[data-theme="dark"] .sc-help-footer { color: #94a3b8 !important; border-top-color: #334155 !important; }

html[data-theme="dark"] .note-editor.note-frame,
html[data-theme="dark"] .note-toolbar,
html[data-theme="dark"] .note-editing-area,
html[data-theme="dark"] .note-editable,
html[data-theme="dark"] .note-statusbar {
  background: #111827;
  color: #e2e8f0;
  border-color: #334155;
}
html[data-theme="dark"] .note-btn {
  background: #1e293b;
  color: #e2e8f0;
  border-color: #334155;
}

html[data-theme="dark"] .nice-select,
html[data-theme="dark"] .nice-select .list,
html[data-theme="dark"] .select2-container--default .select2-selection--single,
html[data-theme="dark"] .select2-container--default .select2-selection--multiple,
html[data-theme="dark"] .select2-dropdown,
html[data-theme="dark"] .select2-search__field {
  background-color: #111827 !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .nice-select .option:hover,
html[data-theme="dark"] .nice-select .option.focus,
html[data-theme="dark"] .select2-results__option--highlighted {
  background: #334155 !important;
  color: #fff !important;
}

html[data-theme="dark"] .swal-modal,
html[data-theme="dark"] .swal2-popup {
  background: #1e293b;
  color: #e2e8f0;
}
html[data-theme="dark"] .swal-title,
html[data-theme="dark"] .swal-text,
html[data-theme="dark"] .swal2-title,
html[data-theme="dark"] .swal2-html-container { color: #e2e8f0; }

html[data-theme="dark"] .nav-pills .nav-link,
html[data-theme="dark"] .nav-tabs .nav-link { color: #cbd5e1; }
html[data-theme="dark"] .nav-tabs { border-color: #334155; }
html[data-theme="dark"] .nav-tabs .nav-link.active {
  background: #1e293b;
  color: #fff;
  border-color: #334155 #334155 #1e293b;
}

html[data-theme="dark"] .alert-light,
html[data-theme="dark"] .alert-secondary {
  background: #1e293b;
  color: #e2e8f0;
  border-color: #334155;
}

html[data-theme="dark"] .dataTables_wrapper,
html[data-theme="dark"] .dataTables_info,
html[data-theme="dark"] .dataTables_length,
html[data-theme="dark"] .dataTables_filter { color: #e2e8f0; }
html[data-theme="dark"] .paginate_button {
  color: #e2e8f0 !important;
}

/* Homepage */
html[data-theme="dark"] .navbar.scrolled {
  background: rgba(11, 18, 32, 0.96);
  box-shadow: 0 2px 30px rgba(0, 0, 0, 0.35);
}
html[data-theme="dark"] .navbar.scrolled .nav-brand-text,
html[data-theme="dark"] .navbar.scrolled .nav-links a { color: #e2e8f0; }
html[data-theme="dark"] .navbar.scrolled .nav-links a:hover {
  background: var(--school-primary, #187630);
  color: #fff;
}
html[data-theme="dark"] .nav-dropdown-menu {
  background: #1e293b;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.4);
}
html[data-theme="dark"] .nav-dropdown-menu a { color: #e2e8f0 !important; }
html[data-theme="dark"] .ranking-section,
html[data-theme="dark"] .contact-section { background: #0f172a; }
html[data-theme="dark"] .section-heading,
html[data-theme="dark"] .teacher-card-v2 h4,
html[data-theme="dark"] .contact-card h4,
html[data-theme="dark"] .student-rank-card h3,
html[data-theme="dark"] .student-rank-card h4 { color: #f8fafc; }
html[data-theme="dark"] .section-desc,
html[data-theme="dark"] .about-text,
html[data-theme="dark"] .contact-card p,
html[data-theme="dark"] .teacher-card-v2 .teacher-role,
html[data-theme="dark"] .no-data-message { color: #94a3b8; }
html[data-theme="dark"] .student-rank-card,
html[data-theme="dark"] .teacher-card-v2,
html[data-theme="dark"] .contact-form,
html[data-theme="dark"] .scroll-btn {
  background: #1e293b;
  color: #e2e8f0;
  box-shadow: none;
}
html[data-theme="dark"] .contact-form input,
html[data-theme="dark"] .contact-form textarea {
  background: #111827;
  color: #e2e8f0;
  border-color: #334155;
}

/* Inline styles and late page stylesheets beat a normal theme rule.
   These overrides cover the light surfaces that are written directly on elements. */
html[data-theme="dark"] .search-bar,
html[data-theme="dark"] .chat-messages,
html[data-theme="dark"] .friends-list-container,
html[data-theme="dark"] .profile-dropdown-body,
html[data-theme="dark"] .copyright.footer,
html[data-theme="dark"] .input-group-text,
html[data-theme="dark"] .note-editor .note-editable,
html[data-theme="dark"] .note-editor .note-statusbar,
html[data-theme="dark"] .note-editor.note-frame.fullscreen,
html[data-theme="dark"] .note-editor.note-airframe.fullscreen,
html[data-theme="dark"] .feed-search-bar {
  background: var(--inline-sunken) !important;
  background-color: var(--inline-sunken) !important;
  color: var(--inline-text) !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .message.received {
  background-color: #1e3a4c !important;
  color: var(--inline-text) !important;
}
html[data-theme="dark"] .profile-info-item:hover { background: #3d8f4e !important; }
html[data-theme="dark"] #gbComponentCard input:disabled,
html[data-theme="dark"] #gbScoreCard input:disabled,
html[data-theme="dark"] #gbdComponentCard input:disabled,
html[data-theme="dark"] #gbdScoreCard input:disabled {
  background-color: var(--inline-sunken) !important;
  color: #94a3b8 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .test-cell.selected { background-color: #14532d !important; color: #ecfdf5 !important; }
html[data-theme="dark"] .test-cell.swap-target,
html[data-theme="dark"] .schedule-cell.locked { background-color: var(--inline-highlight) !important; color: #fde68a !important; }
html[data-theme="dark"] .test-slot-empty { background-color: var(--inline-sunken) !important; }

html[data-theme="dark"] [style*="background: white"],
html[data-theme="dark"] [style*="background:white"],
html[data-theme="dark"] [style*="background: #fff"],
html[data-theme="dark"] [style*="background:#fff"],
html[data-theme="dark"] [style*="background: #ffffff"],
html[data-theme="dark"] [style*="background:#ffffff"],
html[data-theme="dark"] [style*="background-color: white"],
html[data-theme="dark"] [style*="background-color:white"],
html[data-theme="dark"] [style*="background-color: #fff"],
html[data-theme="dark"] [style*="background-color:#fff"],
html[data-theme="dark"] [style*="background-color: whitesmoke"],
html[data-theme="dark"] [style*="background-color:whitesmoke"],
html[data-theme="dark"] [style*="background:#f8f9fa"],
html[data-theme="dark"] [style*="background: #f8f9fa"],
html[data-theme="dark"] [style*="background:#f5f6fa"],
html[data-theme="dark"] [style*="background: #f5f6fa"],
html[data-theme="dark"] [style*="background:#f5f5f5"],
html[data-theme="dark"] [style*="background:#f0f4ff"],
html[data-theme="dark"] [style*="background: #f0f4ff"],
html[data-theme="dark"] [style*="background:#f8f9ff"],
html[data-theme="dark"] [style*="background: #f8f9ff"],
html[data-theme="dark"] [style*="background:#f0f0f0"],
html[data-theme="dark"] [style*="background:#f8fafc"],
html[data-theme="dark"] [style*="background: #f8fafc"],
html[data-theme="dark"] [style*="background:#f9f9f9"],
html[data-theme="dark"] [style*="background: #f9f9f9"],
html[data-theme="dark"] [style*="background:#fafbfc"],
html[data-theme="dark"] [style*="background: #fafbfc"],
html[data-theme="dark"] [style*="background:#fafafa"],
html[data-theme="dark"] [style*="background: #fafafa"],
html[data-theme="dark"] [style*="background:#f8f9fb"],
html[data-theme="dark"] [style*="background: #f8f9fb"],
html[data-theme="dark"] [style*="background:#f0f3f7"],
html[data-theme="dark"] [style*="background: #f0f3f7"],
html[data-theme="dark"] [style*="background-color:#f8f9fa"],
html[data-theme="dark"] [style*="background-color: #f8f9fa"] {
  background: var(--inline-surface) !important;
  background-color: var(--inline-surface) !important;
  color: var(--inline-text);
}
html[data-theme="dark"] [style*="background:#fff3cd"],
html[data-theme="dark"] [style*="background: #fff3cd"],
html[data-theme="dark"] [style*="background:#fffbeb"],
html[data-theme="dark"] [style*="background: #fffbeb"],
html[data-theme="dark"] [style*="background:#fffbf0"],
html[data-theme="dark"] [style*="background: #fffbf0"] {
  background: var(--inline-highlight) !important;
  background-color: var(--inline-highlight) !important;
  color: #fde68a !important;
}
html[data-theme="dark"] [style*="color:black"],
html[data-theme="dark"] [style*="color: black"],
html[data-theme="dark"] [style*="color:#000"],
html[data-theme="dark"] [style*="color: #000"],
html[data-theme="dark"] [style*="color:#333"],
html[data-theme="dark"] [style*="color: #333"],
html[data-theme="dark"] [style*="color:#1a1a2e"],
html[data-theme="dark"] [style*="color: #1a1a2e"],
html[data-theme="dark"] [style*="color:#212529"],
html[data-theme="dark"] [style*="color: #212529"] {
  color: var(--inline-text) !important;
}

/* Learning and marketplace pages inject these light panels after the theme file. */
html[data-theme="dark"] .lrn-card,
html[data-theme="dark"] .upcoming,
html[data-theme="dark"] .lc-pane,
html[data-theme="dark"] .lc-tabs button:not(.active),
html[data-theme="dark"] .mat-item,
html[data-theme="dark"] .asn-item,
html[data-theme="dark"] .qz-item,
html[data-theme="dark"] .lms-kpi .kpi-card,
html[data-theme="dark"] .lms-detail,
html[data-theme="dark"] .lms-detail-tabs,
html[data-theme="dark"] .detail-grid .ds,
html[data-theme="dark"] .item-card,
html[data-theme="dark"] .empty-state,
html[data-theme="dark"] .lms-stat,
html[data-theme="dark"] .lms-toolbar,
html[data-theme="dark"] .course-card,
html[data-theme="dark"] .course-card .footer,
html[data-theme="dark"] .lms-modal,
html[data-theme="dark"] .lms-modal-footer,
html[data-theme="dark"] .lms-tabs,
html[data-theme="dark"] .lms-card,
html[data-theme="dark"] .item-row,
html[data-theme="dark"] .lms-drawer,
html[data-theme="dark"] .lms-drawer-footer,
html[data-theme="dark"] .question-card,
html[data-theme="dark"] .disc-post,
html[data-theme="dark"] .disc-thread-head,
html[data-theme="dark"] .cl-card,
html[data-theme="dark"] #MPane,
html[data-theme="dark"] #TPane,
html[data-theme="dark"] #MBody,
html[data-theme="dark"] #TBody,
html[data-theme="dark"] #ThreadPane,
html[data-theme="dark"] .mkt-card,
html[data-theme="dark"] .mkt-stat,
html[data-theme="dark"] .mkt-toolbar,
html[data-theme="dark"] .mkt-modal,
html[data-theme="dark"] .mkt-modal-footer,
html[data-theme="dark"] .shop-toolbar,
html[data-theme="dark"] .product-card,
html[data-theme="dark"] .product-card .thumb,
html[data-theme="dark"] .cart-drawer,
html[data-theme="dark"] .cart-footer,
html[data-theme="dark"] .cart-line .qty-ctrl,
html[data-theme="dark"] .shop-tabs button:not(.active),
html[data-theme="dark"] .order-tile,
html[data-theme="dark"] .order-card,
html[data-theme="dark"] .order-drawer,
html[data-theme="dark"] .order-drawer-footer,
html[data-theme="dark"] .auto-refresh-box,
html[data-theme="dark"] .mkto-modal,
html[data-theme="dark"] .mkto-p,
html[data-theme="dark"] .mkto-foot,
html[data-theme="dark"] .drawer-buyer,
html[data-theme="dark"] .img-preview {
  background: #1e293b !important;
  background-image: none !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .product-card .thumb,
html[data-theme="dark"] .cart-line .qty-ctrl,
html[data-theme="dark"] .question-card,
html[data-theme="dark"] .mkt-stat,
html[data-theme="dark"] .mkt-toolbar,
html[data-theme="dark"] .course-card .footer,
html[data-theme="dark"] .item-row,
html[data-theme="dark"] .mat-item,
html[data-theme="dark"] .asn-item,
html[data-theme="dark"] .qz-item,
html[data-theme="dark"] .mkto-p,
html[data-theme="dark"] .img-preview {
  background: #111827 !important;
}
html[data-theme="dark"] .cart-line .qty-ctrl button {
  background: #334155 !important;
  color: #e2e8f0 !important;
}
html[data-theme="dark"] .lrn-card .title,
html[data-theme="dark"] .product-card .name,
html[data-theme="dark"] .product-card .body .name,
html[data-theme="dark"] .mkt-stat .val,
html[data-theme="dark"] .lms-stat .val,
html[data-theme="dark"] .lms-kpi .kpi-value,
html[data-theme="dark"] .course-card .title,
html[data-theme="dark"] .item-row .title,
html[data-theme="dark"] .item-card .ic-title,
html[data-theme="dark"] .detail-grid .ds .val,
html[data-theme="dark"] .order-tile .order-id,
html[data-theme="dark"] .order-card .order-id,
html[data-theme="dark"] .cart-line .name,
html[data-theme="dark"] .mat-item .t,
html[data-theme="dark"] .asn-item .t,
html[data-theme="dark"] .question-card .qt,
html[data-theme="dark"] .disc-thread-title,
html[data-theme="dark"] .disc-post-head strong,
html[data-theme="dark"] .drawer-buyer .name,
html[data-theme="dark"] .drawer-line-item .name,
html[data-theme="dark"] .mkto-p .name {
  color: #f8fafc !important;
}
html[data-theme="dark"] .lrn-card .meta,
html[data-theme="dark"] .product-card .desc,
html[data-theme="dark"] .product-card .body .stock,
html[data-theme="dark"] .mkt-stat .lbl,
html[data-theme="dark"] .lms-stat .lbl,
html[data-theme="dark"] .course-card .meta,
html[data-theme="dark"] .item-row .meta,
html[data-theme="dark"] .order-tile .meta,
html[data-theme="dark"] .cart-summary {
  color: #94a3b8 !important;
}
html[data-theme="dark"] .product-card .price,
html[data-theme="dark"] .product-card .body .price,
html[data-theme="dark"] .order-tile .amount,
html[data-theme="dark"] .order-card .amt,
html[data-theme="dark"] .cart-summary .total {
  color: var(--school-primary-light, #4db865) !important;
}
html[data-theme="dark"] #ProgressFill {
  background: #fff !important;
  background-color: #fff !important;
}

/* Promotion ladder on the classes page. */
html[data-theme="dark"] .promo-ladder-workspace,
html[data-theme="dark"] .promo-pool,
html[data-theme="dark"] .promo-step,
html[data-theme="dark"] .promo-pool-head,
html[data-theme="dark"] .promo-save-bar,
html[data-theme="dark"] .promo-chip,
html[data-theme="dark"] .promo-step-label:focus {
  background: #1e293b !important;
  background-color: #1e293b !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .promo-chip,
html[data-theme="dark"] .promo-chip-id,
html[data-theme="dark"] .promo-step-label:focus {
  background: #111827 !important;
  background-color: #111827 !important;
}
html[data-theme="dark"] .promo-chip-name,
html[data-theme="dark"] .promo-step-label,
html[data-theme="dark"] .promo-pool-head h6,
html[data-theme="dark"] .promo-step-head h6 {
  color: #f8fafc !important;
}
html[data-theme="dark"] .promo-chip-id {
  color: #e2e8f0 !important;
  border-color: #334155;
}
html[data-theme="dark"] .promo-pool-hint,
html[data-theme="dark"] .promo-step-foot,
html[data-theme="dark"] .promo-hint,
html[data-theme="dark"] .promo-empty { color: #94a3b8 !important; }
html[data-theme="dark"] .promo-step-num {
  background: rgba(var(--school-primary-rgb), 0.28);
  color: #bbf7d0;
}
html[data-theme="dark"] .promo-step-actions .btn-light {
  background: #334155 !important;
  border-color: #475569 !important;
  color: #e2e8f0;
}
html[data-theme="dark"] .promo-band-elementary { background: #14532d !important; color: #bbf7d0 !important; }
html[data-theme="dark"] .promo-band-junior-high { background: #1e3a5f !important; color: #bfdbfe !important; }
html[data-theme="dark"] .promo-band-senior-high { background: #3f2e12 !important; color: #fdba74 !important; }
html[data-theme="dark"] .promo-pool-body.is-over,
html[data-theme="dark"] .promo-step-drop.is-over {
  background: rgba(var(--school-primary-rgb), 0.18) !important;
}

/* Schedule page tabs, teacher hours, and timetable cells. */
html[data-theme="dark"] .default-tab .nav-link,
html[data-theme="dark"] .nav-tabs .nav-link {
  background: transparent !important;
  color: #cbd5e1 !important;
}
html[data-theme="dark"] .default-tab .nav-link.active,
html[data-theme="dark"] .default-tab .nav-link:hover,
html[data-theme="dark"] .nav-tabs .nav-link.active,
html[data-theme="dark"] .nav-tabs .nav-item.show .nav-link {
  background: #1e293b !important;
  color: #f8fafc !important;
  border-color: #334155 #334155 #1e293b !important;
}
html[data-theme="dark"] .avail-hero,
html[data-theme="dark"] .avail-stat,
html[data-theme="dark"] .avail-list-card,
html[data-theme="dark"] .avail-editor-card,
html[data-theme="dark"] .avail-filter:not(.active),
html[data-theme="dark"] .avail-teacher-item,
html[data-theme="dark"] .avail-type-card,
html[data-theme="dark"] .avail-day,
html[data-theme="dark"] .avail-search input,
html[data-theme="dark"] .avail-search input:focus,
html[data-theme="dark"] .avail-window input[type="time"],
html[data-theme="dark"] .swap-instructions,
html[data-theme="dark"] .card.bg-light,
html[data-theme="dark"] .pe-rule-card,
html[data-theme="dark"] .pe-conflict-option {
  background: #1e293b !important;
  background-image: none !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .avail-teacher-item,
html[data-theme="dark"] .avail-type-card,
html[data-theme="dark"] .avail-day,
html[data-theme="dark"] .avail-search input,
html[data-theme="dark"] .avail-stat {
  background: #111827 !important;
}
html[data-theme="dark"] .avail-filter.active {
  background: var(--school-primary, #187630) !important;
  color: #fff !important;
  border-color: var(--school-primary, #187630) !important;
}
html[data-theme="dark"] .avail-hero h4,
html[data-theme="dark"] .avail-type-card strong,
html[data-theme="dark"] .avail-day-head strong,
html[data-theme="dark"] .avail-stat span {
  color: #f8fafc !important;
}
html[data-theme="dark"] .avail-hero-copy,
html[data-theme="dark"] .avail-type-card em,
html[data-theme="dark"] .avail-stat small,
html[data-theme="dark"] .schedule-teacher,
html[data-theme="dark"] .schedule-room { color: #94a3b8 !important; }
html[data-theme="dark"] .avail-fulltime-note {
  background: #14532d !important;
  color: #bbf7d0 !important;
}
html[data-theme="dark"] .schedule-cell.free-period,
html[data-theme="dark"] .schedule-cell.selected {
  background: #14532d !important;
  background-image: none !important;
  color: #bbf7d0 !important;
}
html[data-theme="dark"] .schedule-cell.free-period .schedule-subject,
html[data-theme="dark"] .schedule-cell.selected .schedule-subject { color: #bbf7d0 !important; }
html[data-theme="dark"] .schedule-cell.occupied-period {
  background: #3f1d1d !important;
  background-image: none !important;
  color: #fecaca !important;
}
html[data-theme="dark"] .schedule-cell.occupied-period .schedule-subject { color: #fecaca !important; }
html[data-theme="dark"] .schedule-cell.recess {
  background: #3f2e12 !important;
  background-image: none !important;
  color: #fdba74 !important;
}
html[data-theme="dark"] .schedule-cell.swap-target,
html[data-theme="dark"] .priority-high {
  background: #3f2e12 !important;
  background-color: #3f2e12 !important;
  color: #fde68a !important;
}
html[data-theme="dark"] .table {
  --bs-table-bg: #1e293b;
  --bs-table-color: #e2e8f0;
  --bs-table-border-color: #334155;
  --bs-table-hover-bg: #334155;
  --bs-table-hover-color: #f8fafc;
}

/* Student Places */
html[data-theme="dark"] .places-card,
html[data-theme="dark"] .places-toolbar,
html[data-theme="dark"] .summary-strip,
html[data-theme="dark"] .places-table thead th,
html[data-theme="dark"] .places-table tbody td,
html[data-theme="dark"] .rank-pill:not(.gold):not(.silver):not(.bronze),
html[data-theme="dark"] .student-cell .avatar {
  background: #1e293b !important;
  background-image: none !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .places-toolbar,
html[data-theme="dark"] .summary-strip,
html[data-theme="dark"] .places-table thead th,
html[data-theme="dark"] .rank-pill:not(.gold):not(.silver):not(.bronze),
html[data-theme="dark"] .student-cell .avatar {
  background: #111827 !important;
}
html[data-theme="dark"] .places-table tbody tr:hover td {
  background: #334155 !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] .places-table tbody td,
html[data-theme="dark"] .summary-strip .item .value { color: #f8fafc !important; }
html[data-theme="dark"] .places-table thead th,
html[data-theme="dark"] .places-toolbar label,
html[data-theme="dark"] .summary-strip .item .label,
html[data-theme="dark"] .empty-state { color: #94a3b8 !important; }
html[data-theme="dark"] .rank-pill.silver {
  background: #334155 !important;
  background-image: none !important;
  color: #e2e8f0 !important;
}

/* ID cards and certificates share the template manager. */
html[data-theme="dark"] .tm-wrap {
  --tm-border: #334155;
  --tm-soft: #334155;
  --tm-primary: #e2e8f0;
}
html[data-theme="dark"] .tm-card,
html[data-theme="dark"] .tm-tabs .tm-tab:not(.active),
html[data-theme="dark"] .tm-btn-outline,
html[data-theme="dark"] .tm-side,
html[data-theme="dark"] .tm-side .tm-side-fields button,
html[data-theme="dark"] .tm-item,
html[data-theme="dark"] .tm-photo-card,
html[data-theme="dark"] .tm-tpl,
html[data-theme="dark"] .tm-canvas-wrap,
html[data-theme="dark"] .tm-item:not(.selected) .tm-item-check,
html[data-theme="dark"] .tm-photo-card:not(.selected) .tm-photo-check,
html[data-theme="dark"] .tm-kbd-hint,
html[data-theme="dark"] .tm-kbd-hint kbd,
html[data-theme="dark"] .tm-side-props-section,
html[data-theme="dark"] .tm-toolbar select,
html[data-theme="dark"] .tm-toolbar input,
html[data-theme="dark"] .tm-side input,
html[data-theme="dark"] .tm-side select {
  background: #1e293b !important;
  background-image: none !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .tm-tabs .tm-tab:not(.active),
html[data-theme="dark"] .tm-btn-outline,
html[data-theme="dark"] .tm-tpl,
html[data-theme="dark"] .tm-canvas-wrap,
html[data-theme="dark"] .tm-side .tm-side-fields button,
html[data-theme="dark"] .tm-item:not(.selected) .tm-item-check,
html[data-theme="dark"] .tm-photo-card:not(.selected) .tm-photo-check,
html[data-theme="dark"] .tm-kbd-hint kbd,
html[data-theme="dark"] .tm-toolbar select,
html[data-theme="dark"] .tm-toolbar input,
html[data-theme="dark"] .tm-side input,
html[data-theme="dark"] .tm-side select {
  background: #111827 !important;
}
html[data-theme="dark"] .tm-tabs .tm-tab:not(.active):hover,
html[data-theme="dark"] .tm-side .tm-side-fields button:hover,
html[data-theme="dark"] .tm-subtabs .nav-link:not(.active):hover {
  background: #334155 !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] .tm-card h5,
html[data-theme="dark"] .tm-tpl .tm-tpl-name,
html[data-theme="dark"] .tm-photo-card .tm-photo-name,
html[data-theme="dark"] .tm-side h6,
html[data-theme="dark"] .tm-side-toggle,
html[data-theme="dark"] .tm-subtabs .nav-link:not(.active) { color: #f8fafc !important; }
html[data-theme="dark"] .tm-tpl .tm-tpl-meta,
html[data-theme="dark"] .tm-photo-card .tm-photo-meta,
html[data-theme="dark"] .tm-side label,
html[data-theme="dark"] .tm-empty { color: #94a3b8 !important; }
html[data-theme="dark"] .tm-source-badges .badge {
  background: #1e3a5f !important;
  color: #bfdbfe !important;
  border-color: #334155 !important;
}

/* Student teachers page and student profile. */
html[data-theme="dark"] .teachers-tabs .nav-tabs,
html[data-theme="dark"] .teachers-tabs .tab-content,
html[data-theme="dark"] .teacher-rating-card,
html[data-theme="dark"] .btn-rate-teacher.btn-view-ratings,
html[data-theme="dark"] .student-full-details .details-section,
html[data-theme="dark"] .tr-review,
html[data-theme="dark"] .swal-modal.teacher-dialog,
html[data-theme="dark"] .tr-comment {
  background: #1e293b !important;
  background-image: none !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .teachers-tabs .nav-tabs,
html[data-theme="dark"] .btn-rate-teacher.btn-view-ratings,
html[data-theme="dark"] .tr-review,
html[data-theme="dark"] .tr-comment {
  background: #111827 !important;
}
html[data-theme="dark"] .teachers-tabs .nav-tabs .nav-link.active {
  background: #1e293b !important;
  color: var(--school-primary-light, #4db865) !important;
  box-shadow: inset 0 -3px 0 var(--school-primary, #187630) !important;
}
html[data-theme="dark"] .teachers-tabs .nav-tabs .nav-link:not(.active) { color: #94a3b8 !important; }
html[data-theme="dark"] .teacher-card-name,
html[data-theme="dark"] .teachers-section-title h4,
html[data-theme="dark"] .student-full-details .detail-value,
html[data-theme="dark"] .tr-review-comment,
html[data-theme="dark"] .tr-rate-label { color: #f8fafc !important; }
html[data-theme="dark"] .teacher-star-label,
html[data-theme="dark"] .student-full-details .detail-label,
html[data-theme="dark"] .tr-review-metric,
html[data-theme="dark"] .tr-empty { color: #94a3b8 !important; }
html[data-theme="dark"] .student-full-details .details-section-title,
html[data-theme="dark"] .teacher-star-row.total-row .teacher-star-label {
  color: var(--school-primary-light, #4db865) !important;
}
html[data-theme="dark"] .student-full-details .details-section-title {
  background: rgba(var(--school-primary-rgb), 0.22) !important;
  border-bottom-color: #334155 !important;
}
html[data-theme="dark"] .teacher-star-row,
html[data-theme="dark"] .student-full-details .detail-row,
html[data-theme="dark"] .tr-rate-row { border-color: #334155 !important; }
html[data-theme="dark"] .teacher-rating-card .teacher-card-photo::after {
  background: linear-gradient(to top, #1e293b 0%, transparent 100%) !important;
}
html[data-theme="dark"] .btn-rate-teacher.btn-view-ratings:hover {
  background: #334155 !important;
  color: #f8fafc !important;
}

/* Change-of-grade cards on the staff form tab and the admin Change of grades tab. */
html[data-theme="dark"] .grade-badge,
html[data-theme="dark"] .academic-details,
html[data-theme="dark"] .request-card-footer,
html[data-theme="dark"] .request-card-footer-dual,
html[data-theme="dark"] .pending-grade-footer,
html[data-theme="dark"] .approved-grade-footer,
html[data-theme="dark"] .declined-grade-footer,
html[data-theme="dark"] .pending-grade-actions {
  background: #111827 !important;
  background-image: none !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .grade-badge.old-grade { border-color: #334155 !important; }
html[data-theme="dark"] .grade-badge.new-grade {
  background: rgba(var(--school-primary-rgb), 0.22) !important;
  border-color: var(--school-primary, #187630) !important;
}
html[data-theme="dark"] .grade-change-section {
  background: rgba(var(--school-primary-rgb), 0.14) !important;
  border-color: rgba(var(--school-primary-rgb), 0.35) !important;
}
html[data-theme="dark"] .grade-label,
html[data-theme="dark"] .detail-item label,
html[data-theme="dark"] .person-details small,
html[data-theme="dark"] .request-card-footer small,
html[data-theme="dark"] .date-item small,
html[data-theme="dark"] .date-info small { color: #94a3b8 !important; }
html[data-theme="dark"] .grade-value { color: var(--school-primary-light, #4db865) !important; }
html[data-theme="dark"] .person-details h6,
html[data-theme="dark"] .detail-item span,
html[data-theme="dark"] .reason-section p,
html[data-theme="dark"] .request-card-footer span,
html[data-theme="dark"] .date-item span,
html[data-theme="dark"] .date-info span { color: #f8fafc !important; }
html[data-theme="dark"] .info-section,
html[data-theme="dark"] .request-card-footer,
html[data-theme="dark"] .request-card-footer-dual,
html[data-theme="dark"] .pending-grade-footer,
html[data-theme="dark"] .approved-grade-footer,
html[data-theme="dark"] .declined-grade-footer,
html[data-theme="dark"] .pending-grade-actions { border-color: #334155 !important; }
html[data-theme="dark"] .decline-reason-section {
  background: #3f1d1d !important;
  border-left-color: #ef4444 !important;
}
html[data-theme="dark"] .decline-reason-section label { color: #fecaca !important; }
html[data-theme="dark"] .decline-reason-section p { color: #fecaca !important; }
html[data-theme="dark"] .btn-decline {
  background: #334155 !important;
  color: #e2e8f0 !important;
}
html[data-theme="dark"] .btn-decline:hover {
  background: #475569 !important;
  color: #fff !important;
}

html[data-theme="dark"] .create-post-card,
html[data-theme="dark"] .feed-post,
html[data-theme="dark"] .feed-post-dropdown,
html[data-theme="dark"] .edit-post-dialog,
html[data-theme="dark"] .load-more-btn {
  background: #1e293b !important;
  background-image: none !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .create-post-input,
html[data-theme="dark"] .attachment-btn,
html[data-theme="dark"] .comment-bubble,
html[data-theme="dark"] .add-comment-input,
html[data-theme="dark"] .edit-post-close,
html[data-theme="dark"] .feed-search-bar {
  background: #111827 !important;
  background-image: none !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .create-post-input:hover,
html[data-theme="dark"] .attachment-btn:hover,
html[data-theme="dark"] .feed-post-menu-btn:hover,
html[data-theme="dark"] .feed-post-dropdown button:hover,
html[data-theme="dark"] .feed-post-action-btn:hover,
html[data-theme="dark"] .load-more-btn:hover,
html[data-theme="dark"] .edit-post-close:hover {
  background: #334155 !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] .feed-post-info h4,
html[data-theme="dark"] .feed-post-content,
html[data-theme="dark"] .comment-author,
html[data-theme="dark"] .comment-text,
html[data-theme="dark"] .create-post-textarea,
html[data-theme="dark"] .edit-post-textarea,
html[data-theme="dark"] .edit-post-header h3,
html[data-theme="dark"] .no-posts-message h4,
html[data-theme="dark"] .feed-post-dropdown button,
html[data-theme="dark"] .feed-post-menu-btn,
html[data-theme="dark"] .feed-search-bar input {
  color: #f8fafc !important;
}
html[data-theme="dark"] .feed-search-bar input {
  background: transparent !important;
}
html[data-theme="dark"] .feed-post-time,
html[data-theme="dark"] .feed-post-stats,
html[data-theme="dark"] .feed-post-edited,
html[data-theme="dark"] .feed-post-action-btn,
html[data-theme="dark"] .comment-meta,
html[data-theme="dark"] .feed-loading,
html[data-theme="dark"] .no-posts-message,
html[data-theme="dark"] .no-posts-message i,
html[data-theme="dark"] .feed-search-bar i,
html[data-theme="dark"] .feed-search-bar button,
html[data-theme="dark"] .feed-search-bar input::placeholder,
html[data-theme="dark"] .create-post-textarea::placeholder,
html[data-theme="dark"] .add-comment-input::placeholder,
html[data-theme="dark"] .edit-post-textarea::placeholder {
  color: #94a3b8 !important;
}
html[data-theme="dark"] .feed-post-action-btn.liked,
html[data-theme="dark"] .load-more-btn,
html[data-theme="dark"] .load-more-comments-btn,
html[data-theme="dark"] .attachment-btn i,
html[data-theme="dark"] .add-comment-submit {
  color: var(--school-primary-light, #4db865) !important;
}
html[data-theme="dark"] .feed-post-dropdown button.delete-action,
html[data-theme="dark"] .comment-delete-btn { color: #fca5a5 !important; }
html[data-theme="dark"] .create-post-form,
html[data-theme="dark"] .create-post-actions,
html[data-theme="dark"] .feed-post-actions,
html[data-theme="dark"] .feed-post-comments,
html[data-theme="dark"] .edit-post-header,
html[data-theme="dark"] .edit-post-footer { border-color: #334155 !important; }

html[data-theme="dark"] .ps-stat {
  background: #111827 !important;
  background-image: none !important;
  color: #e2e8f0 !important;
  border-color: #334155 !important;
}
html[data-theme="dark"] .ps-stat h3 { color: #f8fafc !important; }
html[data-theme="dark"] .ps-stat span { color: #94a3b8 !important; }
html[data-theme="dark"] .ps-badge {
  background: #1e3a5f !important;
  color: #bfdbfe !important;
}

@media print {
  html[data-theme="dark"] {
    --inline-surface: #fff;
    --inline-sunken: #fff;
    --inline-text: #111;
    --inline-highlight: #fff3cd;
  }
  html[data-theme="dark"],
  html[data-theme="dark"] body,
  html[data-theme="dark"] .content-body,
  html[data-theme="dark"] .content-wrapper,
  html[data-theme="dark"] .card,
  html[data-theme="dark"] .table,
  html[data-theme="dark"] .table td,
  html[data-theme="dark"] .table th,
  html[data-theme="dark"] td:first-child,
  html[data-theme="dark"] .sticky-actions-table > tbody > tr > td:first-child,
  html[data-theme="dark"] .sticky-actions-table > tbody > tr > td:last-child,
  html[data-theme="dark"] .student-records-table > tbody > tr > td:first-child,
  html[data-theme="dark"] .student-records-table > tbody > tr > td:last-child,
  html[data-theme="dark"] .modern-registration-body,
  html[data-theme="dark"] .modern-form-field .form-control,
  html[data-theme="dark"] .modern-edit-form .form-control,
  html[data-theme="dark"] .photo-preview-container,
  html[data-theme="dark"] .reg-doc-card,
  html[data-theme="dark"] .reg-doc-drop,
  html[data-theme="dark"] .dash-inbox-row,
  html[data-theme="dark"] .dash-quick-btn,
  html[data-theme="dark"] .sc-help-toc,
  html[data-theme="dark"] .sc-help-howto,
  html[data-theme="dark"] .sc-help-tab,
  html[data-theme="dark"] .sc-help-feature,
  html[data-theme="dark"] .sc-help-explain,
  html[data-theme="dark"] .sc-help-toolbar,
  html[data-theme="dark"] .lrn-card,
  html[data-theme="dark"] .lc-pane,
  html[data-theme="dark"] .course-card,
  html[data-theme="dark"] .lms-card,
  html[data-theme="dark"] .product-card,
  html[data-theme="dark"] .mkt-card,
  html[data-theme="dark"] .order-card,
  html[data-theme="dark"] .cart-drawer,
  html[data-theme="dark"] .shop-toolbar,
  html[data-theme="dark"] .promo-ladder-workspace,
  html[data-theme="dark"] .promo-pool,
  html[data-theme="dark"] .promo-step,
  html[data-theme="dark"] .promo-chip,
  html[data-theme="dark"] .promo-save-bar,
  html[data-theme="dark"] .places-toolbar,
  html[data-theme="dark"] .places-table thead th,
  html[data-theme="dark"] .places-table tbody td,
  html[data-theme="dark"] .summary-strip,
  html[data-theme="dark"] .tm-card,
  html[data-theme="dark"] .tm-side,
  html[data-theme="dark"] .tm-tabs .tm-tab,
  html[data-theme="dark"] .teachers-tabs .tab-content,
  html[data-theme="dark"] .teacher-rating-card,
  html[data-theme="dark"] .student-full-details .details-section,
  html[data-theme="dark"] .grade-badge,
  html[data-theme="dark"] .academic-details,
  html[data-theme="dark"] .request-card-footer,
  html[data-theme="dark"] .pending-grade-footer,
  html[data-theme="dark"] .approved-grade-footer,
  html[data-theme="dark"] .declined-grade-footer,
  html[data-theme="dark"] .ps-stat,
  html[data-theme="dark"] .feed-post,
  html[data-theme="dark"] .create-post-card,
  html[data-theme="dark"] .comment-bubble {
    background: #fff !important;
    background-color: #fff !important;
    background-image: none !important;
    color: #111 !important;
  }
  .theme-toggle,
  .theme-toggle-item,
  .theme-toggle-fixed { display: none !important; }
}
