html[data-theme="dark"] {
    color-scheme: dark;
    background: #101722;
}

html[data-theme="dark"] body {
    background-color: #101722 !important;
    color: #e4eaf3 !important;
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .all-stat,
html[data-theme="dark"] .all-filter-card,
html[data-theme="dark"] .all-table-card,
html[data-theme="dark"] .logs-summary,
html[data-theme="dark"] .logs-table-card,
html[data-theme="dark"] .loss-summary,
html[data-theme="dark"] .loss-table-card,
html[data-theme="dark"] .switch-summary,
html[data-theme="dark"] .switch-table-card,
html[data-theme="dark"] .health-summary,
html[data-theme="dark"] .health-card {
    background-color: #182230 !important;
    border-color: #2b394b !important;
    color: #e4eaf3;
}

html[data-theme="dark"] .card-header,
html[data-theme="dark"] .all-table-card thead th,
html[data-theme="dark"] .logs-table-card thead th,
html[data-theme="dark"] .loss-table-card thead th,
html[data-theme="dark"] .switch-table-card thead th {
    background-color: #202d3d !important;
    border-color: #334154 !important;
    color: #c4cfdd !important;
}

html[data-theme="dark"] .health-card-header,
html[data-theme="dark"] .health-slot {
    background-color: #202d3d !important;
    border-color: #334154 !important;
    color: #e4eaf3;
}

html[data-theme="dark"] .all-table-card tbody td,
html[data-theme="dark"] .logs-table-card tbody td,
html[data-theme="dark"] .loss-table-card tbody td,
html[data-theme="dark"] .switch-table-card tbody td {
    border-color: #2b394b !important;
}

html[data-theme="dark"] .table,
html[data-theme="dark"] .table > :not(caption) > * > * {
    background-color: #182230;
    color: #e4eaf3;
}

html[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: #1d2938;
    color: #e4eaf3;
}

html[data-theme="dark"] .all-table-card tbody tr:hover,
html[data-theme="dark"] .logs-table-card tbody tr:hover,
html[data-theme="dark"] .loss-table-card tbody tr:hover,
html[data-theme="dark"] .switch-table-card tbody tr:hover {
    background-color: #243347 !important;
    color: #f2f6fb !important;
}

html[data-theme="dark"] .all-table-card tbody tr:hover > *,
html[data-theme="dark"] .logs-table-card tbody tr:hover > *,
html[data-theme="dark"] .loss-table-card tbody tr:hover > *,
html[data-theme="dark"] .switch-table-card tbody tr:hover > * {
    background-color: transparent;
    color: inherit;
}

html[data-theme="dark"] .all-description,
html[data-theme="dark"] .logs-description,
html[data-theme="dark"] .switch-name {
    color: #e4eaf3;
}

html[data-theme="dark"] .all-serial,
html[data-theme="dark"] .logs-port,
html[data-theme="dark"] .switch-port {
    color: #8fd4e0;
}

html[data-theme="dark"] .all-stat-label,
html[data-theme="dark"] .logs-summary-label,
html[data-theme="dark"] .loss-summary-label,
html[data-theme="dark"] .switch-summary-label,
html[data-theme="dark"] .health-summary-label,
html[data-theme="dark"] .health-empty,
html[data-theme="dark"] .all-empty,
html[data-theme="dark"] .logs-empty,
html[data-theme="dark"] .logs-loading,
html[data-theme="dark"] .logs-error,
html[data-theme="dark"] .loss-empty,
html[data-theme="dark"] .loss-loading,
html[data-theme="dark"] .loss-error,
html[data-theme="dark"] .switch-empty,
html[data-theme="dark"] .switch-loading,
html[data-theme="dark"] .switch-error {
    color: #aab8ca !important;
}

html[data-theme="dark"] .all-stat-value,
html[data-theme="dark"] .logs-summary-value,
html[data-theme="dark"] .loss-summary-value,
html[data-theme="dark"] .switch-summary-value,
html[data-theme="dark"] .health-summary-value,
html[data-theme="dark"] .health-slot-value,
html[data-theme="dark"] #logModeDescription {
    color: #eef3f9;
}

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

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

html[data-theme="dark"] .bg-light {
    background-color: #29384b !important;
}

html[data-theme="dark"] .bg-light.text-dark {
    color: #eef3f9 !important;
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select {
    background-color: #111b28;
    border-color: #3a4a60;
    color: #e4eaf3;
}

html[data-theme="dark"] .form-control::placeholder {
    color: #91a0b4;
}

html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus {
    background-color: #111b28;
    border-color: #6bb5d0;
    color: #fff;
}

html[data-theme="dark"] .form-text {
    color: #aab8ca;
}

html[data-theme="dark"] .all-filter-option {
    background-color: #202d3d;
    border-color: #334154;
    color: #e4eaf3;
}

html[data-theme="dark"] .all-filter-option:hover {
    background-color: #29384b;
    border-color: #50647e;
}

html[data-theme="dark"] .modal-content {
    background-color: #182230;
    color: #e4eaf3;
}

html[data-theme="dark"] .modal-header {
    background-color: #202d3d !important;
    border-color: #334154;
}

html[data-theme="dark"] .modal-footer {
    border-color: #334154;
}

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

html[data-theme="dark"] .border-bottom,
html[data-theme="dark"] .table,
html[data-theme="dark"] .table > :not(caption) > * > * {
    border-color: #2b394b !important;
}

html[data-theme="dark"] .alert-success {
    background-color: #17392f;
    border-color: #28644f;
    color: #c4f1dc;
}

html[data-theme="dark"] .alert-danger {
    background-color: #44262d;
    border-color: #793b49;
    color: #ffd2d8;
}