body.dark-mode {
    --theme-page: #191a1d;
    --theme-sidebar: #1c1e21;
    --theme-surface: #272a2e;
    --theme-header: #202226;
    --theme-hover: #33373c;
    --theme-border: #40454b;
    --theme-text: #e6e7e9;
    --theme-muted: #b0b4bb;
    --theme-accent: #aaa2ff;
    background-color: var(--theme-page) !important;
    color: var(--theme-text);
}

.dark-mode .content-wrapper {
    background: var(--theme-page);
    color: var(--theme-text);
}

body.dark-mode .main-header.navbar-joinder {
    background: var(--theme-sidebar);
    border-bottom: 1px solid var(--theme-border);
}

.dark-mode .navbar-joinder .navbar-nav .nav-link {
    color: var(--theme-muted);
}

.dark-mode .navbar-joinder .navbar-nav .nav-link:hover,
.dark-mode .navbar-joinder .navbar-nav .nav-link:focus {
    color: #fff;
}

body.dark-mode .main-sidebar.sidebar-dark-primary,
body.dark-mode .main-sidebar.sidebar-dark-primary .brand-link {
    background: var(--theme-sidebar) !important;
    border-color: var(--theme-border);
}

.dark-mode .sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active {
    background: rgba(139, 128, 255, .14);
    color: #eeeaff;
    box-shadow: none;
}

.dark-mode .sidebar-dark-primary .nav-treeview > .nav-item > .nav-link.active {
    background: rgba(139, 128, 255, .14);
    color: #eeeaff;
}

.dark-mode .card,
.dark-mode .modal-content,
.dark-mode .dropdown-menu,
.dark-mode .main-footer {
    background-color: var(--theme-surface);
    color: var(--theme-text);
    border-color: var(--theme-border);
}

.dark-mode .card {
    border-radius: .65rem;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .12);
}

.dark-mode .card-header,
.dark-mode .card-footer,
.dark-mode .modal-header,
.dark-mode .modal-footer,
.dark-mode .dropdown-divider {
    border-color: var(--theme-border);
}

.dark-mode .bg-gray-joinder {
    background-color: rgba(255, 255, 255, .03);
}

.dark-mode .text-muted,
.dark-mode .text-secondary,
.dark-mode .breadcrumb-item,
.dark-mode .breadcrumb-item.active,
.dark-mode .breadcrumb-item + .breadcrumb-item::before {
    color: var(--theme-muted) !important;
}

.dark-mode .form-control,
.dark-mode .custom-select,
.dark-mode .dataTables_wrapper input,
.dark-mode .dataTables_wrapper select {
    background-color: var(--theme-sidebar);
    color: var(--theme-text);
    border: 1px solid var(--theme-border);
    border-radius: .35rem;
}

.dark-mode .form-control::placeholder,
.dark-mode .dataTables_wrapper input::placeholder {
    color: var(--theme-muted);
    opacity: 1;
}

body.dark-mode .dataTables_wrapper .form-control:not(.form-control-navbar):not(.form-control-sidebar) {
    background-color: var(--theme-sidebar);
    color: var(--theme-text);
    border-color: var(--theme-border);
}

.dark-mode .form-control:focus,
.dark-mode .custom-select:focus,
.dark-mode .dataTables_wrapper input:focus,
.dark-mode .dataTables_wrapper select:focus {
    border-color: #8b80ff;
    outline: none;
    box-shadow: 0 0 0 2px rgba(139, 128, 255, .2);
}

body.dark-mode .btn.btn-light,
body.dark-mode .btn.btn-default {
    background: var(--theme-header) !important;
    color: var(--theme-text) !important;
    border-color: #50555c !important;
}

body.dark-mode .btn.btn-light:hover,
body.dark-mode .btn.btn-default:hover,
body.dark-mode .btn.btn-light:focus,
body.dark-mode .btn.btn-default:focus {
    background: var(--theme-hover) !important;
    color: #fff !important;
    border-color: #8b80ff !important;
}

body.dark-mode table.dataTable {
    color: var(--theme-text);
    border: 1px solid var(--theme-border);
    border-collapse: separate !important;
    border-spacing: 0;
    border-radius: .5rem;
    overflow: hidden;
}

body.dark-mode table.dataTable thead th,
body.dark-mode table.dataTable thead td {
    background-color: var(--theme-header);
    color: var(--theme-muted);
    border: 0;
    border-bottom: 1px solid var(--theme-border);
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .04em;
    padding: 13px 24px 13px 14px;
    vertical-align: middle;
}

body.dark-mode .dataTables_scrollHead table.dataTable {
    border-radius: .5rem .5rem 0 0;
}

body.dark-mode .dataTables_scrollBody table.dataTable {
    border-top: 0;
    border-radius: 0 0 .5rem .5rem;
}

body.dark-mode table.dataTable tbody tr,
body.dark-mode table.dataTable.stripe tbody tr.odd,
body.dark-mode table.dataTable.display tbody tr.odd {
    background-color: var(--theme-surface);
}

body.dark-mode table.dataTable tbody td,
body.dark-mode table.dataTable tbody th {
    border: 0;
    border-bottom: 1px solid var(--theme-border);
    padding: 13px 14px;
    vertical-align: middle;
}

body.dark-mode .dataTables_wrapper table.dataTable tbody tr > .sorting_1,
body.dark-mode .dataTables_wrapper table.dataTable tbody tr > .sorting_2,
body.dark-mode .dataTables_wrapper table.dataTable tbody tr > .sorting_3 {
    background-color: transparent;
}

body.dark-mode table.dataTable.hover tbody tr:hover,
body.dark-mode table.dataTable.display tbody tr:hover,
body.dark-mode table.dataTable.table-hover tbody tr:hover {
    background-color: var(--theme-hover);
    color: #fff;
}

body.dark-mode table.dataTable tbody tr:last-child td {
    border-bottom: 0;
}

body.dark-mode table.dataTable tfoot th,
body.dark-mode table.dataTable tfoot td {
    background: var(--theme-header);
    border: 0;
    border-top: 1px solid var(--theme-border);
    padding: 10px 14px;
}

.dark-mode .dataTables_wrapper .dataTables_length,
.dark-mode .dataTables_wrapper .dataTables_filter,
.dark-mode .dataTables_wrapper .dataTables_info,
.dark-mode .dataTables_wrapper .dataTables_processing,
.dark-mode .dataTables_wrapper .dataTables_paginate {
    color: var(--theme-muted);
}

.dark-mode .dataTables_wrapper .dataTables_length,
.dark-mode .dataTables_wrapper .dataTables_filter {
    margin-bottom: 16px;
}

.dark-mode .dataTables_wrapper .dataTables_filter input,
.dark-mode .dataTables_wrapper .dataTables_length select {
    padding: 7px 10px;
}

.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button {
    background: transparent;
    border: 1px solid transparent;
    border-radius: .35rem;
    color: var(--theme-muted) !important;
}

.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: rgba(139, 128, 255, .18);
    border-color: #8b80ff;
    color: #eeeaff !important;
}

.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: var(--theme-hover);
    border-color: var(--theme-border);
    color: #fff !important;
}

.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    background: transparent;
    border-color: transparent;
    color: var(--theme-muted) !important;
    opacity: .6;
}

.dark-mode .mcp-viewport,
.dark-mode .mcp-endpoint {
    background: var(--theme-surface);
    color: var(--theme-text);
    border-color: var(--theme-border);
}

.dark-mode .mcp-endpoint:hover,
.dark-mode .mcp-endpoint:focus,
.dark-mode .mcp-endpoint.mcp-selected {
    background: var(--theme-hover);
}

.dark-mode .mcp-endpoint small {
    color: var(--theme-muted);
}

body.dark-mode .small-box[class*="bg-joinder-"] {
    background-color: #a5a5a5;
    background-blend-mode: multiply;
}

@media print {
    [data-theme-toggle] {
        display: none !important;
    }
}