macports-webapp/app/static/css/darktheme.css

[data-theme=dark] {
    color: #bebebe;
    background-color: #222
}

[data-theme=dark] .bg-darkmode-dark {
    background-color: #343a40 !important
}

[data-theme=dark] .bg-darkmode-light {
    background-color: #f8f9fa !important
}

[data-theme=dark] .nav-item.active {
    background-color: black !important;
}

[data-theme=dark] .btn-outline-secondary {
    border-color: #bebebe !important;
    color: #f8f9fa !important;
}

[data-theme=dark] .tt-menu {
    background-color: #171717 !important;
    border: 1px solid #bebebe;
}

[data-theme=dark] .tt-cursor, [data-theme=dark] .search-result-item:hover {
    background-color: #353a3f !important;
}

[data-theme=dark] .tt-hint {
    color: #bebebe !important;
}

[data-theme=dark] .table td, [data-theme=dark] .table th {
    border-top: 1px solid #6c757d;
}

[data-theme=dark] .navbar-light {
    background-color: #353a3f !important
}

[data-theme=dark] .bg-light {
    background-color: #353a3f !important;
}

[data-theme=dark] .bg-white {
    background-color: black !important;
}

[data-theme=dark] .btn-light {
    background-color: #6c757d !important;
    color: #bebebe !important;
    border: 0 !important;
}

[data-theme=dark] .text-dark {
    color: #bebebe !important;
}

[data-theme=dark] .list-group-item-action.active {
    background-color: #000000 !important;
    color: #bebebe !important;
    border: 1px solid #bebebe !important;
}

[data-theme=dark] a.text-dark:hover {
    color: white !important;
}

[data-theme=dark] .navbar-light .nav-link, [data-theme=dark] .dropdown-item, [data-theme=dark] a.list-group-item {
    color: #bebebe !important
}

[data-theme=dark] .btn-light .nav-link {
    color: black !important
}

[data-theme=dark] pre {
    color: #bebebe
}

[data-theme=dark] img.icon, [data-theme=dark] svg.icon {
    filter: invert(1)
}

[data-theme=dark] .table {
    color: #bebebe;
    border-color: #404040 !important;
}

[data-theme=dark] .table-hover tbody tr:hover {
    color: #bebebe
}

[data-theme=dark] .list-group-item {
    color: #bebebe;
    background-color: #181818;
    border-color: #404040
}

[data-theme=dark] .list-group-item.list-group-item-action:focus, [data-theme=dark] .list-group-item.list-group-item-action:hover {
    background-color: #222
}

[data-theme=dark] .list-group-item.active, [data-theme=dark] .list-group-item.active:focus, [data-theme=dark] .list-group-item.active:hover {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff
}

[data-theme=dark] .list-group-item-primary {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff
}

[data-theme=dark] .list-group-item-primary.list-group-item-action:focus, [data-theme=dark] .list-group-item-primary.list-group-item-action:hover {
    color: #fff;
    background-color: #0069d9
}

[data-theme=dark] .list-group-item-secondary {
    color: #fff;
    background-color: #6c757d;
    border-color: #6c757d
}

[data-theme=dark] .list-group-item-secondary.list-group-item-action:focus, [data-theme=dark] .list-group-item-secondary.list-group-item-action:hover {
    color: #fff;
    background-color: #5a6268
}

[data-theme=dark] .list-group-item-success {
    color: #fff;
    background-color: #28a745;
    border-color: #28a745
}

[data-theme=dark] .list-group-item-success.list-group-item-action:focus, [data-theme=dark] .list-group-item-success.list-group-item-action:hover {
    color: #fff;
    background-color: #218838
}

[data-theme=dark] .list-group-item-danger {
    color: #fff;
    background-color: #dc3545;
    border-color: #dc3545
}

[data-theme=dark] .list-group-item-danger.list-group-item-action:focus, [data-theme=dark] .list-group-item-danger.list-group-item-action:hover {
    color: #fff;
    background-color: #c82333
}

[data-theme=dark] .list-group-item-warning {
    color: #212529;
    background-color: #ffc107;
    border-color: #ffc107
}

[data-theme=dark] .list-group-item-warning.list-group-item-action:focus, [data-theme=dark] .list-group-item-warning.list-group-item-action:hover {
    color: #212529;
    background-color: #e0a800
}

[data-theme=dark] .list-group-item-info {
    color: #fff;
    background-color: #17a2b8;
    border-color: #17a2b8
}

[data-theme=dark] .list-group-item-info.list-group-item-action:focus, [data-theme=dark] .list-group-item-info.list-group-item-action:hover {
    color: #fff;
    background-color: #138496
}

[data-theme=dark] .list-group-item-light {
    color: #212529;
    background-color: #6c757d;
    border-color: #6c757d
}

[data-theme=dark] .list-group-item-light.list-group-item-action:focus, [data-theme=dark] .list-group-item-light.list-group-item-action:hover {
    color: #212529;
    background-color: #e2e6ea
}

[data-theme=dark] .list-group-item-dark {
    color: #fff;
    background-color: #343a40;
    border-color: #343a40
}

[data-theme=dark] .list-group-item-dark.list-group-item-action:focus, [data-theme=dark] .list-group-item-dark.list-group-item-action:hover {
    color: #fff;
    background-color: #23272b
}

[data-theme=dark] .dropdown-menu {
    background-color: #171717;
    border-color: #404040
}

[data-theme=dark] .dropdown-item:not(:disabled):not(.disabled) {
    color: #bebebe
}

[data-theme=dark] .dropdown-item:focus, [data-theme=dark] .dropdown-item:hover {
    background-color: #242424
}

[data-theme=dark] .dropdown-divider {
    border-top-color: #404040
}

[data-theme=dark] .jumbotron {
    color: #bebebe;
    background-color: #181818;
    border-color: #404040
}

[data-theme=dark] .card {
    color: #bebebe;
    background-color: #181818;
    border-color: #404040
}

[data-theme=dark] .card-header, [data-theme=dark] .card-footer {
    color: #bebebe;
    background-color: #202020;
    border-top-color: #404040;
    border-bottom-color: #404040
}

[data-theme=dark] .form-control {
    color: #bebebe;
    background-color: #171717;
    border-color: #404040
}

[data-theme=dark] .form-control-plaintext {
    color: #bebebe
}

[data-theme=dark] .custom-select {
    color: #bebebe;
    background-color: #171717;
    border-color: #404040;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3e%3cpath fill='%23ffffff' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e")
}

[data-theme=dark] .custom-file-label {
    color: #bebebe;
    background-color: #171717;
    border-color: #404040
}

[data-theme=dark] .custom-file-label:after {
    color: #bebebe;
    background-color: #202020
}

[data-theme=dark] .input-group-text {
    color: #bebebe;
    background-color: #202020;
    border-color: #404040
}

[data-theme=dark] .page-item .page-link {
    border-color: #404040
}

[data-theme=dark] .page-item.disabled .page-link {
    background-color: #171717;
    color: #bebebe
}

[data-theme=dark] .page-item:not(.active) .page-link {
    background-color: #171717
}

[data-theme=dark] .page-item:not(.active) .page-link:hover {
    background-color: #242424
}

[data-theme=dark] .breadcrumb {
    background-color: #171717;
    border-color: #404040
}

[data-theme=dark] .nav-tabs {
    border-bottom-color: #404040
}

[data-theme=dark] .nav-tabs .nav-link:focus, [data-theme=dark] .nav-tabs .nav-link:hover {
    background-color: #242424;
    border-color: #404040
}

[data-theme=dark] .nav-tabs .nav-item.show .nav-link, [data-theme=dark] .nav-tabs .nav-link.active {
    color: #bebebe;
    background-color: #222;
    border-color: #404040;
    border-bottom-color: #222
}

[data-theme=dark] .nav-tabs.card-header-tabs .nav-item.show .nav-link, [data-theme=dark] .nav-tabs.card-header-tabs .nav-link.active {
    background-color: #181818;
    border-bottom-color: #181818
}

[data-theme=dark] .popover {
    background-color: #222;
    border-color: #404040
}

[data-theme=dark] .popover-body {
    color: #bebebe
}

[data-theme=dark] .popover-header {
    background-color: #202020;
    border-bottom-color: #404040
}

[data-theme=dark] .bs-popover-top > .arrow::before, [data-theme=dark] .bs-popover-auto[x-placement^=top] > .arrow::before {
    border-top-color: #404040
}

[data-theme=dark] .bs-popover-top > .arrow::after, [data-theme=dark] .bs-popover-auto[x-placement^=top] > .arrow::after {
    border-top-color: #222
}

[data-theme=dark] .bs-popover-right > .arrow::before, [data-theme=dark] .bs-popover-auto[x-placement^=right] > .arrow::before {
    border-right-color: #404040
}

[data-theme=dark] .bs-popover-right > .arrow::after, [data-theme=dark] .bs-popover-auto[x-placement^=right] > .arrow::after {
    border-right-color: #222
}

[data-theme=dark] .bs-popover-bottom > .arrow::before, [data-theme=dark] .bs-popover-auto[x-placement^=bottom] > .arrow::before {
    border-bottom-color: #404040
}

[data-theme=dark] .bs-popover-bottom > .arrow::after, [data-theme=dark] .bs-popover-auto[x-placement^=bottom] > .arrow::after {
    border-bottom-color: #222
}

[data-theme=dark] .bs-popover-left > .arrow::before, [data-theme=dark] .bs-popover-auto[x-placement^=left] > .arrow::before {
    border-left-color: #404040
}

[data-theme=dark] .bs-popover-left > .arrow::after, [data-theme=dark] .bs-popover-auto[x-placement^=left] > .arrow::after {
    border-left-color: #222
}

[data-theme=dark] .progress {
    background-color: #171717;
    border-color: #404040
}

[data-theme=dark] .close {
    color: #bebebe;
    opacity: 1
}

[data-theme=dark] .modal-header, [data-theme=dark] .modal-footer {
    color: #bebebe;
    background-color: #202020;
    border-bottom-color: #404040;
    border-top-color: #404040
}

[data-theme=dark] .modal-content {
    color: #bebebe;
    background-color: #222;
    border-color: #404040
}

[data-theme=dark] .modal-content {
    color: #bebebe;
    background-color: #222;
    border-color: #404040
}

[data-theme=dark] .btn-link {
    color: #b5dbfc !important;
}

[data-theme=dark] .btn-link.text-dark {
    color: #bebebe !important;
}

[data-theme=dark] a {
    color: #b5dbfc !important;
}

[data-theme=dark] a.bg-warning, [data-theme=dark] a.btn-warning {
    color: black !important;
}

[data-theme=dark] .btn-link:hover {
    color: #FFFFFF !important;
}

[data-theme=dark] a:hover, [data-theme=dark] a.text-dark:active, [data-theme=dark] a:focus {
    color: #FFFFFF !important;
}