@CHARSET "UTF-8";

@media (prefers-color-scheme: dark) {

    #boxed-wrapper {
        background-color: #676767 !important;
        color: #f1f1f1;
    }

    a {
        color: rgb(202, 225, 255);
    }

    a:hover {
        color: rgb(195, 238, 255);
    }

    a:focus {
        color: #fff
    }

    .pretty-table table thead th {
        background-color: #595959;
    }

    .pretty-table table {
        border-color: #bbb !important;
    }

    .pretty-table tr th {
        border-color: #bbb !important;
    }

    .pretty-table tr td {
        border-color: #bbb !important;
    }


    .help-block {
        color: #ddd;
    }

    .text-success {
        color: #68c669;
    }

    .text-danger {
        color: #fc6260;
    }

    .nav-tabs {
        border-bottom: 1px solid #bbb;
    }

    .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
        border: 1px solid #bbb;
        border-bottom-color: transparent;
    }

    .nav-tabs > li > a {
        color: #eee;
    }

    .nav-tabs > li.active > a {
        color: #eee;
    }

    .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
        color: #eee;
        background-color: #676767;
    }

    .nav > li > a:focus, .nav > li > a:hover {
        color: #eee;
        background-color: rgba(95, 95, 95, 0.55);
    }

    .nav-tabs > li > a:hover {
        border-color: #ddd #ddd #ccc;
    }

    .nav-monitor {
        box-shadow: 0 -7px 7px -7px rgba(0, 0, 0, 0.34) inset;
    }

    .nav-monitor .active {
        box-shadow: 0 -7px 7px -7px rgba(0, 0, 0, 0.34);
    }


    .h3-tooltip {
        color: #9bb7db;
    }

    .status-table > tbody > tr > th {
        background-color: #676767;
    }

    .status-table > tbody > tr > td {
        border-color: rgba(229, 229, 229, 0);
    }

    .label-default {
        background-color: #595959;
    }

    .panel {
        background-color: rgba(255, 255, 255, 0.15);
    }

    .btn-default {
        background-color: #f0f0f0;
    }


    .btn-success {
        background-color: #5ead5c;
    }

    .btn-warning {
        background-color: #e5a54a;
    }

    .btn-primary {
        background-color: #5f8dbf;
    }

    .btn-info {
        background-color: #54b3ce;
    }


    .check-ok {
        color: #87d489;
    }

    .check-ng {
        color: #fc6260;
    }

    .two-lines:after {
        border-top: 1px solid #bbb;
        border-bottom: 1px solid #bbb;
    }

    hr {
        border-top: 1px solid #bbb;
    }

    /* formcontrol関連 */
    .form-control {
        background-color: #f0f0f0;
    }

    .form-control:focus {
        border-color: #6ec2fe;
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(166, 215, 255, 0.9);
    }

    .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
        background-color: #b4b4b4;
    }

    .select2-container--default.select2-container--disabled .select2-selection--single {
        background-color: #b4b4b4 !important;
        cursor: default;
    }


    /* navbar関連 */
    .navbar-default {
        background-color: #e1e1e1;
    }

    .navbar-default a {
        color: rgb(138, 154, 186);
    }

    .navbar-default a:hover {
        color: rgb(150, 200, 255);
    }

    .navbar-default a:focus {
        color: #d1deff
    }

    /* モーダル関連 */
    .modal-content {
        background-color: #f0f0f0;
    }

}