/* 兔子的夜间模式，其基本实现为：在html元素上附加dark theme class
    以此令文档区分是否使用dark theme相关的样式
    */
    :root {
        --dark-bg-color: #1a1a1a;
        --dark-text-color: #e0e0e0;
        --dark-card-bg: #2d2d2d;
        --dark-border-color: #444;
        --dark-link-color: #acb1b6;
        --dark-hover-bg: #3d3d3d;
        --dark-input-bg: #333;
        --dark-input-border: #555;
        --dark-btn-primary: #0b3a81;
        --dark-btn-primary-hover: #123d7d;
        --dark-table-bg: #2d2d2d;
        --dark-table-border: #444;
        --dark-code-bg: #222;
        --dark-mild-grey-85: #d9d9d9;
        --dark-mild-grey-90: #e5e5e5;
    }


    .dark-theme {
        transition: background-color 0.3s ease, color 0.3s ease;
    }

    .dark-theme body {
        background-color: #0E0F13 !important;
        color: var(--dark-text-color) !important;
        background-image: url(/plugin/RustyHare_dark_mode/view/img/bg25-dark-alt.jpg) !important;
        background-repeat: no-repeat !important;
        background-size: contain !important;
        background-position: top center, 0 80px !important;
    }

    .dark-theme .card,
    .dark-theme .panel {
        background-color: var(--dark-card-bg) !important;
        border-color: var(--dark-border-color) !important;
    }

    .dark-theme .card>.card-header,
    .dark-theme .panel-heading {
        background-color: var(--dark-hover-bg) !important;
        border-color: var(--dark-border-color) !important;
        color: var(--dark-text-color) !important;
    }

    .dark-theme a {
        color: var(--dark-text-color) !important;
    }

    .dark-theme span>b {
        color: var(--dark-link-color) !important;
    }

    .dark-theme a:hover {
        color: #66b3ff !important;
    }

    .dark-theme li.media.thread:hover {
        background-color: var(--dark-hover-bg) !important;
    }

    .dark-theme .hometit {
        color: var(--dark-text-color) !important;
    }

    .dark-theme .p-t-sm {
        background-color: var(--dark-card-bg) !important;
    }

    .dark-theme .text-muted {
        color: var(--dark-text-color) !important;
    }

    .dark-theme .list-group-item {
        background-color: var(--dark-card-bg);
    }

    .dark-theme .list-group-item-action:hover,
    .dark-theme .list-group-item-action:focus {
        background-color: var(--dark-hover-bg);
    }

    .dark-theme nav {
        color: var(--dark-bg-color);
    }

    .dark-theme nav>ul>li>a {
        background-color: var(--dark-border-color) !important;
        border-color: var(--dark-link-color) !important;
    }

    .dark-theme nav>ul>li.active>a {
        background-color: var(--dark-code-bg) !important;
        border-color: var(--dark-link-color) !important;
    }

    .dark-theme .breadcrumb {
        background-color: var(--dark-input-bg) !important;
    }

    .dark-theme .breadcrumb:hover {
        background-color: var(--dark-input-border) !important;
    }

    .dark-theme h1,
    .dark-theme h2,
    .dark-theme h3,
    .dark-theme h4,
    .dark-theme h5,
    .dark-theme h6 {
        color: var(--dark-text-color) !important;
    }

    .dark-theme .message * {
        color: var(--dark-text-color) !important;
    }

    .dark-theme .message>p,
    .dark-theme .message>span {
        background-color: var(--dark-card-bg) !important;
    }


    .dark-theme .form-control,
    .dark-theme .form-select {
        background-color: var(--dark-input-bg) !important;
        border-color: var(--dark-input-border) !important;
        color: var(--dark-text-color) !important;
    }

    .dark-theme .title,
    .dark-theme .classify,
    .dark-theme .card-title {
        color: var(--dark-link-color) !important;
    }

    .dark-theme p.bt {
        color: var(--dark-link-color) !important;
    }

    .dark-theme span.approve_blue_name {
        color: #65acde;
    }

    .dark-theme span.approve_gold_name {
        color: #f4e586;
    }

    .dark-theme span.approve_red_name {
        color: #eaa08c;
    }

    .dark-theme .form-control:focus {
        background-color: var(--dark-input-bg) !important;
        border-color: var(--dark-link-color) !important;
        color: var(--dark-text-color) !important;
        box-shadow: 0 0 0 0.2rem rgba(77, 166, 255, 0.25) !important;
    }

    .dark-theme .btn-primary {
        background-color: var(--dark-btn-primary) !important;
        border-color: var(--dark-btn-primary) !important;
        color: rgb(227, 227, 227) !important;
    }

    .dark-theme .btn-primary:hover {
        background-color: var(--dark-btn-primary-hover) !important;
        border-color: var(--dark-btn-primary-hover) !important;
    }

    .dark-theme table {
        background-color: var(--dark-table-bg) !important;
        color: var(--dark-text-color) !important;
    }

    .dark-theme table td,
    .dark-theme table th {
        border-color: var(--dark-table-border) !important;
    }

    .dark-theme div.sc-follow-timeline-action {
        background: var(--dark-input-border) !important;
        color: var(--dark-text-color) !important;
    }

    .dark-theme div.sc-follow-timeline-action::after {
        content: none;
    }

    .dark-theme table tr:nth-of-type(odd) {
        background-color: rgba(60, 60, 60, 0.3) !important;
    }

    .dark-theme .btn-light {
        background-color: var(--dark-input-bg) !important;
        border-color: var(--dark-input-border) !important;
    }

    .dark-theme pre,
    .dark-theme code {
        background-color: var(--dark-code-bg) !important;
        color: var(--dark-text-color) !important;
        border-color: var(--dark-border-color) !important;
    }

    .dark-theme blockquote {
        border-left-color: var(--dark-border-color) !important;
        background-color: rgba(50, 50, 50, 0.5) !important;
    }

    .dark-theme .qqFace {
        background: var(--dark-bg-color) !important;
        border-color: var(--dark-link-color) !important;
    }

    .dark-theme .face-tab .active {
        background: var(--dark-card-bg) !important;
        color: var(--dark-link-color) !important;
    }

    .dark-theme .alert {
        background-color: var(--dark-hover-bg) !important;
        border-color: var(--dark-border-color) !important;
        color: var(--dark-text-color) !important;
    }

    .dark-theme select {
        background-color: var(--dark-card-bg) !important;
        color: var(--dark-text-color) !important;
    }

    .dark-theme select>option {
        background-color: var(--dark-card-bg) !important;
        color: var(--dark-text-color) !important;
    }

    .dark-theme .nav-tabs .nav-link.active {
        background-color: var(--dark-card-bg) !important;
        border-color: var(--dark-border-color) !important;
        color: var(--dark-text-color) !important;
    }

    .dark-theme .dropdown-menu {
        background-color: var(--dark-card-bg) !important;
        border-color: var(--dark-border-color) !important;
        color: var(--dark-text-color) !important;
    }

    .dark-theme .dropdown-item {
        color: var(--dark-text-color) !important;
    }

    .dark-theme .dropdown-item:hover {
        background-color: var(--dark-hover-bg) !important;
    }


    .dark-theme .floor_con {
        background: var(--dark-bg-color) !important;
    }

    .dark-theme .floor_win {
        background: var(--dark-btn-primary) !important;
    }

    .dark-theme .modal-content {
        background-color: var(--dark-border-color) !important;
    }

    .dark-theme a.xs-thread-a>span {
        filter: saturate(0.0) brightness(3);
    }

    .dark-theme div.d-flex.small.mt-1>div>font,
    .dark-theme span.text-grey,
    .dark-theme span.username>font {
        color: var(--dark-text-color) !important;
    }

    .dark-theme a.badge {
        background-color: var(--dark-hover-bg);
        color: var(--dark-text-color) !important;
    }

    .dark-theme .badge-content {
        background-color: var(--dark-card-bg);
    }

    .dark-theme h4.break-all>span {
        filter: saturate(0.0) brightness(2);
    }

    .dark-theme .card-user-info .card-footer b {
        color: var(--dark-link-color);
    }

    .dark-theme .thread,
    .dark-theme .post {
        border-bottom: 1px solid #7a7a7a !important;
    }

    .dark-theme a.text-dark:hover,
    .dark-theme a.text-dark:focus {
        color: var(--dark-text-color) !important;
    }

    .dark-theme .edui-editor-toolbarboxinner {
        background-color: var(--dark-mild-grey-85) !important;
        border-bottom: 1px solid var(--dark-border-color);
        color: var(--dark-bg-color);

    }

    .dark-theme .edui-default {
        background-color: var(--dark-mild-grey-85) !important;
    }

    .dark-theme .edui-combox-body {
        border: 1px solid var(--dark-border-color) !important;
    }

    .dark-theme .btn-outline-primary,
    .dark-theme .btn-outline-danger {
        color: var(--dark-link-color) !important;
    }


    .dark-theme .fieldset {
        background: var(--dark-bg-color);
        border: 1px solid var(--dark-border-color);
    }