html {
    color-scheme: light;
}

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

html[data-theme="dark"] body {
    background: #0f131a !important;
    color: #e6ebf1 !important;
}

html[data-theme="dark"] header {
    background: #090c11 !important;
    border-bottom: 1px solid #252c36;
}

html[data-theme="dark"] header a {
    color: #aeb8c5 !important;
}

html[data-theme="dark"] header a.active,
html[data-theme="dark"] header strong {
    color: #ffffff !important;
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .item,
html[data-theme="dark"] .control,
html[data-theme="dark"] .stat,
html[data-theme="dark"] .check {
    background: #171c24 !important;
    border-color: #2b3440 !important;
}

html[data-theme="dark"] .selected {
    background: #14251b !important;
}

html[data-theme="dark"] table,
html[data-theme="dark"] th,
html[data-theme="dark"] td {
    border-color: #2a323d !important;
}

html[data-theme="dark"] th {
    color: #98a3b1 !important;
}

html[data-theme="dark"] td {
    color: #e0e6ed;
}

html[data-theme="dark"] .muted,
html[data-theme="dark"] .count,
html[data-theme="dark"] .label,
html[data-theme="dark"] .counter {
    color: #98a3b1 !important;
}

html[data-theme="dark"] input,
html[data-theme="dark"] select {
    background: #111720 !important;
    color: #e6ebf1 !important;
    border-color: #35404d !important;
}

html[data-theme="dark"] button:not(.btn-green):not(.btn-red):not(.btn-blue):not(.btn-orange):not(.btn-retry):not(.btn-all):not(.btn-none):not(.btn-select) {
    background: #242c37;
    color: #e6ebf1;
    border-color: #3a4654;
}

html[data-theme="dark"] a.link,
html[data-theme="dark"] .links a,
html[data-theme="dark"] main a {
    color: #78a9ff;
}

html[data-theme="dark"] .btn-blue,
html[data-theme="dark"] .btn-retry,
html[data-theme="dark"] .btn-select {
    background: #203559 !important;
    color: #a9c9ff !important;
}

html[data-theme="dark"] .btn-green,
html[data-theme="dark"] .btn-all {
    background: #173a28 !important;
    color: #91e3ae !important;
}

html[data-theme="dark"] .btn-red {
    background: #482126 !important;
    color: #ffadb3 !important;
}

html[data-theme="dark"] .btn-orange {
    background: #463516 !important;
    color: #ffd586 !important;
}

html[data-theme="dark"] .btn-none {
    background: #28303a !important;
    color: #d5dbe3 !important;
}

html[data-theme="dark"] .flash-success {
    background: #173a28 !important;
    color: #91e3ae !important;
}

html[data-theme="dark"] .flash-warning {
    background: #463516 !important;
    color: #ffd586 !important;
}

html[data-theme="dark"] .flash-error {
    background: #482126 !important;
    color: #ffadb3 !important;
}

html[data-theme="dark"] .progress {
    background: #2b333e !important;
}

html[data-theme="dark"] .progress div {
    background: #8491a3 !important;
}

html[data-theme="dark"] .logbox {
    background: #090c10 !important;
    border: 1px solid #29313b;
}

#themeToggle {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 9999;

    border: 1px solid #d6dbe1;
    border-radius: 999px;

    padding: 10px 14px;

    background: #ffffff;
    color: #20242a;

    box-shadow: 0 5px 20px rgba(0,0,0,.14);

    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
}

html[data-theme="dark"] #themeToggle {
    background: #202731 !important;
    color: #edf2f7 !important;
    border-color: #3b4653 !important;
    box-shadow: 0 5px 25px rgba(0,0,0,.4);
}

#themeToggle:hover {
    transform: translateY(-1px);
}

@media(max-width:600px) {
    #themeToggle {
        right: 10px;
        bottom: 10px;
        padding: 9px 11px;
        font-size: 13px;
    }
}
