/*********************************************************************************
**********************************************************************************
**                                                                              **
**      КОНСТАНТЫ / ПЕРЕМЕНННЫЕ                                                 **
**                                                                              **
**********************************************************************************
*********************************************************************************/

:root {
    --main-bg-color: #f2f4f7;
    --main-bg-color-button: #78b7fa;
    --main-bg-color-table-header: #78b7fa;
    --main-global-menu-hover-color: black; /* navy; MidnightBlue; darkblue; #8AEBE3 - исходное крымчан */
}

/********************************************************************************/

.mainWindows {
    padding: 0;
    background-color: #f2f4f7;
}

/* Пункты главного бокового меню ********************************/
#cssmenu a {
    /*font-size: 16px !important;*/
}
#cssmenu a:hover {
    color: var(--main-global-menu-hover-color) !important;
    /*font-weight: bold !important;*/
}
/****************************************************************/

/* Выделение строки таблицы, на которой находится фокус (мышка) */
table.table tbody tr:hover td {
    background-color: #e8e8ef !important;
}

/* Стили для запрета переноса строк у всех таблиц */
table td, table th {
    overflow: hidden !important;
    white-space: nowrap !important;
    -moz-text-overflow: ellipsis !important;
    -ms-text-overflow: ellipsis !important;
    -o-text-overflow: ellipsis !important;
    text-overflow: ellipsis !important;
}

/* Стили для resizable таблиц */
.layout-fixed table {
    table-layout: fixed !important;
}

table {
    table-layout: fixed !important;
}

/* Стили для заголовка таблиц */
table.table thead tr th {
    /*background-color: #78b7fa !important; */
    background-color: var(--main-bg-color-table-header) !important;
    color: white !important;
}

pre {
    font-size: 12px;
}

div.act-block, div.act-unblock, div.act-delivery {
    padding-left: 10px;
    float: left;
    margin: 0 2px;
    cursor: pointer;
}

img.act-block, img.act-unblock, img.act-delivery {
    padding-bottom: 4px;
    margin-bottom: 4px;
}

/*
dsiv.act-block, dsiv.act-unblock {
    padding-left: 10px;
    display: inline-block;
    float: left;
    width: 22px;
    height: 16px;
    margin: 0 2px;
    cursor: pointer;
    background: url("../img/icons/action/aaa.png") no-repeat center;
    line-height: normal;
    display: inline-block;
    vertical-align: middle;
}
*/

#view .form .row-field .title-field, #edit .form .row-field .title-field {
    padding: 3px 0 0 0 !important;
}

/* Стили для просмотра списка получателей сообщения */
#clt .form .row-field {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

#clt .form .row-field .title-field {
    padding: 5px 0 0;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    max-width: 30%;
}

#clt .form .row-field .view-field {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
}

/* Стили для footer'а окна просмотра и редактирования */
.form .form-footer {
    position: absolute;
    z-index: 1;
    bottom: 0;
    width: 100%;
    padding: 10px 20px;
}

.hiddenCol {
    display: none;
}

/* Стили для datepicker */
.ui-datepicker {
    font: 10pt Arial;
}

.ui-datepicker-calendar .ui-state-hover {
    background: #78b7fa;
}

/* Стили для кнопки "Сменить пароль" при просмотре деталей пользователя */
.top-button {
    margin-left: auto !important;
    margin-right: 0px !important;
}

/* Стили полей во всплывающей форме редактирования */
.form-body .row-field .title-field,
.form-body .row-field .view-field
.form-body .row-field .edit-field input,
.form-body .enter-field .input-group .field-clear input,
.form-body .enter-field .input-group .custom-select select option,
.form-body .enter-field .input-group .field-clear textarea {
    font-size: 12px !important;
    /*    color: red !important;    */
}

/* Стиль для заголовка столбца таблицы, по которому есть поиск */
tr th.col-search {
    color: black;
}

/* Стили для таблиц со списками */
.col-actons-1 {
    width: 50px;
}

.col-actons-2 {
    width: 80px;
}

.col-actons-3 {
    width: 110px;
}

.col-actons-4 {
    width: 130px;
}

.col-actons-5 {
    width: 170px;
}

.col-id {
    width: 90px;
    min-width: 90px !important;
}

.col-id-short {
    width: 60px;
    min-width: 60px !important;
}

.col-uniqueId, .col-uniquId {
    width: 300px;
    min-width: 200px !important
}

.col-uniqueId-GUID, .col-uniquId-GUID {
    width: 250px;
    min-width: 200px !important
}

.col-messageType {
    width: 60px
}

.col-messageReceiver {
    width: 150px
}

.col-messageDirection {
    width: 120px
}

.col-messageError {
    width: 120px
}

.col-state {
    width: 120px
}

.col-fullDate {
    width: 140px;
    min-width: 140px;
    max-width: 150px;
}

.col-schType {
    width: 180px;
}

.col-adapter {
    width: 100px;
}

.col-t-Os {
    width: 80px;
}

.col-v-Os {
    width: 100px;
}

.col-v-App {
    width: 140px;
}

.col-v-Sdk {
    width: 100px;
}

.col-deviceProfile {
    width: 85px;
}

.col-device-perso-status {
    width: 200px;
}

.col-client-uniqueId {
    width: 100px;
}

.col-client-uniqueId-long {
    width: 220px;
}

.col-device-model {
    width: 100px;
}

.col-user-login {
    width: 130px;
    min-width: 100px !important
}

.col-user-name {
    width: 220px;
    min-width: 100px !important
}

.col-user-role {
    width: 170px;
    min-width: 100px !important
}

.col-user-mail {
    width: 150px;
    min-width: 100px !important
}

.col-user-phone {
    width: 130px;
    min-width: 100px !important
}

.col-pack-name {
    width: 350px;
    min-width: 100px !important
}

.col-name-300 {
    width: 300px;
}

.col-name-250 {
    width: 250px;
}

.col-name-200 {
    width: 200px;
}

/* Выделение отдельных деталей сущностей */
.bold_details {
    font-weight: bold;
    color: #404040;
}
 
/* Стили крымчан для класса .form – вынесены отдельно для обратной совместимости со старыми стилями */
.modal {
    display: none;
}

.form.form__control .form-body {
    padding: 50px 15px 60px;
}

.form.form__control .row-field {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.form.form__control .row-field .title-field {
    padding: 5px 0 0;
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    max-width: 30%;
}

.form.form__control .row-field .view-field,
.form.form__control .row-field .enter-field {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
}

/* Стили для .view-field в детальных данных */
.view-field {
    background-color: rgba(192, 192, 192, 0.1);
    color: black !important;
    border-bottom: 1px solid rgba(211, 211, 211, 0.5) !important;
}

/* Стили для задания ширины форм #view, #edit */
@media screen and (max-width: 1920px) {
    #view, #edit {
        min-width: 40vw !important;
        width: 50vw !important;
        max-width: 60vw !important;
    }
}

@media screen and (max-width: 1280px) {
    #view, #edit {
        min-width: 40vw !important;
        width: 60vw !important;
        max-width: 70vw !important;
    }
}

/* Стили для задания ширины форм #view, #edit  - пока отключены
@media screen and (max-width: 1920px) {
    .form.form__control,
    #view .form, #edit .form {
        min-width: 40vw !important;
        width: 50vw !important;
        max-width: 60vw !important;
    }
}

@media screen and (max-width: 1680px) {
    .form.form__control,
    #view .form, #edit .form {
        min-width: 40vw !important;
        width: 55vw !important;
        max-width: 65vw !important;
    }
}

@media screen and (max-width: 1280px) {
    .form.form__control,
    #view .form, #edit .form {
        min-width: 40vw !important;
        width: 60vw !important;
        max-width: 70vw !important;
    }
}
*/

/* Стили для кнопок управления пакетами */
.b-package {
    /*display: inline-block;  */
    display: inline-block;
    float: left;
    width: 14px;
    height: 14px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    border: none; /*27.02.2019*/
    margin-right: 10px; /*27.02.2019*/
}

.b-package-start {
    background: url("/images/b-start.png") no-repeat center;
}

.b-package-pause {
    background: url("/images/b-pause.png") no-repeat center;
}

.b-package-stop {
    background: url("/images/b-stop.png") no-repeat center;
}

.b-package-restart {
    background: url("/images/b-restart.png") no-repeat center;
}

.b-package-reject {
    background: url("/images/b-reject.png") no-repeat center;
}

.b-package-archiv {
    background: url("/images/b-archiv.png") no-repeat center;
}

.b-package-view {
    background: url("/images/b-view.png") no-repeat center;
}

.act-block {
    background: url('/images/baseline_lock.png') no-repeat center;
    background-size: contain;
    width: 15px;
    height: 15px;
}

.act-unblock {
    background: url('/images/baseline_lock_open.png') no-repeat center;
    background-size: contain;
    width: 15px;
    height: 15px;
}

/*  стили для прокуртки таблиц и поиска */
table.table thead tr th.search-marker {
    background: #78b7fa url("/images/search-icon.png") no-repeat left 0px;
    background-size: 10px;
    cursor: pointer;
    padding-top: 0px !important;
}

.table-body-scrolling {
    overflow: auto;
    height: auto;
}

/*  стили для выделения строки по клику в таблице --    #f2f4f7 */
.selectRow {
    background: Cornsilk !important;
}

/*  стили для кнопок "Назад"    */
.btn-return {
    background-color: #4d99e9 !important;
    border-color: #4d99e9 !important;
    color: white !important;
}

.btn-return:hover {
    background-color: #4682B4 !important; /*  SteelBlue   */
    border-color: #4682B4 !important;
    color: white !important;
}

/*********************************************************************************
**********************************************************************************
**                                                                              **
**      NP: НАВИГАЦИОННАЯ ПАНЕЛЬ (ФИЛЬТР + ПОИСК)                               **
**                                                                              **
**********************************************************************************
*********************************************************************************/

.g-nav-table {
    margin-top: -15px;
    padding-top: 0;
}

.filter-list {
    padding-left: 15px !important;
    padding-right: 0px !important;
}

.filters .filter {
    margin-right: 8px !important;
}

.filters select {
    margin-right: 0 !important; /* 20.07.2021 */
}

.filter .row-field .enter-field .input-group input:not([type="search"]) {
    margin-right: 0 !important; /* 20.07.2021 */
}

div.no-search-box {
    height: 6px; /* 20.07.2021 */
}

/*  Цвета для отладки

.filters {
    background-color: red;
}

    .filters .filter:nth-child(odd) {
        background-color: blue;
    }

    .filters .filter:nth-child(even) {
        background-color: green;
    }

*/

/****************************************************************
*       NP: Стили для выбора серверного канала с ручным вводом  *
*           с использованием фреймворка model-list-select       *
*           Используется в Messages.vue & MessagesPush.vue      *
****************************************************************/

#filter-serv-channel {
    padding-top: 4px;
/*  padding-top: 4px !important;
    margin-left: 0px !important;    */
}

    #filter-serv-channel .ui.search.dropdown > input.search {
        font-size: 11px !important;
        margin-left: -1px !important;
        margin-top: -1px !important;
        _border: 1px solid #cdced2 !important;
    }

    #filter-serv-channel div.text {
        margin-top: -11px !important;
        margin-left: -1px !important;
        padding-top: 0 !important;
    }

    #filter-serv-channel .ui.dropdown > .dropdown.icon:before {
        font-size: 12px;
        color: black;
    }

    #filter-serv-channel div.item {
        height: 14px !important;
        padding-left: 5px !important;
        padding-top: 1px !important;
        padding-right: 5px !important;
        border-width: 0 !important;
    }

    #filter-serv-channel div.menu.visible {
        width: 300px !important;
        margin-top: 2px !important;
    }

        #filter-serv-channel div.menu.visible .item,
        #filter-serv-channel ui.dropdown .menu > .item {
            font-size: 11px !important;
        }

    #filter-serv-channel .ui.dropdown .menu .selected.item, .ui.dropdown.selected {
        background: #4090fe; /*rgba(0,0,0,.03);*/
        color: white; /*rgba(0,0,0,.95);*/
    }

/****************************************************************
*       NP: Стили для поля ввода значения для поиска и          *
*           для показа списка полей для поиска                  *
****************************************************************/

.search-box {
    margin-left: auto !important;
    margin-right: 0px !important;
    padding-top: 15px !important;
    padding-left: 0px !important;
    padding-right: 15px !important;
    z-index: 0 !important;
}

.search-fields {
    text-align: right;
    color: #202020;
    font-size: 12px;
    font-weight: normal;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-right: 4px;
    display: block
}

/*
.-filter-list {
    width: auto;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.-search-box {
    padding-top: 15px;
    float: right;
    margin-left: auto;
    margin-right: 0px;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}
*/

/****************************************************************
*       NP: Стили блока кнопок управления фильтром              *
****************************************************************/

.filter.filter-control .btn-group {
    height: 30px;
}

/*********************************************************************************
**********************************************************************************
**                                                                              **
**      GS: ОБЩИЕ СТИЛИ                                                         **
**                                                                              **
**********************************************************************************
*********************************************************************************/

/****************************************************************
*       Стили для управления показом                            *
****************************************************************/

.display-on {
    display: normal;
}

.display-off {
    display: none;
}

.full_100 {
    width: 100%;
}

.-wrap-line {
    white-space: nowrap; /* Отменяем перенос текста */
    overflow: hidden; /* Обрезаем содержимое */
    text-overflow: ellipsis; /* Многоточие */
    padding: 0px;
}

    .-wrap-line:hover {
        overflow: visible;
        white-space: normal; /* Обычный перенос текста */
    }


/*  Стили для значка "Доступно шифрование сообщений" */
.img-crypto {
    margin-bottom: 4px;
    width: 13px;
    height: 13px;
}

/****************************************************************
*       Стили для кнопок экспорта и печати (отчеты)             *
****************************************************************/

.filters .export-excel {
    height: 30px !important;
    width: 80px !important;
    cursor: pointer;
    background: url("/assets/img/icons/new/excel.svg") no-repeat center;
    background-size: 22px auto;
    vertical-align: middle;
    background-color: white;
    border-color: var(--main-bg-color-button); /* MediumSeaGreen /* #3b7d32 */
}

    .filters .export-excel:active {
        background: url("/assets/img/icons/new/excel.svg") no-repeat center !important;
        background-color: white !important;
        background-size: 24px auto;
    }

.filters .export-pdf {
    height: 30px !important;
    width: 80px !important;
    cursor: pointer;
    background: url("/assets/img/icons/new/pdf.svg") no-repeat center;
    background-size: 22px auto;
    vertical-align: middle;
    background-color: white;
    border-color: var(--main-bg-color-button);
}

    .filters .export-pdf:active {
        background: url("/assets/img/icons/new/pdf.svg") no-repeat center !important;
        background-color: white !important;
        background-size: 24px auto;
    }

.filters .print_icon {
    height: 30px !important;
    width: 80px !important;
    cursor: pointer;
    background: url("/assets/img/icons/new/print_1.svg") no-repeat center;
    background: url("/assets/img/icons/new/print_4.svg") no-repeat center;
    background-size: 22px auto;
    vertical-align: middle;
    background-color: white;
    border-color: var(--main-bg-color-button);
}

    .filters .print_icon:active {
        background: url("/assets/img/icons/new/print_4.svg") no-repeat center !important;
        background-color: white !important;
        background-size: 24px auto;
    }

.export-button-group-left-margin {
    margin-left: 80px;
}

/****************************************************************
*       Разное                                                  *
****************************************************************/

.divider {
    width: 5px;
    height: auto;
    display: inline-block;
}

.selected-filter-list {
    font-size: 12px;
    font-weight: bold !important;
    margin-right: 20px;
}

/*********************************************************************************
**********************************************************************************
**                                                                              **
**      CO: СТИЛИ ДЛЯ ЗАДАНИЯ ЦВЕТОВ СОСТОЯНИЙ СУЩНОСТЕЙ                        **
**                                                                              **
**********************************************************************************
*********************************************************************************/
/****************************************************************
*       CO: type = 1 - Сообщения                                *
****************************************************************/

.colorState-1-0, .colorState-2-0, .colorState-3-0, .colorState-6-0 {
    color: SteelBlue !important;
}

.colorState-1-1 {
    color: MediumBlue !important;
}

.colorState-1-2 {
    color: seagreen !important;
}

.colorState-1-3 {
    color: dimgrey !important;
}

.colorState-1-4 {
    color: darkorange !important;
}

.colorState-1-5 {
    color: crimson !important;
}

.colorState-1-6 {
    color: darkred !important;
}

.colorState-1-7 {
    color: darkorange !important;
}

.colorState-1-11 {
    color: darkblue !important;
}

.colorState-1-13 {
    color: darkviolet !important;
}

.colorState-1-15 {
    color: red !important;
}

.colorState-1-102, .colorState-1-105, .colorState-1-106 {
    color: saddlebrown !important;
}

.colorState-def {
    color: black !important;
}

/****************************************************************
*       CO: type = 5 - Статус доставки сообщения                *
****************************************************************/

.delivery-state-1 {
    color: darkblue !important;
}

.delivery-state-2 {
    color: seagreen !important;
}

.delivery-state-3 {
    color: DarkMagenta !important;
    color: darkviolet !important;
}

.delivery-state-4 {
    color: red !important;
}

/************************************************************************
*   Правила доставки: стиль для disabled кнопки смены статуса правила   *
************************************************************************/

#changeState[change-state-of-rule]:disabled:hover {
    background-color: #ccc;
    border-color: #ccc;
}
