/**
 * KachiTech Dark Mode Theme
 * Proper dark mode with readable text and cards
 */

[data-theme="dark"] {
  --kt-bg-body: #0f172a;
  --kt-bg-card: #1e293b;
  --kt-bg-panel: #1e293b;
  --kt-bg-sidebar: #0f172a;
  --kt-bg-input: #334155;
  --kt-bg-hover: #334155;
  --kt-bg-active: #475569;
  --kt-text-primary: #f1f5f9;
  --kt-text-secondary: #94a3b8;
  --kt-text-muted: #64748b;
  --kt-border-color: #334155;
  --kt-shadow-color: rgba(0, 0, 0, 0.3);
  --kt-primary: #6BB6DB;
  --kt-primary-dark: #5AA3C8;
  --kt-accent: #6BB6DB;
  --kt-success: #10b981;
  --kt-danger: #ef4444;
  --kt-warning: #f59e0b;
  --kt-info: #3b82f6;
}

/* Dark Mode Base Styles */
[data-theme="dark"] body {
  background-color: #0f172a !important;
  color: #f1f5f9 !important;
}

[data-theme="dark"] .card {
  background: #1e293b !important;
  border-color: #334155 !important;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .sidebar {
  background: #0f172a !important;
  border-right-color: #334155 !important;
}

[data-theme="dark"] .sidebar__inner {
  background: #0f172a !important;
}

[data-theme="dark"] .sidebar__menu-wrapper {
  background: transparent !important;
}

[data-theme="dark"] .sidebar-menu-item > .nav-link {
  color: #94a3b8 !important;
}

[data-theme="dark"] .sidebar-menu-item > .nav-link:hover,
[data-theme="dark"] .sidebar-menu-item.active > .nav-link {
  background: #1e293b !important;
  color: #6BB6DB !important;
}

[data-theme="dark"] .sidebar__menu-header {
  color: #64748b !important;
}

[data-theme="dark"] .sidebar-submenu {
  background: #0f172a !important;
}

[data-theme="dark"] .sidebar-submenu .nav-link {
  color: #94a3b8 !important;
}

[data-theme="dark"] .sidebar-submenu .nav-link:hover {
  color: #6BB6DB !important;
  background: #1e293b !important;
}

[data-theme="dark"] .navbar-wrapper {
  background: #1e293b !important;
  border-bottom-color: #334155 !important;
}

[data-theme="dark"] .navbar-search {
  background: #334155 !important;
}

[data-theme="dark"] .navbar-search-field {
  background: transparent !important;
  color: #f1f5f9 !important;
}

[data-theme="dark"] .navbar-search-field::placeholder {
  color: #64748b !important;
}

[data-theme="dark"] .dropdown-menu {
  background: #1e293b !important;
  border-color: #334155 !important;
  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .dropdown-menu__header {
  background: #0f172a !important;
  border-bottom-color: #334155 !important;
  color: #f1f5f9 !important;
}

[data-theme="dark"] .dropdown-menu__body {
  background: #1e293b !important;
}

[data-theme="dark"] .dropdown-menu__item {
  color: #94a3b8 !important;
}

[data-theme="dark"] .dropdown-menu__item:hover {
  background: #334155 !important;
  color: #f1f5f9 !important;
}

[data-theme="dark"] .dropdown-menu__footer {
  background: #0f172a !important;
  border-top-color: #334155 !important;
}

[data-theme="dark"] .view-all-message {
  color: #6BB6DB !important;
}

[data-theme="dark"] .table {
  color: #f1f5f9 !important;
}

[data-theme="dark"] .table--light {
  background: transparent !important;
}

[data-theme="dark"] .table thead th {
  background: #0f172a !important;
  color: #94a3b8 !important;
  border-bottom-color: #334155 !important;
}

[data-theme="dark"] .table tbody tr {
  border-bottom-color: #334155 !important;
}

[data-theme="dark"] .table tbody tr:hover {
  background: #334155 !important;
}

[data-theme="dark"] .table td {
  border-color: #334155 !important;
  color: #f1f5f9 !important;
}

[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select {
  background: #334155 !important;
  border-color: #475569 !important;
  color: #f1f5f9 !important;
}

[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus {
  background: #475569 !important;
  border-color: #6BB6DB !important;
  color: #f1f5f9 !important;
  box-shadow: 0 0 0 0.25rem rgba(107, 182, 219, 0.25) !important;
}

[data-theme="dark"] .form-control::placeholder {
  color: #64748b !important;
}

[data-theme="dark"] .btn--primary {
  background: linear-gradient(135deg, #6BB6DB 0%, #5AA3C8 100%) !important;
  color: #fff !important;
}

[data-theme="dark"] .btn--dark {
  background: linear-gradient(135deg, #475569 0%, #334155 100%) !important;
  color: #fff !important;
}

[data-theme="dark"] .btn--secondary {
  background: #475569 !important;
  color: #fff !important;
}

[data-theme="dark"] .alert {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #f1f5f9 !important;
}

[data-theme="dark"] .alert__message {
  color: #f1f5f9 !important;
}

[data-theme="dark"] .modal-content {
  background: #1e293b !important;
  border-color: #334155 !important;
}

[data-theme="dark"] .modal-header {
  background: #0f172a !important;
  border-bottom-color: #334155 !important;
  color: #f1f5f9 !important;
}

[data-theme="dark"] .modal-title {
  color: #f1f5f9 !important;
}

[data-theme="dark"] .modal-body {
  color: #f1f5f9 !important;
}

[data-theme="dark"] .modal-footer {
  border-top-color: #334155 !important;
  background: #0f172a !important;
}

[data-theme="dark"] .breadcrumb-wrapper {
  background: #1e293b !important;
}

[data-theme="dark"] .breadcrumb {
  background: transparent !important;
}

[data-theme="dark"] .breadcrumb-item a {
  color: #94a3b8 !important;
}

[data-theme="dark"] .breadcrumb-item.active {
  color: #f1f5f9 !important;
}

[data-theme="dark"] .kachi-admin-hero {
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%) !important;
}

[data-theme="dark"] .kachi-admin-hero__title {
  color: #f1f5f9 !important;
}

[data-theme="dark"] .kachi-admin-hero__tagline {
  color: #94a3b8 !important;
}

[data-theme="dark"] .kachi-admin-hero__eyebrow {
  color: #6BB6DB !important;
}

[data-theme="dark"] .kachi-admin-hero__stat-label {
  color: #94a3b8 !important;
}

[data-theme="dark"] .kachi-admin-hero__stat strong {
  color: #f1f5f9 !important;
}

[data-theme="dark"] .dashboard-widget {
  background: #1e293b !important;
}

[data-theme="dark"] .dashboard-widget__content span {
  color: #94a3b8 !important;
}

[data-theme="dark"] .dashboard-widget__content h5 {
  color: #f1f5f9 !important;
}

[data-theme="dark"] .prod-p-card {
  background: #1e293b !important;
}

[data-theme="dark"] .prod-p-card h6 {
  color: #94a3b8 !important;
}

[data-theme="dark"] .prod-p-card h3 {
  color: #f1f5f9 !important;
}

[data-theme="dark"] .card-title {
  color: #f1f5f9 !important;
}

[data-theme="dark"] .text-muted {
  color: #64748b !important;
}

[data-theme="dark"] .kachi-admin-page-summary {
  background: #1e293b !important;
}

[data-theme="dark"] .kachi-admin-page-summary h1 {
  color: #f1f5f9 !important;
}

[data-theme="dark"] .kachi-admin-page-summary p {
  color: #94a3b8 !important;
}

[data-theme="dark"] .kachi-admin-page-summary span {
  color: #6BB6DB !important;
}

[data-theme="dark"] .top-nav-bg {
  background: #0f172a !important;
}

[data-theme="dark"] .bodywrapper__inner {
  background: #0f172a !important;
}

/* Dark Mode Toggle Button */
.dark-mode-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #334155;
  color: #f1f5f9;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease;
}

.dark-mode-toggle:hover {
  background: #475569;
  transform: scale(1.05);
}

.dark-mode-toggle i {
  font-size: 18px;
}

/* Badge colors in dark mode */
[data-theme="dark"] .badge--success {
  background: rgba(16, 185, 129, 0.2) !important;
  color: #10b981 !important;
}

[data-theme="dark"] .badge--danger {
  background: rgba(239, 68, 68, 0.2) !important;
  color: #ef4444 !important;
}

[data-theme="dark"] .badge--primary {
  background: rgba(107, 182, 219, 0.2) !important;
  color: #6BB6DB !important;
}

[data-theme="dark"] .badge--warning {
  background: rgba(245, 158, 11, 0.2) !important;
  color: #f59e0b !important;
}

/* Scrollbar in dark mode */
[data-theme="dark"] ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
  background: #0f172a;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: #475569;
  border-radius: 4px;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: #64748b;
}

/* Links in dark mode. Button-like anchors manage their own contrast. */
[data-theme="dark"] a:not([class*="btn"]):not(.cmn--btn) {
  color: #6BB6DB !important;
}

[data-theme="dark"] a:not([class*="btn"]):not(.cmn--btn):hover {
  color: #5AA3C8 !important;
}

/* Input group in dark mode */
[data-theme="dark"] .input-group-text {
  background: #334155 !important;
  border-color: #475569 !important;
  color: #f1f5f9 !important;
}

/* Pagination in dark mode */
[data-theme="dark"] .pagination .page-link {
  background: #1e293b !important;
  border-color: #334155 !important;
  color: #f1f5f9 !important;
}

[data-theme="dark"] .pagination .page-item.active .page-link {
  background: #6BB6DB !important;
  border-color: #6BB6DB !important;
  color: #fff !important;
}

[data-theme="dark"] .pagination .page-link:hover {
  background: #334155 !important;
  color: #f1f5f9 !important;
}

/* Dashboard stat cards */
[data-theme="dark"] .kachi-dash-stat-card {
  background: #1e293b !important;
  border-color: #334155 !important;
}

[data-theme="dark"] .kachi-dash-stat-icon {
  border-radius: 12px;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
}

/* Widget icons */
[data-theme="dark"] .kachi-dash-widget-icon-primary {
  background: rgba(107, 182, 219, 0.15);
  color: #6BB6DB !important;
  border-radius: 12px;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
}

[data-theme="dark"] .kachi-dash-widget-icon-white {
  background: rgba(255, 255, 255, 0.1);
  color: #fff !important;
  border-radius: 12px;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
}

/* Chart card in dark mode */
[data-theme="dark"] .kachi-admin-login-chart-card {
  background: #1e293b !important;
  border-color: #334155 !important;
}

/* Top nav breadcrumb */
[data-theme="dark"] .top-nav-bg {
  background: #0f172a !important;
}

/* Admin logout modal redesign */
[data-theme="dark"] .admin-logout-modal .modal-content {
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
  border: 1px solid #334155;
  border-radius: 16px;
}

[data-theme="dark"] .admin-logout-modal .modal-header {
  background: transparent;
  border-bottom-color: #334155;
}

[data-theme="dark"] .admin-logout-modal .btn-close {
  filter: invert(1);
}

/* ============================================================
   Full application dark-mode coverage
   Keep this section last so it can override legacy light themes.
   ============================================================ */

html[data-theme="dark"] {
  color-scheme: dark;
  --kt-dark-canvas: #0b0f17;
  --kt-dark-canvas-soft: #101621;
  --kt-dark-surface: #171d29;
  --kt-dark-surface-raised: #1d2533;
  --kt-dark-surface-hover: #252f3f;
  --kt-dark-border: #303b4d;
  --kt-dark-text: #f3f6fb;
  --kt-dark-text-soft: #cbd3df;
  --kt-dark-text-muted: #9aa7ba;
  --kt-dark-link: #7cc7ef;
  --kt-dark-focus: #60a5fa;
  --bs-body-color: var(--kt-dark-text);
  --bs-body-color-rgb: 243, 246, 251;
  --bs-body-bg: var(--kt-dark-canvas);
  --bs-body-bg-rgb: 11, 15, 23;
  --bs-secondary-color: var(--kt-dark-text-muted);
  --bs-secondary-bg: var(--kt-dark-surface-raised);
  --bs-tertiary-bg: var(--kt-dark-surface-hover);
  --bs-border-color: var(--kt-dark-border);
  --bs-emphasis-color: #ffffff;
  --bs-heading-color: #ffffff;
  --bs-link-color: var(--kt-dark-link);
  --bs-link-hover-color: #a6ddf7;
  --ws-bg: var(--kt-dark-canvas);
  --ws-card: var(--kt-dark-surface);
  --ws-text: var(--kt-dark-text);
  --ws-text-muted: var(--kt-dark-text-muted);
  --ws-border: var(--kt-dark-border);
  --kd-bg: var(--kt-dark-canvas);
  --kd-panel: var(--kt-dark-surface);
  --kd-panel-soft: var(--kt-dark-surface-raised);
  --kd-text: var(--kt-dark-text);
  --kd-muted: var(--kt-dark-text-muted);
  --kd-border: var(--kt-dark-border);
  --kt-shell: var(--kt-dark-canvas-soft);
  --kt-surface: var(--kt-dark-surface);
  --kt-text: var(--kt-dark-text);
  --kt-muted: var(--kt-dark-text-muted);
  --kt-border: var(--kt-dark-border);
}

html[data-theme="dark"],
html[data-theme="dark"] body,
body.kachi-dark-mode {
  background-color: var(--kt-dark-canvas) !important;
  color: var(--kt-dark-text) !important;
}

html[data-theme="dark"] body {
  background-image:
    radial-gradient(circle at 10% 0%, rgba(96, 165, 250, 0.08), transparent 34%),
    linear-gradient(180deg, #0d121c 0%, var(--kt-dark-canvas) 58%, #080b11 100%) !important;
  background-attachment: fixed !important;
}

html[data-theme="dark"] body.kachi-frontend-body,
html[data-theme="dark"] body.kachi-dashboard-body,
html[data-theme="dark"] body.kachi-admin-body,
html[data-theme="dark"] body.kachi-workspace-body,
html[data-theme="dark"] body.kachi-workspace-dashboard-body,
body.kachi-dark-mode.kachi-frontend-body,
body.kachi-dark-mode.kachi-dashboard-body {
  background-color: var(--kt-dark-canvas) !important;
  background-image:
    radial-gradient(circle at 10% 0%, rgba(96, 165, 250, 0.08), transparent 34%),
    linear-gradient(180deg, #0d121c 0%, var(--kt-dark-canvas) 58%, #080b11 100%) !important;
  color: var(--kt-dark-text) !important;
}

/* Main application canvases */
html[data-theme="dark"] body .body-wrapper,
html[data-theme="dark"] body .bodywrapper__inner,
html[data-theme="dark"] body .dashboard-section,
html[data-theme="dark"] body .dashboard-container-wrap,
html[data-theme="dark"] body .dashboard-body,
html[data-theme="dark"] body .kachi-dashboard-main,
html[data-theme="dark"] body .kachi-dashboard-content,
html[data-theme="dark"] body .kachi-frontend-inner-canvas,
html[data-theme="dark"] body .site-boxed-layout,
html[data-theme="dark"] body .kachi-workspace-main,
html[data-theme="dark"] body .workspace-content,
html[data-theme="dark"] body .kachi-workspace-landing,
html[data-theme="dark"] body .course-home,
html[data-theme="dark"] body .page-wrapper,
html[data-theme="dark"] body .page-content,
html[data-theme="dark"] body .main-content,
body.kachi-dark-mode .body-wrapper,
body.kachi-dark-mode .dashboard-section,
body.kachi-dark-mode .dashboard-body,
body.kachi-dark-mode .kachi-dashboard-content,
body.kachi-dark-mode .kachi-frontend-inner-canvas,
body.kachi-dark-mode .site-boxed-layout {
  background-color: var(--kt-dark-canvas) !important;
  background-image: none !important;
  border-color: var(--kt-dark-border) !important;
  color: var(--kt-dark-text) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body .kachi-dashboard-shell.dashboard,
body.kachi-dark-mode .kachi-dashboard-shell.dashboard {
  background: var(--kt-dark-canvas-soft) !important;
  border-color: var(--kt-dark-border) !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34) !important;
}

html[data-theme="dark"] body .workspace-header,
html[data-theme="dark"] body .kachi-dashboard-header,
html[data-theme="dark"] body .dashboard-header,
html[data-theme="dark"] body .kachi-dashboard-footer,
html[data-theme="dark"] body .workspace-footer,
body.kachi-dark-mode .workspace-header,
body.kachi-dark-mode .kachi-dashboard-header,
body.kachi-dark-mode .dashboard-header,
body.kachi-dark-mode .kachi-dashboard-footer {
  background: var(--kt-dark-surface) !important;
  border-color: var(--kt-dark-border) !important;
  color: var(--kt-dark-text-soft) !important;
}

/* Cards, panels and page-specific content surfaces */
html[data-theme="dark"] body .card,
html[data-theme="dark"] body .card-body,
html[data-theme="dark"] body .custom--card,
html[data-theme="dark"] body .base-card,
html[data-theme="dark"] body .base--card,
html[data-theme="dark"] body .dashboard-card,
html[data-theme="dark"] body .dashboard-widget,
html[data-theme="dark"] body .dash-box,
html[data-theme="dark"] body .discover-box,
html[data-theme="dark"] body .category-card,
html[data-theme="dark"] body .chart-bg,
html[data-theme="dark"] body .form-area,
html[data-theme="dark"] body .profile-info-card,
html[data-theme="dark"] body .dashboard_profile_wrap,
html[data-theme="dark"] body .profile-wrap,
html[data-theme="dark"] body .course-home__primary,
html[data-theme="dark"] body .course-home__secondary,
html[data-theme="dark"] body .course-home__metrics > div,
html[data-theme="dark"] body .kui-table-shell,
html[data-theme="dark"] body .tbl-wrap,
html[data-theme="dark"] body .table-area,
html[data-theme="dark"] body .table-responsive,
html[data-theme="dark"] body .section-bg,
html[data-theme="dark"] body .section-bg-two,
html[data-theme="dark"] body .section--bg,
html[data-theme="dark"] body .section--bg-two,
html[data-theme="dark"] body .panel,
html[data-theme="dark"] body .widget,
html[data-theme="dark"] body .well,
html[data-theme="dark"] body .tab-content,
html[data-theme="dark"] body .list-group-item,
body.kachi-dark-mode .card,
body.kachi-dark-mode .custom--card,
body.kachi-dark-mode .base-card,
body.kachi-dark-mode .dashboard-card,
body.kachi-dark-mode .dashboard-widget,
body.kachi-dark-mode .dash-box,
body.kachi-dark-mode .discover-box,
body.kachi-dark-mode .category-card,
body.kachi-dark-mode .chart-bg,
body.kachi-dark-mode .form-area,
body.kachi-dark-mode .profile-info-card,
body.kachi-dark-mode .course-home__primary,
body.kachi-dark-mode .course-home__secondary,
body.kachi-dark-mode .kui-table-shell,
body.kachi-dark-mode .tbl-wrap,
body.kachi-dark-mode .table-area,
body.kachi-dark-mode .table-responsive,
body.kachi-dark-mode .section-bg,
body.kachi-dark-mode .section-bg-two {
  background: var(--kt-dark-surface) !important;
  background-image: none !important;
  border-color: var(--kt-dark-border) !important;
  color: var(--kt-dark-text) !important;
  box-shadow: 0 3px 14px rgba(0, 0, 0, 0.22) !important;
}

html[data-theme="dark"] body .card-header,
html[data-theme="dark"] body .card-footer,
html[data-theme="dark"] body .panel-heading,
html[data-theme="dark"] body .panel-footer,
html[data-theme="dark"] body .modal-header,
html[data-theme="dark"] body .modal-footer,
html[data-theme="dark"] body .offcanvas-header,
html[data-theme="dark"] body .toast-header,
html[data-theme="dark"] body .dropdown-menu__header,
html[data-theme="dark"] body .dropdown-menu__footer,
body.kachi-dark-mode .card-header,
body.kachi-dark-mode .card-footer {
  background: var(--kt-dark-surface-raised) !important;
  border-color: var(--kt-dark-border) !important;
  color: var(--kt-dark-text) !important;
}

html[data-theme="dark"] body .bg-white,
html[data-theme="dark"] body .bg-light,
html[data-theme="dark"] body .bg--white,
html[data-theme="dark"] body .bg--light,
html[data-theme="dark"] body [class~="bg-white"],
html[data-theme="dark"] body [class~="bg-light"],
body.kachi-dark-mode .bg-white,
body.kachi-dark-mode .bg-light,
body.kachi-dark-mode .bg--white,
body.kachi-dark-mode .bg--light {
  background-color: var(--kt-dark-surface) !important;
  background-image: none !important;
  color: var(--kt-dark-text) !important;
}

/* Typography and readable utility colors */
html[data-theme="dark"] body h1,
html[data-theme="dark"] body h2,
html[data-theme="dark"] body h3,
html[data-theme="dark"] body h4,
html[data-theme="dark"] body h5,
html[data-theme="dark"] body h6,
html[data-theme="dark"] body .h1,
html[data-theme="dark"] body .h2,
html[data-theme="dark"] body .h3,
html[data-theme="dark"] body .h4,
html[data-theme="dark"] body .h5,
html[data-theme="dark"] body .h6,
html[data-theme="dark"] body .title,
html[data-theme="dark"] body .card-title,
html[data-theme="dark"] body .page-title,
html[data-theme="dark"] body .modal-title,
html[data-theme="dark"] body .offcanvas-title,
body.kachi-dark-mode h1,
body.kachi-dark-mode h2,
body.kachi-dark-mode h3,
body.kachi-dark-mode h4,
body.kachi-dark-mode h5,
body.kachi-dark-mode h6 {
  color: #ffffff !important;
}

html[data-theme="dark"] body p,
html[data-theme="dark"] body li,
html[data-theme="dark"] body td,
html[data-theme="dark"] body th,
html[data-theme="dark"] body label,
html[data-theme="dark"] body legend,
html[data-theme="dark"] body .form-label,
html[data-theme="dark"] body .form-check-label,
html[data-theme="dark"] body .text-body,
html[data-theme="dark"] body .text-dark,
html[data-theme="dark"] body .text-black,
html[data-theme="dark"] body .text-black-50,
body.kachi-dark-mode p,
body.kachi-dark-mode label,
body.kachi-dark-mode .text-body,
body.kachi-dark-mode .text-dark,
body.kachi-dark-mode .text-black {
  color: var(--kt-dark-text-soft) !important;
}

html[data-theme="dark"] body .text-muted,
html[data-theme="dark"] body .text-secondary,
html[data-theme="dark"] body .small,
html[data-theme="dark"] body small,
html[data-theme="dark"] body .subtitle,
html[data-theme="dark"] body .help-block,
html[data-theme="dark"] body .form-text,
body.kachi-dark-mode .text-muted,
body.kachi-dark-mode .text-secondary,
body.kachi-dark-mode small {
  color: var(--kt-dark-text-muted) !important;
}

html[data-theme="dark"] body a:not([class*="btn"]):not(:where(.badge, .nav-link, .dropdown-item, .sidebar-menu-list__link, .sidebar-submenu-list__link, .cmn--btn)),
body.kachi-dark-mode a:not([class*="btn"]):not(:where(.badge, .nav-link, .dropdown-item, .sidebar-menu-list__link, .sidebar-submenu-list__link, .cmn--btn)) {
  color: var(--kt-dark-link) !important;
}

html[data-theme="dark"] body a:not([class*="btn"]):not(:where(.badge, .nav-link, .dropdown-item, .sidebar-menu-list__link, .sidebar-submenu-list__link, .cmn--btn)):hover,
body.kachi-dark-mode a:not([class*="btn"]):not(:where(.badge, .nav-link, .dropdown-item, .sidebar-menu-list__link, .sidebar-submenu-list__link, .cmn--btn)):hover {
  color: #a6ddf7 !important;
}

html[data-theme="dark"] body hr,
html[data-theme="dark"] body .border,
html[data-theme="dark"] body .border-top,
html[data-theme="dark"] body .border-end,
html[data-theme="dark"] body .border-bottom,
html[data-theme="dark"] body .border-start {
  border-color: var(--kt-dark-border) !important;
}

/* Tables */
html[data-theme="dark"] body .table {
  --bs-table-color: var(--kt-dark-text-soft);
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--kt-dark-border);
  --bs-table-striped-color: var(--kt-dark-text);
  --bs-table-striped-bg: rgba(255, 255, 255, 0.035);
  --bs-table-hover-color: #ffffff;
  --bs-table-hover-bg: rgba(124, 199, 239, 0.08);
  color: var(--kt-dark-text-soft) !important;
}

html[data-theme="dark"] body .table > :not(caption) > * > *,
html[data-theme="dark"] body .table tbody td,
html[data-theme="dark"] body .table tbody th,
body.kachi-dark-mode .table > :not(caption) > * > * {
  background-color: var(--kt-dark-surface) !important;
  border-color: var(--kt-dark-border) !important;
  color: var(--kt-dark-text-soft) !important;
}

html[data-theme="dark"] body .table thead th,
html[data-theme="dark"] body .table--light thead th,
body.kachi-dark-mode .table thead th {
  background-color: var(--kt-dark-surface-raised) !important;
  color: var(--kt-dark-text-muted) !important;
}

html[data-theme="dark"] body .table-hover > tbody > tr:hover > * {
  background-color: var(--kt-dark-surface-hover) !important;
  color: #ffffff !important;
}

/* Forms and native controls */
html[data-theme="dark"] body .form-control,
html[data-theme="dark"] body .form--control,
html[data-theme="dark"] body .form-select,
html[data-theme="dark"] body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]),
html[data-theme="dark"] body select,
html[data-theme="dark"] body textarea,
html[data-theme="dark"] body .input-group-text,
body.kachi-dark-mode .form-control,
body.kachi-dark-mode .form--control,
body.kachi-dark-mode .form-select,
body.kachi-dark-mode select,
body.kachi-dark-mode textarea {
  background-color: var(--kt-dark-surface-raised) !important;
  border-color: var(--kt-dark-border) !important;
  color: var(--kt-dark-text) !important;
}

html[data-theme="dark"] body .form-control:focus,
html[data-theme="dark"] body .form--control:focus,
html[data-theme="dark"] body .form-select:focus,
html[data-theme="dark"] body input:focus,
html[data-theme="dark"] body select:focus,
html[data-theme="dark"] body textarea:focus,
body.kachi-dark-mode .form-control:focus,
body.kachi-dark-mode .form--control:focus {
  background-color: var(--kt-dark-surface-raised) !important;
  border-color: var(--kt-dark-focus) !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.2) !important;
}

html[data-theme="dark"] body ::placeholder,
body.kachi-dark-mode ::placeholder {
  color: #7f8da2 !important;
  opacity: 1;
}

html[data-theme="dark"] body option,
html[data-theme="dark"] body optgroup {
  background: var(--kt-dark-surface-raised);
  color: var(--kt-dark-text);
}

html[data-theme="dark"] body .form-check-input {
  background-color: var(--kt-dark-surface-raised) !important;
  border-color: #526078 !important;
}

html[data-theme="dark"] body .form-check-input:checked {
  background-color: var(--kt-dark-focus) !important;
  border-color: var(--kt-dark-focus) !important;
}

html[data-theme="dark"] body input:-webkit-autofill,
html[data-theme="dark"] body input:-webkit-autofill:hover,
html[data-theme="dark"] body input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--kt-dark-text) !important;
  box-shadow: 0 0 0 1000px var(--kt-dark-surface-raised) inset !important;
  caret-color: var(--kt-dark-text);
}

/* Select2, datepicker, editors and code fields */
html[data-theme="dark"] body .select2-container--default .select2-selection--single,
html[data-theme="dark"] body .select2-container--default .select2-selection--multiple,
html[data-theme="dark"] body .select2-dropdown,
html[data-theme="dark"] body .select2-search__field,
html[data-theme="dark"] body .select2-results,
html[data-theme="dark"] body .f-dropdown ul,
html[data-theme="dark"] body .datepicker,
html[data-theme="dark"] body .datepicker--content,
html[data-theme="dark"] body .note-editor,
html[data-theme="dark"] body .note-toolbar,
html[data-theme="dark"] body .note-editing-area,
html[data-theme="dark"] body .CodeMirror,
html[data-theme="dark"] body .ck.ck-editor__main > .ck-editor__editable,
html[data-theme="dark"] body .ck.ck-toolbar,
html[data-theme="dark"] body .ck.ck-list,
html[data-theme="dark"] body .ck.ck-dropdown__panel {
  background: var(--kt-dark-surface-raised) !important;
  border-color: var(--kt-dark-border) !important;
  color: var(--kt-dark-text) !important;
}

html[data-theme="dark"] body .select2-selection__rendered,
html[data-theme="dark"] body .select2-results__option,
html[data-theme="dark"] body .f-dropdown ul li a,
html[data-theme="dark"] body .CodeMirror-line,
html[data-theme="dark"] body .ck.ck-editor__editable,
html[data-theme="dark"] body .ck.ck-button,
html[data-theme="dark"] body .ck.ck-label {
  color: var(--kt-dark-text) !important;
}

html[data-theme="dark"] body .select2-results__option--highlighted,
html[data-theme="dark"] body .select2-results__option[aria-selected="true"],
html[data-theme="dark"] body .f-dropdown ul li a:hover,
html[data-theme="dark"] body .ck.ck-button:hover,
html[data-theme="dark"] body .ck.ck-button.ck-on {
  background: var(--kt-dark-surface-hover) !important;
  color: #ffffff !important;
}

/* Menus, overlays and navigation content */
html[data-theme="dark"] body .dropdown-menu,
html[data-theme="dark"] body .modal-content,
html[data-theme="dark"] body .modal-body,
html[data-theme="dark"] body .offcanvas,
html[data-theme="dark"] body .toast,
html[data-theme="dark"] body .popover,
html[data-theme="dark"] body .popover-body,
html[data-theme="dark"] body .tooltip-inner,
html[data-theme="dark"] body .accordion-item,
html[data-theme="dark"] body .accordion-body,
html[data-theme="dark"] body .accordion-button,
html[data-theme="dark"] body .nav-tabs,
html[data-theme="dark"] body .pagination .page-link {
  background: var(--kt-dark-surface) !important;
  border-color: var(--kt-dark-border) !important;
  color: var(--kt-dark-text-soft) !important;
}

html[data-theme="dark"] body .dropdown-item,
html[data-theme="dark"] body .nav-link,
html[data-theme="dark"] body .accordion-button {
  color: var(--kt-dark-text-soft) !important;
}

html[data-theme="dark"] body .dropdown-item:hover,
html[data-theme="dark"] body .dropdown-item:focus,
html[data-theme="dark"] body .nav-link:hover,
html[data-theme="dark"] body .accordion-button:not(.collapsed),
html[data-theme="dark"] body .pagination .page-link:hover {
  background: var(--kt-dark-surface-hover) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body .nav-tabs .nav-link.active,
html[data-theme="dark"] body .pagination .page-item.active .page-link {
  background: var(--kt-dark-focus) !important;
  border-color: var(--kt-dark-focus) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body .workspace-menu-list__item a,
html[data-theme="dark"] body .workspace-menu a {
  color: rgba(255, 255, 255, 0.76) !important;
}

html[data-theme="dark"] body .workspace-menu-list__item a:hover,
html[data-theme="dark"] body .workspace-menu-list__item a.active,
html[data-theme="dark"] body .workspace-menu a:hover,
html[data-theme="dark"] body .workspace-menu a.active {
  color: #ffffff !important;
}

html[data-theme="dark"] body .btn-light,
html[data-theme="dark"] body .btn-outline-dark,
html[data-theme="dark"] body .btn-outline-secondary {
  background: var(--kt-dark-surface-raised) !important;
  border-color: var(--kt-dark-border) !important;
  color: var(--kt-dark-text) !important;
}

html[data-theme="dark"] body .badge.text-dark,
html[data-theme="dark"] body .badge.text-black {
  color: #111827 !important;
}

/* Admin sidebar: stronger text contrast than the legacy translucent theme. */
html[data-theme="dark"] body.kachi-admin-body .sidebar,
html[data-theme="dark"] body.kachi-admin-body .kachi-admin-shell .sidebar {
  background: linear-gradient(180deg, #111827 0%, #0f172a 52%, #0b1220 100%) !important;
  border-color: #2b3749 !important;
  box-shadow: 6px 0 28px rgba(0, 0, 0, 0.32) !important;
}

html[data-theme="dark"] body.kachi-admin-body .sidebar__inner,
html[data-theme="dark"] body.kachi-admin-body .sidebar__menu,
html[data-theme="dark"] body.kachi-admin-body .sidebar__menu-wrapper {
  background: transparent !important;
}

html[data-theme="dark"] body.kachi-admin-body .sidebar__menu-header {
  color: #aab7c9 !important;
  font-weight: 800 !important;
}

html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .sidebar-menu-item > a,
html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .sidebar-menu-item > a .menu-title {
  color: #e5ebf4 !important;
}

html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .menu-icon,
html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .menu-icon i {
  color: #dff4ff !important;
}

html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .menu-icon {
  background: rgba(96, 165, 250, 0.14) !important;
  border: 1px solid rgba(124, 199, 239, 0.2) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .sidebar-dropdown > a::before {
  color: #b7c4d6 !important;
}

html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .sidebar-menu-item > a:hover,
html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .sidebar-menu-item .side-menu--open,
html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .sidebar-menu-item.active > a {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.28), rgba(14, 165, 233, 0.18)) !important;
  border-color: rgba(125, 211, 252, 0.34) !important;
  color: #ffffff !important;
  box-shadow: inset 3px 0 0 #7dd3fc, 0 6px 18px rgba(0, 0, 0, 0.2) !important;
}

html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .sidebar-menu-item > a:hover *,
html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .sidebar-menu-item .side-menu--open *,
html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .sidebar-menu-item.active > a * {
  color: #ffffff !important;
}

html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .sidebar-submenu {
  background: rgba(3, 7, 18, 0.38) !important;
  border-color: rgba(148, 163, 184, 0.18) !important;
}

html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .sidebar-submenu .sidebar-menu-item a {
  color: #c4cfdd !important;
}

html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .sidebar-submenu .sidebar-menu-item a:hover,
html[data-theme="dark"] body.kachi-admin-body .sidebar__menu .sidebar-submenu .sidebar-menu-item.active > a {
  background: rgba(96, 165, 250, 0.16) !important;
  color: #ffffff !important;
}

/* Student and instructor dashboard sidebar. */
html[data-theme="dark"] body.kachi-dashboard-body .kachi-dashboard-shell .sidebar-menu,
body.kachi-dark-mode.kachi-dashboard-body .kachi-dashboard-shell .sidebar-menu {
  background: linear-gradient(180deg, #151d2a 0%, #101722 54%, #0b111b 100%) !important;
  border-color: #303b4d !important;
  box-shadow: 5px 0 26px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .kachi-dashboard-shell .sidebar-menu .logo-wrapper,
body.kachi-dark-mode.kachi-dashboard-body .kachi-dashboard-shell .sidebar-menu .logo-wrapper {
  background: #f8fafc !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .sidebar-menu-list__link,
html[data-theme="dark"] body.kachi-dashboard-body .sidebar-menu-list__link .text,
html[data-theme="dark"] body.kachi-dashboard-body .sidebar-menu-list__link > i,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-menu-list__link,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-menu-list__link .text,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-menu-list__link > i {
  color: #d8e1ed !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .sidebar-menu-list__link .icon,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-menu-list__link .icon {
  color: #e9f7ff !important;
  background: rgba(96, 165, 250, 0.16) !important;
  border: 1px solid rgba(124, 199, 239, 0.22) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .sidebar-menu-list__item.has-dropdown > a::after,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-menu-list__item.has-dropdown > a::after {
  color: #aebdce !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .sidebar-menu-list__link:hover,
html[data-theme="dark"] body.kachi-dashboard-body .sidebar-menu-list__link.active,
html[data-theme="dark"] body.kachi-dashboard-body .sidebar-menu-list__item.has-dropdown.active > a,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-menu-list__link:hover,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-menu-list__link.active,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-menu-list__item.has-dropdown.active > a {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.3), rgba(14, 165, 233, 0.18)) !important;
  border-color: rgba(125, 211, 252, 0.34) !important;
  color: #ffffff !important;
  box-shadow: inset 3px 0 0 #7dd3fc !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .sidebar-menu-list__link:hover *,
html[data-theme="dark"] body.kachi-dashboard-body .sidebar-menu-list__link.active *,
html[data-theme="dark"] body.kachi-dashboard-body .sidebar-menu-list__item.has-dropdown.active > a *,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-menu-list__link:hover *,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-menu-list__link.active *,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-menu-list__item.has-dropdown.active > a * {
  color: #ffffff !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .sidebar-submenu,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-submenu {
  background: rgba(3, 7, 18, 0.4) !important;
  border-color: rgba(148, 163, 184, 0.18) !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .sidebar-submenu-list__link,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-submenu-list__link {
  color: #bdc9d8 !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .sidebar-submenu-list__link:hover,
html[data-theme="dark"] body.kachi-dashboard-body .sidebar-submenu-list__link.active,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-submenu-list__link:hover,
body.kachi-dark-mode.kachi-dashboard-body .sidebar-submenu-list__link.active {
  background: rgba(96, 165, 250, 0.16) !important;
  color: #ffffff !important;
}

/* Solid buttons must never inherit the global blue link color. */
html[data-theme="dark"] body :is(
  .btn-primary,
  .btn-secondary,
  .btn-success,
  .btn-danger,
  .btn-info,
  .btn-dark,
  .btn--primary,
  .btn--secondary,
  .btn--success,
  .btn--danger,
  .btn--info,
  .btn--dark,
  .btn--base,
  .btn--base-2,
  .cmn--btn
):not([class*="outline"]):not(.outline):not(.outline-2),
body.kachi-dark-mode :is(
  .btn-primary,
  .btn-secondary,
  .btn-success,
  .btn-danger,
  .btn-info,
  .btn-dark,
  .btn--primary,
  .btn--secondary,
  .btn--success,
  .btn--danger,
  .btn--info,
  .btn--dark,
  .btn--base,
  .btn--base-2,
  .cmn--btn
):not([class*="outline"]):not(.outline):not(.outline-2) {
  color: #ffffff !important;
}

html[data-theme="dark"] body :is(
  .btn-primary,
  .btn-secondary,
  .btn-success,
  .btn-danger,
  .btn-info,
  .btn-dark,
  .btn--primary,
  .btn--secondary,
  .btn--success,
  .btn--danger,
  .btn--info,
  .btn--dark,
  .btn--base,
  .btn--base-2,
  .cmn--btn
):not([class*="outline"]):not(.outline):not(.outline-2) *,
body.kachi-dark-mode :is(
  .btn-primary,
  .btn-secondary,
  .btn-success,
  .btn-danger,
  .btn-info,
  .btn-dark,
  .btn--primary,
  .btn--secondary,
  .btn--success,
  .btn--danger,
  .btn--info,
  .btn--dark,
  .btn--base,
  .btn--base-2,
  .cmn--btn
):not([class*="outline"]):not(.outline):not(.outline-2) * {
  color: inherit !important;
  fill: currentColor !important;
}

html[data-theme="dark"] body .btn:not([class*="outline"]):not(.btn-link):not(.btn-close),
html[data-theme="dark"] body [class*="btn--"]:not([class*="outline"]),
html[data-theme="dark"] body .cmn--btn,
body.kachi-dark-mode .btn:not([class*="outline"]):not(.btn-link):not(.btn-close),
body.kachi-dark-mode [class*="btn--"]:not([class*="outline"]),
body.kachi-dark-mode .cmn--btn {
  color: #ffffff !important;
}

html[data-theme="dark"] body :is(.btn-warning, .btn--warning, .btn--base-3):not([class*="outline"]),
body.kachi-dark-mode :is(.btn-warning, .btn--warning, .btn--base-3):not([class*="outline"]) {
  color: #172033 !important;
}

html[data-theme="dark"] body :is(.btn-warning, .btn--warning, .btn--base-3):not([class*="outline"]) *,
body.kachi-dark-mode :is(.btn-warning, .btn--warning, .btn--base-3):not([class*="outline"]) * {
  color: inherit !important;
  fill: currentColor !important;
}

html[data-theme="dark"] body :is(
  .btn-outline-primary,
  .btn-outline-secondary,
  .btn-outline-success,
  .btn-outline-danger,
  .btn-outline-info,
  .btn-outline--base,
  .btn--base.outline,
  .btn--base.outline-2
):not(:hover):not(:focus):not(.active),
body.kachi-dark-mode :is(
  .btn-outline-primary,
  .btn-outline-secondary,
  .btn-outline-success,
  .btn-outline-danger,
  .btn-outline-info,
  .btn-outline--base,
  .btn--base.outline,
  .btn--base.outline-2
):not(:hover):not(:focus):not(.active) {
  background: transparent !important;
  color: var(--kt-dark-link) !important;
}

html[data-theme="dark"] body :is(
  .btn-outline-primary,
  .btn-outline-secondary,
  .btn-outline-success,
  .btn-outline-danger,
  .btn-outline-info,
  .btn-outline--base,
  .btn--base.outline,
  .btn--base.outline-2
):is(:hover, :focus, .active),
body.kachi-dark-mode :is(
  .btn-outline-primary,
  .btn-outline-secondary,
  .btn-outline-success,
  .btn-outline-danger,
  .btn-outline-info,
  .btn-outline--base,
  .btn--base.outline,
  .btn--base.outline-2
):is(:hover, :focus, .active) {
  color: #ffffff !important;
}

html[data-theme="dark"] body .btn *,
html[data-theme="dark"] body [class*="btn--"] *,
html[data-theme="dark"] body .cmn--btn *,
body.kachi-dark-mode .btn *,
body.kachi-dark-mode [class*="btn--"] *,
body.kachi-dark-mode .cmn--btn * {
  color: inherit !important;
  fill: currentColor !important;
}

html[data-theme="dark"] body .btn-close {
  filter: invert(1) grayscale(1) brightness(1.8);
}

html[data-theme="dark"] body .workspace-mode-toggle,
html[data-theme="dark"] body .dark-mode-toggle {
  background: var(--kt-dark-surface-raised) !important;
  border-color: var(--kt-dark-border) !important;
  color: #ffffff !important;
}

/* Keep semantic alerts readable without turning them into pale light boxes. */
html[data-theme="dark"] body .alert-info {
  background: rgba(56, 189, 248, 0.12) !important;
  border-color: rgba(56, 189, 248, 0.35) !important;
  color: #a5e7ff !important;
}

html[data-theme="dark"] body .alert-success {
  background: rgba(34, 197, 94, 0.12) !important;
  border-color: rgba(34, 197, 94, 0.35) !important;
  color: #a7f3c0 !important;
}

html[data-theme="dark"] body .alert-warning {
  background: rgba(245, 158, 11, 0.13) !important;
  border-color: rgba(245, 158, 11, 0.38) !important;
  color: #fde2a1 !important;
}

html[data-theme="dark"] body .alert-danger {
  background: rgba(239, 68, 68, 0.13) !important;
  border-color: rgba(239, 68, 68, 0.38) !important;
  color: #fecaca !important;
}

html[data-theme="dark"] body .alert-info *,
html[data-theme="dark"] body .alert-success *,
html[data-theme="dark"] body .alert-warning *,
html[data-theme="dark"] body .alert-danger * {
  color: inherit !important;
}

html[data-theme="dark"] body .alert *,
html[data-theme="dark"] body .badge,
html[data-theme="dark"] body .btn,
html[data-theme="dark"] body [class*="btn--"] {
  text-shadow: none;
}

html[data-theme="dark"] body img {
  color-scheme: normal;
}

/* Public header logo: use the footer's white logo against dark navigation. */
.workspace-brand__logo--dark {
  display: none !important;
}

html[data-theme="dark"] body.kachi-frontend-body .workspace-brand__logo--light,
body.kachi-dark-mode.kachi-frontend-body .workspace-brand__logo--light {
  display: none !important;
}

html[data-theme="dark"] body.kachi-frontend-body .workspace-brand__logo--dark,
body.kachi-dark-mode.kachi-frontend-body .workspace-brand__logo--dark {
  display: block !important;
}

/*
 * Some public-page cards intentionally keep a light surface in dark mode.
 * Give those cards their own dark typography variables so inherited page
 * colors never produce light text on a light background.
 */
html[data-theme="dark"] body.kachi-frontend-body :is(
  .card,
  .card-body,
  .global-card,
  .base-card,
  .category-card,
  .kachi-course-card,
  .details-card1,
  .details-card2,
  .review-card,
  .review-box,
  .contact-card,
  .cookies-card,
  .body-card,
  .price-cardBody,
  .key-card
),
body.kachi-dark-mode.kachi-frontend-body :is(
  .card,
  .card-body,
  .global-card,
  .base-card,
  .category-card,
  .kachi-course-card,
  .details-card1,
  .details-card2,
  .review-card,
  .review-box,
  .contact-card,
  .cookies-card,
  .body-card,
  .price-cardBody,
  .key-card
) {
  --kt-surface: #f8fafc;
  --kt-text: #172033;
  --kt-muted: #536277;
  --kt-border: #d5dee9;
  background-color: #f8fafc !important;
  background-image: none !important;
  border-color: #d5dee9 !important;
  color: #172033 !important;
  box-shadow: 0 8px 24px rgba(2, 8, 23, 0.18) !important;
}

html[data-theme="dark"] body.kachi-frontend-body :is(
  .card,
  .global-card,
  .base-card,
  .category-card,
  .kachi-course-card,
  .details-card1,
  .details-card2,
  .review-card,
  .review-box,
  .contact-card,
  .cookies-card,
  .body-card,
  .price-cardBody,
  .key-card
) :is(p, li, small, label, .text-muted, .sub-title, .subtitle, .category, .date-time, .meta, .description),
body.kachi-dark-mode.kachi-frontend-body :is(
  .card,
  .global-card,
  .base-card,
  .category-card,
  .kachi-course-card,
  .details-card1,
  .details-card2,
  .review-card,
  .review-box,
  .contact-card,
  .cookies-card,
  .body-card,
  .price-cardBody,
  .key-card
) :is(p, li, small, label, .text-muted, .sub-title, .subtitle, .category, .date-time, .meta, .description) {
  color: #536277 !important;
}

html[data-theme="dark"] body.kachi-frontend-body :is(
  .card,
  .global-card,
  .base-card,
  .category-card,
  .kachi-course-card,
  .details-card1,
  .details-card2,
  .review-card,
  .review-box,
  .contact-card,
  .cookies-card,
  .body-card,
  .price-cardBody,
  .key-card
) :is(h1, h2, h3, h4, h5, h6, .title, .name, .card-title, .price, .dis-price, .kachi-course-card__price strong, .kachi-installment-item strong),
body.kachi-dark-mode.kachi-frontend-body :is(
  .card,
  .global-card,
  .base-card,
  .category-card,
  .kachi-course-card,
  .details-card1,
  .details-card2,
  .review-card,
  .review-box,
  .contact-card,
  .cookies-card,
  .body-card,
  .price-cardBody,
  .key-card
) :is(h1, h2, h3, h4, h5, h6, .title, .name, .card-title, .price, .dis-price, .kachi-course-card__price strong, .kachi-installment-item strong) {
  color: #172033 !important;
}

html[data-theme="dark"] body.kachi-frontend-body :is(
  .card,
  .global-card,
  .base-card,
  .category-card,
  .kachi-course-card,
  .details-card1,
  .details-card2,
  .review-card,
  .review-box,
  .contact-card,
  .cookies-card,
  .body-card,
  .price-cardBody,
  .key-card
) a:not(.btn):not([class*="btn--"]):not(.cmn--btn):not(.kachi-course-card__enroll),
body.kachi-dark-mode.kachi-frontend-body :is(
  .card,
  .global-card,
  .base-card,
  .category-card,
  .kachi-course-card,
  .details-card1,
  .details-card2,
  .review-card,
  .review-box,
  .contact-card,
  .cookies-card,
  .body-card,
  .price-cardBody,
  .key-card
) a:not(.btn):not([class*="btn--"]):not(.cmn--btn):not(.kachi-course-card__enroll) {
  color: #174f7a !important;
}

html[data-theme="dark"] body.kachi-frontend-body :is(.card-header, .card-footer),
body.kachi-dark-mode.kachi-frontend-body :is(.card-header, .card-footer) {
  background: #eef3f8 !important;
  border-color: #d5dee9 !important;
  color: #172033 !important;
}

html[data-theme="dark"] body.kachi-frontend-body :is(.btn, [class*="btn--"], .cmn--btn, .kachi-course-card__enroll):not([class*="outline"]),
body.kachi-dark-mode.kachi-frontend-body :is(.btn, [class*="btn--"], .cmn--btn, .kachi-course-card__enroll):not([class*="outline"]) {
  color: #ffffff !important;
}

html[data-theme="dark"] body.kachi-frontend-body :is(.btn-warning, .btn--warning, .btn--base-3):not([class*="outline"]),
body.kachi-dark-mode.kachi-frontend-body :is(.btn-warning, .btn--warning, .btn--base-3):not([class*="outline"]) {
  color: #172033 !important;
}

/* Homepage cards immediately below the hero keep a light surface and dark copy. */
html[data-theme="dark"] body.kachi-frontend-body :is(
  .kachi-home-pillar,
  .kachi-home-operate__steps > li
),
body.kachi-dark-mode.kachi-frontend-body :is(
  .kachi-home-pillar,
  .kachi-home-operate__steps > li
) {
  background: #f8fafc !important;
  border-color: #d5dee9 !important;
  color: #172033 !important;
  box-shadow: 0 8px 24px rgba(2, 8, 23, 0.18) !important;
}

html[data-theme="dark"] body.kachi-frontend-body .kachi-home-pillar h3,
html[data-theme="dark"] body.kachi-frontend-body .kachi-home-operate__steps strong,
body.kachi-dark-mode.kachi-frontend-body .kachi-home-pillar h3,
body.kachi-dark-mode.kachi-frontend-body .kachi-home-operate__steps strong {
  color: #172033 !important;
}

html[data-theme="dark"] body.kachi-frontend-body .kachi-home-pillar p,
html[data-theme="dark"] body.kachi-frontend-body .kachi-home-operate__steps > li > span,
body.kachi-dark-mode.kachi-frontend-body .kachi-home-pillar p,
body.kachi-dark-mode.kachi-frontend-body .kachi-home-operate__steps > li > span {
  color: #536277 !important;
}

/* Workspace landing cards use the same deliberate light-card contrast. */
html[data-theme="dark"] body.kachi-frontend-body :is(
  .ws-landing-feature-card,
  .ws-landing-plan-group__header,
  .ws-landing-plan-card,
  .ws-landing-classroom__card
),
body.kachi-dark-mode.kachi-frontend-body :is(
  .ws-landing-feature-card,
  .ws-landing-plan-group__header,
  .ws-landing-plan-card,
  .ws-landing-classroom__card
) {
  background: #f8fafc !important;
  border-color: #d5dee9 !important;
  color: #172033 !important;
  box-shadow: 0 8px 24px rgba(2, 8, 23, 0.18) !important;
}

html[data-theme="dark"] body.kachi-frontend-body :is(
  .ws-landing-classroom__rate,
  .ws-landing-classroom__form
),
body.kachi-dark-mode.kachi-frontend-body :is(
  .ws-landing-classroom__rate,
  .ws-landing-classroom__form
) {
  background: #eef3f8 !important;
  border-color: #d5dee9 !important;
  color: #172033 !important;
}

html[data-theme="dark"] body.kachi-frontend-body :is(
  .ws-landing-feature-card h3,
  .ws-landing-plan-group__header h3,
  .ws-landing-plan-card h4,
  .ws-landing-classroom__info h4,
  .ws-landing-classroom__rate strong
),
body.kachi-dark-mode.kachi-frontend-body :is(
  .ws-landing-feature-card h3,
  .ws-landing-plan-group__header h3,
  .ws-landing-plan-card h4,
  .ws-landing-classroom__info h4,
  .ws-landing-classroom__rate strong
) {
  color: #172033 !important;
}

html[data-theme="dark"] body.kachi-frontend-body :is(
  .ws-landing-feature-card p,
  .ws-landing-plan-group__header p,
  .ws-landing-plan-card__period,
  .ws-landing-plan-card__features li,
  .ws-landing-classroom__info > p,
  .ws-landing-classroom__rate span,
  .ws-landing-classroom__form .form-label
),
body.kachi-dark-mode.kachi-frontend-body :is(
  .ws-landing-feature-card p,
  .ws-landing-plan-group__header p,
  .ws-landing-plan-card__period,
  .ws-landing-plan-card__features li,
  .ws-landing-classroom__info > p,
  .ws-landing-classroom__rate span,
  .ws-landing-classroom__form .form-label
) {
  color: #536277 !important;
}

html[data-theme="dark"] body.kachi-frontend-body .ws-landing-classroom,
body.kachi-dark-mode.kachi-frontend-body .ws-landing-classroom {
  background: linear-gradient(180deg, #101621 0%, #0b0f17 100%) !important;
}

html[data-theme="dark"] body.kachi-frontend-body .ws-landing-classroom__form .form-control,
body.kachi-dark-mode.kachi-frontend-body .ws-landing-classroom__form .form-control {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #172033 !important;
}

/* Connect directory sidebar and service cards should be genuinely dark. */
html[data-theme="dark"] body.kachi-frontend-body .ws-connect-sidebar,
html[data-theme="dark"] body.kachi-frontend-body .ws-connect-card,
body.kachi-dark-mode.kachi-frontend-body .ws-connect-sidebar,
body.kachi-dark-mode.kachi-frontend-body .ws-connect-card {
  background: var(--kt-dark-surface) !important;
  border: 1px solid var(--kt-dark-border) !important;
  color: var(--kt-dark-text) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28) !important;
}

html[data-theme="dark"] body.kachi-frontend-body .ws-connect-sidebar__title,
html[data-theme="dark"] body.kachi-frontend-body :is(.ws-connect-card__username, .ws-connect-card__title),
body.kachi-dark-mode.kachi-frontend-body .ws-connect-sidebar__title,
body.kachi-dark-mode.kachi-frontend-body :is(.ws-connect-card__username, .ws-connect-card__title) {
  color: var(--kt-dark-text) !important;
  border-color: var(--kt-dark-border) !important;
}

html[data-theme="dark"] body.kachi-frontend-body .ws-connect-sidebar__list a,
body.kachi-dark-mode.kachi-frontend-body .ws-connect-sidebar__list a {
  color: var(--kt-dark-text-soft) !important;
}

html[data-theme="dark"] body.kachi-frontend-body .ws-connect-sidebar__list a:is(:hover, .active),
body.kachi-dark-mode.kachi-frontend-body .ws-connect-sidebar__list a:is(:hover, .active) {
  background: rgba(96, 165, 250, 0.16) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.kachi-frontend-body .ws-connect-sidebar__list .badge,
body.kachi-dark-mode.kachi-frontend-body .ws-connect-sidebar__list .badge {
  background: var(--kt-dark-surface-raised) !important;
  border-color: var(--kt-dark-border) !important;
  color: var(--kt-dark-text-soft) !important;
}

html[data-theme="dark"] body.kachi-frontend-body .ws-connect-sidebar__list a.active .badge,
body.kachi-dark-mode.kachi-frontend-body .ws-connect-sidebar__list a.active .badge {
  background: #2563eb !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.kachi-frontend-body .ws-connect-card__desc,
html[data-theme="dark"] body.kachi-frontend-body .ws-connect-card small,
body.kachi-dark-mode.kachi-frontend-body .ws-connect-card__desc,
body.kachi-dark-mode.kachi-frontend-body .ws-connect-card small {
  color: var(--kt-dark-text-muted) !important;
}

html[data-theme="dark"] body.kachi-frontend-body .ws-connect-card__price,
body.kachi-dark-mode.kachi-frontend-body .ws-connect-card__price {
  background: var(--kt-dark-surface-raised) !important;
  border: 1px solid var(--kt-dark-border) !important;
}

html[data-theme="dark"] body.kachi-frontend-body .ws-connect-card__btn--web,
body.kachi-dark-mode.kachi-frontend-body .ws-connect-card__btn--web {
  background: var(--kt-dark-surface-raised) !important;
  color: var(--kt-dark-text-soft) !important;
}

/* Keep login and dashboard actions readable against their blue backgrounds. */
html[data-theme="dark"] body.kachi-frontend-body :is(
  .workspace-auth,
  .course-home__login,
  .kachi-auth-form .btn--base,
  .workspace-auth-form .btn--base
),
body.kachi-dark-mode.kachi-frontend-body :is(
  .workspace-auth,
  .course-home__login,
  .kachi-auth-form .btn--base,
  .workspace-auth-form .btn--base
) {
  background: linear-gradient(135deg, #2563eb, #0e7490) !important;
  border-color: transparent !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.kachi-frontend-body :is(
  .workspace-auth,
  .course-home__login,
  .kachi-auth-form .btn--base,
  .workspace-auth-form .btn--base
) *,
body.kachi-dark-mode.kachi-frontend-body :is(
  .workspace-auth,
  .course-home__login,
  .kachi-auth-form .btn--base,
  .workspace-auth-form .btn--base
) * {
  color: inherit !important;
}

/* Give all three login experiences a comfortable desktop content width. */
body.kachi-frontend-body :is(.kachi-auth-shell, .workspace-auth-shell) {
  min-height: 100vh !important;
  padding: clamp(32px, 6vw, 72px) 24px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

body.kachi-frontend-body .kachi-auth-card {
  max-width: 480px !important;
  padding: 40px 38px 32px !important;
}

body.kachi-frontend-body .workspace-auth-card {
  max-width: 470px !important;
  padding: 40px 38px 32px !important;
}

body.kachi-frontend-body :is(.kachi-auth-form, .workspace-auth-form) .form-control {
  min-height: 48px;
  padding: 11px 14px !important;
}

body.kachi-frontend-body :is(.kachi-auth-form, .workspace-auth-form) .btn--base {
  min-height: 48px;
  background: linear-gradient(135deg, #2563eb, #0e7490) !important;
  background-color: #2563eb !important;
  border-color: transparent !important;
  color: #ffffff !important;
  font-weight: 800;
  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.24) !important;
}

body.kachi-frontend-body :is(.kachi-auth-form, .workspace-auth-form) button[type="submit"].btn--base:hover,
body.kachi-frontend-body :is(.kachi-auth-form, .workspace-auth-form) button[type="submit"].btn--base:focus {
  background: linear-gradient(135deg, #1d4ed8, #0e7490) !important;
  background-color: #1d4ed8 !important;
  border-color: transparent !important;
  color: #ffffff !important;
}

body.kachi-frontend-body :is(.kachi-auth-form, .workspace-auth-form) button[type="submit"].btn--base *,
body.kachi-frontend-body :is(.kachi-auth-form, .workspace-auth-form) button[type="submit"].btn--base:hover *,
body.kachi-frontend-body :is(.kachi-auth-form, .workspace-auth-form) button[type="submit"].btn--base:focus * {
  color: #ffffff !important;
}

@media (max-width: 575.98px) {
  body.kachi-frontend-body :is(.kachi-auth-shell, .workspace-auth-shell) {
    align-items: flex-start;
    padding: 24px 14px !important;
  }

  body.kachi-frontend-body :is(.kachi-auth-card, .workspace-auth-card) {
    max-width: 100% !important;
    padding: 34px 22px 26px !important;
  }
}

html.theme-transition body,
html.theme-transition body * {
  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease;
}

@media (prefers-reduced-motion: reduce) {
  html.theme-transition body,
  html.theme-transition body * {
    transition: none !important;
  }
}

/* Final dashboard coverage: late light-theme rules must not leak into dark mode. */
html[data-theme="dark"] body.kachi-dashboard-body :is(
  .dashboard-body,
  .kachi-dashboard-main,
  .kachi-dashboard-content
) {
  background-color: var(--kt-dark-canvas) !important;
  color: var(--kt-dark-text) !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .kachi-dashboard-content :is(
  .dashboard-card,
  .chart-bg,
  .kachi-course-slider-section,
  .kachi-dash-timetable-card,
  .kachi-dash-timetable-card .card-body,
  .base-card,
  .base-card .content-wrap,
  .base-card .carn-btm,
  .custom--card,
  .card,
  .card-body,
  .table-responsive
) {
  background-color: var(--kt-dark-surface) !important;
  background-image: none !important;
  border-color: var(--kt-dark-border) !important;
  color: var(--kt-dark-text) !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .kachi-dashboard-content :is(
  .dashboard-card__amount,
  .dashboard-card__title,
  .kachi-course-slider-title,
  .base-card .title,
  .base-card .price,
  .base-card .category,
  .base-card .product-status p,
  .base-card .dis-price,
  .kachi-dash-timetable-card h1,
  .kachi-dash-timetable-card h2,
  .kachi-dash-timetable-card h3,
  .kachi-dash-timetable-card h4,
  .kachi-dash-timetable-card h5,
  .kachi-dash-timetable-card h6
) {
  color: var(--kt-dark-text) !important;
  -webkit-text-fill-color: currentColor !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .kachi-dashboard-content :is(
  .dashboard-card__title,
  .base-card .category,
  .base-card .product-status p,
  .base-card .dis-price,
  .kachi-course-sub,
  .kachi-slot-empty,
  .text-muted
) {
  color: var(--kt-dark-text-muted) !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .dashboard-card__icon {
  background: rgba(96, 165, 250, 0.16) !important;
  border: 1px solid rgba(125, 211, 252, 0.24) !important;
  color: #bae6fd !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .dashboard-card__icon * {
  color: inherit !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .kachi-slider-btn {
  background: var(--kt-dark-surface-raised) !important;
  border-color: var(--kt-dark-border) !important;
  color: var(--kt-dark-text-soft) !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .kachi-slider-btn:hover,
html[data-theme="dark"] body.kachi-dashboard-body .kachi-slider-btn:focus {
  background: #2563eb !important;
  border-color: #60a5fa !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .kachi-weekly-timetable-wrap .kachi-weekly-table tbody tr:nth-child(even),
html[data-theme="dark"] body.kachi-dashboard-body .kachi-weekly-timetable-wrap .kachi-weekly-table tbody tr:nth-child(odd),
html[data-theme="dark"] body.kachi-dashboard-body .kachi-weekly-timetable-wrap .kachi-weekly-table tbody th,
html[data-theme="dark"] body.kachi-dashboard-body .kachi-weekly-timetable-wrap .kachi-weekly-table tbody td {
  background: var(--kt-dark-surface) !important;
  border-color: var(--kt-dark-border) !important;
  color: var(--kt-dark-text-soft) !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .kachi-weekly-timetable-wrap .kachi-weekly-table tbody tr:hover > * {
  background: var(--kt-dark-surface-hover) !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .kachi-weekly-timetable-wrap .kachi-slot-line {
  background: rgba(56, 189, 248, 0.14) !important;
  border-color: rgba(125, 211, 252, 0.25) !important;
  color: #bae6fd !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .kachi-weekly-timetable-wrap .table-warning > * {
  background: rgba(245, 158, 11, 0.12) !important;
  color: #fcd34d !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .apexcharts-text,
html[data-theme="dark"] body.kachi-dashboard-body .apexcharts-legend-text {
  fill: var(--kt-dark-text-muted) !important;
  color: var(--kt-dark-text-muted) !important;
}

html[data-theme="dark"] body.kachi-dashboard-body .apexcharts-gridline {
  stroke: var(--kt-dark-border) !important;
}

/* Explicit button fills prevent blue link inheritance from hiding labels. */
html[data-theme="dark"] body :is(.btn--base, .btn--base-2, .cmn--btn):not([class*="outline"]):not(.outline):not(.outline-2) {
  background: linear-gradient(135deg, #2563eb, #0e7490) !important;
  background-color: #2563eb !important;
  border-color: #3b82f6 !important;
  color: #ffffff !important;
  text-shadow: none !important;
}

html[data-theme="dark"] body :is(.btn-outline--base, .btn--base.outline, .btn--base.outline-2) {
  background: transparent !important;
  border-color: #60a5fa !important;
  color: #93c5fd !important;
}

html[data-theme="dark"] body :is(.btn-outline--base, .btn--base.outline, .btn--base.outline-2):is(:hover, :focus, .active) {
  background: #2563eb !important;
  border-color: #60a5fa !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body .kachi-attendance-nudge__btn {
  background: #f59e0b !important;
  border-color: #f59e0b !important;
  color: #111827 !important;
}

html[data-theme="dark"] body .kachi-attendance-alert__btn {
  background: #ffffff !important;
  border-color: #ffffff !important;
  color: #991b1b !important;
}

html[data-theme="dark"] body.kachi-frontend-body .site-boxed-layout {
  background: var(--kt-dark-canvas) !important;
  color: var(--kt-dark-text) !important;
}
