/*
 * Kachitech unified dark surfaces
 * Loaded last across admin, student, instructor, and workspace dashboards.
 */

html[data-theme="dark"] {
  color-scheme: dark;
  --kds-canvas: #0b1120;
  --kds-surface: #131c2b;
  --kds-surface-raised: #182335;
  --kds-control: #101827;
  --kds-hover: #1d2a3f;
  --kds-border: #2a3950;
  --kds-border-strong: #3a4c66;
  --kds-text: #edf3fb;
  --kds-text-soft: #c5d0df;
  --kds-text-muted: #94a3b8;
  --kds-accent: #60a5fa;
  --kds-accent-strong: #2563eb;
  --bs-body-bg: var(--kds-canvas);
  --bs-body-color: var(--kds-text);
  --bs-border-color: var(--kds-border);
  --bs-secondary-color: var(--kds-text-muted);
  --bs-tertiary-bg: var(--kds-surface-raised);
}

html[data-theme="dark"] body {
  background: var(--kds-canvas) !important;
  color: var(--kds-text) !important;
}

/* Remove inherited light patches from dashboard containers. */
html[data-theme="dark"] body :is(
  .body-wrapper,
  .bodywrapper__inner,
  .dashboard-body,
  .kachi-dashboard-main,
  .kachi-dashboard-content,
  .kachi-workspace-main,
  .workspace-content,
  .course-home
) {
  background-color: var(--kds-canvas) !important;
  background-image: none !important;
  color: var(--kds-text) !important;
}

html[data-theme="dark"] body :is(
  .card,
  .card-body,
  .card-footer,
  .custom--card,
  .base--card,
  .base-card,
  .base-card .content-wrap,
  .base-card .carn-btm,
  .dashboard-card,
  .dashboard-widget,
  .dash-box,
  .chart-bg,
  .discover-box,
  .profile-wrap,
  .dashboard_profile_wrap,
  .workspace-card,
  .plan-card,
  .pricing-card,
  .table-responsive,
  .list-group-item,
  .accordion-item,
  .accordion-body,
  .modal-content,
  .modal-body,
  .offcanvas,
  .dropdown-menu
) {
  background-color: var(--kds-surface) !important;
  background-image: none !important;
  border-color: var(--kds-border) !important;
  color: var(--kds-text) !important;
}

html[data-theme="dark"] body :is(
  .bg-white,
  .bg-light,
  .bg--white,
  .bg--light,
  .table-light,
  [class*="bg--light"]
) {
  background-color: var(--kds-surface-raised) !important;
  background-image: none !important;
  color: var(--kds-text) !important;
}

html[data-theme="dark"] body :is(.bg-primary, .bg--primary) {
  background-color: #1d4ed8 !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body :is(.bg-success, .bg--success) {
  background-color: #166534 !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body :is(.bg-danger, .bg--danger) {
  background-color: #991b1b !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body :is(.bg-info, .bg--info) {
  background-color: #155e75 !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body :is(.bg-warning, .bg--warning) {
  background-color: #d97706 !important;
  color: #111827 !important;
}

html[data-theme="dark"] body :is(
  .bg-primary,
  .bg--primary,
  .bg-success,
  .bg--success,
  .bg-danger,
  .bg--danger,
  .bg-info,
  .bg--info,
  .bg-warning,
  .bg--warning
) > :is(.card-header, .card-body, .card-footer) {
  background: transparent !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
}

html[data-theme="dark"] body :is(
  .card-header,
  .modal-header,
  .modal-footer,
  .offcanvas-header,
  .accordion-header,
  .toast-header,
  .dropdown-header
) {
  background-color: var(--kds-surface-raised) !important;
  background-image: none !important;
  border-color: var(--kds-border) !important;
  color: var(--kds-text) !important;
}

/* Labels must sit naturally on the dark surface, never on white rectangles. */
html[data-theme="dark"] body label,
html[data-theme="dark"] body :is(.form-label, .form--label, .control-label) {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  color: var(--kds-text-soft) !important;
  -webkit-text-fill-color: currentColor !important;
}

html[data-theme="dark"] body .form-group > :is(label, .form-label, .form--label) {
  font-weight: 600;
}

html[data-theme="dark"] body :is(
  h1, h2, h3, h4, h5, h6,
  .card-title,
  .modal-title,
  .page-title,
  strong,
  b
) {
  color: var(--kds-text) !important;
  -webkit-text-fill-color: currentColor !important;
}

html[data-theme="dark"] body :is(
  p,
  td,
  dd,
  li,
  .text-body,
  .text-dark,
  .text-black
) {
  color: var(--kds-text-soft) !important;
}

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

html[data-theme="dark"] body .text-white,
html[data-theme="dark"] body :is(.bg-primary, .bg--primary, .bg-success, .bg--success, .bg-danger, .bg--danger, .bg-info, .bg--info) :is(h1, h2, h3, h4, h5, h6, p, span, small, strong, a, i) {
  color: #ffffff !important;
  -webkit-text-fill-color: currentColor !important;
}

html[data-theme="dark"] body :is(.bg-warning, .bg--warning) :is(h1, h2, h3, h4, h5, h6, p, span, small, strong, a, i) {
  color: #111827 !important;
  -webkit-text-fill-color: currentColor !important;
}

html[data-theme="dark"] body a:not(.btn):not([class*="btn-"]) {
  color: #8ec5ff;
}

html[data-theme="dark"] body a:not(.btn):not([class*="btn-"]):hover {
  color: #bfdbfe;
}

/* Form controls use a slightly inset surface and readable native states. */
html[data-theme="dark"] body :is(
  .form-control,
  .form--control,
  .form-select,
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  select,
  textarea
) {
  background-color: var(--kds-control) !important;
  background-image: none !important;
  border-color: var(--kds-border) !important;
  color: var(--kds-text) !important;
  -webkit-text-fill-color: currentColor !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body :is(
  .form-control,
  .form--control,
  .form-select,
  input,
  textarea
)::placeholder {
  color: #718198 !important;
  opacity: 1;
}

html[data-theme="dark"] body :is(
  .form-control,
  .form--control,
  .form-select,
  input,
  select,
  textarea
):focus {
  background-color: #111c2d !important;
  border-color: var(--kds-accent) !important;
  color: var(--kds-text) !important;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.16) !important;
}

html[data-theme="dark"] body :is(
  .form-control,
  .form--control,
  .form-select,
  input,
  select,
  textarea
):is(:disabled, [readonly]) {
  background-color: #172133 !important;
  border-color: #29384d !important;
  color: #b8c4d4 !important;
  opacity: 1;
}

html[data-theme="dark"] body select option {
  background: var(--kds-control);
  color: var(--kds-text);
}

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-box-shadow: 0 0 0 1000px var(--kds-control) inset !important;
  -webkit-text-fill-color: var(--kds-text) !important;
  caret-color: var(--kds-text);
}

html[data-theme="dark"] body :is(.input-group-text, .form-control-file-label) {
  background: var(--kds-surface-raised) !important;
  border-color: var(--kds-border) !important;
  color: var(--kds-text-soft) !important;
}

html[data-theme="dark"] body input[type="file"]::file-selector-button {
  background: var(--kds-surface-raised);
  border: 0;
  border-right: 1px solid var(--kds-border);
  color: var(--kds-text);
}

html[data-theme="dark"] body :is(.form-check-input, input[type="checkbox"], input[type="radio"]) {
  background-color: var(--kds-control) !important;
  border-color: var(--kds-border-strong) !important;
}

html[data-theme="dark"] body :is(.form-check-input, input[type="checkbox"], input[type="radio"]):checked {
  background-color: var(--kds-accent-strong) !important;
  border-color: var(--kds-accent) !important;
}

/* Tables share the same surface hierarchy as cards. */
html[data-theme="dark"] body .table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--kds-text-soft);
  --bs-table-border-color: var(--kds-border);
  --bs-table-striped-bg: rgba(255, 255, 255, 0.025);
  --bs-table-striped-color: var(--kds-text-soft);
  --bs-table-hover-bg: var(--kds-hover);
  --bs-table-hover-color: var(--kds-text);
  color: var(--kds-text-soft) !important;
}

html[data-theme="dark"] body .table > :not(caption) > * > * {
  background-color: transparent !important;
  border-color: var(--kds-border) !important;
  color: inherit !important;
  box-shadow: none !important;
}

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

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

/* Buttons have explicit fill/text pairings to prevent blue-on-blue labels. */
html[data-theme="dark"] body :is(
  .btn-primary,
  .btn--primary,
  .btn--base,
  .btn--base-2,
  .btn-global,
  .cmn--btn
):not([class*="outline"]):not(.outline):not(.outline-2) {
  background: linear-gradient(135deg, #2563eb, #1d4ed8) !important;
  border-color: #3b82f6 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: currentColor !important;
}

html[data-theme="dark"] body :is(.btn-success, .btn--success) {
  background: #15803d !important;
  border-color: #22c55e !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body :is(.btn-danger, .btn--danger) {
  background: #b91c1c !important;
  border-color: #ef4444 !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body :is(.btn-warning, .btn--warning) {
  background: #f59e0b !important;
  border-color: #fbbf24 !important;
  color: #111827 !important;
}

html[data-theme="dark"] body :is(.btn-info, .btn--info) {
  background: #0e7490 !important;
  border-color: #22d3ee !important;
  color: #ffffff !important;
}

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

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

html[data-theme="dark"] body :is(
  .btn-outline-primary,
  .btn-outline--primary,
  .btn-outline--base,
  .btn--base.outline,
  .btn--base.outline-2
):hover {
  background: var(--kds-accent-strong) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body .btn :is(i, span),
html[data-theme="dark"] body [class*="btn-"] :is(i, span) {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}

html[data-theme="dark"] body .btn:disabled,
html[data-theme="dark"] body .btn.disabled {
  opacity: 0.6;
}

/* Common third-party widgets. */
html[data-theme="dark"] body :is(
  .select2-container--default .select2-selection--single,
  .select2-container--default .select2-selection--multiple,
  .select2-dropdown,
  .select2-search__field
) {
  background: var(--kds-control) !important;
  border-color: var(--kds-border) !important;
  color: var(--kds-text) !important;
}

html[data-theme="dark"] body .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--kds-text) !important;
}

html[data-theme="dark"] body .select2-container--default .select2-results__option {
  background: var(--kds-surface) !important;
  color: var(--kds-text-soft) !important;
}

html[data-theme="dark"] body .select2-container--default .select2-results__option--highlighted {
  background: var(--kds-accent-strong) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body :is(
  .note-editor.note-frame,
  .note-toolbar,
  .note-editing-area,
  .note-editable,
  .note-statusbar
) {
  background: var(--kds-control) !important;
  border-color: var(--kds-border) !important;
  color: var(--kds-text) !important;
}

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

html[data-theme="dark"] body :is(.nav-tabs, .pagination, hr) {
  border-color: var(--kds-border) !important;
}

html[data-theme="dark"] body .nav-tabs .nav-link {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--kds-text-muted) !important;
}

html[data-theme="dark"] body .nav-tabs .nav-link.active {
  background: var(--kds-surface-raised) !important;
  border-color: var(--kds-border) !important;
  color: var(--kds-text) !important;
}

html[data-theme="dark"] body .page-link {
  background: var(--kds-surface) !important;
  border-color: var(--kds-border) !important;
  color: var(--kds-text-soft) !important;
}

html[data-theme="dark"] body .page-item.active .page-link {
  background: var(--kds-accent-strong) !important;
  border-color: var(--kds-accent) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body :is(.alert, .toast, .popover) {
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.28) !important;
}

html[data-theme="dark"] body .border,
html[data-theme="dark"] body [class*="border-"] {
  border-color: var(--kds-border) !important;
}

/* Authentication pages: one calm dark surface across every account type. */
html[data-theme="dark"] body :is(
  .site-boxed-layout,
  .kachi-frontend-inner-canvas,
  .kachi-auth-shell,
  .workspace-auth-shell,
  .kachi-admin-login-page,
  .login_area
) {
  background-color: var(--kds-canvas) !important;
  background-image:
    radial-gradient(circle at 12% 8%, rgba(37, 99, 235, 0.13), transparent 32%),
    radial-gradient(circle at 88% 92%, rgba(14, 165, 233, 0.08), transparent 30%) !important;
  color: var(--kds-text) !important;
}

.kachi-auth-logo--dark {
  display: none;
}

html[data-theme="dark"] body .kachi-auth-logo--light {
  display: none !important;
}

html[data-theme="dark"] body .kachi-auth-logo--dark {
  display: inline-block !important;
}

html[data-theme="dark"] body :is(
  .kachi-auth-card,
  .workspace-auth-card,
  .kachi-admin-login-card,
  .login,
  .account-form
) {
  background: rgba(19, 28, 43, 0.97) !important;
  border: 1px solid var(--kds-border) !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.42) !important;
  color: var(--kds-text) !important;
}

html[data-theme="dark"] body :is(
  .kachi-admin-login-body,
  .login__body,
  .account-form
) {
  background-color: transparent !important;
  color: var(--kds-text) !important;
}

html[data-theme="dark"] body :is(
  .kachi-auth-header h4,
  .workspace-auth-header h4,
  .login__header h2,
  .login__body h4,
  .account-form h2,
  .account-form h3,
  .account-form h4,
  .account-form h5,
  .account-form h6
) {
  color: var(--kds-text) !important;
}

html[data-theme="dark"] body :is(
  .workspace-auth-header p,
  .login__header p,
  .kachi-auth-footer p,
  .workspace-auth-footer p,
  .kachi-admin-login-footer p,
  .kachi-admin-login-app-hint,
  .kachi-auth-app-hint,
  .workspace-auth-app-hint
) {
  color: var(--kds-text-muted) !important;
}

html[data-theme="dark"] body :is(
  .kachi-auth-form .form-label,
  .workspace-auth-form .form-label,
  .kachi-login-label,
  .kachi-login-remember-label,
  .account-form label,
  .login label
) {
  background: transparent !important;
  color: var(--kds-text-soft) !important;
  -webkit-text-fill-color: currentColor !important;
}

html[data-theme="dark"] body :is(
  .kachi-auth-form .form-control,
  .kachi-auth-form .form-select,
  .workspace-auth-form .form-control,
  .workspace-auth-form .form-select,
  .kachi-login-input,
  .login__body .field input,
  .account-form .form-control,
  .account-form .form-select,
  .verification-code input
) {
  background: var(--kds-control) !important;
  border-color: var(--kds-border) !important;
  color: var(--kds-text) !important;
  -webkit-text-fill-color: currentColor !important;
}

html[data-theme="dark"] body :is(
  .kachi-auth-form .form-control,
  .kachi-auth-form .form-select,
  .workspace-auth-form .form-control,
  .workspace-auth-form .form-select,
  .kachi-login-input,
  .login__body .field input,
  .account-form .form-control,
  .account-form .form-select
):focus {
  background: var(--kds-control) !important;
  border-color: var(--kds-accent) !important;
  box-shadow: 0 0 0 4px rgba(96, 165, 250, 0.14) !important;
  color: var(--kds-text) !important;
}

html[data-theme="dark"] body :is(
  .kachi-auth-form .input-group-text,
  .workspace-auth-form .input-group-text
) {
  background: var(--kds-surface-raised) !important;
  border-color: var(--kds-border) !important;
  color: var(--kds-text-muted) !important;
}

html[data-theme="dark"] body :is(
  .kachi-auth-close,
  .workspace-auth-close,
  .kachi-auth-social
) {
  background: var(--kds-surface-raised) !important;
  border-color: var(--kds-border) !important;
  color: var(--kds-text-soft) !important;
}

html[data-theme="dark"] body :is(
  .kachi-auth-close,
  .workspace-auth-close,
  .kachi-auth-social
):hover {
  background: var(--kds-hover) !important;
  color: var(--kds-accent) !important;
}

html[data-theme="dark"] body .kachi-auth-tab {
  background: var(--kds-control) !important;
  border-color: var(--kds-border) !important;
  color: var(--kds-text-muted) !important;
}

html[data-theme="dark"] body .kachi-auth-tab.active {
  background: linear-gradient(135deg, #2563eb, #1d4ed8) !important;
  border-color: #3b82f6 !important;
  color: #ffffff !important;
}

html[data-theme="dark"] body .kachi-auth-divider::before {
  background: var(--kds-border) !important;
}

html[data-theme="dark"] body .kachi-auth-divider span {
  background: var(--kds-surface) !important;
  color: var(--kds-text-muted) !important;
}

html[data-theme="dark"] body :is(
  .kachi-auth-footer,
  .workspace-auth-footer,
  .kachi-admin-login-footer,
  .kachi-admin-login-app
) {
  background: transparent !important;
  border-color: var(--kds-border) !important;
}

html[data-theme="dark"] body :is(
  .kachi-auth-footer a,
  .workspace-auth-footer a,
  .kachi-login-forgot,
  .login__footer a,
  .forget-text,
  .account-form a
) {
  color: #7dd3fc !important;
}

html[data-theme="dark"] body :is(
  .kachi-auth-footer a,
  .workspace-auth-footer a,
  .kachi-login-forgot,
  .login__footer a,
  .forget-text,
  .account-form a
):hover {
  color: #bae6fd !important;
}

html[data-theme="dark"] body :is(
  .kachi-auth-form .btn--base,
  .workspace-auth-form .btn--base,
  .kachi-login-submit,
  .sign-in,
  .btn-login
) {
  background: linear-gradient(135deg, #2563eb, #1d4ed8) !important;
  border-color: #3b82f6 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

html[data-theme="dark"] body :is(
  .kachi-auth-form .btn--base,
  .workspace-auth-form .btn--base,
  .kachi-login-submit,
  .sign-in,
  .btn-login
) :is(span, i) {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}

html[data-theme="dark"] body :is(
  .kachi-login-input-icon,
  .login__body .show-pass,
  .password-show-hide
) {
  color: var(--kds-text-muted) !important;
}

html[data-theme="dark"] body .kachi-login-checkbox {
  background: var(--kds-control) !important;
  border-color: var(--kds-border-strong) !important;
}

html[data-theme="dark"] body :is(.input-popup, .verification-code .boxes span) {
  background: var(--kds-surface-raised) !important;
  border-color: var(--kds-border) !important;
  color: var(--kds-text-soft) !important;
}

@media (max-width: 575.98px) {
  html[data-theme="dark"] body :is(.kachi-auth-shell, .workspace-auth-shell, .kachi-admin-login-page) {
    padding: 14px !important;
  }
}
