/* ********************************* */
/* WebView для работы телеграмм-бота */
/* @sgrc26_bot                        */
/* ********************************* */
/*       https://t.me/fsanek         */
/* ********************************* */

/* разметка шаблонов под единый стандарт организаци */

.switch-btn {
    background: #bfbfbf; /* цвет фона */
    border: 1px solid darkblue;
}
.switch-btn::after {
    background: #fff; /* цвет кнопки */
    border: 1px solid blue;
}
.switch-on {
    background: linear-gradient(to right, #118c4e, #bfbfbf);
}
.switch-btn.switch-on::after {
    background: #06769b; /* цвет кнопки */
}

/* ******************* */
/* * light theme     * */
/* ******************* */
body.sgrc.light {
    color: black;
    background-color: white;
}

.sgrc.light .panel {
    background-color: white;
}
.sgrc.light .deco-2-line {
    border-top-color: darkblue;
    border-bottom-color: darkblue;
}
.sgrc.light .deco-side {
    border-color: blue;
}
.sgrc.light .deco-panel {
    border-color: darkblue;
}

.sgrc.light .btn {
    background-color: #dddddd;
    border-color: darkblue;
}

.sgrc.light #panel-help-btn {
    background-color: white;
    color: darkblue;
}

.sgrc.light #panel-data-add .input input {
    border-color: darkblue;
}

.sgrc.light .pay-month {
    border-color: darkblue;
}

.sgrc.light .pay-month .pay-M,
.sgrc.light .pay-month .pay-S {
    border-bottom-color: gray;
}

.sgrc.light #ver {
    border-color: darkblue;
    background-color: white;
}

/* ******************* */
/* * dark theme      * */
/* ******************* */
body.sgrc.dark {
    color: white;
    background-color: black;
}

.sgrc.dark .panel {
    background-color: black;
}

.sgrc.dark deco-2-line {
    border-top-color: silver;
    border-bottom-color: silver;
}
.sgrc.dark .deco-side {
    border-color: silver;
}
.sgrc.dark .deco-panel {
    border-color: silver;
}

.sgrc.dark .btn {
    background-color: silver;
    border-color: #ffda79;
    color: black;
}

.sgrc.dark #panel-data-add .input input {
    border-color: #ffda79;
}

.sgrc.dark .pay-month {
    border-color: silver;
}

.sgrc.dark .pay-month .pay-M,
.sgrc.dark .pay-month .pay-S {
    border-bottom-color: silver;
}

.sgrc.dark #panel-result,
.sgrc.dark #panel-load {
    border-color: #ffda79;
}

.sgrc.dark #ver {
    border-color: silver;
    background-color: black;
}