/** СТИЛИ ПРИЛОЖЕНИЯ */

/* Определение переменных */
body {
    --row_top: 10px;
    --color: #373737;
    --color-primary-text-button: white;
    --height_footer: 38px;
    --cl_row_catalog: #d2f2ff;
    --cl_form_text: black;
    --cl_form_button: #ffc838;
    --body_fon: white;
    --color-lighten10: #ffba07;
    --color-lighten: #8BC34A;
    --cl_button_border: rgba(254, 190, 65, 0.80);
    --cl_button_fon: #ffc838;
    --cl_button_fon_hover: rgba(254, 190, 65, 0.80);
    --cl_button_text: black;
    --cl_input_fon: white;
    --cl_input_text: black;
    --cl_fon_block: #d2f2ff;
    --cl_fon_block_hover: rgba(205, 242, 255, 0.71);
    --cl_header_text: black;
    --cl_text: black;
    --cl_text_border: black;
    --cl_text_hover: rgba(0, 0, 0, 0.50);
    --cl_table_border: #e8e9eb;
    --cl_row_block: #d9d9d9;
    --cl_page_fon: white;
    --cl_orange: #FF8D24;
    --cl_danger: darkred;
    --cl_green: green;
    --cl_darkgreen: darkgreen;
    --cl_border_table: #b8c1ca;
    --sz_margin_page: 20px;
    --sz_width_menu: 310px;
    --sz_icon: 14px;
    --page_title_size: 22px;
    --row_subtitle_size: 20px;
    --row_text_size: 18px;
    --cl_hover_link: #1a97d5;
    --cl_list_btn_fon: #d2f2ff;
    --cl_list_btn_text: black;
}

/*body {-ms-overflow-style: none; scrollbar-width: none; overflow-y: scroll;}
body::-webkit-scrollbar {display: none;}*/

/***************** fade *********************/
.fadeIn{
    animation-name: fadeIn;
    -webkit-animation-name: fadeIn;
    animation-duration: .5s;
    -webkit-animation-duration: 0.5s;
    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
}
@keyframes fadeIn {
    0% {
        transform: scale(0);
        opacity: 0.0;
    }
    60% {
        transform: scale(1.1);
    }
    80% {
        transform: scale(0.9);
        opacity: 1;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}
@-webkit-keyframes fadeIn {
    0% {
        -webkit-transform: scale(0);
        opacity: 0.0;
    }
    60% {
        -webkit-transform: scale(1.1);
    }
    80% {
        -webkit-transform: scale(0.9);
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(1);
        opacity: 1;
    }
}
.fadeOut{
    animation-name: fadeOut;
    -webkit-animation-name: fadeOut;
    animation-duration: .5s;
    -webkit-animation-duration: 0.5s;
    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
}
@keyframes fadeOut {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    60% {
        transform: scale(0.9);
        opacity: 1;
    }
    80% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(0);
        opacity: 0;
    }
}
@-webkit-keyframes fadeOut {
    0% {
        -webkit-transform: scale(1);
        opacity: 1;
    }
    60% {
        -webkit-transform: scale(0.9);
        opacity: 1;
    }
    80% {
        -webkit-transform: scale(1.1);
    }
    100% {
        -webkit-transform: scale(1);
        opacity: 0.0;
    }
}

/***************** slideDown *********************/
.slideDownIn{
    animation-name: slideDownIn;
    -webkit-animation-name: slideDownIn;
    animation-duration: 1s;
    -webkit-animation-duration: 1s;
    animation-timing-function: ease;
    -webkit-animation-timing-function: ease;
}
@keyframes slideDownIn {
    0% {transform: translateY(-100%);}
    50% {transform: translateY(8%);}
    65% {transform: translateY(-4%);}
    80% {transform: translateY(4%);}
    95% {transform: translateY(-2%);}
    100% {transform: translateY(0%);}
}
@-webkit-keyframes slideDownIn {
    0% {-webkit-transform: translateY(-100%);}
    50% {-webkit-transform: translateY(8%);}
    65% {-webkit-transform: translateY(-4%);}
    80% {-webkit-transform: translateY(4%);}
    95% {-webkit-transform: translateY(-2%);}
    100% {-webkit-transform: translateY(0%);}
}

/* Placeholders */
::-webkit-input-placeholder {color: #414141;}
:-moz-placeholder {color: #414141;}
::-moz-placeholder {color: #414141;}

/************ Заглушки по высоте **************/
.height20 {
    height: 20px;
    width: 100%;
}

/*********************************** СТРАНИЦА АВТОРИЗАЦИИ ************************************************/
/* Весь блок формы авторизации */
#auth_phone_conteiner {
    margin: auto;
    border-radius: 5px;
    box-shadow: 1px 1px 10px #000;
    background-color: var(--cl_row_catalog, #d2f2ff) !important;
    padding: 20px;
}
/* Заголовок формы авторизации */
.authform_header {
    position: relative;
    text-align: center;
    font-size: 40px;
    color: var(--cl_form_text, black) !important;
    margin: 0 0 10px 0;
}
/* Поля формы авторизации */
.auth_fields {
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    justify-content: center;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    width: 100%;
    flex-direction: column;
    align-content: center;
}
/* Поле ввода авторизации */
.auth_fields input {
    text-decoration: none;
    position: relative;
    width: 90%;
    display: block;
    margin: 9px auto;
    font-size: 18px;
    color: black;
    padding: 8px;
    background: white;
    border: none;
    text-align: center;
    outline: none;
    font-weight: bold;
    -webkit-transition: all 2s ease-in-out;
    -moz-transition: all 2s ease-in-out;
    -o-transition: all 2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
/* Поле ввода телефона в форме авторизации */
#txt_auth_phone {
    max-width: 245px;
    font-weight: normal;
}
.auth_fields input[type="button"] {
    background-color: var(--cl_form_button, #ffc838);
    color: black;
    font-weight: bold;
}
.auth_fields input[type="button"]:not([disabled]):active, .auth_fields input:not([type='button']):focus {
    outline: none;
    box-shadow: 3px 3px 10px #333;
    background: #f1fbff;
    opacity: 0.7;
}
#but_auth_phone, #but_registration {
    max-width: 243px;
    width: -webkit-fill-available;
    width: 150px;
}
#but_auth_phone:disabled, #but_registration:disabled {
    cursor: not-allowed;
    opacity: 0.4;
}
/* Блок кнопок формы */
.block_buttons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
    flex-direction: column;
}
/* Подсказка о подтверждении номера */
#title_help {
    display: none;
    text-align: center;
    max-width: 300px;
}
/* Поле подтверждения кода авторизации */
#txt_auth_accept {
    display: none;
    max-width: 150px;
}
/* Кнопка сброса авторизации */
#but_reset_code {
    display: none;
    width: auto;
}
/* Надпись входа по паролю */
#goto_in_password, #goto_in_restore {
    text-align: center;
    cursor: pointer;
    width: fit-content;
    align-self: center;
}
#goto_in_password:hover, #goto_in_restore:hover {
    text-decoration: underline var(--cl_hover_link, #1a97d5);
    color: var(--cl_hover_link, #1a97d5);
}

/* Блок ввода пароля */
.block_password {
    display: flex;
}

/* Поле ввода пароля */
#txt_auth_password {
    font-weight: normal;
}

/* Кнопка скрытия блока пароля(крестик) */
#close_block_passwords {
    align-self: center;
    cursor: pointer;
}
#close_block_passwords:hover {
    color: var(--cl_hover_link, #1a97d5);
}

/* Блок дозвона на номер и время */
.auth_fields #block_accept {justify-content: center;}

/********************************************** ОСНОВНОЙ КОТЕЙНЕР СТРАНИЦ ****************************************************/

.page_container_all {
    display: flex;
    flex-flow: column nowrap;
    width: 100%;
    min-height: 100vh;
    overflow: hidden;
}

/* Весь контейнер страницы height: 100vh; */
.page_container {
    display: flex;
    flex-flow: row nowrap;
    flex: 1;
    width: 100%;
    overflow: hidden;
}

/* Классы отображения/скрытия блоков */
.page_container .show_flex {display: flex !important;}
.page_container .hide_flex {display: none !important;}

/* Футер страницы */
.page_footer {}

/************************************* ЛЕВОЕ МЕНЮ ********************************************************/
#LeftNavbar {
    width: var(--sz_width_menu, 260px);
    background-color: var(--cl_fon_block, #d2f2ff);
    margin-right: 20px;
    height: fit-content;
}
#LeftNavbar>* {
    display: flex;
    padding: 0 15px;
}
#LeftNavbar>li {cursor: pointer;}
#LeftNavbar>li.paging:hover {
    background-color: var(--cl_fon_block, #d2f2ff);
    filter: contrast(110%);
}
#LeftNavbar>li a {
    font-weight: normal;
    color: var(--cl_text, black);
    text-decoration: none;
}
#LeftNavbar>li.top_border {
    border-top: 1px solid var(--cl_text_border, black);
}
#LeftNavbar>li a.activated {font-weight: bold;}
#LeftNavbar>li.paging a:hover {color: var(--cl_text_hover, rgba(0, 0, 0, 0.50));}

/* Логин аккаунта в левом меню */
#account_phone, #account_role {cursor: default !important;}
#account_role {flex-direction: column; margin-bottom: 5px;}
#account_phone>* {font-weight: bold !important; font-size: 18px;}
#account_role>* {color: var(--cl_danger, darkred) !important; text-wrap: auto;  font-size: 18px;}

/* Закрыть меню в мобиле */
.close_menu {display: none;}

/* Заголовок меню */
.header_menu {justify-content: flex-start;}

/*********************************  СТИЛИ СТРАНИЦ ПРИЛОЖЕНИЯ *********************************************/

/* Контент страницы без левого меню */
.template_page {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0 var(--sz_margin_page, 20px) 0 0;
    overflow: hidden;
}

/* Контент страницы без верхнего заголовка */
.wrapper {display: flex; flex-direction: column; overflow: hidden;}

/* Прокрутка на старнице настроек приложения */
#wrapper_settings, #wrapper_company_add, #wrapper_main_editor, #wrapper__orders_editor,
#wrapper_accounts_add, .wrapper_editor, #wrapper_megaorder_editor {overflow: auto; padding-right: 20px;}

/* Блок заголовка страницы */
.template_page .page_title {
    font-size: var(--page_title_size, 22px);
    font-weight: bold;
    text-align: left;
    border-bottom: 1px solid var(--cl_text_border, black);
    padding: 15px 0 15px 0;
    display: flex;
    margin-bottom: 15px;
    flex-wrap: wrap;
    justify-content: space-between;
}

/* Все элементы блока титула страницы */
.template_page .page_title * {align-self: center; margin-right: 5px; vertical-align: text-bottom;}
.template_page .page_title *:last-child {margin-right: 0;}

/* Кнопка возврата в меню(в моб. версии) */
.back_menu {
    display: none;
    cursor: pointer;
    margin-right: 5px;
}

/* Позаголовок страницы */
.subtitle {
    font-size: var(--row_subtitle_size, 20px);
    text-align: center;
    padding: 0 20px 10px 20px;
}

/* Блок с титулом и полем ввода(может включать ещё и кнопку) */
.page_rows {
    display: flex;
    flex-wrap: nowrap;
    line-height: var(--row_text_size, 18px);
    font-size: var(--row_text_size, 18px);
    font-weight: normal;
}

/* Блоки строк с переносом элентов на след. строку */
.page_rows_wrap {
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    padding: 10px 0 0 0;
    align-self: center;
}
.page_rows_wrap * {margin-bottom: 10px;}

/* Каждый элемент блока поля ввода */
.page_rows>* {align-self: center; margin-bottom: 10px;}

.order_payment_inline *, .order_check_inline * {margin-bottom: 0;}

/* Само поле ввода в блоке */
.page_rows input.form-control {
    margin-left: 5px;
    /*margin-right: 10px;*/
    text-align: center;
    font-weight: bold;
    color: var(--cl_input_text, black);
    font-size: var(--row_text_size);
    max-width: 320px;
}

/* Кнопка в блоке поля ввода(если включена) */
.but_page_app {
    padding: 5px 10px;
    margin-right: 10px;
    min-width: 40px;
    height: 38px;
    border-radius: 5px;
    border: 1px var(--cl_button_border, rgba(254, 190, 65, 0.80)) solid;
    background-color: var(--cl_button_fon, #ffc838);
    color: var(--cl_button_text, black);
    font-size: var(--row_text_size, 18px);
    font-weight: bold;
    cursor: pointer;
}

/* Кнопка в фокусе блока поля ввода */
.but_page_app:active:not(:disabled) {outline: 1px solid var(--cl_text_hover, rgba(0, 0, 0, 0.50));}

/* Кнопка под курсором мыши */
.but_page_app:hover:not(:disabled) {filter: opacity(0.6);}

/* Кнопка под запретом */
.but_page_app:disabled {cursor: not-allowed; opacity: 0.4;}

/* Слой блокировки со спинером загрузки */
.content-blocker {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    background-color: rgba(132, 162, 208, 0.5);
    z-index: 2;
}
.content-blocker.show {
    display: block;
    width: 100%;
    height: 100%;
}

/* Спинер загрузки для ajax запросов */
.spinner {
    display: none;
    animation: rotate 2s linear infinite;
    z-index: 3;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -25px 0 0 -25px;
    width: 50px;
    height: 50px;
    stroke: var(--cl_orange, #FF8D24);
}
.spinner.show_spinner {display: flex;}
.spinner_path {
    stroke: hsl(210, 70, 75);
    stroke-linecap: round;
    animation: dash 1.5s ease-in-out infinite;
}
@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}
@keyframes dash {
    0% {
        stroke-dasharray: 1, 150;
        stroke-dashoffset: 0;
    }
    50% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -35;
    }
    100% {
        stroke-dasharray: 90, 150;
        stroke-dashoffset: -124;
    }
}

/********************************* СТИЛИ ТАБЛИЦ СТРАНИЦ ПРИЛОЖЕНИЯ *****************************************/

/* Стиль блока с таблицей */
.wrapper_table {width: 100%; overflow: auto; height: 100%;}

/* Стиль всей таблицы */
.wrapper_table table {
    border: 1px solid #495057;
    border-collapse: collapse;
    font-size: 16px;
    min-width: 100%;
    width: max-content !important;
    cursor: default;
}

/* Заголовки таблиц */
.wrapper_table table tr.tbl_header {
    height: 36px;
    min-height: 36px;
    font-weight: bold;
    background-color: #cccccc;
}
tr.tbl_header th {padding: 3px 6px;text-align: center;}

/* Строки таблиц */
.wrapper_table table tr {
    border: 1px solid var(--cl_border_table, #b8c1ca);
    height: 32px;
    min-height: 32px;
}

/* Заблокированная и спойлерная строки */
.wrapper_table table tr.rw_header {background-color: var(--cl_row_catalog, lightblue); font-weight: bold;}
.wrapper_table table tr.rw_block {background-color: var(--cl_table_border, #e8e9eb);}
.wrapper_table table tr.rw_prod_block {background-color: #f0f2f4;}

/* Строки стадии заказа */
.wrapper_table table tr.is_stage_made {background-color: #f4bfbf;}
.wrapper_table table tr.is_stage_give {background-color: #c6e0b4;}
.wrapper_table table tr.is_stage_inmade {background-color: #d8fff8;}

/* Каждая ячейка таблицы */
.wrapper_table table td {
    border: 1px solid var(--cl_border_table, b8c1ca);
    white-space: nowrap;
    padding: 3px 6px;
}

/*********************** Кнопки в таблицах **********************/

/* Общие стили кнопок в таблицах */
.but_app {
    display: inline-block;
    margin: 0;
    width: auto;
    height: auto;
    font-size: 16px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-decoration: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid rgba(0,0,0,0.50);
    border-top: 1px solid rgba(0,0,0,0.001);
    -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0 1px 2px rgba(0,0,0,0.18), inset 0 -2px 0 rgba(0,0,0,0.35), inset 0 2px 2px rgba(255,255,255,0.10);
    -moz-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0 1px 2px rgba(0,0,0,0.18), inset 0 -2px 0 rgba(0,0,0,0.35), inset 0 2px 2px rgba(255,255,255,0.10);
    -o-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0 1px 2px rgba(0,0,0,0.18), inset 0 -2px 0 rgba(0,0,0,0.35), inset 0 2px 2px rgba(255,255,255,0.10);
    -ms-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0px 1px 2px rgba(0,0,0,0.18), inset 0px -2px 0px rgba(0,0,0,0.35), inset 0px 2px 2px rgba(255,255,255,0.10);
    -ms-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    cursor: pointer !important;
}
.but_app:hover{
    text-decoration: none;
    -webkit-box-shadow:  0 0 10px rgba(0,0,0,0.35), 0 1px 3px rgba(0,0,0,0.18), inset 0 -3px 0 rgba(0,0,0,0.35), inset 0 14px 14px rgba(255,255,255,0.25);
    -moz-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0 1px 3px rgba(0,0,0,0.18), inset 0 -3px 0 rgba(0,0,0,0.35), inset 0 14px 14px rgba(255,255,255,0.25);
    -o-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0 1px 3px rgba(0,0,0,0.18), inset 0 -3px 0 rgba(0,0,0,0.35), inset 0 14px 14px rgba(255,255,255,0.25);
    -ms-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0px 1px 3px rgba(0,0,0,0.18), inset 0px -3px 0px rgba(0,0,0,0.35), inset 0px 14px 14px rgba(255,255,255,0.25);
    box-shadow:  0 0 10px rgba(0,0,0,0.35), 0 1px 3px rgba(0,0,0,0.18), inset 0 -3px 0 rgba(0,0,0,0.35), inset 0 14px 14px rgba(255,255,255,0.25);
}
.but_app:active{
    margin: 1px 0 0 0;
    border-top: 1px solid rgba(0,0,0,0.55);
    -webkit-animation: none;
    -webkit-box-shadow: 0 0 1px rgba(0,0,0,0.35), 0 1px 1px rgba(0,0,0,0.18), inset 0 0px 0 rgba(0,0,0,0.35), inset 0 0px 0px rgba(255,255,255,0.1);
    -moz-box-shadow: 0 0 1px rgba(0,0,0,0.35), 0 1px 1px rgba(0,0,0,0.18), inset 0 0px 0 rgba(0,0,0,0.35), inset 0 0px 0px rgba(255,255,255,0.1);
    -o-box-shadow: 0 0 1px rgba(0,0,0,0.35), 0 1px 1px rgba(0,0,0,0.18), inset 0 0px 0 rgba(0,0,0,0.35), inset 0 0px 0px rgba(255,255,255,0.1);
    -ms-box-shadow: 0 0 1px rgba(0,0,0,0.35), 0 1px 1px rgba(0,0,0,0.18), inset 0 0px 0 rgba(0,0,0,0.35), inset 0 0px 0px rgba(255,255,255,0.1);
    box-shadow:  0 0 1px rgba(0,0,0,0.35), 0 1px 1px rgba(0,0,0,0.18), inset 0 0px 0 rgba(0,0,0,0.35), inset 0 0px 0px rgba(255,255,255,0.1);
}

/* Кнопки общего и строкового коллапса строк в таблицах */
.wrapper_table table .col_all{
    padding: 6px 12px;
    background-color: #1c3345;
    color: #fff;
}
.wrapper_table table .col_one{
    padding: 0 8px;
    background-color: #6397b4;
    color: #fff;
    min-width: 23px;
    max-width: 23px;
    max-height: 24px;
}

/* Кнопки коллапса всех строк в таблицах */
#collapse_all {
    width: 28px !important;
    height: 28px !important;
    padding: 2px 6px !important;
    text-align: center;
}

/*********************** Элементы страницы  **********************/

/* Блок строки поля ввода вместе с фильтром */
.row_filters {justify-content: space-between; flex-flow: row wrap;}

/* Сам блок фильтров справа */
.block_filters *:not(:last-child) {margin-right: 5px;}

/* Фильтр "Весь период" таблицы комментов */
.page_row_checkbox {display: flex; margin-left: 5px;}
.page_row_checkbox *:not(:last-child) {margin-right: 5px;}

/* Блок строки фильтра таблиц */
.list_table .filters {margin-bottom: 10px;}
.list_table .filters>* {margin: 0 0 8px 0; min-height: 38px;align-self: flex-start;}
.list_table .filters>*:not(:first-child) {margin-left: 8px;}

/* Блок выбора периода на странице настроек для сканирования выписок */
#wrapper_settings .filter_period {margin: 0 8px 0 0;}
#wrapper_settings .filter_period .form-control {font-size: 16px;}

/* Кнопка элемента спадающего списка dropdown */
.wrapper .dropdown .dropdown-toggle {
    padding: 0 10px;
    font-size: var(--row_text_size, 18px);
    background-color: var(--cl_list_btn_fon, #d2f2ff);
    color: var(--cl_list_btn_text, black);
}
.wrapper .dropdown .dropdown-toggle:active,
.wrapper .dropdown .dropdown-toggle:focus {outline: none !important;}

/* Блок выпадающего списка height: 500px;*/
.wrapper .dropdown .dropdown-menu {
    margin-top: 5px;
    padding-top: unset;
    padding-bottom: unset;
    overflow-y: auto;
    overflow-x: hidden;
}

/* Каждый элемент выпадающего списка */
.wrapper .dropdown .dropdown-item {
    cursor: pointer;
    padding-left: 0.6rem;
    padding-right: 0.6rem;
}

/* Кнопки добавления/удаления */
.but_record {
    text-align: end;
    text-align: -moz-right;
    text-align: -webkit-right;
    padding: 0 7px;
    height: 24px;
    width: 24px;
    max-width: 24px;
    max-height: 24px;
    display: inline-block;
    margin: 0;
    font-size: 16px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-decoration: none;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    -o-border-radius: 12px;
    -ms-border-radius: 12px;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,0.50);
    border-top: 1px solid rgba(0,0,0,0.001);
    -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0 1px 2px rgba(0,0,0,0.18), inset 0 -2px 0 rgba(0,0,0,0.35), inset 0 2px 2px rgba(255,255,255,0.10);
    -moz-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0 1px 2px rgba(0,0,0,0.18), inset 0 -2px 0 rgba(0,0,0,0.35), inset 0 2px 2px rgba(255,255,255,0.10);
    -o-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0 1px 2px rgba(0,0,0,0.18), inset 0 -2px 0 rgba(0,0,0,0.35), inset 0 2px 2px rgba(255,255,255,0.10);
    -ms-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0px 1px 2px rgba(0,0,0,0.18), inset 0px -2px 0px rgba(0,0,0,0.35), inset 0px 2px 2px rgba(255,255,255,0.10);
    -ms-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
    text-shadow: -1px -1px 0 white, 1px 1px 0 white, -1px 1px 0 white, 1px -1px 0 white !important;
    /*margin-left: -1px !important;*/
}
.but_record:hover {
    text-decoration: none;
    -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0 1px 2px rgba(0,0,0,0.18), inset 0 -2px 0 rgba(0,0,0,0.35), inset 0 2px 2px rgba(255,255,255,0.10);
    -moz-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0 1px 2px rgba(0,0,0,0.18), inset 0 -2px 0 rgba(0,0,0,0.35), inset 0 2px 2px rgba(255,255,255,0.10);
    -o-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0 1px 2px rgba(0,0,0,0.18), inset 0 -2px 0 rgba(0,0,0,0.35), inset 0 2px 2px rgba(255,255,255,0.10);
    -ms-box-shadow: 0 0 10px rgba(0,0,0,0.35), 0 1px 2px rgba(0,0,0,0.18), inset 0 -2px 0 rgba(0,0,0,0.35), inset 0 2px 2px rgba(255,255,255,0.10);
    box-shadow:  0 0 10px rgba(0,0,0,0.35), 0 1px 2px rgba(0,0,0,0.18), inset 0 -2px 0 rgba(0,0,0,0.35), inset 0 2px 2px rgba(255,255,255,0.10);
}

.but_record:active {
    margin: 1px 0 0 0;
    border-top: 1px solid rgba(0,0,0,0.55);
    -webkit-animation: none;
    -webkit-box-shadow: 0 0 1px rgba(0,0,0,0.35), 0 1px 1px rgba(0,0,0,0.18), inset 0 0 0 rgba(0,0,0,0.35), inset 0 0 0 rgba(255,255,255,0.1);
    -moz-box-shadow: 0 0 1px rgba(0,0,0,0.35), 0 1px 1px rgba(0,0,0,0.18), inset 0 0 0 rgba(0,0,0,0.35), inset 0 0 0 rgba(255,255,255,0.1);
    -o-box-shadow: 0 0 1px rgba(0,0,0,0.35), 0 1px 1px rgba(0,0,0,0.18), inset 0 0 0 rgba(0,0,0,0.35), inset 0 0 0 rgba(255,255,255,0.1);
    -ms-box-shadow: 0 0 1px rgba(0,0,0,0.35), 0 1px 1px rgba(0,0,0,0.18), inset 0 0px 0 rgba(0,0,0,0.35), inset 0 0px 0px rgba(255,255,255,0.1);
    box-shadow:  0 0 1px rgba(0,0,0,0.35), 0 1px 1px rgba(0,0,0,0.18), inset 0 0 0 rgba(0,0,0,0.35), inset 0 0 0 rgba(255,255,255,0.1);
}
.add_record {
    background-color: var(--cl_orange, #FF8D24);
    color: var(--cl_orange, #FF8D24);
}
.del_record {
    background-color: var(--cl_danger, darkred);
    color: white !important;
    padding: 0px 8px;
    text-shadow: 1px 0 0 white, -1px 0 0 white !important;
    line-height: 16px;
}

/* Блок со свойством flex */
.flex {
    display: -ms-flexbox;
    display: -ms-flex;
    display: -moz-flex;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
}
.flexend {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
}
.flex.nowrap, .flexend.nowrap {-ms-flex-wrap: nowrap; flex-wrap: nowrap;}
.flex.wrap, .flexend.wrap {-ms-flex-wrap: wrap; flex-wrap: wrap;}
.flex.row, .flexend.row {-ms-flex-direction: row; -webkit-flex-direction: row; flex-direction: row;}
.flex.column, .flexend.column {-ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column;}
.flex.hide, .flexend.hide {display: none;}

/* Блок таблицы с фильтрами */
.list_table {overflow: hidden;}
#wrapper_main_editor .list_table {overflow: unset;}

/* Кнопки в заголовке */
.title_buttons>* {margin: 8px 0 0 5px !important;}
.title_buttons>*:first-child {margin-left: 0 !important;}
.title_buttons {margin-top: -5px;}

/* Класс скрытия элемента */
.hide_mode {display: none;}

/* Блок пустого содержимого */
.nothing_block {
    border: 1px solid darkred;
    border-radius: 5px;
    padding: 10px;
    text-align: center;
    margin-bottom: 10px;
}

/* Класс отступа вниз на 10px */
.margin_bottom {margin-bottom: 10px;}
.margin_bottom20 {margin-bottom: 20px;}
.margin_top {margin-top: 10px;}

/* Цвета текста ячейки результата */
.color_green {color: darkgreen;}
.color_red {color: darkred;}

/* Фильтр по периоду */
.filter_period input.form-control {
    height: 35px;
    border: 1px solid #495057;
    color: #353535;
    font-weight: bold;
    margin: 0;
    -webkit-align-self: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-self: center;
    width: 110px;
    text-align: center;
    cursor: default !important;
}
.divider_period {margin: 0 3px; align-self: center;}

/* Поля элементов ввода */
.form-control:focus {box-shadow: unset;}

/* Ячейка выделения в таблице */
.select_cell {color: white; background-color: #0a4b78;}

/* Поле редактирования в ячейке с режимом редактирования */
.cell_edit {
    height: 28px !important;
    width: 78px !important;
    padding: 0 !important;
    line-height: 25px !important;
    outline: none !important;
    text-align: center !important;
    border: 1px solid darkgreen !important;
    vertical-align: center !important;
}

/* Кнопки в ячейках таблиц с надписями */
.but_in_cell {
    font-size: 16px;
    padding: 0;
    width: 100%;
    border-radius: 5px;
    font-weight: bold;
}

/* Кнопка фиксации оплаты заказа */
#pay_fixed {
    background-color: var(--cl_danger, darkred);
    color: white;
    height: 28px;
}

/* Кнопка создания ссылки на оплату */
#create_pay {
    background-color: var(--cl_danger, darkred);
    color: white;
    height: 28px;
}

/* Кнопка действия по чеку по умолчанию (красная Регистрация чека) */
.check_type {
    background-color: var(--cl_danger, darkred);
    color: white;
    height: 28px;
}

/* Кнопка отмены  (зелёная Регистрация отмены чека) */
.check_type_abort {
    background-color: var(--cl_fon_block, #d2f2ff);
    color: var(--cl_text, black);
    height: 28px;
}

/* Флажок установки роли доступа */
.chk_role {margin-left: 5px;}

/* Кнопка перехода на оплату по qr коду */
.pay_qrcode {
    width: auto;
    padding: 0 7px;
    background-color: var(--cl_orange, orange);
    margin-right: 6px;
}

/* Селект выбора типа ордера на странице добавления нового ордера движения средств */
#paymove_type_edit {
    margin-left: 10px;
    background-color: white;
    border-radius: .25rem;
    height: 35px;
    font-weight: 600;
}

/* Селект выбора на странице движения средств контрагента */
#wrapper_bankmove_add select {
    background-color: white;
    border-radius: .25rem;
    height: 35px;
    margin-bottom: 10px;
}
#wrapper_bankmove_add #filter_company {width: calc(100% - 100px);}

/* Селект выбора на странице редактирования заказа */
#wrapper_main_editor #filter_company, #wrapper_megaorder_editor #filter_company {
    background-color: white;
    border-radius: .25rem;
    height: 35px;
    margin-bottom: 10px;
    width: calc(100% - 270px);
    min-width: 360px;
}
#select_company_block #filter_company {width: 400px; display: none;}

/* Всплывающие подсказки (широкие) */
.wide_tooltip_window.tooltip .tooltip-inner {display: flex; max-width: unset; flex-direction: column;}
.wide_tooltip_window.tooltip .tooltip-inner * {align-self: center;}

/* Фильтры выборки в таблицах */
#pay_type_edit, #filter_pay_type, #filter_status, #filter_roles, #filter_doc_type, #doc_type_edit, #filter_ucat, #cmb_catalog {
    background-color: white;
    border-radius: .25rem;
    height: 35px;
    align-self: center;
}
#cmb_catalog {max-width: 250px; height: 38px;}
#wrapper_main_editor #wrapper_cmb_catalog {margin-left: 0;}

/* Спадающий список выбора оплаты */
#pay_type_edit {margin-right: 8px; margin-bottom: 10px; font-weight: 600;}

/* Ссылка на редактирование */
.ref_edit_company, .ref_edit_accounts, .goto_orders_company, .ref_auth_accounts {cursor: pointer;}

/* Ссылка на просмотр файла pdf счёта на странице редактора заказа */
#goto_invoice {align-self: center; font-weight: bold; min-height: unset;}

/* Инфоокно на странице редактирования пользователя */
#user_info {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    border: 3px double #ced4da;
    border-radius: 5px;
    padding: 10px;
    background: #f4f2f2;
    max-width: 330px;
    width: 330px;
}
#user_info>* {
    width: 100%;
    text-align: center;
    margin: 5px;
}
#user_info>*:first-child {font-weight: bold;}

/* Список ролей пользователя */
#user_roles {font-weight: bold; color: var(--cl_danger, darkred);}

/* Класс признака аккаунта в онлайн(зеленный) */
.wrapper_table table .is_online {font-weight: bold; color: var(--cl_darkgreen, darkgreen);}
.wrapper_table table .is_active {font-weight: 600; color: #009d00;;}

/* Флажок начисления бонусов в заказ */
.chk_bonus_add {
    align-self: center;
    margin-bottom: 8px;
    margin-right: 5px;
}

/* Блок откатов заказа(отмен) */
.rollback_block {
    background-color: #f0f0f0;
    margin-top: 5px;
    margin-bottom: 10px;
    padding: 10px;
    font-size: 18px;
    border: 1px solid darkred;
    border-radius: 5px;
    width: fit-content;
}

/* Статус оплаты и ссылка на оплату заказа */
#goto_payment {margin-right: 10px; margin-bottom: 10px;}
#pay_status {font-weight: bold; margin-bottom: 10px;}

/* Ссылка на чек кассы Атол */
.ref_check {margin-right: 10px; margin-bottom: 10px; font-weight: bold;}

/* Обводка кнопок */
button::-moz-focus-inner {border: 0 !important;}
button:active, button:focus {outline: none !important;}
button {box-shadow: none !important;}

/* Удаление текущего файла документа(крестик) */
#delete_file_pdf, #delete_screen_client {
    align-self: center;
    font-size: 18px;
    font-weight: bold;
    color: darkred;
    cursor: pointer;
}
.filters #delete_file_pdf, .page_rows #delete_screen_client, .page_rows #delete_photo_client, .page_rows #delete_dessign_client {margin-left: 15px;}

/* Блок пагинатора страниц таблицы */
.wrap_paginator {margin-bottom: 10px; margin-top: 10px; height: 30px;}
.wrap_paginator>* {margin-right: 5px; align-self: center;}
.wrap_paginator>*:last-child {margin-right: 0;}

/* Расширенный пагинатор */
.wrap_paginator .pg_total_count {margin-left: 10px;}
.wrap_paginator .pg_range_count {margin-left: 10px;}
.wrap_paginator .pg_total_count.hide {display: none;}
.wrap_paginator .pg_range_count.hide {display: none;}

/* Кнопки пагинатора страниц в таблицах */
.next_one,
.next_ten,
.prev_one,
.prev_ten
{
    background-color: #6397b4;
    color: white !important;
    border-radius: 3px;
    text-shadow: none !important;
    padding-top: 1px;
    min-width: 24px;
    min-height: 24px;
    width: 28px;
    text-align: center;
    height: 28px;
}

/* Копирование ИНН по клику */
table .ref_copy_company_inn {cursor: pointer; margin-right: 5px; color: #0a4b78;}
table .ref_copy_company_inn:hover {color: #186faf;}

/* Модальные окна bootstrap  */
.modal .modal-content {max-width: calc(100% - 40px); !important;}
.modal .modal-content .accept_paste_image {max-height: calc(100vh - 450px) !important; max-width: 100% !important;}

/* Элемент загрузки файлов фона на странице товаров */
label.image_upload .image_upload_filesize {
    position: absolute;
    bottom: -13px;
    text-align: center;
    font-size: 7px;
    color: #ff0000;
    font-weight: 700;
    min-width: 36px;
    right: 0;
}
label.image_upload .image_upload_input {
    opacity: 0;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
    width: 100%;
}
label.image_upload .image_upload_img {
    background: url(data:image/png;base64,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) no-repeat 50%;
    background-size: contain;
    width: 20px;
    height: 20px;
    margin-left: 1px;
    margin-top: 1px;
    transform: scale(1.1);
}
label.image_upload .image_upload_nofile {
    transition: all .05s ease-in;
    cursor: pointer;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
label.image_upload .image_upload_nofile:focus, .image_upload_nofile:hover {-webkit-transform: scale(1.1); transform: scale(1.1);}
label.image_upload {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    background-color: #ededed;
    background-position-x: 0%;
    background-position-y: 0%;
    background-image: none;
    background-size: 100%;
    background-position: 0 50%;
    background-repeat: no-repeat;
    border: 1px dashed #bababa;
    border-radius: 4px;
}
label.image_upload_small {height: 36px; width: 36px; min-width: 36px;}
label.image_upload .btn:not(:disabled):not(.disabled) {cursor: pointer;}
label.image_upload .image_upload_delete {
    font-weight: bold;
    position: absolute;
    bottom: 5px;
    left: 5px;
    color: #fff;
    padding: 2px 4px;
    background-color: rgb(248, 108, 107);
    border-radius: 3px;
    width: 30px;
    height: 24px;
    display: flex;
    justify-content: center;
    cursor: pointer;
}
label.image_upload_small .image_upload_delete {
    position: static;
    display: none;
}
label.image_upload_small:hover .image_upload_delete, .image_upload_small:focus .image_upload_delete {
    width: 34px;
    height: 34px;
    display: flex;
}

/* Фильтр мультиселекта */
.chosen-container .chosen-drop {top: auto !important;}

/* Фильтр выбора категорий в блокировке(как span) */
.title_ucat {font-weight: 600;}

/* Тема всплывающей подсказки transparent */
.tippy-box[data-theme~='transparent'] {background-color: transparent;color: transparent;}
.tippy-box[data-theme~='transparent'] .tippy-content {padding: 0;}
.tippy-box[data-theme~='transparent'] .tippy-arrow {display: none;}

/* Блок мобильной и обычной вёрстки */
.is_mobile_blocks, .is_mobile_flex {display: none;}
.is_web_blocks {display: block;}
.is_web_flex {display: flex;}

/* Спадающие списки выбора варианта списочного поля битрикс */
.list_field_bitrix {
    background-color: white;
    border-radius: .25rem;
    height: 35px;
    align-self: center;
    margin-right: 8px;
    margin-bottom: 10px;
    font-weight: 600;
}

/* Скрыть кнопку отмена в календарях */
.dtp-btn-cancel {display: none !important;}
.dtp .dtp-buttons {justify-content: flex-start !important;}
.dtp .dtp-buttons .btn:not(:first-child) {margin-left: 10px !important;}

/* Верхний блок итоговой суммы заказа в карточке заказа */
.order_total_summary {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    width: fit-content;
    max-width: 100%;
    padding: 8px 14px;
    margin: 4px 0 12px 0;
    border: 1px solid #f0c36d;
    border-radius: 6px;
    background-color: #fff3cd;
    color: var(--cl_text, #000);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.25;
}
.order_total_summary_title {font-weight: 700;}
.order_total_summary_value {font-size: 22px; font-weight: 800;}
.order_total_summary_currency {font-size: 18px; font-weight: 700;}
.order_total_summary.is_mobile {
    display: flex;
    width: 100%;
    box-sizing: border-box;
    justify-content: center;
    text-align: center;
}

/* Верхняя строка суммы заказа, метода оплаты и чека кассы */
.order_summary_payment_row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    width: 100%;
    margin: 4px 0 12px;
}
.order_summary_payment_row .order_total_summary {margin: 0; flex: 0 0 auto;}
.order_payment_inline {
    display: flex;
    align-items: center;
    flex: 0 1 auto;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
    margin: 0;
}
.order_payment_inline > label,
.order_payment_inline > select,
.order_payment_inline > button,
.order_payment_inline > a,
.order_payment_inline > #pay_status {margin-bottom: 0 !important;}
.order_payment_inline > #pay_status {font-weight: 600;}
.order_payment_inline > #goto_payment {
    max-width: 320px;
    overflow-wrap: anywhere;
}
.order_check_inline {
    display: flex;
    align-items: center;
    flex: 0 1 auto;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
    margin: 0;
}
.order_check_inline > label,
.order_check_inline > button,
.order_check_inline > .ref_check {margin-bottom: 0 !important;}
.order_check_inline > .ref_check {margin-right: 0;}
.order_summary_payment_row.is_mobile {align-items: stretch;}
.order_summary_payment_row.is_mobile .order_total_summary.is_mobile {
    flex: 1 1 100%;
    width: auto;
}
.order_summary_payment_row.is_mobile .order_payment_inline,
.order_summary_payment_row.is_mobile .order_check_inline {flex: 1 1 100%;}

/* Компактные секции-спойлеры карточки заказа */
.order_spoiler {
    width: 100%;
    box-sizing: border-box;
    margin: 10px 0;
    border: 1px solid #d9dee5;
    border-radius: 6px;
    background-color: rgba(255, 255, 255, .45);
    overflow: hidden;
}
.order_spoiler_header {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
    box-sizing: border-box;
    padding: 6px 8px;
}
.order_spoiler_header_content {
    flex: 1 1 auto;
    min-width: 0;
}
.order_spoiler_header_content > .page_rows {margin-top: 0 !important;}
.order_spoiler_toggle {
    flex: 0 0 36px;
    width: 36px;
    min-width: 36px;
    height: 34px;
    margin: 0 0 0 auto;
    padding: 0;
    border: 1px solid #b8c0ca;
    border-radius: 5px;
    background-color: var(--cl_fon_block, #d2f2ff);
    color: var(--cl_text, #000);
    font-size: 15px;
    font-weight: 700;
    line-height: 32px;
    text-align: center;
    cursor: pointer;
}
.order_spoiler_toggle:hover,
.order_spoiler_toggle:focus {filter: brightness(.96);}
.order_spoiler_body {
    box-sizing: border-box;
    padding: 10px 8px 2px;
    border-top: 1px solid #e1e5ea;
}
.order_spoiler_body[hidden] {display: none !important;}
.order_spoiler.is_open .order_spoiler_header {background-color: rgba(210, 242, 255, .28);}

@media (max-width: 700px) {
    .order_summary_payment_row {gap: 8px;}
    .order_payment_inline {align-items: flex-start;}
    .order_spoiler_header {padding: 6px;}
    .order_spoiler_body {padding: 8px 6px 2px;}
    .order_spoiler_toggle {flex-basis: 34px; width: 34px; min-width: 34px;}
}