/**
 * PingWell Admin / Seller — Night mode (Stisla + plugins)
 * Soft, low-glare palette. Loaded after style.css / components.css / dev.css.
 */
html[data-theme="dark"] {
  color-scheme: dark;
  --pw-bg: #10131a;
  --pw-bg-elevated: #161a22;
  --pw-surface: #1a1f29;
  --pw-surface-2: #222836;
  --pw-border: #2f3648;
  --pw-border-soft: #282f3f;
  --pw-text: #e4e7ee;
  --pw-text-muted: #8f98ab;
  --pw-text-soft: #c2c9d6;
  --pw-sidebar: #12161e;
  --pw-sidebar-hover: #1e2430;
  --pw-input: #131720;
  --pw-shadow: 0 1px 0 rgba(255, 255, 255, 0.025), 0 10px 28px rgba(0, 0, 0, 0.32);
  --pw-primary: #5a6bc4;
  --pw-primary-soft: #a7b3f0;
  --pw-danger: #d8898e;
  --pw-success: #6bb892;
  --pw-warning: #c9a56a;
  --pw-info: #6aa4be;
  --light: #222836;
  --dark: #e4e7ee;
}

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

/* ---------- Shell / layout ---------- */
html[data-theme="dark"] .main-wrapper,
html[data-theme="dark"] .main-content,
html[data-theme="dark"] .section,
html[data-theme="dark"] .section-body {
  background-color: transparent !important;
  color: var(--pw-text);
}

/* Stisla page header bar — was pure white and blinded dark mode */
html[data-theme="dark"] .section .section-header,
html[data-theme="dark"] .section-header {
  background-color: var(--pw-surface) !important;
  border: 1px solid var(--pw-border) !important;
  box-shadow: none !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .main-wrapper-1 .section .section-header {
  border-top-color: var(--pw-border) !important;
  border-radius: 0 !important;
}

html[data-theme="dark"] .section .section-header h1,
html[data-theme="dark"] .section-header h1,
html[data-theme="dark"] .section-title,
html[data-theme="dark"] .section-title h1,
html[data-theme="dark"] .section .section-title {
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .section-header-breadcrumb,
html[data-theme="dark"] .section-header-breadcrumb .breadcrumb-item,
html[data-theme="dark"] .section-header-breadcrumb .breadcrumb-item a,
html[data-theme="dark"] .breadcrumb,
html[data-theme="dark"] .breadcrumb-item,
html[data-theme="dark"] .breadcrumb-item a {
  color: var(--pw-text-muted) !important;
}

html[data-theme="dark"] .section-header-breadcrumb .breadcrumb-item.active a,
html[data-theme="dark"] .breadcrumb-item.active {
  color: var(--pw-text-soft) !important;
}

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

html[data-theme="dark"] .text-dark,
html[data-theme="dark"] .text-body {
  color: var(--pw-text) !important;
}

html[data-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item):not(.badge):not(.page-link) {
  color: var(--pw-primary-soft) !important;
}

html[data-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item):hover {
  color: #c5ceff !important;
}

html[data-theme="dark"] .product-name-link,
html[data-theme="dark"] a.product-name-link,
html[data-theme="dark"] .text-primary,
html[data-theme="dark"] a.text-primary {
  color: var(--pw-primary-soft) !important;
}

/* ---------- Sidebar ---------- */
html[data-theme="dark"] .main-sidebar,
html[data-theme="dark"] app-sidebar.main-sidebar,
html[data-theme="dark"] .main-sidebar .sidebar-brand,
html[data-theme="dark"] .main-sidebar .sidebar-brand-sm {
  background-color: var(--pw-sidebar) !important;
  border-color: var(--pw-border) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .main-sidebar .sidebar-brand a,
html[data-theme="dark"] .main-sidebar .sidebar-brand-sm a {
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .main-sidebar .sidebar-menu li a,
html[data-theme="dark"] .main-sidebar .sidebar-menu li a .nav-link {
  color: var(--pw-text-soft) !important;
}

html[data-theme="dark"] .main-sidebar .sidebar-menu li a:hover,
html[data-theme="dark"] .main-sidebar .sidebar-menu li.active > a,
html[data-theme="dark"] .main-sidebar .sidebar-menu li a.active {
  background-color: var(--pw-sidebar-hover) !important;
  color: #fff !important;
}

html[data-theme="dark"] .main-sidebar .sidebar-menu li ul.dropdown-menu,
html[data-theme="dark"] .main-sidebar .sidebar-menu li .dropdown-menu {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .main-sidebar .sidebar-menu li ul.dropdown-menu li a {
  color: var(--pw-text-soft) !important;
  background: transparent !important;
}

html[data-theme="dark"] .main-sidebar .sidebar-menu li ul.dropdown-menu li a:hover,
html[data-theme="dark"] .main-sidebar .sidebar-menu li ul.dropdown-menu li.active a {
  background-color: var(--pw-sidebar-hover) !important;
  color: #fff !important;
}

html[data-theme="dark"] .main-sidebar .sidebar-menu .menu-header {
  color: var(--pw-text-muted) !important;
}

html[data-theme="dark"] .main-sidebar .sidebar-brand {
  border-bottom: 1px solid var(--pw-border) !important;
  background-color: var(--pw-sidebar) !important;
}

html[data-theme="dark"] .main-sidebar .sidebar-logo {
  filter: none;
}

html[data-theme="dark"] .main-sidebar .sidebar-menu li a i,
html[data-theme="dark"] .main-sidebar .sidebar-menu li a .ion,
html[data-theme="dark"] .main-sidebar .sidebar-menu li a .fas,
html[data-theme="dark"] .main-sidebar .sidebar-menu li a .far {
  color: inherit !important;
}

/* ---------- Navbar menus ---------- */
html[data-theme="dark"] .dropdown-menu {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
  box-shadow: var(--pw-shadow) !important;
}

html[data-theme="dark"] .dropdown-item {
  color: var(--pw-text-soft) !important;
}

html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .dropdown-item:focus,
html[data-theme="dark"] .dropdown-item.active {
  background-color: var(--pw-surface-2) !important;
  color: #fff !important;
}

html[data-theme="dark"] .dropdown-divider {
  border-top-color: var(--pw-border) !important;
}

html[data-theme="dark"] .dropdown-header {
  color: var(--pw-text-muted) !important;
}

/* ---------- Cards / panels ---------- */
html[data-theme="dark"] .card,
html[data-theme="dark"] .card-primary,
html[data-theme="dark"] .card-secondary,
html[data-theme="dark"] .card-success,
html[data-theme="dark"] .card-danger,
html[data-theme="dark"] .card-warning,
html[data-theme="dark"] .card-info,
html[data-theme="dark"] .card-dark,
html[data-theme="dark"] .card-statistic-1,
html[data-theme="dark"] .card-statistic-2 {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
  box-shadow: var(--pw-shadow) !important;
}

html[data-theme="dark"] .card .card-header,
html[data-theme="dark"] .card .card-footer,
html[data-theme="dark"] .card .card-body,
html[data-theme="dark"] .card-footer {
  background-color: transparent !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .card .card-header h4,
html[data-theme="dark"] .card .card-header h5,
html[data-theme="dark"] .card .card-title,
html[data-theme="dark"] .card-header h4 {
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .card.card-primary .card-header,
html[data-theme="dark"] .card.card-hero .card-header {
  background-color: var(--pw-surface-2) !important;
  border-bottom-color: var(--pw-border) !important;
}

html[data-theme="dark"] .card.card-primary.card-hero .card-header {
  background: linear-gradient(135deg, #2a3148 0%, #1c212c 100%) !important;
}

html[data-theme="dark"] .card .card-header .btn-header,
html[data-theme="dark"] .card-header-action a {
  color: var(--pw-text-muted) !important;
}

html[data-theme="dark"] .list-group-item {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .list-group-item-action:hover,
html[data-theme="dark"] .list-group-item-action:focus {
  background-color: var(--pw-surface-2) !important;
  color: #fff !important;
}

/* ---------- Forms ---------- */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .custom-select,
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] select.form-control,
html[data-theme="dark"] textarea.form-control,
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="password"],
html[data-theme="dark"] input[type="number"],
html[data-theme="dark"] input[type="search"],
html[data-theme="dark"] input[type="url"],
html[data-theme="dark"] input[type="tel"],
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] input[type="datetime-local"],
html[data-theme="dark"] input[type="file"] {
  background-color: var(--pw-input) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .form-control:focus {
  border-color: #6b7ad8 !important;
  box-shadow: 0 0 0 0.12rem rgba(91, 111, 214, 0.28) !important;
}

html[data-theme="dark"] .form-control::placeholder,
html[data-theme="dark"] .form-control::-webkit-input-placeholder {
  color: var(--pw-text-muted) !important;
  opacity: 1;
}

html[data-theme="dark"] .form-control:disabled,
html[data-theme="dark"] .form-control[readonly] {
  background-color: #1a1f2a !important;
  color: var(--pw-text-muted) !important;
}

html[data-theme="dark"] .form-group > label,
html[data-theme="dark"] label,
html[data-theme="dark"] .custom-control-label {
  color: var(--pw-text-soft) !important;
}

html[data-theme="dark"] .input-group-text {
  background-color: var(--pw-surface-2) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text-soft) !important;
}

html[data-theme="dark"] .custom-file-label {
  background-color: var(--pw-input) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .custom-file-label::after {
  background-color: var(--pw-surface-2) !important;
  color: var(--pw-text) !important;
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .custom-switch .custom-control-label::before,
html[data-theme="dark"] .custom-checkbox .custom-control-label::before,
html[data-theme="dark"] .custom-radio .custom-control-label::before {
  background-color: var(--pw-input) !important;
  border-color: var(--pw-border) !important;
}

/* ---------- Tables ---------- */
html[data-theme="dark"] .table,
html[data-theme="dark"] .table td,
html[data-theme="dark"] .table th,
html[data-theme="dark"] table.dataTable {
  color: var(--pw-text) !important;
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .table thead th,
html[data-theme="dark"] .table thead td {
  background-color: var(--pw-surface-2) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text-soft) !important;
}

html[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd),
html[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) > td,
html[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) > th {
  background-color: rgba(255, 255, 255, 0.025) !important;
}

html[data-theme="dark"] .table-hover tbody tr:hover,
html[data-theme="dark"] .table-hover tbody tr:hover > td,
html[data-theme="dark"] .table tbody tr.summary-row:hover > td {
  background-color: rgba(91, 111, 214, 0.1) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .table-bordered,
html[data-theme="dark"] .table-bordered td,
html[data-theme="dark"] .table-bordered th {
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .table tbody tr > td,
html[data-theme="dark"] .table tbody tr > th {
  background-color: transparent !important;
  border-color: var(--pw-border-soft) !important;
}

html[data-theme="dark"] .table tbody tr:hover > td {
  background-color: rgba(91, 111, 214, 0.08) !important;
}

html[data-theme="dark"] .dataTables_wrapper .dataTables_length,
html[data-theme="dark"] .dataTables_wrapper .dataTables_filter,
html[data-theme="dark"] .dataTables_wrapper .dataTables_info,
html[data-theme="dark"] .dataTables_wrapper .dataTables_paginate {
  color: var(--pw-text-muted) !important;
}

html[data-theme="dark"] .dataTables_wrapper .dataTables_filter input,
html[data-theme="dark"] .dataTables_wrapper .dataTables_length select {
  background-color: var(--pw-input) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .page-item .page-link,
html[data-theme="dark"] .pagination .page-link {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text-soft) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .page-item.active .page-link {
  background-color: var(--pw-primary) !important;
  border-color: var(--pw-primary) !important;
  color: #fff !important;
}

html[data-theme="dark"] .page-item.disabled .page-link {
  background-color: var(--pw-bg-elevated) !important;
  color: var(--pw-text-muted) !important;
}

/* ---------- Buttons — mute Stisla neon glows ---------- */
html[data-theme="dark"] .btn,
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-info,
html[data-theme="dark"] .btn-success,
html[data-theme="dark"] .btn-warning,
html[data-theme="dark"] .btn-danger,
html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .btn-dark,
html[data-theme="dark"] .btn-primary:focus,
html[data-theme="dark"] .btn-primary:active,
html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .btn-info:hover,
html[data-theme="dark"] .btn-success:hover,
html[data-theme="dark"] .btn-warning:hover,
html[data-theme="dark"] .btn-danger:hover {
  box-shadow: none !important;
  text-shadow: none !important;
}

html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-primary.disabled {
  background-color: #4f61c4 !important;
  border-color: #4f61c4 !important;
  color: #fff !important;
}

html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .btn-primary:focus,
html[data-theme="dark"] .btn-primary:active {
  background-color: #5d70d4 !important;
  border-color: #5d70d4 !important;
  color: #fff !important;
}

html[data-theme="dark"] .btn-info {
  background-color: #3d7f9c !important;
  border-color: #3d7f9c !important;
  color: #fff !important;
}

html[data-theme="dark"] .btn-success {
  background-color: #3f8f68 !important;
  border-color: #3f8f68 !important;
  color: #fff !important;
}

html[data-theme="dark"] .btn-warning {
  background-color: #b8863d !important;
  border-color: #b8863d !important;
  color: #1a1408 !important;
}

html[data-theme="dark"] .btn-danger {
  background-color: #b85a60 !important;
  border-color: #b85a60 !important;
  color: #fff !important;
}

html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .btn-dark {
  background-color: var(--pw-surface-2) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .btn-light,
html[data-theme="dark"] .btn-white,
html[data-theme="dark"] .btn-default {
  background-color: var(--pw-surface-2) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .btn-outline-primary {
  color: var(--pw-primary-soft) !important;
  border-color: #5a6adf !important;
  background: transparent !important;
}

html[data-theme="dark"] .btn-outline-primary:hover {
  background-color: rgba(91, 111, 214, 0.18) !important;
  color: #fff !important;
}

html[data-theme="dark"] .btn-outline-secondary,
html[data-theme="dark"] .btn-outline-dark {
  color: var(--pw-text-soft) !important;
  border-color: var(--pw-border) !important;
  background: transparent !important;
}

html[data-theme="dark"] .btn-outline-secondary:hover,
html[data-theme="dark"] .btn-outline-dark:hover {
  background-color: var(--pw-surface-2) !important;
  color: #fff !important;
}

html[data-theme="dark"] .btn-outline-danger {
  color: #e8a0a4 !important;
  border-color: #8a4a50 !important;
  background: transparent !important;
}

html[data-theme="dark"] .btn-group .btn {
  box-shadow: none !important;
}

/* Soft tinted badges — never neon fill + mismatched text */
html[data-theme="dark"] .badge,
html[data-theme="dark"] span.badge {
  box-shadow: none !important;
  border: 1px solid transparent;
  font-weight: 600;
}

html[data-theme="dark"] .badge-primary,
html[data-theme="dark"] .badge.badge-primary {
  background-color: rgba(91, 111, 214, 0.22) !important;
  color: #c2cbff !important;
  border-color: rgba(91, 111, 214, 0.35) !important;
}

html[data-theme="dark"] .badge-info,
html[data-theme="dark"] .badge.badge-info {
  background-color: rgba(106, 174, 207, 0.2) !important;
  color: #b7dced !important;
  border-color: rgba(106, 174, 207, 0.35) !important;
}

html[data-theme="dark"] .badge-success,
html[data-theme="dark"] .badge.badge-success {
  background-color: rgba(92, 188, 138, 0.18) !important;
  color: #b6e3cb !important;
  border-color: rgba(92, 188, 138, 0.32) !important;
}

html[data-theme="dark"] .badge-warning,
html[data-theme="dark"] .badge.badge-warning {
  background-color: rgba(212, 163, 90, 0.18) !important;
  color: #efd2a4 !important;
  border-color: rgba(212, 163, 90, 0.32) !important;
}

html[data-theme="dark"] .badge-danger,
html[data-theme="dark"] .badge.badge-danger {
  background-color: rgba(224, 122, 128, 0.18) !important;
  color: #f0c0c3 !important;
  border-color: rgba(224, 122, 128, 0.32) !important;
}

html[data-theme="dark"] .badge-light,
html[data-theme="dark"] .badge-secondary,
html[data-theme="dark"] .badge.badge-light,
html[data-theme="dark"] .badge.badge-secondary {
  background-color: var(--pw-surface-2) !important;
  color: var(--pw-text-soft) !important;
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .badge-dark {
  background-color: #2a3140 !important;
  color: var(--pw-text-soft) !important;
}

/* Text-* utility colors (not badge fills) */
html[data-theme="dark"] .text-success { color: #8fd4b0 !important; }
html[data-theme="dark"] .text-danger { color: #e8a0a4 !important; }
html[data-theme="dark"] .text-warning { color: #e0c08a !important; }
html[data-theme="dark"] .text-info { color: #9ecfe3 !important; }

html[data-theme="dark"] .alert {
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .alert-primary {
  background-color: rgba(91, 111, 214, 0.14) !important;
  color: #c5ceff !important;
  border-color: rgba(91, 111, 214, 0.3) !important;
}

html[data-theme="dark"] .alert-success {
  background-color: rgba(92, 188, 138, 0.12) !important;
  color: #b6e3cb !important;
  border-color: rgba(92, 188, 138, 0.28) !important;
}

html[data-theme="dark"] .alert-warning {
  background-color: rgba(212, 163, 90, 0.12) !important;
  color: #efd2a4 !important;
  border-color: rgba(212, 163, 90, 0.28) !important;
}

html[data-theme="dark"] .alert-danger {
  background-color: rgba(224, 122, 128, 0.12) !important;
  color: #f0c0c3 !important;
  border-color: rgba(224, 122, 128, 0.28) !important;
}

html[data-theme="dark"] .alert-info {
  background-color: rgba(106, 174, 207, 0.12) !important;
  color: #b7dced !important;
  border-color: rgba(106, 174, 207, 0.28) !important;
}

html[data-theme="dark"] .alert-light,
html[data-theme="dark"] .alert-secondary {
  background-color: var(--pw-surface-2) !important;
  color: var(--pw-text-soft) !important;
}

/* ---------- Modals / popovers ---------- */
html[data-theme="dark"] .modal-content {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer {
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .modal-title {
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .modal-backdrop.show {
  opacity: 0.7;
}

html[data-theme="dark"] .close,
html[data-theme="dark"] .modal-header .close {
  color: var(--pw-text) !important;
  text-shadow: none !important;
  opacity: 0.75;
}

html[data-theme="dark"] .popover {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .popover-header {
  background-color: var(--pw-surface-2) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .popover-body {
  color: var(--pw-text-soft) !important;
}

/* ---------- Nav tabs / pills ---------- */
html[data-theme="dark"] .nav-tabs {
  border-bottom-color: var(--pw-border) !important;
}

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

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

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

html[data-theme="dark"] .nav-pills .nav-link {
  color: var(--pw-text-soft) !important;
}

html[data-theme="dark"] .nav-pills .nav-link.active {
  background-color: var(--pw-primary) !important;
  color: #fff !important;
}

/* ---------- Progress / misc ---------- */
html[data-theme="dark"] .progress {
  background-color: var(--pw-surface-2) !important;
}

html[data-theme="dark"] hr {
  border-top-color: var(--pw-border) !important;
}

html[data-theme="dark"] .bg-white,
html[data-theme="dark"] .bg-light,
html[data-theme="dark"] .bg-whitesmoke {
  background-color: var(--pw-surface) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .border,
html[data-theme="dark"] .border-top,
html[data-theme="dark"] .border-bottom,
html[data-theme="dark"] .border-left,
html[data-theme="dark"] .border-right {
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .jumbotron {
  background-color: var(--pw-surface) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] code,
html[data-theme="dark"] kbd,
html[data-theme="dark"] pre,
html[data-theme="dark"] .pre-content {
  background-color: var(--pw-bg-elevated) !important;
  color: #e6edf7 !important;
  border-color: var(--pw-border) !important;
}

/* ---------- Auth / login ---------- */
html[data-theme="dark"] .simple-footer,
html[data-theme="dark"] body > .simple-footer {
  background: transparent !important;
  color: var(--pw-text-muted) !important;
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .login-brand,
html[data-theme="dark"] .login-brand a {
  color: var(--pw-text) !important;
}

/* ---------- Footer ---------- */
html[data-theme="dark"] .main-footer,
html[data-theme="dark"] .main-footer.app-footer {
  background: var(--pw-bg-elevated) !important;
  border-top-color: var(--pw-border) !important;
  color: var(--pw-text-muted) !important;
}

/* ---------- Select2 ---------- */
html[data-theme="dark"] .select2-container--default .select2-selection--single,
html[data-theme="dark"] .select2-container--default .select2-selection--multiple {
  background-color: var(--pw-input) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

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

html[data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--pw-text-muted) transparent transparent transparent !important;
}

html[data-theme="dark"] .select2-dropdown {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

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

html[data-theme="dark"] .select2-container--default .select2-results__option--highlighted[aria-selected],
html[data-theme="dark"] .select2-container--default .select2-results__option[aria-selected="true"] {
  background-color: var(--pw-primary) !important;
  color: #fff !important;
}

html[data-theme="dark"] .select2-container--default .select2-search--dropdown .select2-search__field {
  background-color: var(--pw-input) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .select2-container .select2-selection--single {
  border-color: var(--pw-border) !important;
}

/* ---------- Tagify / tagsinput ---------- */
html[data-theme="dark"] .tagify {
  background: var(--pw-input) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
  --tags-border-color: var(--pw-border);
  --tags-hover-border-color: var(--pw-primary);
  --tag-bg: var(--pw-surface-2);
  --tag-hover: #2c3550;
  --tag-text-color: var(--pw-text);
  --placeholder-color: var(--pw-text-muted);
}

html[data-theme="dark"] .bootstrap-tagsinput {
  background-color: var(--pw-input) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .bootstrap-tagsinput .tag {
  background-color: var(--pw-surface-2) !important;
  color: var(--pw-text) !important;
}

/* ---------- Summernote ---------- */
html[data-theme="dark"] .note-editor.note-frame,
html[data-theme="dark"] .note-editor.note-frame .note-editing-area .note-editable,
html[data-theme="dark"] .note-editor .note-toolbar,
html[data-theme="dark"] .note-editor .note-statusbar {
  background-color: var(--pw-input) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .note-editor.note-frame .note-editing-area .note-editable {
  background-color: var(--pw-input) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .note-toolbar .note-btn,
html[data-theme="dark"] .note-popover .popover-content .note-btn {
  background-color: var(--pw-surface-2) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text-soft) !important;
}

html[data-theme="dark"] .note-dropdown-menu {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .note-modal .modal-content {
  background-color: var(--pw-surface) !important;
  color: var(--pw-text) !important;
}

/* ---------- Datepicker / datetime / clock ---------- */
html[data-theme="dark"] .datepicker,
html[data-theme="dark"] .datepicker-dropdown,
html[data-theme="dark"] .bootstrap-datetimepicker-widget,
html[data-theme="dark"] .xdsoft_datetimepicker,
html[data-theme="dark"] .clockpicker-popover {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .datepicker table tr td,
html[data-theme="dark"] .datepicker table tr th,
html[data-theme="dark"] .xdsoft_datetimepicker .xdsoft_calendar td,
html[data-theme="dark"] .xdsoft_datetimepicker .xdsoft_calendar th,
html[data-theme="dark"] .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div {
  background: transparent !important;
  color: var(--pw-text-soft) !important;
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .datepicker table tr td.day:hover,
html[data-theme="dark"] .datepicker table tr td.active,
html[data-theme="dark"] .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_default,
html[data-theme="dark"] .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current {
  background-color: var(--pw-primary) !important;
  color: #fff !important;
}

/* ---------- Toastr / iziToast ---------- */
html[data-theme="dark"] .toast,
html[data-theme="dark"] #toast-container > div {
  box-shadow: var(--pw-shadow) !important;
}

html[data-theme="dark"] .iziToast {
  background: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

/* ---------- Images / empty states ---------- */
html[data-theme="dark"] img.admin-img,
html[data-theme="dark"] img.admin-banner-img {
  border-color: var(--pw-border) !important;
  background: var(--pw-bg-elevated);
}

html[data-theme="dark"] .empty-state,
html[data-theme="dark"] .empty-state .empty-state-icon {
  color: var(--pw-text-muted) !important;
}

/* ---------- Chat / tickets ---------- */
html[data-theme="dark"] .chat-box .chat-content,
html[data-theme="dark"] .chat-box .chat-form {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .chat-box .chat-content .chat-item .chat-details .chat-text {
  background-color: var(--pw-surface-2) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .chat-box .chat-content .chat-item.chat-right .chat-details .chat-text {
  background-color: rgba(91, 111, 214, 0.22) !important;
}

/* ---------- Scrollbars ---------- */
html[data-theme="dark"] *::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

html[data-theme="dark"] *::-webkit-scrollbar-track {
  background: var(--pw-bg);
}

html[data-theme="dark"] *::-webkit-scrollbar-thumb {
  background: #3a4258;
  border-radius: 8px;
}

html[data-theme="dark"] *::-webkit-scrollbar-thumb:hover {
  background: #4d5770;
}

html[data-theme="dark"] .figure-caption {
  color: var(--pw-text-muted) !important;
}

html[data-theme="dark"] .toggle.btn {
  border-color: var(--pw-border) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .card-statistic-1 .card-header h4,
html[data-theme="dark"] .card-statistic-1 .card-body,
html[data-theme="dark"] .card-statistic-2 .card-header h4 {
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .pricing,
html[data-theme="dark"] .pricing .pricing-title,
html[data-theme="dark"] .pricing .pricing-price {
  background-color: var(--pw-surface) !important;
  color: var(--pw-text) !important;
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .activities .activity .activity-detail {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .ticket-item {
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .ticket-item.active {
  background-color: var(--pw-surface-2) !important;
}

html[data-theme="dark"] .was-validated .form-control:invalid,
html[data-theme="dark"] .form-control.is-invalid {
  border-color: var(--pw-danger) !important;
}

html[data-theme="dark"] .invalid-feedback {
  color: #f0c0c3 !important;
}

html[data-theme="dark"] .well {
  background-color: var(--pw-surface-2) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .iconpicker-popover,
html[data-theme="dark"] .iconpicker .iconpicker-items {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .iconpicker .iconpicker-item:hover:not(.iconpicker-selected) {
  background-color: var(--pw-surface-2) !important;
}

/* Kill leftover colored button glows from style.css */
html[data-theme="dark"] [class*="btn-"] {
  filter: none;
}

/* ---------- Nuclear pass: wipe leftover light surfaces ---------- */
html[data-theme="dark"] .main-content .card,
html[data-theme="dark"] .main-content .card-body,
html[data-theme="dark"] .main-content .card-header,
html[data-theme="dark"] .main-content .card-footer,
html[data-theme="dark"] .section-body .card,
html[data-theme="dark"] .section-body .card-body,
html[data-theme="dark"] .section-body .card-header,
html[data-theme="dark"] .section-body .card-footer {
  background-color: var(--pw-surface) !important;
  color: var(--pw-text) !important;
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .main-content .table,
html[data-theme="dark"] .section-body .table,
html[data-theme="dark"] .main-content .table-responsive,
html[data-theme="dark"] .section-body .table-responsive {
  background-color: transparent !important;
  color: var(--pw-text) !important;
}

html[data-theme="dark"] .main-content .table thead th,
html[data-theme="dark"] .section-body .table thead th {
  background-color: var(--pw-surface-2) !important;
  color: var(--pw-text-soft) !important;
  border-color: var(--pw-border) !important;
}

html[data-theme="dark"] .main-content .table td,
html[data-theme="dark"] .main-content .table th,
html[data-theme="dark"] .section-body .table td,
html[data-theme="dark"] .section-body .table th {
  border-color: var(--pw-border-soft) !important;
  color: var(--pw-text) !important;
}

/* Soften blinding brand navbar in night mode */
html[data-theme="dark"] .navbar-bg {
  background-color: color-mix(in srgb, var(--navbar-bg, #6777ef) 38%, #141820) !important;
  background-image: none !important;
  opacity: 1 !important;
  filter: none !important;
}

html[data-theme="dark"] .main-navbar .nav-link,
html[data-theme="dark"] .main-navbar .header-tool,
html[data-theme="dark"] .main-navbar .header-tool-label,
html[data-theme="dark"] .main-navbar .header-tool-icon {
  color: #f0f2f7 !important;
  text-shadow: none !important;
}

/* Catch common Angular page surfaces that stay white */
html[data-theme="dark"] .lg-table-wrap,
html[data-theme="dark"] .lg-card,
html[data-theme="dark"] .set-card,
html[data-theme="dark"] .products-card,
html[data-theme="dark"] .em-card,
html[data-theme="dark"] .treasury-card,
html[data-theme="dark"] .dash-panel-card,
html[data-theme="dark"] .dash-stat-card,
html[data-theme="dark"] .cat-tile,
html[data-theme="dark"] .cat-item,
html[data-theme="dark"] .hp-cat-item,
html[data-theme="dark"] .kyc-card,
html[data-theme="dark"] .provider-card,
html[data-theme="dark"] .integration-card,
html[data-theme="dark"] .method-card,
html[data-theme="dark"] .plan-card,
html[data-theme="dark"] .gateway-tile,
html[data-theme="dark"] .filter-bar,
html[data-theme="dark"] .toolbar-card,
html[data-theme="dark"] .soft-box,
html[data-theme="dark"] .panel-soft,
html[data-theme="dark"] .info-box,
html[data-theme="dark"] .stat-box,
html[data-theme="dark"] .meta-box {
  background-color: var(--pw-surface) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
  box-shadow: var(--pw-shadow) !important;
}

html[data-theme="dark"] .lg-table th,
html[data-theme="dark"] .lg-sticky-actions {
  background-color: var(--pw-surface-2) !important;
  color: var(--pw-text-soft) !important;
}

html[data-theme="dark"] .lg-sticky-actions {
  background: linear-gradient(180deg, rgba(28, 33, 44, 0), var(--pw-surface) 28%) !important;
}

html[data-theme="dark"] .lg-key code,
html[data-theme="dark"] .main-content code {
  background-color: var(--pw-bg-elevated) !important;
  color: var(--pw-text-soft) !important;
  border: 1px solid var(--pw-border);
}

/* Inputs inside Angular hosts that miss form-control class */
html[data-theme="dark"] .main-content input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
html[data-theme="dark"] .main-content textarea,
html[data-theme="dark"] .main-content select {
  background-color: var(--pw-input) !important;
  border-color: var(--pw-border) !important;
  color: var(--pw-text) !important;
}

/* Modal / offcanvas leftovers */
html[data-theme="dark"] .modal-body,
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer {
  background-color: var(--pw-surface) !important;
  color: var(--pw-text) !important;
}

/* Empty / loading cells */
html[data-theme="dark"] .main-content .text-center.py-4,
html[data-theme="dark"] .main-content .py-5 {
  color: var(--pw-text-muted);
}

/* DataTables odd rows that force white */
html[data-theme="dark"] table.dataTable tbody tr,
html[data-theme="dark"] table.dataTable.stripe tbody tr.odd,
html[data-theme="dark"] table.dataTable.display tbody tr.odd {
  background-color: transparent !important;
}

html[data-theme="dark"] table.dataTable.stripe tbody tr.even,
html[data-theme="dark"] table.dataTable.display tbody tr.even {
  background-color: rgba(255, 255, 255, 0.02) !important;
}

/* Login page shell */
html[data-theme="dark"] .card.card-primary.card-hero,
html[data-theme="dark"] section.section .card {
  background-color: var(--pw-surface) !important;
}

/* Keep icon glyphs on colored icon tiles white */
html[data-theme="dark"] .card-statistic-1 .card-icon i,
html[data-theme="dark"] .card-statistic-2 .card-icon i,
html[data-theme="dark"] .dash-stat-card .card-icon i {
  color: #fff !important;
}