@charset "utf-8";

@font-face {
   font-family: "PT Sans";
   font-weight: normal;
   font-style: normal;
   src: url('../fonts/PTSans-Regular.ttf');
}
@font-face {
   font-family: "Roboto-Regular";
   font-weight: normal;
   font-style: normal;
   src: url('../fonts/Roboto/Roboto-Regular.ttf');
}
@font-face {
   font-family: "Mono Regular";
   font-weight: normal;
   font-style: normal;
   src: url('../fonts/RobotoMono-Regular.ttf');
}
@font-face {
   font-family: "Mono Bold";
   font-weight: normal;
   font-style: normal;
   src: url('../fonts/RobotoMono-Bold.ttf');
}
@font-face {
   font-family: "Material-Icons";
   font-weight: normal;
   font-style: normal;
   src:
      local('Material Icons'),
      local('MaterialIcons-Regular'),
      url('../fonts/MaterialIcons-Regular.ttf') format('truetype'),
      /*url('../fonts/MaterialIcons/MaterialIcons-Rounded2.woff2') format('woff2')*/
}
@font-face {
   font-family: "Nunito";
   font-weight: normal;
   font-style: normal;
   src: url('../fonts/Nunito-Regular.ttf');
}
*,
*:before,
*:after {
   -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
           box-sizing: border-box;
   scroll-behavior: smooth;
}
:focus-visible { outline: none }
/* Basic elements */
html, body {
   font-family: 'PT Sans', Helvetica, sans-serif;
   text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   height: calc(100% - 20px);
   font-size: 100%;
   padding: 0;
   margin: 0;
}
body {
   background-color: #d9d9d9;
   color: #3e3e3e;
}
a {
   text-decoration: none;
   color: #0065df;
}
table {
   min-width: 100%;
   border-collapse: collapse;
   border-spacing: 0;
   background-color: #fff;
}
.noselect {
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
}
*::selection {
   color: #000;
   background-color: #ffe53e;
}
.nowrap {
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
}
.develop-message { margin-left: 16px }
.dev-message {
   line-height: 40px;
   padding: 0 24px;
   height: 40px;
   color: #f44336;
}
.nodata {
   text-align: center;
   margin-top: 32px;
   width: 100%;
   color: #888;
}
.nodata-italic { color: #ccc }
.resizable-textarea { resize: vertical !important }
.offscreen {
   position: absolute;
   left: -999em;
}
[data-etitle]:hover:after {
   transition: all 0.1s ease 0.5s;
   visibility: visible;
   opacity: 1;
}
[data-etitle]:after {
   content: attr(data-etitle);
   position: absolute;
   box-shadow: 1px 1px 3px #222;
   font-family: 'Roboto-Regular';
   background-color: #333;
   border: 1px solid #333;
   white-space: nowrap;
   visibility: hidden;
   border-radius: 6px;
   line-height: 24px;
   font-size: 14px;
   padding: 0 10px;
   bottom: -1.6em;
   z-index: 99999;
   height: 24px;
   color: #eee;
   opacity: 0;
   left: 100%;
}
[data-etitle] { position: relative }

/* Бібліотека компонентів MFLite */
/* ----------------------------------------------------------------  */

.mf-noselect {
   -webkit-touch-callout: none; /* iOS Safari */
     -webkit-user-select: none; /* Safari */
      -khtml-user-select: none; /* Konqueror HTML */
        -moz-user-select: none; /* Old versions of Firefox */
         -ms-user-select: none; /* Internet Explorer/Edge */
             user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}
.mf-nowrap {
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
}
.mf-offscreen {
   position: absolute;
   left: -999em;
}
.mf-icons {
   font-family: "Material-Icons";
   font-weight: normal;
   font-style: normal;
   text-align: center;
   font-size: 18px;
   letter-spacing: normal;
   text-transform: none;
   -webkit-font-feature-settings: 'liga';
   -webkit-font-smoothing: antialiased;
   text-rendering: optimizeLegibility;
   -moz-osx-font-smoothing: grayscale;
   font-feature-settings: 'liga';
}
.mf-component:hover { background-color: #eee }
.mf-component:active { background-color: #bbdefb }
.mf-table-fixed { table-layout: fixed}
.mf-flex {
   display: flex;
   flex-direction: row;
   align-items: center;
}
.mf-flex-column {
   display: flex;
   flex-direction: column;
}
.mf-regular-button {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   font-family: 'Roboto-Regular';
   background-color: #0362d9;
   border-radius: 32px;
   text-align: center;
   line-height: 28px;
   font-weight: bold;
   overflow: hidden;
   padding: 0 16px;
   font-size: 14px;
   cursor: pointer;
   height: 28px;
   color: #fff;
}
.mf-input {
   font-family: 'Roboto-Regular';
   border: 2px solid #3f3f3f;
   background-color: #3a3b3c;
   border-radius: 6px;
   outline: none;
   color: #eee;
}
.mf-input:focus { border-color: #0262da }
.mf-input::placeholder {
   opacity: 0.5;
   color: #aaa;
}
.mf-textarea {
   font-family: 'Roboto-Regular';
   font-size: 14px;
   resize: vertical;
   min-height: 38px;
   padding: 4px 8px;
   font-size: 12pt;
   height: 80px;
}
.mf-textarea:focus { border-color: #0262da }
.mf-control-preloader {
   /* Локальний прелоадер контролів */
   display: none;
   position: absolute;
   background-position: center;
   background-repeat: no-repeat;
   background-image: url(../img/control-preload.svg);
   background-size: 32px;
   min-height: 32px;
   min-width: 32px;
   margin: 0 auto;
   height: 32px;
   width: 32px;
}
.mf-disabled {
   pointer-events: none;
   opacity: 0.6;
}
.mf-label {
   margin: 0;
   font-family: 'Roboto-Regular';
   font-size: 14px;
   margin-top: 8px;
}
.mf-round-button {
   display: inline-block;
   border-radius: 40px;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
/* Checkbox component */
.mf-checkbox-container { display: inline-block }
.mf-custom-checkbox {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   position: relative;
   cursor: pointer;
   height: 20px;
   min-width: 20px;
}
.mf-custom-checkbox input {
   opacity: 0;
   height: 0;
   width: 0;
}
.mf-checkmark {
   /*--after-display: inline-block;*/
   position: absolute;
   top: 0;
   left: 0;
   height: 20px;
   width: 20px;
   background-color: #ecf9ff;
   border: 2px solid #ccc;
   border-radius: 6px;
}
.mf-custom-checkbox:hover input ~ .mf-checkmark { border-color: #aaa }
.mf-checkmark:after {
   content: "";
   position: absolute;
   display: none;
}
.mf-custom-checkbox input:checked ~ .mf-checkmark:after {
   display: inline-block;
   /*display: var(--after-display);*/
}
.mf-custom-checkbox .mf-checkmark:after {
   top: 2px;
   left: 6px;
   width: 5px;
   height: 10px;
   border: solid #444;
   border-width: 0 3px 3px 0;
   -webkit-transform: rotate(45deg);
   -ms-transform: rotate(45deg);
   transform: rotate(45deg);
}
.mf-custom-checkbox-title {
   margin-left: 20px;
   line-height: 20px;
}
/* Checkbox 2 */
.mf-checkbox-element {
   display: flex;
   flex-direction: row;
   align-items: center;
   cursor: pointer;
}
.mf-checkbox-input {}
.mf-checkbox-checkmark {
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   font-size: 24px;
   height: 24px;
   width: 24px;
}
.mf-checkbox-label {
   line-height: 24px;
   padding: 0 4px;
   height: 24px;
}
.mf-checkbox-disabled { color: #888 }
/* Switch */
.mf-switch-container { display: inline-block }
.mf-switch-element { cursor: pointer }
.mf-switch {
   line-height: 24px;
   min-height: 24px;
   min-width: 44px;
   font-size: 44px;
   height: 24px;
   width: 44px;
}
.mf-switch-disabled { color: #888 }
.mf-switch-label {
   line-height: 24px;
   padding: 0 4px;
   height: 24px;
}
/* Search component */
.mf-search-container {
   display: inline-flex;
   flex-direction: row;
   flex-wrap: nowrap;
   position: relative;
   align-items: center;
   width: 100%;
}
.mf-search-element {
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
   position: relative;
   align-items: center;
   width: 100%;
}
.mf-search-input {
   display: inline-block;
   width: 100%;
   height: 32px;
   padding: 4px;
   padding-left: 8px;
   padding-right: 34px;
   font-size: 12pt;
   font-weight: 500;
   outline: none;
   border-radius: 6px;
   border: 2px solid #ddd;
   background-color: #ecf9ff;
   font-family: 'Roboto-Regular';
   overflow: hidden;
   color: #000;
}
.mf-search-input:focus { border-color: #0262da }
.mf-search-input::placeholder {
   opacity: 0.5;
   color: #aaa;
}
.mf-custom-clear {
   display: none;
   position: absolute;
   right: 4px;
   width: 32px;
   height: 32px;
   padding: 0;
   border-radius: 50%;
   line-height: 32px;
   vertical-align: middle;
   font-family: "Material-Icons";
   text-align: center;
   color: #bbb;
   font-size: 24px;
   cursor: pointer;
   z-index: 16;
}
.mf-custom-clear:hover { color: #888 }
.mf-custom-search-result-container {
   display: none;
   position: absolute;
   border-radius: 0 0 4px 4px;
   box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.4);
   overflow: hidden;
   z-index: 9999;
   width: 100%;
   top: 36px;
}
.mf-custom-search-result {
   display: flex;
   flex-direction: column;
   max-height: 350px;
   width: 100%;
   padding: 16px;
   background-color: #ffffff;
   overflow: hidden;
}
.mf-custom-search-filter-panel {
   width: 100%;
   height: 40px;
   margin-bottom: 16px;
}
.mf-custom-search-result-list-container {
   position: relative;
   width: 100%;
   overflow: hidden;
   overflow-y: auto;
}
.mf-custom-search-result-list { width: 99.5% }
.mf-custom-search-result-section {
   height: 24px;
   line-height: 20px;
   margin-bottom: 4px;
   padding: 2px 8px;
   background-color: #9e9e9e;
   color: #fff;
}
.mf-custom-search-result-section:not(:first-child) { margin-top: 4px }
.mf-custom-search-result-item {
   display: flex;
   flex-direction: column;
   line-height: 32px;
   cursor: pointer;
   padding: 0 8px;
   margin: 0;
}
.mf-custom-search-result-item:hover {
   background-color: #eee;
   color: #38f;
}
.mf-custom-search-result-item-title {
   display: flex;
   flex-direction: row;
   line-height: 34px;
   height: 34px;
}
.mf-custom-search-result-item-icon {
   display: inline-block;
   height: 34px;
   width: 34px;

   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px;
}
.mf-custom-search-result-item-text {
   display: inline-block;
   line-height: 34px;
   height: 34px;
}
.mf-custom-search-result-item-info {
   font-size: 12px;
   color: #888;
}
/* Radio component */
.mf-radio-container { display: inline-block }
.mf-radio-block {
   display: flex;
   flex-direction: row;
   width: 100%;
}
.mf-radio-buttos-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   width: 100%;
}
.mf-radio-button {
   display: flex;
   position: relative;
   text-align: center;
   cursor: pointer;
}
.mf-radio-text {}
.mf-radio-count {
   display: none;
   position: absolute;
   font-family: "Roboto-Regular";
   background-color: #81b0f3;
   border-radius: 40px;
   text-align: center;
   line-height: 18px;
   min-height: 18px;
   min-width: 18px;
   font-size: 10px;
   height: 18px;
   width: 18px;
   color: #fff;
   right: 0px;
   top: 0;
}
.mf-radio-button-disabled { color: #a7a7a7 }
/* TimePicker */
.mf-timepicker-container {
   display: inline-flex;
   flex-direction: row;
   justify-content: center;
   width: 100%;
}
.mf-timepicker-input {
   display: inline-block;
   border-radius: 6px;
   border: 2px solid #ddd;
   background-color: #ecf9ff;
   font-size: 10pt;
   padding: 4px;
   height: 32px;
   width: 28%;
}
.mf-timepicker-input-minutes,
.mf-timepicker-input-seconds { margin-left: 8px }
/* Dialog */
.mf-dialog {
   display: none;
   position: fixed;
   background-color: #fff;
   border-radius: 4px;
   box-shadow: 0 0 16px 0 #0005;
   margin-bottom: 8px;
   padding: 8px;
   padding-top: 4px;
   z-index: 5500;
}
.mf-dialog-top-panel,
.mf-dialog-top-panel-v2 {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   flex-wrap: nowrap;
   margin-bottom: 4px;
   border-bottom: 1px solid #ddd;
   padding-bottom: 2px;
   line-height: 40px;
   height: 40px;
}
.mf-dialog-top-panel-drag { cursor: grab }
.mf-dialog-top-panel-drag:active { cursor: grabbing }
.mf-dialog-title {
   padding-right: 4px;
   line-height: 32px;
   height: 32px;
   width: 100%;
}
.mf-dialog-confirm {
   display: inline-block;
   background-color: #0362d9;
   border-radius: 40px;
   margin-right: 12px;
   text-align: center;
   line-height: 28px;
   font-weight: bold;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
   color: #fff;
}
.mf-dialog-close {
   display: inline-block;
   border-radius: 50%;
   margin-left: auto;
   line-height: 26px;
   font-weight: bold;
   min-height: 26px;
   min-width: 26px;
   font-size: 19px;
   cursor: pointer;
   height: 26px;
   width: 26px;
}
.mf-dialog-content {
   position: relative;
   overscroll-behavior-y: contain;
   height: calc(100% - 50px);
   overflow: hidden;
   overflow-y: auto;
}
.mf-dialog-toolbar {
   display: flex;
   flex-direction: row;
   justify-content: flex-start;
   align-items: center;
   margin-right: 12px;
   flex-wrap: nowrap;
   line-height: 40px;
   min-height: 40px;
   height: 40px;
   width: 100%;
}
/* Global Serach */
.global-search-icon-device {
   background-size: 20px;
   background-image: url(../img/devices.svg);
}
.global-search-icon-contact {
   background-size: 14px;
   background-image: url(../img/contact.svg);
}
.global-search-icon-task {
   background-size: 14px;
   background-image: url(../img/task.svg);
}
.global-search-icon-company { background-image: url(../img/company.svg); }
.search-global-filter-button-test {
   background-image: url(../img/test.svg);
   background-repeat: no-repeat;
   background-position: left 10% center;
   background-size: 14px;
}
.global-search-task-info { line-height: 22px }
.global-search-buttons-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-left: auto;
   height: 34px;
}
.global-search-buttons-item {
   min-height: 34px;
   min-width: 34px;
   height: 34px;
   width: 34px;
}
.global-search-buttons-item:not(:first-child) { margin-left: 4px }
/* TextInput */
.mf-text-input-container {
   display: inline-flex;
   flex-direction: row;
   justify-content: center;
   width: 100%;
}
.mf-text-input-element {
   position: relative;
   width: 100%;
}
.mf-text-input {
   display: inline-block;
   font-family: 'Roboto-Regular';
   border: 2px solid #ddd;
   background-color: #fff;
   border-radius: 6px;
   font-weight: 500;
   overflow: hidden;
   font-size: 16px;
   padding: 0 8px;
   outline: none;
   height: 32px;
   width: 100%;
   color: #000;
}
.mf-text-input:focus { border-color: #0262da }
.mf-text-input-clear {
   display: none;
   position: absolute;
   border-radius: 28px;
   line-height: 24px;
   cursor: pointer;
   height: 24px;
   width: 24px;
   z-index: 10;
   right: 6px;
}
/* Textarea */
.mf-textarea {
   position: relative;
   border: 2px solid #ddd;
   font-family: 'Roboto-Regular';
   border-radius: 6px;
   resize: vertical;
   min-height: 32px;
   font-size: 16px;
   outline: none;
   padding: 8px;
   width: 100%;
}
.mf-textarea:focus { border-color: #0262da }
/* ToggleBox */
.mf-togglebox {
   border: 1px solid #ddd;
   border-radius: 4px;
   padding: 4px;
   width: 100%;
}
.mf-togglebox-control {
   display: flex;
   flex-direction: row;
   overflow: hidden;
   height: 20px;
   width: 100%;
}
.mf-togglebox:not(:first-child) { margin-top: 8px }
.mf-togglebox-drag-helper {
   display: inline-block;
   line-height: 20px;
   font-size: 16px;
   cursor: grab;
   height: 20px;
   width: 20px;
}
.mf-togglebox-drag-helper:active { cursor: grabbing }
.mf-togglebox-control-label {
   line-height: 20px;
   font-size: 12px;
   padding: 0 2px;
   color: #aaa;
}
.mf-togglebox-control-info-container {
   transition: visibility 0s, opacity 0.3s linear;
   visibility: hidden;
   overflow: hidden;
   height: 20px;
   opacity: 0;
}
.mf-togglebox-control-info {
   display: flex;
   flex-direction: row;
   align-items: center;
   line-height: 20px;
   font-size: 12px;
   overflow: hidden;
   height: 20px;
}
.mf-togglebox-control-fold-button {
   display: inline-block;
   border-radius: 32px;
   line-height: 20px;
   margin-left: auto;
   min-height: 20px;
   min-width: 20px;
   cursor: pointer;
   font-size: 20px;
   height: 20px;
   width: 20px;
}
.mf-togglebox-placeholder {
   font-family: 'Roboto-Regular';
   text-align: center;
   padding: 24px 8px;
   font-size: 14px;
   color: #aaa;
   width: 100%;
}
.mf-togglebox-content { display: none }
.mf-togglebox-folded { padding-bottom: 0 }
/*  Button */
.mf-button {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
}
.mf-button-inner-span { display: inline-block }
/* Button */
.mf-round-button {
   border-radius: 50%;
   text-align: center;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   height: 28px;
   width: 28px;
}
.mf-button-disabled {
   background-color: #ccc;
   color: #a7a7a7;
}
@media screen and (max-width: 1024px) {
   .mf-button-inner-span { display: none }
}
/* DropDownMenu */
.mf-dropdown-container {
   position: relative;
   display: inline-flex;
   justify-content: center;
   align-items: center;
   font-family: 'PT Sans';
}
.mf-dropdown-button {
   display: inline-flex;
   justify-content: center;
   align-items: center;
   border-radius: 32px;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   font-size: 26px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
.mf-dropdown-notify-icon {
   display: none;
   position: absolute;
   font-family: 'Roboto-Regular';
   background-color: #f44336;
   border-radius: 32px;
   text-align: center;
   line-height: 16px;
   min-height: 16px;
   min-width: 16px;
   font-size: 10px;
   height: 16px;
   width: 16px;
   color: #fff;
   left: 12px;
   top: 0;
}
.mf-dropdown-menu {
   display: none;
   position: fixed;
   border-radius: 8px;
   background-color: #fff;
   box-shadow: 0 2px 8px 1px rgba(0, 0, 0, 0.2);
   padding: 8px 0;
   overflow: hidden;
   visibility: hidden;
   opacity: 0;
   transition: visibility 0s, opacity 0.3s linear;
   z-index: 1000;
   left: auto;
   top: auto;
}
.mf-dropdown-search-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-bottom: 8px;
   margin-top: 8px;
   padding: 0 12px;
   height: 32px;
}
.mf-dropdown-search {
   border: 2px solid #ddd;
   font-family: 'Roboto-Regular';
   border-radius: 6px;
   line-height: 32px;
   font-size: 14px;
   padding: 0 8px;
   outline: none;
   height: 32px;
   width: 100%;
}
.mf-dropdown-search-clear { right: 20px }
.mf-dropdown-menu-scrolled {
   overflow: hidden;
   overflow-y: auto;
   height: 100%;
}
.mf-dropdown-menu-item {
   display: flex;
   flex-direction: row;
   align-items: center;
   padding: 0 12px;
   cursor: pointer;
   line-height: 36px;
   height: 36px;
   width: 100%;
   overflow: hidden;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
}
.mf-dropdown-menu-item:not(.mf-dropdown-menu-item-sticky):hover { background-color: #e5e5e5 }
.mf-dropdown-menu-item:not(.mf-dropdown-menu-item-sticky):active { background-color: #cbcbcb }
.mf-dropdown-menu-item-disable { color: #ccc }
.mf-dropdown-menu-item-icon {
   margin-right: 10px;
   text-align: center;
   line-height: 24px;
   height: 24px;
   width: 24px;
}
.mf-dropdown-menu-item-text {
   text-overflow: ellipsis;
   white-space: nowrap;
   text-align: left;
   overflow: hidden;
   font-size: 16px;
   width: 100%;
}
/* DropDownBox */
.mf-dropdown-box-element {}
.mf-dropdown-box-front {
   flex-wrap: nowrap;
   justify-content: flex-start;
   background-color: #fff;
   border: 2px solid #ddd;
   position: relative;
   border-radius: 6px;
   padding-left: 8px;
   cursor: pointer;
   height: 32px;
   width: 100%;
}
.mf-dropdown-box-input {
   font-family: 'Roboto-Regular';
   overflow: hidden;
   cursor: pointer;
   font-size: 16px;
   outline: none;
   border: none;
   height: 28px;
   width: 100%;
   color: #000;
}
.mf-dropdown-box-input::placeholder { color: #bdbdbd; }
.mf-dropdown-box-input-hidden {}
.mf-dropdown-box-icon {
   border-radius: 4px;
   line-height: 28px;
   margin-right: 1px;
   min-height: 28px;
   min-width: 28px;
   height: 28px;
   width: 28px;
}
.mf-dropdown-box {
   display: none;
   position: fixed;
   border-radius: 8px;
   background-color: #fff;
   box-shadow: 0 2px 8px 1px rgba(0, 0, 0, 0.2);
   transition: visibility 0s, opacity 0.3s linear;
   visibility: hidden;
   overflow: hidden;
   z-index: 1000;
   padding: 8px;
   opacity: 0;
   left: auto;
   top: auto;
}
.mf-dropdown-box-scrolled { overflow: auto }
.mf-dropdown-box-disabled { background-color: #f5f5f5; }
/* Chips */
.mf-chips {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   background-color: #ebebeb;
   border-radius: 32px;
   line-height: 24px;
   font-size: 14px;
   height: 24px;
}
.mf-chips-icon {
   display: inline-block;
   background-position: center;
   background-repeat: no-repeat;
   background-size: 20px;
   text-align: center;
   margin-right: -4px;
   line-height: 17px;
   margin-left: 6px;
   font-size: 17px;
   color: #757575;
   height: 17px;
   width: 17px;
}
.mf-chips-text {
   display: inline-block;
   padding: 0 6px 0 8px;
   line-height: 24px;
   height: 24px;
}
.mf-chips-button {
   display: inline-block;
   background-color: #757575;
   border-radius: 32px;
   margin-right: 6px;
   line-height: 17px;
   min-height: 17px;
   min-width: 17px;
   cursor: pointer;
   font-size: 12px;
   color: #ebebeb;
   height: 17px;
   width: 17px;
}
.mf-chips-disabled {
   background-color: #ccc;
   color: #a7a7a7;
}
/* Snackbar */
.mf-snackbar {
   display: flex;
   position: fixed;
   flex-wrap: nowrap;
   flex-direction: row;
   align-items: center;
   box-shadow: 0 0 16px 0 #0005;
   background-color: #fff;
   border-radius: 6px;
   padding: 8px 16px;
   min-height: 48px;
   z-index: 9999;
   width: 344px;
}
.mf-snackbar-icon {
   display: inline-block;
   background-position: center;
   background-repeat: no-repeat;
   background-size: 20px;
   text-align: center;
   line-height: 24px;
   margin-right: 8px;
   font-size: 24px;
   color: #757575;
   height: 24px;
   width: 24px;
}
.mf-snackbar-text {
   display: inline-block;
   padding-right: 6px;
   line-height: 24px;
   min-height: 24px;
   font-size: 14px;
}
.mf-snackbar-button {
   display: inline-block;
   background-color: #757575;
   border-radius: 32px;
   line-height: 17px;
   margin-left: auto;
   min-height: 17px;
   min-width: 17px;
   font-size: 12px;
   cursor: pointer;
   color: #ebebeb;
   height: 17px;
   width: 17px;
}
.mf-snackbar-disabled {
   background-color: #ccc;
   color: #a7a7a7;
}
/* SnackBar */
.mf-snackbar-v2-position-container {
   display: flex;
   position: fixed;
   align-items: center;
   justify-content: center;
   pointer-events: none;
   z-index: 9999;
   width: 100%;
   gap: 10px;
}
.mf-snackbar-v2-position-container.top { top: 20px }
.mf-snackbar-v2-position-container.center {
   transform: translateY(-50%);
   top: 50%;
}
.mf-snackbar-v2-position-container.bottom { bottom: 20px }
.mf-snackbar-v2 {
   display: flex;
   align-items: center;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
   background-color: #f0f4f9;
   pointer-events: auto;
   border-radius: 8px;
   min-width: 300px;
   max-width: 90%;
   color: #1b1c1d;
   padding: 16px;
   opacity: 0;
   gap: 1rem;
}
.mf-snackbar-v2-icon {
   display: inline-block;
   background-position: center;
   background-repeat: no-repeat;
   background-size: 20px;
   text-align: center;
   line-height: 24px;
   margin-right: 8px;
   font-size: 20px;
   color: #1b1c1d;
   height: 24px;
   width: 24px;
}
.mf-snackbar-v2.slide-down { animation: slideInDown 0.3s forwards }
.mf-snackbar-v2.slide-down.fade-out { animation: fadeOutDown 0.3s forwards }
.mf-snackbar-v2.slide-up { animation: slideInUp 0.3s forwards }
.mf-snackbar-v2.slide-up.fade-out { animation: fadeOutUp 0.3s forwards }
.mf-snackbar-v2-close {
   display: inline-block;
   transition: background-color 0.2s ease;
   background-color: transparent;
   border-radius: 32px;
   line-height: 22px;
   margin-left: auto;
   min-height: 22px;
   min-width: 22px;
   font-size: 18px;
   cursor: pointer;
   color: #1b1c1d;
   height: 22px;
   width: 22px;
}
.mf-snackbar-v2-close:hover { background-color: #d0d5da }
.mf-snackbar-v2-text {
   display: inline-block;
   font-family: 'Roboto-Regular';
   padding-right: 8px;
   line-height: 24px;
   min-height: 24px;
   font-size: 14px;
   color: #1b1c1d;
}
.mf-snackbar-v2-bottom-panel {
   font-family: 'Roboto-Regular';
   box-sizing: border-box;
   border-radius: 6px;
   font-size: 14px;
   padding: 0 32px;
   width: 100%;
}
.mf-snackbar-v2-content-wrapper {
   display: flex;
   flex-direction: column;
   width: 100%;
}
/* DataGrid */
.mf-datagrid-element {
   position: relative;
   height: 100%;
   width: 100%;
}
.mf-datagrid-top-panel,
.mf-datagrid-group-panel,
.mf-datagrid-button-panel {
   background-color: #fff;
   position: relative;
   display: flex;
   flex-direction: row;
   align-items: center;
   height: 40px;
}
.mf-datagrid-top-panel {
   width: 100%;
}
.mf-datagrid-head-container {
   background-color: #fff;
   border: 1px solid #ddd;
}
.mf-datagrid-table-container {
   overflow-x: auto;
   margin-top: 0px;
}
.mf-datagrid-element table {
   width:100%;
   table-layout: fixed;
}
.mf-datagrid-element th,
.mf-datagrid-element td {
   vertical-align: middle;
   border: 1px solid #ddd;
   text-align: left;
   font-size: 12px;
   padding: 8px;
}
.mf-datagrid-element th {
   border-top: none;
   border-bottom: none;
}
.mf-datagrid-element th:first-child {
   border-left: none;
}
.mf-datagrid-element th:last-child {
   border-right: none;
}
.mf-datagrid-element td { color: #000 }
.mf-datagrid-fixed-head {
   position: -webkit-sticky;
   position: sticky;
   z-index: 2;
   top: 0;
}
/* SelectSerach */
.mf-select-search-element {
   position: relative;
   display: flex;
   flex-direction: column;
}
.mf-select-search-input-container {
   position: relative;
   display: flex;
   flex-direction: row;
   align-items: center;
}
.mf-select-search-disabled {
   background-color: #f5f5f5;
   color: #777;
}
.mf-select-search-buttons {
   display: none;
   position: absolute;
   border-radius: 28px;
   line-height: 24px;
   cursor: pointer;
   height: 24px;
   width: 24px;
   z-index: 10;
}
.mf-select-search-add-button {
   color: #008e00;
   left: 4px;
}
.mf-select-search-clear { right: 6px }
.mf-select-search-with-add { padding-left: 30px }
.mf-select-search-result-container {
   display: none;
   position: absolute;
   top: 36px;
   width: 100%;
   border-radius: 4px;
   box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.4);
   overflow: hidden;
   z-index: 9999;
}
.mf-select-search-result-list {
   max-height: 200px;
   background-color: #fff;
   overflow: hidden;
   overflow-y: auto;
   padding: 4px 0;
   width: 100%;
}
.mf-select-search-result-item {
   line-height: 32px;
   cursor: pointer;
   padding: 0 8px;
   height: 32px;
   margin: 0;
}
.mf-select-search-result-item:hover {
   background-color: #eee;
   color: #38f;
}
.mf-search-input-hidden {
   position: absolute;
   left: -999em;
}
.mf-select-search-values-area-container {
   display: none;
   margin-top: 4px;
   width: 100%;
}
.mf-select-search-values-area {
   display: flex;
   flex-direction: row;
   justify-content: flex-start;
   flex-wrap: wrap;
   background-color: #eee;
   border-radius: 6px;
   padding: 3px;
   width: 100%;
}
.mf-select-search-values-area > div {
   margin: 1px;
}
/* List */
.mf-list-element {
   display: none;
   position: absolute;
   box-shadow: 1px 1px 8px 0px #0005;
   background-color: #fff;
   border-radius: 6px;
   max-height: 100px;
   overflow: hidden;
   overflow-y: auto;
   padding: 6px 0;
   z-index: 500;
}
.mf-list {
   position: relative;
   box-shadow: none;
   overflow-y: auto;
   padding: 0 4px;
   width: 100%;
   margin: 0;
}
.mf-list-group-header {
   background-color: #eee;
   margin-top: 0.5rem;
   line-height: 32px;
   min-height: 32px;
   padding: 0 8px;
   color: #374151;
   height: 32px;
}
.mf-list-group-header:first-child { margin-top: 0 }
.mf-list-group-header-title {
   font-weight: 600;
   color: #a0a0a0;
}
.mf-list-group-toggle {
   margin-left: auto;
   cursor: pointer;
}
.mf-list-item {
   transition: background-color 0.2s;
   font-family: 'Roboto-Regular';
   white-space: nowrap;
   text-overflow: ellipsis;
   line-height: 32px;
   overflow: hidden;
   font-size: 16px;
   cursor: pointer;
   padding: 0 8px;
   height: 32px;
   width: 100%;
   color: #000;
}
.mf-list-item-nodata { color: #acb4bf }
.mf-list-item:not(.mf-list-item-selected, .mf-list-item-nodata):hover { background-color: #ddd }
.mf-list-selected { background-color: #dde6ebf2 }
.mf-list-item-selected {
   background-color: #e0f2fe;
   color: #007bff;
}
.mf-list-item-checkbox { margin-right: 8px }
.mf-list-hidden {
   visibility: hidden;
   height: 0px;
}
.mf-list-no-data-item,
.mf-list-no-matches {
   font-family: 'Roboto-Regular';
   line-height: 32px;
   font-size: 16px;
   cursor: default;
   color: #9e9e9e;
   padding: 0 8px;
   height: 32px;
   width: 100%;
}
.mf-list-no-matches { display: none }
/* Counter */
.mf-counter-element {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
}
.mf-counter-button {
   border: 2px solid #0362d9;
   line-height: 26px;
   cursor: pointer;
   font-size: 20px;
   height: 28px;
   width: 28px;
}
.mf-counter-button:active { background-color: #ecf9ff }
.mf-counter-decrement {
   border-top-left-radius: 6px;
   border-bottom-left-radius: 6px;
   border-right: none;
}
.mf-counter-increment {
   border-top-right-radius: 6px;
   border-bottom-right-radius: 6px;
   border-left: none;
}
.mf-counter-input {
   border: 2px solid #0362d9;
   line-height: 28px;
   font-size: 16px;
   padding: 0 6px;
   height: 28px;
   width: 60px;
}
/* SelectBox */
.mf-select-box-result-container {
   position: fixed;
   box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.4);
   border-radius: 4px;
   z-index: 9999;
   width: 100%;
   top: 34px;
}
/* ExtButton (кнопка з меню) */
.mf-ext-button-element,
.mf-ext-button {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   line-height: 32px;
   height: 32px;
}
.mf-ext-button-element {
   position: relative;
   border-radius: 32px;
}
.mf-ext-button,
.mf-ext-button-menu-button { background-color: #0362d9 }
.mf-ext-button {
   border-top-left-radius: 32px;
   border-bottom-left-radius: 32px;
   text-align: center;
   padding-left: 16px;
   padding-right: 8px;
   width: 100%;
   color: #fff;
}
.mf-ext-button-with-text {
   font-family: 'Roboto-Regular';
   font-size: 14px;
}
.mf-ext-button-inner-span {
   font-family: 'Roboto-Regular';
   text-align: center;
   line-height: 32px;
   font-size: 14px;
   height: 32px;
   width: 100%;
   color: #fff;
}
.mf-ext-button-menu-button {
   box-shadow: inset 1px 0px 0px 0px #1870de;
   border-top-right-radius: 32px;
   border-bottom-right-radius: 32px;
   text-align: left;
   text-indent: 6px;
   line-height: 32px;
   min-width: 32px;
   height: 32px;
   width: 32px;
   color: #fff;
}
.mf-ext-button:hover,
.mf-ext-button-menu-button:hover { background-color: #1870de }
.mf-ext-button-menu-container {
   display: none;
   position: absolute;
   background-color: #fff;
   border-radius: 6px;
   top: 32px;
}
.mf-ext-button-menu-item { font-size: 14px }
/* NumberBox */
.mf-number-box-element {
   display: flex;
   flex-wrap: nowrap;
   flex-direction: row;
   align-items: center;
   position: relative;
   width: 100%;
}
.mf-number-box-input {
   display: inline-block;
   font-family: 'Roboto-Regular';
   padding: 4px 34px 4px 8px;
   border: 2px solid #ddd;
   border-radius: 6px;
   overflow: hidden;
   font-weight: 500;
   font-size: 12pt;
   outline: none;
   height: 32px;
   width: 100%;
   color: #000;
}
.mf-number-box-input:focus { border-color: #0262da }
/* Уточнення */
.mf-clarify-element {
   display: flex;
   flex-direction: row;
   align-items: center;
   flex-wrap: nowrap;
   background-color: #fff;
   border: 2px solid #ddd;
   position: relative;
   border-radius: 6px;
   height: 32px;
   width: 100%;
}
.mf-clarify-input {
   width: calc(100% - 72px);
   font-family: 'Roboto-Regular';
   line-height: 26px;
   font-size: 14px;
   padding: 0 8px;
   height: 26px;
   border: none;
}
.mf-clarify-actions {
   display: inline-block;
   border-left: 1px solid #ccc;
   line-height: 32px;
   cursor: pointer;
   height: 30px;
   width: 36px;
}
.mf-clarify-clear { font-size: 16px }
.mf-clarify-button { font-size: 20px }
.mf-clarify-top-bar {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
   border-bottom: 1px solid #ddd;
   overflow: hidden;
   padding: 0 4px;
   height: 38px;
   width: 100%;
}
.mf-clarify-close-map,
.mf-clarify-apply-coords {
   border-radius: 40px;
   line-height: 32px;
   min-height: 32px;
   min-width: 32px;
   font-size: 24px;
   cursor: pointer;
   height: 32px;
   width: 32px;
   color: #000;
}
.mf-clarify-map-buttons-block {
   position: relative;
   display: inline-flex;
   align-self: center;
}
/* TagBox  */
/*[contentEditable=true]:empty:not(:focus):before {
   content: attr(data-placeholder);
   padding: 0 8px;
}*/
.mf-tag-box-element {
   position: relative;
   display: flex;
   flex-direction: column;
   width: 100%;
}
.mf-tags-container {
   position: relative;
   display: flex;
   flex-direction: row;
   align-items: center;
   width: 100%;
}
.mf-tag-box {
   display: flex;
   flex-direction: row;
   align-items: center;
   flex-wrap: nowrap;
   background-color: #fff;
   border: 2px solid #ddd;
   position: relative;
   border-radius: 6px;
   overflow: hidden;
   height: 32px;
   width: 100%;
}
.mf-tag-box > div { margin-left: 4px }
.mf-tags-placeholder {
   line-height: 30px;
   padding: 0 4px;
   color: #bdbdbd;
   height: 30px;
}
.mf-tag-box-disabled { background-color: #f5f5f5 }
.mf-tag-box-list-container {
   display: none;
   position: fixed;
   box-shadow: 0 4px 8px 1px rgba(0, 0, 0, 0.4);
   background-color: #fff;
   border-radius: 4px;
   visibility: hidden;
   overflow: hidden;
   overflow-y: auto;
   z-index: 9999;
   height: auto;
   width: 100%;
   opacity: 0;
   top: auto;
}
.mf-tag-box-list {
   background-color: #fff;
   overflow-y: auto;
}
.mf-tag-box-list-item { padding: 4px 8px }
.mf-tag-box-list-item:hover { background-color: #eee }
.mf-tag-box-button-panel {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: space-evenly;
   background-color: #eee;
   position: sticky;
   height: 28px;
   top: 64px;
}
.mf-tag-box-search-container {
   background-color: #f8f8f8;
   position: sticky;
   padding: 16px;
   top: 0px;
}
.mf-tag-box-search {
   font-family: 'Roboto-Regular';
   background-color: #fff;
   border: 2px solid #ddd;
   border-radius: 6px;
   line-height: 32px;
   font-size: 16px;
   padding: 0 8px;
   outline: none;
   height: 32px;
   width: 100%;
}
.mf-tag-box-search-clear {
   right: 24px;
   top: 20px;
}
.mf-tag-box-button {
   border-radius: 32px;
   line-height: 20px;
   cursor: pointer;
   padding: 0 8px;
   height: 20px;
}
.mf-tag-box-button:hover {
   background-color: #d7d7d7;
   color: #000;
}
/* DatePicker */
.mf-datepicker-element {
   display: flex;
   flex-direction: column;
   background-color: #fff;
   overflow: hidden;
   height: 100%;
}
.mf-datepicker-date-container {
   display: flex;
   flex-direction: column;
}
.mf-datepicker-top-panel {
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
   width: 100%;
}
.mf-datepicker-button {
   display: inline-block;
   background-color: #0362d9;
   border-radius: 32px;
   line-height: 28px;
   font-weight: bold;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
   color: #fff;
}
.mf-datepicker-button-reset,
.mf-datepicker-button-today { margin-left: 8px }
.mf-datepicker-button-today { font-weight: normal }
.mf-datepicker-timepicker-container {
   min-height: 40px;
   height: 40px;
}
.mf-datepicker-timepicker-container-v2 {
   justify-content: center;
   margin-top: 8px;
   height: 100%;
}
/* DateTimeBox V1 */
.mf-datetime-box-element {
   flex-wrap: nowrap;
   justify-content: flex-start;
   background-color: #fff;
   border: 2px solid #ddd;
   position: relative;
   border-radius: 6px;
   padding-left: 8px;
   cursor: pointer;
   height: 32px;
   width: 100%;
}
.mf-datetime-box-input {
   font-family: 'Roboto-Regular';
   overflow: hidden;
   cursor: pointer;
   font-size: 16px;
   outline: none;
   border: none;
   height: 28px;
   width: 100%;
   color: #000;
}
.mf-datetime-box-input::placeholder { color: #bdbdbd }
.mf-datetime-box-clear,
.mf-datetime-box-icon {
   line-height: 32px;
   min-height: 32px;
   min-width: 32px;
   height: 32px;
   width: 32px;
}
.mf-datetime-box-clear { font-size: 16px }
.mf-datetime-box-form {
   display: flex;
   flex-direction: column;
   align-items: center;
   overflow: auto;
}
/* Рейтинг */
.mf-rating-block {
   display: flex;
   flex-direction: row;
   align-items: center;
   width: 100%;
}
.mf-rating-button {
   display: inline-block;
   border-radius: 40px;
   line-height: 32px;
   min-height: 32px;
   min-width: 32px;
   cursor: pointer;
   font-size: 22px;
   color: #d2d2d2;
   height: 32px;
   width: 32px;
}
.mf-rating-buttos-container {
   display: inline-flex;
   flex-direction: row-reverse;
}
.mf-rating-button:hover,
.mf-rating-button:hover ~ .mf-rating-button { color: #ffa900 }
.mf-rating-button-selected,
.mf-rating-button-selected ~ .mf-rating-button { color: #ffa900 }
.mf-rating-button:active { color: #f57c00 !important }
/* FileUploader */
.mf-file-uploader-element { width: 100% }
.mf-file-uploader-button {
   border-radius: 40px;
   text-align: center;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   max-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
.mf-file-uploader-dropbox {
   transition: all 0.3s ease-out;
   border-radius: 6px;
   min-height: 40px;
   overflow: hidden;
   width: 100%;
}
.mf-file-uploader-dropbox[drop-active=true] {
   box-shadow: 0px 0px 4px #ff5c5c;
   outline: 1px dashed #fff;
}
.mf-file-uploader-list {
   background-color: #e3f2fd;
   border-radius: 6px;
   min-height: 40px;
   overflow: hidden;
   width: 100%;
}
.mf-file-uploader-placeholder {
   line-height: 40px;
   min-height: 40px;
   font-size: 32px;
   color: #cccccc;
   width: 100%;
}
.mf-file-item-icon {
   background-repeat: no-repeat;
   background-position: center;
   background-size: 24px;
   text-align: center;
   line-height: 28px;
   min-height: 28px;
   min-width: 52px;
   font-size: 28px;
   color: #546e7a;
   height: 28px;
   width: 52px;
}
.mf-file-icon-pdf { background-image: url('../img/icons/pdf.svg'); }
.mf-file-icon-excel { background-image: url('../img/icons/excel.svg'); }
.mf-file-icon-word { background-image: url('../img/icons/word.svg'); }
.mf-file-icon-rtf { background-image: url('../img/icons/rtf.svg'); }
.mf-file-icon-mp3 { background-image: url('../img/icons/mp3.svg'); }
.mf-file-icon-mp4 { background-image: url('../img/icons/mp4.svg'); }
.mf-file-icon-flv { background-image: url('../img/icons/flv.svg'); }
.mf-file-icon-aac { background-image: url('../img/icons/aac.svg'); }
.mf-file-icon-ogg { background-image: url('../img/icons/ogg.svg'); }
.mf-file-icon-mpg { background-image: url('../img/icons/mpg.svg'); }
.mf-file-icon-mpeg { background-image: url('../img/icons/mpg.svg'); }
.mf-file-icon-plain { background-image: url('../img/icons/txt.svg'); }
.mf-file-icon-x-zip-compressed { background-image: url('../img/icons/zip.svg'); }
.mf-file-icon-kml { background-image: url('../img/icons/kml.svg'); }
.mf-file-icon-md { background-image: url('../img/icons/md.svg'); }
.mf-file-uploader-element ul { margin: 0px; padding: 0px }
.mf-file-uploader-element li {
   display: flex;
   flex-direction: row;
   align-items: center;
   list-style-type: none;
   padding: 0px;
   margin: 6px;
}
.mf-file-uploader-element li span {
   font-family: "Roboto-Regular";
   text-overflow: ellipsis;
   white-space: wrap;
   line-height: 18px;
   margin-left: 8px;
   overflow: hidden;
   font-size: 12px;
}
.mf-file-uploader-element li img {
   height: fit-content;
   max-height: 32px;
   padding: 0 4px;
   width: fit-content;
   min-width: 52px;
   max-width: 52px;
}
.mf-file-item-info {
   display: flex;
   flex-direction: column;
   justify-content: flex-start;
   align-items: flex-start;
   overflow: hidden;
   width: 100%;
}
.mf-file-item-remove {
   border-radius: 40px;
   text-align: center;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   max-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
/* Адаптивне меню */
.mf-menu {
   display: flex;
   position: relative;
   align-items: center;
   flex-wrap: nowrap;
   transition: opacity 0.3s ease;
   background-color: #fff;
   min-height: 32px;
   height: 32px;
   width: 100%;
}
.mf-menu-disabled {
   pointer-events: none;
   opacity: 0.6;
}
.mf-menu-more-button {
   position: relative;
   justify-content: center;
   border-radius: 50px;
   text-align: center;
   line-height: 32px;
   margin-left: 2px;
   min-height: 32px;
   min-width: 32px;
   font-size: 32px;
   cursor: pointer;
   height: 32px;
   width: 32px;
}
.mf-menu-more-button-hide { display: none }
.mf-menu-more-marked { background-color: #e0f2fe }
.mf-menu-more-button:not(.mf-menu-more-marked):hover { background-color: #fefefe }
.mf-menu-indicator {
   display: none;
   position: absolute;
   border-radius: 20px;
   min-height: 10px;
   min-width: 10px;
   color: #35aeff;
   height: 10px;
   width: 10px;
   right: 4px;
   top: -12px;
}
.mf-menu-item {
   position: relative;
   transition: background-color 0.2s, color 0.2s;
   font-family: 'Roboto-Regular';
   white-space: nowrap;
   text-align: center;
   line-height: 32px;
   min-height: 32px;
   font-size: 14px;
   cursor: pointer;
   padding: 0 12px;
   flex-shrink: 0;
   height: 32px;
}
.mf-menu-item:last-child { margin-right: 0 }
.mf-menu-item:not(.mf-menu-item-selected):hover { background-color: #f3f4f6 }
.mf-menu-item-selected {
   background-color: #e0f2fe;
   color: #1e40af;
}
.mf-menu-item-counter {
   display: none;
   position: absolute;
   font-family: "Roboto-Regular";
   background-color: #81b0f3;
   border-radius: 40px;
   text-align: center;
   line-height: 18px;
   min-height: 18px;
   min-width: 18px;
   font-size: 10px;
   height: 18px;
   width: 18px;
   color: #fff;
   right: 0px;
   top: 0;
}
.mf-menu-dropdown {
   display: none;
   position: absolute;
   box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
   border: 1px solid #e5e7eb;
   background-color: #fff;
   border-radius: 8px;
   min-width: 160px;
   overflow: hidden;
   margin-top: 2px;
   z-index: 1000;
   top: 100%;
   right: 0;
}
.mf-menu-dropdown-item {
   display: flex;
   position: relative;
   flex-direction: row;
   align-items: center;
   line-height: 36px;
   overflow: hidden;
   font-size: 16px;
   padding: 0 12px;
   cursor: pointer;
   height: 36px;
   width: 100%;
   transition: background-color 0.2s, color 0.2s;
   font-family: 'Roboto-Regular';
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
}
.mf-menu-dropdown-item:hover { background-color: #e5e5e5 }
.mf-menu-dropdown-item:active { background-color: #cbcbcb }
.mf-menu-item-disabled { color: #ccc }
.mf-menu-dropdown-show { display: block }
/* Календар */
.mf-calendar-component {
   background-color: #fff;
   font-family: 'Roboto-Regular';
   --calendar-header-button-padding: 8px 12px;
   --calendar-header-font-size: 14px;
   --calendar-base-font-size: 14px;
   --calendar-month-item-gap: 12px;
   --calendar-grid-gap: 4px;
   --calendar-padding: 8px;
   padding: var(--calendar-padding);
   border-radius: 6px;
}
.mf-calendar-disabled {
   pointer-events: none;
   cursor: not-allowed;
   opacity: 0.6;
}
.mf-calendar-day-names {}
.mf-calendar-day-name {
   font-size: calc(var(--calendar-base-font-size) * 0.8);
   padding: var(--calendar-padding) 0;
   font-weight: 600;
   color: #718096;
}
.mf-calendar-days-grid {
   display: grid;
   grid-template-columns: repeat(7, 1fr);
   gap: var(--calendar-grid-gap);
   text-align: center;
}
.mf-calendar-months-grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: var(--calendar-month-item-gap);
   text-align: center;
   margin: auto 0;
}
.mf-calendar-header {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-bottom: var(--calendar-padding);
}
.mf-calendar-prev-button,
.mf-calendar-next-button {
   /*padding: var(--calendar-header-button-padding);*/
   font-size: var(--calendar-base-font-size);
   transition: background-color 0.2s ease;
   border-radius: 80px;
   line-height: 32px;
   font-weight: 600;
   min-height: 32px;
   min-width: 32px;
   cursor: pointer;
   font-size: 24px;
   color: #4a5568;
   height: 32px;
   width: 32px;
}
.mf-calendar-month-year {
   flex-grow: 1;
   padding: var(--calendar-header-button-padding);
   font-size: var(--calendar-header-font-size);
   transition: background-color 0.2s ease;
   border-radius: 6px;
   text-align: center;
   font-weight: 600;
   cursor: pointer;
   color: #2d3748;
}
.mf-calendar-buttons-panel {
   display: flex;
   justify-content: space-around;
   gap: var(--calendar-padding);
   margin-top: auto;
   min-height: 32px;
   height: 32px;
}
.mf-calendar-today-button,
.mf-calendar-clear-button {
   /*padding: var(--calendar-header-button-padding);*/
   border-radius: 6px;
   line-height: 32px;
   min-height: 32px;
   padding: 0 12px;
   cursor: pointer;
   color: #3b82f6;
   height: 32px;
}
.mf-calendar-day-name {}
.mf-calendar-day,
.mf-calendar-month-item {
   display: flex;
   align-items: center;
   justify-content: center;
   transition: background-color 0.2s ease, color 0.2s ease;
   font-size: var(--calendar-base-font-size);
   padding: var(--calendar-padding) 0;
   font-weight: 500;
   cursor: pointer;
   color: #2d3748;
}
.mf-calendar-day-empty {
   background-color: transparent;
   cursor: default;
}
.mf-calendar-day {
   border-radius: 80px;
   line-height: 26px;
   min-height: 26px;
   min-width: 26px;
   height: 26px;
   width: 26px;
}
.mf-calendar-other-month { border-radius: 6px }
.mf-calendar-today {
   outline: 2px solid #1ca8dd;
   font-weight: 600;
   color: #1e40af;
}
.mf-calendar-selected {
   background-color: #3b82f6;
   outline: none;
   font-weight: 600;
   color: #fff;
}
.mf-calendar-month-item { border-radius: 6px }
.mf-calendar-current-month {
   background-color: #bfdbfe;
   font-weight: 600;
   color: #1e40af;
}
.mf-calendar-selected-month,
.mf-calendar-selected-start,
.mf-calendar-selected-end {
   background-color: #2563eb;
   font-weight: 600;
   color: #fff;
}
.mf-calendar-in-range {
   background-color: #93c5fd;
   color: #1e40af;
}
.mf-calendar-other-month {
   border-radius: 80px;
   line-height: 26px;
   min-height: 26px;
   min-width: 26px;
   color: #a0aec0;
   height: 26px;
   width: 26px;
}
.mf-calendar-day:not(.mf-calendar-selected, .mf-calendar-today):hover,
.mf-calendar-month-item:hover { background-color: #e2e8f0 }
/* Popover */
.mf-popover {
   position: absolute; /* Буде змінено на fixed в JS */
   box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
   transition: opacity 300ms ease-in-out;
   border: 1px solid #e5e7eb;
   background-color: white;
   border-radius: 0.5rem;
   pointer-events: none;
   padding: 1rem;
   z-index: 50;
   opacity: 0;
}
.mf-popover-is-visible {
   pointer-events: auto;
   opacity: 1;
}
.mf-popover-arrow-outer,
.mf-popover-arrow-inner {
   position: absolute;
   border-style: solid;
   height: 0;
   width: 0;
}
/* Обгортка контролів */
.mf-control-wrapper {}
.mf-control-wrapper-panel {
   line-height: 32px;
   min-height: 32px;
   height: 32px;
}
.mf-control-wrapper-title {
   font-family: 'Roboto-Regular';
   line-height: 32px;
   min-height: 32px;
   font-size: 13px;
   height: 32px;
}
.mf-control-wrapper-buttons-block { margin-left: auto }
.mf-control-wrapper-save,
.mf-control-wrapper-toggle {
   border-radius: 50%;
   line-height: 26px;
   min-height: 26px;
   min-width: 26px;
   cursor: pointer;
   height: 26px;
   width: 26px;
}
.mf-control-wrapper-save { margin-right: 8px }
.mf-control-wrapper-content {}
.mf-control-wrapper-info {
   font-family: 'Roboto-Regular';
   border: 2px solid #eaeaea;
   background-color: #fff;
   border-radius: 6px;
   padding: 4.4px 8px;
   min-height: 32px;
   font-size: 16px;
}
.mf-control-wrapper-editor {}
.mf-control-wrapper-disabled {
   pointer-events: none;
   opacity: 0.6;
}
/* SelectBox V2 */
.mf-selectbox-element {}
.mf-selectbox-input-wrapper {
   background-color: #fff;
   position: relative;
   width: 100%;
}
.mf-selectbox-input {
   font-family: 'Roboto-Regular';
   background-color: transparent;
   border: 2px solid #eaeaea;
   padding: 0 32px 0 8px;
   border-radius: 6px;
   line-height: 30px;
   min-height: 32px;
   font-size: 16px;
   height: 32px;
   width: 100%;
   z-index: 8;
}
.mf-selectbox-input-placeholder {
   position: absolute;
   font-family: 'Roboto-Regular';
   border: 2px solid #fff;
   background-color: #fff;
   padding: 0 32px 0 8px;
   border-radius: 6px;
   line-height: 30px;
   min-height: 32px;
   font-size: 16px;
   height: 32px;
   width: 100%;
   color: #888;
   z-index: 0;
   left: 0px;
   top: 0px;
}
.mf-selectbox-disabled {
   pointer-events: none;
   opacity: 0.6;
}
.mf-selectbox-list-container {
   display: none;
   position: fixed;
   box-shadow: 0px 4px 6px 2px rgba(0, 0, 0, 0.4);
   background-color: #fff;
   border-radius: 6px;
   margin-top: 2px;
   z-index: 9999;
   padding: 6px;
}
.mf-selectbox-panel {
   margin-bottom: 8px;
   width: 100%;
}
.mf-selectbox-search { width: 100% }
.mf-selectbox-toggle-group {
   border-radius: 40px;
   line-height: 26px;
   margin-left: 8px;
   min-height: 26px;
   min-width: 26px;
   cursor: pointer;
   height: 26px;
   width: 26px;
}
.mf-selectbox-list-control {
   position: relative;
   height: 100%;
   width: 100%;
}
/* TimePicker (Аналоговий годинник) */
.mf-time-picker-element {
   display: flex;
   flex-direction: column;
}
.mf-time-picker-wrapper { position: relative; width: 320px; height: 320px; font-family: system-ui, sans-serif; }
.mf-time-picker-svg { width: 100%; height: 100%; display: block; user-select: none; -webkit-user-select: none; touch-action: none; }
.mf-time-picker-face { fill: #fff; stroke: #e5e7eb; stroke-width: 1; }
.mf-time-picker-center-dot { fill: #111827; }
.mf-time-picker-mark { stroke: #9ca3af; stroke-width: 2; stroke-linecap: round; }
.mf-time-picker-mark-hour { stroke-width: 3; }
.mf-time-picker-hand { stroke: #111827; stroke-linecap: round; transition: stroke-width .12s ease; }
.mf-time-picker-hand-hour { stroke-width: 5; }
.mf-time-picker-hand-minute { stroke-width: 3; }
.mf-time-picker-hand-second { stroke: #ef4444; stroke-width: 1; transition: none; }
.mf-time-picker-hand-grab { cursor: grab; }
.mf-time-picker-hand-grabbing { cursor: grabbing; }
.mf-time-picker-hand-active { stroke-width: 7; }
.mf-time-picker-ring { fill: none; stroke: #f3f4f6; stroke-width: 24; }
.mf-time-picker-inner-ring { fill: none; stroke: #e2e8f0; stroke-width: 20; }
.mf-time-picker-num {
   dominant-baseline: middle;
   text-anchor: middle;
   user-select: none;
   font-size: 12px;
   cursor: pointer;
   fill: #374151;
   height: 20px;
   width: 20px;
}
.mf-time-picker-num:hover { stroke: #00bcd4; fill: #111827; }
.mf-time-picker-num-24 { fill: #4b5563; font-size: 10px; }
.mf-time-picker-num-24:hover { fill: #111827; }
.mf-time-picker-marker { fill: #6366f1; stroke: #fff; stroke-width: 2; cursor: grab; }
.mf-time-picker-marker-active { fill: #4f46e5; }
.mf-time-picker-marker-second { fill: #ef4444; }
.mf-time-picker-marker-text {
   font-family: 'Roboto-Regular';
   dominant-baseline: middle;
   pointer-events: none;
   text-anchor: middle;
   font-weight: bold;
   font-size: 12px;
   fill: #fff;
}
.mf-time-picker-panel {
   min-height: 26px;
   padding: 0 16px;
   height: 26px;
   width: 100%;
}
.mf-time-picker-label {
   font-family: 'Mono Bold';
   background-color: #eee;
   border-radius: 6px;
   text-align: center;
   line-height: 26px;
   font-size: 24px;
   padding: 0 4px;
   color: #374151;
   height: 26px;
}
.mf-time-picker-toggle {
   display: inline-flex;
   flex-direction: row;
   background-color: #eee;
   border: 2px solid #9ca3af;
   border-radius: 6px;
   margin-left: auto;
   overflow: hidden;
   min-height: 26px;
   min-width: 64px;
   cursor: pointer;
   height: 26px;
   width: 76px;
}
.mf-time-picker-mode-am,
.mf-time-picker-mode-pm {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   font-family: 'Roboto-Regular';
   text-align: center;
   line-height: 24px;
   font-weight: 600;
   width: 38px;
}
.mf-time-picker-toggle-select { background-color: #00bcd4 }
.mf-datepicker-dial {
   height: 240px;
   width: 240px;
}
/* TimePicker (iOS-style) */
.mf-time-picker-element-v2.mf-theme-dark {
   --mf-fade-top: linear-gradient(to bottom, rgba(60, 60, 60, 0.95) 0%, rgba(60, 60, 60, 0) 100%);
   --mf-fade-bottom: linear-gradient(to top, rgba(60, 60, 60, 0.95) 0%, rgba(60, 60, 60, 0) 100%);
   --mf-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.3), 0 8px 15px -6px rgba(0, 0, 0, 0.3);
   --mf-overlay-border: #525252;
   --mf-text-inactive: #a3a3a3;
   --mf-text-active: #ffffff;
   --mf-separator: #737373;
   --mf-border: #4d4d4d;
   --mf-bg: #3c3c3c;
}
.mf-time-picker-element-v2 {
   --mf-fade-top: linear-gradient(to bottom, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0) 100%);
   --mf-fade-bottom: linear-gradient(to top, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0) 100%);
   --mf-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.05), 0 8px 10px -6px rgba(0, 0, 0, 0.05);
   --mf-overlay-border: #e2e8f0;
   --mf-text-inactive: #64748b;
   --mf-text-active: #0f172a;
   --mf-separator: #94a3b8;
   --mf-border: #f1f5f9;
   --mf-bg: #ffffff;

   display: flex;
   align-items: center;
   justify-content: center;
   transition: border-color 0.3s ease;
   background-color: var(--mf-bg);
   -webkit-user-select: none;
   border-radius: 24px;
   padding: 15px 25px;
   position: relative;
   width: fit-content;
   user-select: none;
   margin: 0 auto;
}
.mf-time-picker-element-v2.mf-disabled {
   pointer-events: none;
   filter: grayscale(1);
   opacity: 0.5;
}
.mf-time-picker-body {
   display: flex;
   align-items: center;
   position: relative;
   overflow: hidden;
}
.mf-picker-col {
   position: relative;
   transform-style: preserve-3d;
   perspective: 1000px;
   overflow: hidden;
   cursor: grab;
   width: 70px;
}
.mf-picker-col:active { cursor: grabbing }
.mf-picker-track {
   position: absolute;
   transform-style: preserve-3d;
   will-change: transform;
   width: 100%;
   left: 0;
   top: 0;
}
.mf-picker-item {
   font-family: 'Roboto-Regular';
   transition: opacity 0.3s ease, transform 0.3s ease;
   color: var(--mf-text-inactive);
   backface-visibility: hidden;
   text-align: center;
   font-weight: 600;
   font-size: 28px;
}
.mf-picker-separator {
   display: flex;
   align-items: center;
   justify-content: center;
   font-family: 'Roboto-Regular';
   transition: color 0.3s ease;
   color: var(--mf-separator);
   user-select: none;
   font-weight: 600;
   font-size: 28px;
   padding: 0 8px;
}
.mf-picker-fade {
   position: absolute;
   pointer-events: none;
   z-index: 10;
   right: 0;
   left: 0;
}
.mf-picker-fade-top {
   background: var(--mf-fade-top);
   top: 0;
}
.mf-picker-fade-bottom {
   background: var(--mf-fade-bottom);
   bottom: 0;
}
.mf-picker-overlay {
   position: absolute;
   border-bottom: 1.5px solid var(--mf-overlay-border);
   border-top: 1.5px solid var(--mf-overlay-border);
   pointer-events: none;
   z-index: 5;
   right: 0;
   left: 0;
}
.mf-picker-manual-input {
   animation: mfInputFadeIn 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}
@keyframes mfInputFadeIn {
   from { opacity: 0; transform: translate(-50%, -50%) scale(0.85); }
   to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}
.mf-picker-manual-input::-webkit-outer-spin-button,
.mf-picker-manual-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.mf-picker-manual-input[type="number"] { -moz-appearance: textfield }
/* Редактор регіонів */
.mf-region-editor {
   position: fixed;
   background-color: #fff;
   z-index: 9999;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
}
.mf-region-editor-top-panel {
   background-color: #fff;
   min-height: 40px;
   height: 40px;
   width: 100%;
}
.mf-region-editor-close,
.mf-region-editor-fit-region,
.mf-region-editor-confirm {
   border-radius: 50%;
   text-align: center;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
.mf-region-editor-title { margin-left: 16px }
.mf-region-editor-close { margin-left: 8px }
.mf-region-editor-fit-region { margin-left: 16px }
.mf-region-editor-confirm { margin-right: 8px }
.mf-region-editor-map-wrapper {
   position: relative;
   height: calc(100% - 40px);
   overflow: hidden;
   width: 100%;
}
.mf-region-editor-colorpicker-container {
   position: absolute;
   z-index: 9999;
   right: 16px;
   top: 22px;
}
.mf-region-editor-colorpicker {
   box-shadow: 0 2px 5px rgba(0,0,0,0.2);
   background-color: transparent;
   border: 2px solid white;
   border-radius: 50%;
   overflow: hidden;
   cursor: pointer;
   height: 3rem;
   width: 3rem;
}
.mf-region-editor-colorpicker::-webkit-color-swatch {
   border-radius: 50%;
   border: none;
}
.mf-region-editor-colorpicker::-webkit-color-swatch-wrapper { padding: 0 }
/* Контрол вибору періоду дат */
.mf-period-box { position: relative; }
.mf-period-box-button {
   border-radius: 50%;
   text-align: center;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   font-size: 24px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
.mf-period-box-button-prev { margin-right: 4px }
.mf-period-box-button-next { margin-left: 4px }
.mf-period-box-input {
   background-color: #fff;
   border: 2px solid #ccc;
   text-align: center;
   line-height: 30px;
   min-height: 32px;
   min-width: 196px;
   cursor: pointer;
   height: 32px;
   width: 100%;
   color: #333;
}
/* Слайдер (Slider) */
.mf-slider {
   display: flex;
   align-items: center;
   position: relative;
   user-select: none;
   -webkit-user-select: none;
   touch-action: none;
   cursor: pointer;
   outline: none;
   height: 36px;
   width: 100%;
}
.mf-slider-track {
   position: relative;
   transition: background-color 0.2s ease;
   background-color: #e2e8f0;
   border-radius: 9999px;
   height: 6px;
   width: 100%;
}
.mf-slider:hover .mf-slider-track { background-color: #cbd5e1 }
.mf-slider-progress {
   position: absolute;
   background: linear-gradient(90deg, #6366f1, #4f46e5);
   border-radius: 9999px;
   will-change: width;
   height: 100%;
   left: 0;
   top: 0;
}
.mf-slider-thumb {
   position: absolute;
   box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
   transition: transform 0.1s ease, box-shadow 0.1s ease, border-color 0.2s;
   transform: translate(-50%, -50%);
   background-color: #ffffff;
   border: 2px solid #4f46e5;
   border-radius: 50%;
   will-change: left;
   cursor: grab;
   height: 20px;
   width: 20px;
   z-index: 10;
   top: 50%;
}

.mf-slider-thumb:active {
   box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.25);
   transform: translate(-50%, -50%) scale(1.15);
   cursor: grabbing;
}
.mf-slider:focus-within .mf-slider-thumb { box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.4) }
.mf-slider-tooltip {
   position: absolute;
   transition: opacity 0.15s ease, transform 0.15s ease;
   box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.15);
   transform: translateX(-50%) scale(0.8);
   background-color: #fff;
   pointer-events: none;
   white-space: nowrap;
   border-radius: 6px;
   font-weight: 600;
   padding: 4px 8px;
   font-size: 14px;
   z-index: 20;
   color: #333;
   opacity: 0;
}
.mf-slider-tooltip-top {
   margin-bottom: 10px;
   bottom: 100%;
   left: 50%;
}
.mf-slider-tooltip-top::after {
   content: '';
   position: absolute;
   border-color: #fff transparent transparent transparent;
   transform: translateX(-50%);
   border-style: solid;
   border-width: 5px;
   left: 50%;
   top: 100%;
}
.mf-slider-tooltip-bottom {
   margin-top: 10px;
   left: 50%;
   top: 100%;
}
.mf-slider-tooltip-bottom::after {
   content: '';
   position: absolute;
   border-color: transparent transparent #fff transparent;
   transform: translateX(-50%);
   border-width: 5px;
   border-style: solid;
   bottom: 100%;
   left: 50%;
}
.mf-slider-tooltip-show {
   transform: translateX(-50%) scale(1);
   opacity: 1;
}
.mf-slider-tooltip-always {
   transform: translateX(-50%) scale(1) !important;
   opacity: 1 !important;
}
.mf-slider-scale {
   position: relative;
   margin-top: 4px;
   height: 24px;
   width: 100%;
}
/* EmailBox (редагуємий список) */
.mf-email-box-panel {
   min-height: 36px;
   height: 36px;
}
.mf-email-box-title { font-size: 14px }
.mf-email-box-item { width: 100% }
.mf-email-box-item:not(:first-child) { margin-top: 8px }
.mf-email-input-group {
   border: 2px solid #eee;
   border-radius: 4px;
   width: 100%;
}
.mf-email-input-group:focus-within {
   box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.15);
   border-color: #4f46e5;
}
.mf-email-box-item-icon {
   margin-left: 4px;
   min-height: 16px;
   min-width: 16px;
   color: #94a3b8;
   height: 16px;
   width: 16px;
}
.mf-email-box-input {
   background-color: transparent;
   margin-left: 4px;
   min-height: 28px;
   font-size: 14px;
   color: #334155;
   height: 28px;
   border: none;
   width: 100%;
}
.mf-email-box-valid { border-color: #e2e8f0 }
.mf-email-box-non-valid { border-color: #fda4af }
.mf-email-box-item-delete {
   background-color: transparent;
   min-height: 32px;
   min-width: 32px;
   cursor: pointer;
   color: #94a3b8;
   border: none;
   height: 32px;
   width: 32px;
}
.mf-email-box-add-icon { margin-right: 4px }
.mf-email-box-button {
   background-color: #eef2ff;
   padding: 0 14px 0 6px;
   border-radius: 32px;
   margin-left: auto;
   line-height: 26px;
   min-height: 26px;
   cursor: pointer;
   color: #4f46e5;
   height: 26px;
}
.mf-email-box-list { padding: 8px 0 }
.mf-email-box-placeholder {
   border: 1px solid #eee;
   border-radius: 4px;
   text-align: center;
   font-style: italic;
   margin-top: 4px;
   font-size: 12px;
   padding: 8px;
   color: grey;
}
/* Загальні класи */
.mf-hidden { display: none }
.mf-bottom-align { margin-bottom: 8px }
.mf-right-align { margin-left: auto }
.mf-left-align { margin-left: 8px }
.mf-top-align { margin-top: 8px }
.mf-full-width { width: 100% }
.mf-prev { margin-right: 8px }
.mf-next { margin-left: 8px }
.mf-rotate-90 {
   -webkit-transform: rotate(90deg);
      -moz-transform: rotate(90deg);
       -ms-transform: rotate(90deg);
        -o-transform: rotate(90deg);
           transform: rotate(90deg);
}

/* Форми */
.form-combo {
   position: relative;
   display: flex;
   flex-direction: column;
   align-items: stretch;
   background-color: #eee;
   border-radius: 6px;
   overflow: hidden;
   margin-top: 8px;
   padding: 4px;
   height: auto;
   width: 100%;
}
.form-item-top-block {
   justify-content: flex-start;
   min-height: 28px;
   height: 28px;
   width: 100%;
}
.form-form-toggle-field { margin-right: 8px }
.form-item-drag-helper {
   line-height: 18px;
   min-height: 18px;
   cursor: grab;
   height: 18px;
   width: 30px;
}
.form-item-drag-helper:after { content: "\e945" }
.form-item-drag-helper:active { cursor: grabbing }
.form-item-number {
   position: absolute;
   background-color: #414141;
   border-radius: 32px;
   text-align: center;
   line-height: 14px;
   margin-right: 0px;
   min-height: 14px;
   min-width: 14px;
   font-size: 10px;
   height: 14px;
   width: 14px;
   color: #fff;
   left: 12px;
   top: 3px;
}
.form-item-label {
   font-family: 'Roboto-Regular';
   font-size: 14px;
}
/* Стилі контролів приоритетів */
.priority-color-block, .priority-order-block { margin: 8px }
.priority-color-item {
   display: inline-block;
   text-align: center;
   border-radius: 50%;
   line-height: 24px;
   font-weight: bold;
   min-height: 24px;
   min-width: 24px;
   cursor: pointer;
   font-size: 14px;
   height: 24px;
   width: 24px;
   color: #000;
}
.priority-color-item:not(:first-child),
.priority-order-item:not(:first-child) { margin-left: 8px }
.priority-color-red {
   background-color: #f44336;
   border: 2px solid #f44336;
}
.priority-color-yellow {
   background-color: #ffc107;
   border: 2px solid #ffc107;
}
.priority-color-green {
   background-color: #388e3c;
   border: 2px solid #388e3c;
}
.priority-color-none {
   background-color: #ccc;
   border: 2px solid #ccc;
}
.priority-order-item {
   display: inline-block;
   border: 2px solid #ccc;
   border-radius: 50%;
   text-align: center;
   line-height: 21px;
   cursor: pointer;
   font-size: 12px;
   height: 24px;
   width: 24px;
}
.priority-order-none {
   background-repeat: no-repeat;
   background-position: center;
   background-size: 14px;
}
.priority-order-none:after { content: "\e5cd" }
.priority-color-item-select {
   border-color: #222 !important;
   line-height: 22px;
}
.priority-color-item-select:after { content: "\e5ca" }
.priority-order-item-select { border-color: #2a95ff !important }

/* Загальні стилі ERP Lite */
.erplite-top-align { margin-top: 8px }
.erplite-panel {
   display: flex;
   position: relative;
   flex-direction: row;
   align-items: center;
   background-color: #fff;
   padding: 0 8px;
}
.erplite-button {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   font-family: 'Roboto-Regular';
   background-color: #0362d9;
   border-radius: 32px;
   text-align: center;
   line-height: 28px;
   overflow: hidden;
   padding: 0 16px;
   font-size: 14px;
   cursor: pointer;
   height: 28px;
   color: #fff;
}
.erplite-grey-slim-button {
    background-color: #e0e0e0;
    border-radius: 40px;
    line-height: 26px;
    margin-top: 14px;
    min-height: 26px;
    padding: 0 16px;
    cursor: pointer;
    height: 26px;
}
.erplite-round-button {
   display: inline-block;
   border-radius: 28px;
   text-align: center;
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   cursor: pointer;
   height: 24px;
   width: 24px;
}
.erplite-round-button-28 {
   display: inline-block;
   border-radius: 32px;
   text-align: center;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
.erplite-toggle-size-button {
   display: inline-block;
   border-radius: 32px;
   text-align: center;
   font-weight: bold;
   line-height: 26px;
   min-height: 26px;
   min-width: 26px;
   font-size: 14px;
   cursor: pointer;
   height: 26px;
   width: 26px;
}
.erplite-tool-round-button {
   display: inline-block;
   border-radius: 32px;
   text-align: center;
   line-height: 26px;
   min-height: 26px;
   min-width: 26px;
   cursor: pointer;
   height: 26px;
   width: 26px;
}
.erplite-large-round-button {
   display: inline-block;
   background-color: #0362d9;
   border-radius: 32px;
   line-height: 28px;
   font-weight: bold;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
   color: #fff;
}
.erplite-button-text {
   line-height: 28px;
   height: 28px;
}
.erplite-button-icon-ok { color: green; }
.erplite-form-input {
   border: 2px solid #ddd;
   border-radius: 4px;
   padding: 0 8px;
   height: 28px;
   width: 100%;
}
.erplite-form-duo-block {
   display: flex;
   flex-direction: row;
   align-items: center;
   flex-wrap: nowrap;
}
.erplite-form-block,
.erplite-form-vblock {
   display: flex;
   flex-direction: column;
   width: 100%;
}
.erplite-form-vblock:not(:first-child) { margin-left: 4px; }
.erplite-side-panel {
   display: none;
   flex-wrap: nowrap;
   flex-direction: column;
   background-color: #fff;
   border-right: 1px solid #ddd;
   min-height: 100%;
   min-width: 280px;
   overflow: auto;
   padding: 8px;
   height: 100%;
   width: 280px;
}
.erplite-right-align { margin-left: auto }
.erplite-default-container {
   background-color: #efefef;
   border-radius: 6px;
   height: 32px;
}
.erplite-button-icon {
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   font-size: 20px;
   height: 24px;
   width: 24px;
}
.erplite-button-label {
   text-align: center;
   margin: 0 auto;
   width: 100%;
}
.erplite-mid-round-button {
   display: inline-block;
   border-radius: 40px;
   text-align: center;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
.erplite-middle-container {
   position: relative;
   height: 100%;
   width: 100%;
}
.erplite-scroll-block {
   overflow: auto;
   height: 100%;
   width: 100%;
}
.erplite-bottom-panel {
   position: relative;
   border-top: 1px solid #ddd;
   background-color: #ececec;
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
   width: 100%;
}
.erplite-total-item {
   line-height: 28px;
   min-height: 28px;
   font-size: 14px;
   height: 28px;
}
.erplite-total-item:not(:first-child) { margin-left: 16px }
.erplite-total-label { font-weight: 700 }
.erplite-total-value { margin-left: 4px }
.erplite-filter-indicator {
   display: none;
   position: absolute;
   background-color: #ff9800;
   border-radius: 32px;
   line-height: 18px;
   min-height: 18px;
   min-width: 18px;
   font-size: 13px;
   height: 18px;
   width: 18px;
   color: #000;
   z-index: 5;
   left: 38px;
   top: 2px;
}
.erplite-toggle-sidebar-button { transition: all 0.6s ease-out }
.erplite-toggle-sidebar-button:hover {
   background-color: #a26eff;
   color: #772bff;
}
.erplite-toggle-sidebar-button-select {
   background-color: #8745ff;
   color: #e1d0ff;
}
.erplite-form-toolbar {
   height: 40px;
   width: 100%;
}
.erplite-form-toolbar-left-block,
.erplite-form-toolbar-right-block {
   position: relative;
   height: 40px;
}
.erplite-form-toolbar-left-block > *:not(:first-child),
.erplite-form-toolbar-right-block > *:not(:first-child) { margin-left: 14px; }
.erplite-form-toolbar-right-block { margin-left: auto; }
.button-disable { background-color: #4e4e4e !important }
.button-disable:active { background-color: #4e4e4e !important }
.send-button { background-color: #0362d9; font-weight: bold; color: #eee; }
.del-button { background-color: #f44336; font-weight: bold; color: #eee; }
.del-action { color: #ff6256 }
.del-confirm-info {
   background-color: #204352;
   border-radius: 6px;
   padding: 8px;
   width: 100%;
   color: #eee;
}
.del-confirm-info-icon {
   margin-right: 8px;
   color: orange;
}
.erplite-form-top-panel {
   background-color: #2a3a54;
   border-radius: 4px;
   position: sticky;
   padding: 0 8px;
   height: 40px;
   z-index: 15;
   top: 0;
}
.erplite-form-label {
   font-size: 14px;
   margin: 0;
   margin-top: 8px;
}
.erplite-404-container {
   background-color: #333;
   border-radius: 8px;
   text-align: center;
   margin: 16px auto;
   padding: 16px;
   color: #ccc;
   height: 95%;
   width: 95%;
}
.erplite-404-icon {
   display: block;
   position: relative;
   border-radius: 100%;
   background-color: #5d4037;
   background-clip: content-box;
   background-repeat: no-repeat;
   background-position: center;
   background-image: url('../img/404.svg');
   background-size: 86%;
   margin: 4px auto;
   height: 160px;
   width: 160px;
}
.erplite-form-id-label {
   padding-right: 4px;
   line-height: 40px;
   font-size: 14px;
   color: #607d8b;
   height: 40px;
   width: 100%;
}
.erplite-span-icon {
   display: inline-flex;
   justify-content: center;
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   font-size: 24px;
   height: 24px;
   width: 24px;
}
.erplite-pager-container *:not(:first-child, .mf-list-item) { margin-left: 4px }
.erplite-pager-button {
   border-radius: 50%;
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   cursor: pointer;
   height: 24px;
   width: 24px;
}
.erplite-page-size-button {
   font-family: 'Roboto-Regular';
   text-align: center;
   font-size: 10px;
}
.erplite-page-size-select {
   background-color: #707070;
   color: #fff;
}
.erplite-pager-input {
   line-height: 24px;
   min-height: 24px;
   font-size: 14px;
   border: none;
   height: 24px;
   width: 100px;
}
.erplite-form-button-label {
   font-family: 'Roboto-Regular';
   background-color: #59beff;
   border-radius: 40px;
   line-height: 24px;
   min-height: 24px;
   cursor: pointer;
   padding: 0 10px;
   font-size: 14px;
   color: #3f51b5;
   height: 24px;
}
.erplite-form-label-value { margin-left: 2px }

.grid-toggle-row-btn {
   border-radius: 50%;
   line-height: 28px;
   margin-left: 4px;
   min-height: 28px;
   min-width: 28px;
   font-size: 24px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}

.minideal-card {
   background-color: #fff;
   transition: all .5s;
   margin-bottom: 8px;
   border-radius: 0;
   padding: 0 16px;
}
.mini-card-top {
   line-height: 32px;
   min-height: 32px;
   height: 32px;
}
.mini-card-color {
   border-radius: 50%;
   line-height: 16px;
   min-height: 16px;
   min-width: 16px;
   font-size: 16px;
   height: 16px;
   width: 16px;
}
.mini-card-scenario-type { font-size: 14px }
.mini-card-menu-button {
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   font-size: 24px;
   height: 24px;
   width: 24px;
}
.mini-toggle-button {
   border-radius: 50%;
   line-height: 22px;
   min-height: 22px;
   min-width: 22px;
   font-size: 24px;
   cursor: pointer;
   height: 22px;
   width: 22px;
}
.mini-card-content {
   border-top: 1px solid #ccc;
   padding-bottom: 16px;
}
.mini-card-item {
   margin-top: 6px;
}
.mini-card-label { margin-right: 4px }

.card { background-color: #fff }
.card-top-left-block { width: 100% }
.card-top-right-block {
   justify-content: flex-end
   margin-left: auto;
}
.card-status-icon {
   justify-content: center;
   font-family: 'Roboto-Regular';
   border: 1px solid #1e90ff;
   border-radius: 32px;
   text-align: center;
   line-height: 20px;
   margin-right: 4px;
   margin-left: 8px;
   min-height: 22px;
   min-width: 22px;
   font-size: 10px;
   height: 22px;
   width: 22px;
   color: #111;
}
.card-title {
   margin-left: 8px;
   min-width: 100px;
   width: 100%;
}
.card-item-fold {
   text-align: center;
   line-height: 32px;
   font-size: 26px;
   cursor: pointer;
   height: 32px;
   width: 32px;
}
.card-exinfo-table tr:nth-child(even) { background-color: #eee }
.card-exinfo-table td {
   line-height: 32px;
   padding: 0 8px;
   height: 32px;
}


/* ----------------------------------------------------------------  */

/* Індикатор очикування */
#loading {
   display: none;
   position: fixed;
   top: 50%;
   left: 50%;
   width: 78px;
   height: 78px;
   margin-top: -62px;
   margin-left: -39px;
   border-radius: 100px;
   box-shadow: 0 0 4px 0 #333;
   background-color: #fff;
   background-image: url('../img/waitme.svg');
   background-clip: content-box;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 102px;
   z-index: 999996;
}
/* Затемнений задник */
#eclipse {
   position: fixed;
   top: 0;
   display: none;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, .5);
   z-index: 9990;
}
.button {
   display: inline-block;
   padding: 8px 16px;
   color:  #fff;
   background-color: #0262da;
   text-align: center;
   font-weight: bold;
   font-size: 10pt;
   border-radius: 6px;
   cursor: pointer;
}
.button:active {
   background-color: #0056d1;
}
.service-button {
   min-width: 100px;
}
.remove-button {
   background-color: #f44336;
}
.remove-button:active {
   background-color: #f32415;
}
#infoBox {
   position: fixed;
   top: 350px;
   left: 10%;
   width: 80%;
   padding: 24px 16px;
   background-color: #fff;
   border-radius: 8px;
   box-shadow: 1px 1px 10px 4px #888;
   font-size: 10pt;
   z-index: 9999;

   background-image: url('../img/info.svg');
   background-repeat: no-repeat;
   background-position: 16px center;
   background-size: 32px;
}
.info-box-text {
   padding-left: 44px;
}
.float-add-button {
   position: fixed;
   bottom: 10px;
   right: 10px;
   width: 32px;
   height: 32px;
   border-radius: 32px;
   background-image: url('../img/add.svg');
   background-clip: content-box;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 32px;
   z-index: 9970;
}
.float-add-button:active {
   opacity: 0.5;
}
.popup-window {
   display: none;
   position: absolute;
   top: 44px;
   width: 99.9%;
   left: 0.1%;
   background-color: #fff;
   border-radius: 4px;
   box-shadow: 0 0 4px 0 #888;
   margin-bottom: 8px;
   padding: 8px;
   z-index: 1500;
}
.popup-top-panel {
   display: flex;
   flex-direction: row;
   justify-content: flex-start;
   align-items: center;
   flex-wrap: nowrap;
   margin-bottom: 8px;
}
.popup-top {
   width: 100%;
   height: 32px;
   line-height: 32px;
   border-bottom: 1px solid #ddd;
   margin-bottom: 16px;
   cursor: grab;
}
.popup-top:active {
   cursor: grabbing;
}
.popup-close {
   position: absolute;
   display: block;
   top: 8px;
   right: 8px;
   width: 26px;
   height: 26px;
   border-radius: 50%;
   cursor: pointer;
   background-image: url('../img/cross.png');
   background-repeat: no-repeat;
   background-position: center;
   background-size: 12px;
}
.popup-close:hover {
   background-color: #ccc;
}
.popup-field-label {
   margin: 0;
   padding: 0;
   margin-top: 4px;
   margin-bottom: 2px;
}
.popup-block-field {
   display: block;
   width: 100%;
   height: 31px;
   line-height: 32px;
   background-color: #ecf9ff;
   border: 2px solid #b3e5fc;
   border-radius: 6px;
   padding: 4px;
}
.popup-body {
   position: relative;
   height: calc(100% - 50px);
   overflow: hidden;
   overflow-y: auto;
}
.service-window {
   display: none;
   position: absolute;
   top: 44px;
   width: 98%;
   left: 1%;
   background-color: #fff;
   border-radius: 4px;
   box-shadow: 0 0 4px 0 #888;
   padding: 16px;
   padding-top: 4px;
   z-index: 1600;
}
.service-window-top {
   display: flex;
   flex-direction: row;
   align-items: center;
   border-bottom: 1px solid #ddd;
   margin-bottom: 8px;
   line-height: 32px;
   height: 32px;
   width: 100%;
   /*cursor: grab;*/
}
.service-window-title {
   line-height: 16px;
   font-size: 14px;
   height: 16px;
}
/*.service-window-top:active {
   cursor: grabbing;
}*/
.service-window-close {
   background-image: url('../img/cross.png');
   background-repeat: no-repeat;
   background-position: center;
   background-size: 9px;
   border-radius: 50%;
   margin-left: auto;
   min-height: 17px;
   min-width: 17px;
   cursor: pointer;
   height: 17px;
   width: 17px;
}
.service-window-body {
   position: relative;
   height: calc(100% - 16px);
   overflow: hidden;
   overflow-y: auto;
}

/* Модулі, суб-модулі */
.module,
.submodule,
.tool-module {
   position: relative;
   overflow: hidden;
   font-size: 16px;
}
.submodule,
.tool-module {
   position: relative;
   width: 100%;
   height: 100%;
   overflow: hidden;
}
.tool-module {
   margin: 0 auto;
}
.multimodule {
   display: block;
   height: 100%;
   overflow: hidden;
}
.module-container,
.submodule-container {
   width: 100%;
   height: 100%;
   overflow: hidden;
}
.submodule-container {
   position: fixed;
   height: calc(100% - 42px);
   background-color: #d9d9d9;
   transition: all 0.1s;
   z-index: 100;
   right: -100%;
   top: 40px;

   -webkit-animation: slide 0.5s forwards;
   /*-webkit-animation-delay: 2s;*/
   animation: slide 0.5s forwards;
}
.module-preload {
   position: fixed;
   display: none;
   margin: -14px 0 0 -43px;
   z-index: 9999;
   height: 28px;
   width: 86px;
   left: 50%;
   top: 50%;

   background-position: center;
   background-repeat: no-repeat;
   background-image: url(../img/module-preload.svg);
   background-size: 86px;
}
.card-preload {
   position: absolute;
   background-color: #f0f4f9;
   box-shadow: 0px 0px 8px 0px #00000096;
   background-image: url(../img/invoice-preloader.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 32px;
   border-radius: 32px;
   min-height: 32px;
   min-width: 32px;
   z-index: 9999;
   height: 32px;
   width: 32px;
   left: 50%;
   top: 50%;
}

.module-top-panel {
   border-bottom: 1px solid #ccc;
   background-color: #fff;
   min-height: 40px;
   height: 40px;
   width: 100%;
}
.module-top-left-block { width: 100% }
.module-top-right-block {
   margin-left: auto;
   padding: 0 6px;
}
.module-top-left-block { padding: 0 6px }
.module-top-left-block > *:not(:first-child, #region-filter-indicator, #events-filter-indicator) { margin-left: 16px }

.module-top-buttons-block > *:not(:first-child) { margin-left: 8px }
.select-submenu {
   color: #fff;
   border-color: #64b5f6;
   background-color: #64b5f6;
}
.cards-list {
   position: relative;
   width: 96%;
   margin: 0 auto;
   overflow-y: auto;
   border-radius: 4px;
   margin-bottom: 8px;

   height: calc(100% - 40px);
   /*font-size: 12px;*/
}
.submodule-list {
   position: relative;
   width: 100%;
   height: calc(100% - 72px);
   /*scrollbar-gutter: stable;*/
   overflow-y: auto;
   /*margin-bottom: 8px;*/
   border-radius: 4px;
   padding: 0;
}
.grid-content,
.grid-container { width: fit-content }
.grid-filter-indicator {
   display: none;
   position: absolute;
   background-color: #ffc107;
   border-radius: 32px;
   line-height: 18px;
   min-height: 18px;
   min-width: 18px;
   font-size: 13px;
   height: 18px;
   width: 18px;
   z-index: 5;
   top: 0;
}

.dx-datagrid .dx-header-filter {
   /*color: #8b4cff;*/
   color: #ff9800;
}
.dx-datagrid .dx-header-filter-empty {
   color: #75757580;
}
.fixed-form-top-panel {
   position: sticky;
   background-color: #d3e3fd;
   border-radius: 4px;
   height: 40px;
   z-index: 20;
   top: 0;
}

/* Тумблер */
#load-mode {
   width: 0;
   height: 0;
   visibility: hidden;
}
.label-switch-checkbox {
   top: 0.2rem;
   cursor: pointer;
   text-indent: -9999px;
   width: 35px;
   height: 20px;
   background-color: #0262da;
   border-radius: 18px;
   position: relative;
}
.label-switch-checkbox:after {
   content: '';
   position: absolute;
   top: 3px;
   right: 3px;
   width: 14px;
   height: 14px;
   background: #fff;
   border-radius: 14px;
   transition: 0.1s;
}
.switch-checkbox:checked + .label-switch-checkbox {
   background: #ff5722;
}
.switch-checkbox:checked + .label-switch-checkbox:after {
   right: calc(100% - 3px);
   transform: translateX(100%);
}
.label-switch-checkbox:active:after {
   width: 14px;
}
.redo-switch {
   position: absolute;
   right: 24px;
}
.switch-checkbox {
   width: 1rem;
   height: 1rem;
   margin: 0 0.6rem 0 0;
   visibility: hidden;
}

/* Перетаскування полів форми Задача */
.ui-state-highlight {
   display: block;
   padding: 0.5em 1em;
   height: 2.5em;
   max-width: 100%;
   background-color: #fdfd96;
}
.field-draggable-block { position: relative }
.field-draggable-block:not(:first-child) { margin-top: 8px }
.drag-helper {
   display: inline-block;
   position: absolute;
   top: 4px;
   left: 4px;
   width: 18px;
   height: 24px;
   margin-right: 4px;
   cursor: grab;
   background-image: url('../img/drag-vertical.svg');
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px;
}
.drag-helper:active {
   cursor: grabbing;
}
.form-action-radio-block {
   border: 2px solid #ddd;
   border-radius: 6px;
   padding: 8px;
}
.form-action-radio-container {
   display: flex;
   flex-direction: column;
   align-items: start;
}
.form-action-radio-item {
   line-height: 32px;
   height: 32px;
}
.form-action-radio-item:before {
   content: "\e836";
   line-height: 32px;
   margin-right: 6px;
   font-family: "Material-Icons";
   font-weight: normal;
   font-style: normal;
   text-align: center;
   font-size: 18px;
   letter-spacing: normal;
   text-transform: none;
   -webkit-font-feature-settings: 'liga';
   -webkit-font-smoothing: antialiased;
}
.form-action-radio-select:before {
   content: "\e837";
}

/* Основний контейнер додатку */
#container {
   position: relative;
   width: 100%;
   min-width: 100%;
   height: 100%;
   margin-top: 40px;
   overflow: hidden;
}

/* Форма авторизації */
.entry-title {
   text-align: center;
}
#entry-container {
   width: 96%;
   background-color: #fff;
   border-radius: 4px;
   margin: 0 auto;
   padding: 16px 0;
}
#entry-form {
   padding: 0 24px;
}
.entry-label {
   display: block;
   padding: 16px 0;
   font-size: 14pt;
}
.entry-input {
   display: block;
   height: 36px;
   width: 100%;
   background-color: #ecf9ff;
   border: 2px solid #ddd;
   border-radius: 6px;
   padding: 0;
   padding-left: 8px;
   padding-right: 40px;
   line-height: 36px;
   margin: 0 auto;
   font-size: 14pt;
}
.entry-input-box,
.entry-textarea-box {
   position: relative;
   display: inline-flex;
   align-items: center;
   width: 100%;
   height: 44px;
   margin: 0 auto;
}
.entry-textarea-box {
   height: 60px;
}
.entry-clear,
.input-clear,
.task-geo-clear {
   position: absolute;
   display: block;
   top: -4px;
   right: -2px;
   width: 38px;
   height: 40px;
   border-radius: 50%;
   cursor: pointer;
   background-image: url('../img/cross.svg');
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px;
   z-index: 100;
}
.entry-clear:hover,
.input-clear:hover,
.task-geo-clear:hover {
   opacity: .8;
}
.entry-clear {
   top: 2px;
}
.task-geo-clear {
   top: 11px;
}
#entry-button {
   display: block;
   width: 100%;
   padding: 8px 16px;
   color:  #fff;
   background-color: #0046aa;
   font-family: "PT Sans";
   font-weight: bold;
   font-size: 14pt;
   border: 2px solid #0046aa;
   border-radius: 6px;
   margin: 0 auto;
   margin-top: 16px;
   margin-bottom: 16px;
}
#entry-info {
   width: 100%;
   height: 24px;
   text-align: center;
   margin-top: 16px;
}
.entry-info-warning {
   color: #f44336;
   background-image: url('../img/rwarning.png');
   background-repeat: no-repeat;
   background-position: left center;
   background-size: 24px;
}
.entry-info-default {
   color: #38a;
}
.entry-hblock {
   display: flex;
   flex-direction: row;
   align-items: center;
   line-height: 38px;
   height: 38px;
   width: 100%;
}
.entry-bottom-block {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   padding: 8px 24px;
   width: 100%;
}
.entry-version-label {
   margin-left: auto;
   text-align: right;
}

/* Верхня панель додатку (видима завжди) */
#top-panel {
   position: fixed;
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   border-bottom: 1px solid #ddd;
   margin-bottom: 8px;
   background-color: #fff;
   background-repeat: no-repeat;
   z-index: 9990;
   height: 40px;
   width: 100%;
   top: 0;
}
#top-horizontal-menu-button {
   transition: transform 0.3s;
   border-radius: 40px;
   line-height: 32px;
   min-height: 32px;
   min-width: 32px;
   cursor: pointer;
   font-size: 32px;
   height: 32px;
   width: 32px;
}
#top-loading {
   display: none;
   position: absolute;
   background-image: url('../img/rolling-preloader.svg');
   background-repeat: no-repeat;
   background-position: center;
   background-size: 44px;
   min-height: 40px;
   min-width: 40px;
   height: 40px;
   width: 40px;
   left: 40px;
   top: 0;
}
.top-panel-item {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   flex-wrap: nowrap;
}
#top-panel-left-block { margin-right: 8px }
#menu-button {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   line-height: 40px;
   min-height: 40px;
   min-width: 40px;
   font-size: 26px;
   cursor: pointer;
   height: 40px;
   width: 40px;
}
.current-page {
   border-right: 6px solid #2196f3;
   background: rgb(255,255,255);
   background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 32%, rgba(132,200,255,1) 100%);
}
#top-search-panel {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   height: 40px;
   width: 50%;
}
#global-create-financial-task-button { color: green }
#global-go-to-financial-button { color: #558b2f }
#global-create-deal-button { margin-left: 8px }
#top-search-container {
   display: inline-flex;
   flex-direction: row;
   position: relative;
   padding: 4px 0;
   height: 40px;
   width: calc(100% - 36px);
}
#top-panel-right-block {
   margin-left: auto;
   padding-left: 8px;
   width: auto;
}
#top-panel-notify-container { padding-right: 4px }
.top-notify-button { font-size: 20px }
.top-notify-menu {
   max-width: 400px;
   width: 400px;
}
.top-notify-menu-item {
   height: auto;
   padding: 0;
}
.top-notify-menu-item:hover { background-color: initial }
.top-notify-menu-button {
   position: relative;
   border-radius: 40px;
   min-height: 32px;
   min-width: 32px;
   color: #1976d2;
   height: 32px;
   width: 32px;
}
/*.top-notify-menu-button[title]:hover::after {
  content: attr(title);
  position: absolute;
  font-family: 'Roboto-Regular';
  background-color: #333;
  border-radius: 6px;
  line-height: 24px;
  font-size: 12px;
  padding: 0 12px;
  color: #fff;
  height: 24px;
  top: 100%;
  left: 0;
}*/

.top-notify-menu-item-text {
   display: flex;
   flex-direction: row;
   align-items: center;
}
.rapid-notify-item {
   border: 1px solid #9e9e9e;
   border-radius: 6px;
   overflow: hidden;
   margin: 4px;
   width: 100%;
}
.rapid-notify-top {
   background-color: gray;
   text-align: center;
   line-height: 28px;
   min-height: 28px;
   font-size: 14px;
   height: 28px;
   width: 100%;
   color: #fff;
}
.rapid-notify-content {
   line-height: 24px;
/*   white-space: pre-wrap;*/
   font-size: 14px;
   padding: 0 8px;
}
.rapid-notify-bottom {
   height: 28px;
}
.rapid-notify-color {
   border: 1px solid gray;
   border-radius: 24px;
   min-height: 12px;
   min-width: 12px;
   height: 12px;
   width: 12px;
}
.rapid-notify-number {
   margin-left: 8px;
   font-size: 12px;
}
.rapid-notify-ondate {
   margin-left: auto;
   font-size: 12px;
}
.rapid-notify-insert { background-color: #1a6183 }
.rapid-notify-update { background-color: #616161 }
#top-panel-notify-block { position: relative }
#top-panel-connect-indicator {
   position: absolute;
   border: 1px solid #9e9e9e;
   border-radius: 18px;
   min-height: 8px;
   min-width: 8px;
   bottom: 0px;
   height: 8px;
   width: 8px;
   left: 0px;
}
.socket-opened { background-color: green }
.socket-error { background-color: red }
.socket-closed { background-color: gray }

#top-title {
   display: inline-block;
   line-height: 40px;
   font-weight: bold;
   overflow: hidden;
   padding: 0 8px;
   height: 40px;
   width: max-content;
   color: #333;
}
#progress-wrapper {
   position: fixed;
   min-height: 3px;
   z-index: 900;
   height: 3px;
   width: 100%;
   top: 40px;
   left: 0;
}
#progress-bar {
   background-color: #1e90ff;
   height: 100%;
   width: 0;
}

/* Сендвич-меню */
#main-menu {
   position: fixed;
   top: 0;
   width: 0;
   min-height: 100%;
   height: 100%;
   background-color: #fff;
   border-right: 1px solid #ddd;
   box-shadow: 6px 0 10px 0 #888;
   overflow: hidden;
   z-index: 9999;
   transition: width 0.2s;
   font-family: 'PT Sans', Helvetica, sans-serif;
   font-size: 12pt;
}
#main-menu-top {
   display: flex;
   border-bottom: 1px solid #cdcdcd;
   background-color: #E6E8E8;
}
#main-menu-info {
   background-color: #eee;
   min-height: 32px;
   padding: 0 6px;
   height: 32px;
   width: 100%;
}
#main-menu-account-href { display: inline-block }
#main-menu-account {
   display: inline-block;
   padding-left: 8px;
   line-height: 38px;
   font-size: 10pt;
   height: 38px;
   color: #333;
}
#main-menu-version {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   line-height: 40px;
   font-size: 14px;
   padding: 8px;
   height: 40px;
   color: #333;
}
#main-menu-close {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   border-radius: 40px;
   line-height: 32px;
   margin-right: 8px;
   cursor: pointer;
   font-size: 24px;
   z-index: 9999;
   height: 32px;
   width: 32px;
}
#main-menu-exit {
   margin-left: 14px;
   font-size: 16px;
}
#main-menu-theme { margin-right: 16px }
#main-menu-items {
   width: 100%;
   height: calc(100% - 78px);
   padding-right: 2px;
   margin-top: 4px;
   overflow: hidden;
   overflow-y: auto;
}
.main-menu-item,
.main-menu-group-item {
   display: block;
   width: auto;
   height: 42px;
   line-height: 42px;
   font-weight: bold;
   color: #111 !important;
   margin-left: 14px;
   padding-left: 10px;
   cursor: pointer;
}
.main-menu-item:hover,
.main-menu-group-item:hover { background-color: #eceff1 }
.main-menu-group {
   display: flex;
   flex-direction: column;
   padding-right: 2px;
   width: 100%;
}
.main-menu-group-title {
   height: 42px;
   width: 100%;
   line-height: 42px;
   font-weight: bold;
   margin-left: 14px;
   padding-left: 10px;
   cursor: pointer;

   background-color: #ecf9ff;
   background-image: url(../img/triangle-down.svg);
   background-repeat: no-repeat;
   background-position: center right 48px;
   background-size: 8px;
}
.main-menu-group-container {
   display: none;
   border: 1px dashed #ccc;
   border-top: none;
   border-right: none;
   border-bottom-left-radius: 6px;
   padding: 6px 0;
   margin-left: 14px;
   width: 96%;
}
#main-menu-logout {
   width: 100%;
   height: 42px;
   line-height: 42px;
   padding-left: 24px;
   color: #e34;
   cursor: pointer;
}

.slide-main-menu { width: 80% !important }
/* Верхнє горизонтальне меню */
#top-horizontal-menu-container {
   display: none;
   position: -webkit-sticky;
   position: sticky;
   background-color: #eee;
   border-bottom: 1px solid #ddd;
   overflow: hidden;
   z-index: 100;
   clear: both;
   height: 28px;
   width: 100%;
   top: 40px;
}
.horizontal-menu-link {
   display: inline-block;
   overflow: hidden;
   height: 28px;
}
.horizontal-menu-item {
   display: inline-block;
   line-height: 28px;
   font-size: 14px;
   overflow: hidden;
   text-align: center;
   padding: 0 16px;
   height: 28px;
   color: #333;
   transition: all 0.8ms;
   border-bottom: 3.5px solid #eee0;
}
.horizontal-menu-item:hover { background-color: #ecf9ff }
.current-page-horisontal {
   border-bottom: 3.5px solid #1976d2;
   background-color: #ecf9ff;
}
.horizontal-menu-group {
   display: inline-block;
   overflow: hidden;
   height: 28px;
}
.horizontal-menu-group-title {
   height: 28px;
   width: 100%;
   line-height: 28px;
   padding: 0 8px;
   cursor: pointer;
}
.horizontal-menu-group-container {
   display: none;
   position: fixed;
   background-color: #fff;
   padding: 6px 0;
   top: 68px;
}

/* Metro */
#metro-container {
   display: grid;
   /*grid-template-columns: auto auto;*/
   grid-template-columns: 1fr 1fr;
   grid-template-rows: repeat(auto, 1fr);
   /*justify-items: stretch;*/
   align-content: start;
   align-items: center;
   background-color: #fff;
   max-width: 1024px;
   overflow: hidden;
   overflow-y: auto;
   margin: 0 auto;
   padding: 2px;
   height: 100%;
   width: 100%;
}
.metro-item-link {
   display: grid;
   position: relative;
   grid-template-columns: 100%;
   grid-template-rows: 100%;
   justify-content: center;
   align-items: center;
   color: #333;
}
.metro-item-container {
   position: relative;
   display: inline-flex;
   flex-direction: row;
   border: 3px solid #fff;
   background-color: #8bc34a;
   transition: all 160ms;
   border-radius: 8px;
   /*padding: 32px 24px;*/
   overflow: hidden;
   cursor: pointer;
   padding: 16px;
   width: 100%;
   clear: both;
}
.metro-item-container:hover {
   background-color: #dfebff;
   opacity: 0.8;
}
.metro-item-icon {
   display: inline-block;
   background-color: #e0f2f1;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 24px;
   border-radius: 28px;
   line-height: 28px;
   overflow: hidden;
   min-height: 28px;
   min-width: 28px;
   height: 28px;
   width: 28px;
}
.metro-item-text {
   display: inline-block;
   width: calc(100% - 36px);
   text-align: center;
   line-height: 28px;
   margin-left: 8px;
   font-size: 14px;
   height: 28px;
}
.metro-item-count {
   display: none;
   position: absolute;
   font-family: 'Roboto-Regular';
   background-color: #f44336;
   border-radius: 40px;
   text-align: center;
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   font-size: 12px;
   height: 24px;
   width: 24px;
   color: #fff;
   right: 6px;
   top: 6px;
}
.metro-item-icon-devices,
.metro-item-icon-device { background-image: url(../img/devices.svg) }
.metro-item-icon-history {
   background-image: url(../img/history.svg);
   background-size: 18px;
}
.metro-item-icon-company {
   background-image: url(../img/company.svg);
   background-size: 18px;
}
.metro-item-icon-companies {
   background-image: url(../img/table.svg);
   background-size: 18px;
}
.metro-item-icon-contact {
   background-image: url(../img/contact.svg);
   background-size: 15px;
}
.metro-item-icon-dxcontact {
   background-image: url(../img/table.svg);
   background-size: 18px;
}
.metro-item-icon-contacts {
   background-image: url(../img/contact.svg);
   background-size: 15px;
}
.metro-item-icon-telephony {
   background-image: url(../img/phone.svg);
   background-size: 18px;
}
.metro-item-icon-billing {
   background-image: url(../img/billing.svg);
   background-size: 18px;
}
.metro-item-icon-simpletask {
   background-image: url(../img/task.svg);
   background-size: 18px;
}
.metro-item-icon-forms {
   background-image: url(../img/link.svg);
   background-size: 15px;
}
.metro-item-icon-settings {
   background-image: url(../img/settings.svg);
   background-size: 15px;
}
.metro-item-icon-electric {
   background-image: url(../img/electric.svg);
   background-size: 20px;
}
.metro-item-icon-tasks {
   background-image: url(../img/assignment.svg);
   background-size: 16px;
}
.metro-item-icon-deal {
   background-image: url(../img/deal.svg);
   background-size: 16px;
}
.metro-item-icon-scheduler {
   background-image: url(../img/calendar.svg);
   background-size: 16px;
}
.metro-item-icon-gtasks {
   background-image: url(../img/table.svg);
   background-size: 16px;
}
.metro-item-icon-warehouse {
   background-image: url(../img/warehouse.svg);
   background-size: 18px;
}
.metro-item-icon-accounts {
   background-image: url(../img/accounts.svg);
   background-size: 18px;
}
.metro-item-icon-car {
   background-image: url(../img/service.svg);
   background-size: 24px;
}
.metro-item-icon-bills {
   background-image: url(../img/bills.svg);
   background-size: 18px;
}
.metro-item-icon-events {
   background-image: url(../img/event.svg);
   background-size: 18px;
}
.metro-item-icon-message {
   background-image: url(../img/notify.svg);
   background-size: 22px;
}

/* Плитка посилань (метро-меню) */
#main-window {
   display: flex;
   align-content: flex-start;
   justify-content: space-between;
   flex-wrap: wrap;
   flex-direction: row;
   position: relative;
   height: 100%;
   width: 96%;
   margin: 0 auto;
}
.main-pad-link {
   display: inline-block;
   position: relative;
   margin: 8px;
}
.main-pad-item {
   display: inline-flex;
   align-items: center;
   flex-direction: row;
   justify-content: space-between;
   position: relative;
   padding: 24px;
   background-color: #fff;
   border-radius: 96px;
   text-align: center;
   box-shadow: 0 0 1px 0 #bbb;
   transition: all 160ms ease-out;
}
.main-pad-item:hover { opacity: 0.8 }
.main-pad-icon {
   margin-right: 8px;
   font-size: 24px;
}

/* Панель фільтрів пошуку */
.search-filter {
   width: 96%;
   height: 34px;
   margin: 0 auto;
}
.search-global-filter-button:first-child,
.tasks-date-presets-filter-button:first-child,
.gtasks-date-presets-filter-button:first-child,
.search-filter button:first-child,
.search-filter div:first-child {
   border-top-left-radius: 6px;
   border-bottom-left-radius: 6px;
}
.search-global-filter-button:last-child,
.tasks-date-presets-filter-button:last-child,
.gtasks-date-presets-filter-button:last-child,
.search-filter button:last-child,
.search-filter div:last-child {
   border-top-right-radius: 6px;
   border-bottom-right-radius: 6px;
}
.search-filter-button {
   width: 33%;
   background-color: #fff;
   border: 2px solid #4482cf;
   padding: 4px 24px;
   cursor: pointer;
   float: left;
}
.search-filter-button:not(:last-child),
.search-global-filter-button:not(:last-child),
.tasks-date-presets-filter-button:not(:last-child),
.gtasks-date-presets-filter-button:not(:last-child) { border-right: none }
.search-filter:after {
   content: '';
   clear: both;
   display: table;
}
.search-filtr-button:hover { border-color: #0065df }
.search-device-filter-button {
   height: 28px;
   width: 25%;
   line-height: 24px;
   background-color: #fff;
   border: 2px solid #4482cf;
   padding: 0 24px;
   cursor: pointer;
   float: left;
}
.search-device-filter-button:not(:last-child) { border-right: none }
.search-filter-select,
.search-global-filter-button-select { background-color: #b3e5fc !important }
.search-global-filter-button {
   background-color: #fff;
   border: 2px solid #4482cf;
   line-height: 26px;
   padding: 0 16px;
   cursor: pointer;
   width: 16%;
}

/* Поле пошуку */
.search-wrapper {
   position: relative;
   width: 96%;
   margin: 0 auto;
   margin-top: 2px;
   margin-bottom: 8px;
}
.search-input {
   display: inline-block;
   width: 100%;
   height: 31px;
   border: 2px solid #ddd;
   background-color: #ecf9ff;
   border-radius: 6px;
   padding: 4px;
   font-size: 12pt;
}
.search-result-box {
   position: absolute;
   width: 100%;
   max-height: 280px;
   padding: 0;
   margin: 0 auto;
   background-color: #fff;
   box-shadow: 0 4px 12px 0 #888;
   margin-top: 2px;
   overflow: hidden;
   overflow-y: auto;
   z-index: 9980;
}
.search-result-list {
   display: none;
   min-width: 100%;
   background-color: #fff;
}
.search-result-box tr { border-top: 1px solid #ddd }
.search-result-box tr:first-child { border-top: none }
.search-result-box td { font-size: 9pt }
.device-search-id { border: none }
.device-search-item {
   border-bottom: 2px solid #03a9f4;
   cursor: pointer;
}
.device-search-item:hover { background-color: #b2ebf2 }
.device-search-cell {
   height: 16px;
   line-height: 16px;
}
.highlight-matches { background-color: #ffeb3b }
.control-search-result {
   display: none;
   position: absolute;
   top: 41px;
   width: 100% ;
   max-height: 200px;
   padding: 6px;
   margin: 0 auto;
   background-color: #fff;
   box-shadow: 0 4px 12px 0 #888;
   border-radius: 4px;
   font-size: 10pt;
   overflow: hidden;
   overflow-y: auto;
   z-index: 9980;
}
#devices-list { height: calc(100% - 74px) }
/* Картка окремого пристрою */
.device-item,
.contact-item {
   background-color: #fff;
   margin-bottom: 6px;
   border-radius: 4px;
   overflow: hidden;
}
.device-item-top,
.contact-item-top {
   position: relative;
   display: flex;
   justify-content: flex-start;
   flex-direction: row;
   align-items: center;
   width: 100%;
   height: 34px;
   line-height: 32px;
   overflow: hidden;
}
.device-item-top-part { display: inline-block }
.device-status-icon {
   width: 18px;
   height: 18px;
   border: 1px solid #1e90ff;
   border-radius: 18px;
   margin-left: 8px;
   margin-right: 4px;
   font-family: 'Roboto-Regular';
   font-size: 6pt;
   text-align: center;
   line-height: 16px;
}
.device-title {
   width: calc(100% - 100px);
   padding-left: 4px;
   padding-right: 8px;
   font-weight: bold;
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
}
.device-item-fold,
.device-equipment-fold,
.device-actions-fold {
   float: right;
   text-align: center;
   line-height: 32px;
   margin-left: auto;
   cursor: pointer;
   height: 32px;
   width: 32px;
}
.device-item-fold:after,
.device-equipment-fold:after,
.device-actions-fold:after {
   content: '•••';
}
.device-item-fold { text-align: left }
.device-item-exinfo {
   display: none;
   width: 96%;
   margin: 0 auto;
   border-top: 1px solid #ddd;
   overflow: hidden;
}
.exinfo-table tr { border-bottom: 1px solid #b3e5fc }
.exinfo-table td {
   padding-top: 4px;
   padding-bottom: 4px;
}
.exinfo-label { min-width: 120px }
.exinfo-value {
   min-width: 0;
   overflow: hidden;
}
.exinfo-button {
   display: inline-flex;
   padding: 0 !important;
}
.exinfo-input {
   width: 100%;
   border: none;
   font: 12pt 'PT Sans';
}
.exinfo-edit-car {
   width: 28px;
   height: 28px;
   background-repeat: no-repeat;
   background-position: center right 8px;
   background-size: 14px;
   background-image: url('../img/pencil.svg');
   cursor: pointer;
}
.device-receive-data-to { color: #ff5722 }
.exinfo-additional-top {
   display: flex;
   flex-direction: row;
   justify-content: flex-start;
   flex-wrap: nowrap;
   width: 100%;
   height: 20px;
}
.exinfo-additional-title {
   display: inline-flex;
   flex-direction: row;
   height: 20px;
   line-height: 20px;
   width: calc(100% - 24px);
}
.exinfo-additional-add {
   height: 20px;
   width: 20px;
   margin-left: 8px;
   border-radius: 50%;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 16px;
   background-image: url('../img/plus.svg');
   cursor: pointer;
}
/*.exinfo-additional-fold {
   display: inline-flex;
   align-self: self-end;
   text-align: center;
   line-height: 20px;
   height: 20px;
   width: 24px;
   cursor: pointer;
}
.exinfo-additional-fold:after {
    content: '•••';
}*/
.exinfo-additional-content {
   display: none;
   font-size: 10pt;
   padding: 4px;
}
.exinfo-additional-table td { border: 1px solid #cfd8dc }
.exinfo-additional-th {
   background-color: #e1f5fe;
   color: #888;
}
.exinfo-additional-actions-td {
   width: 54px;
   max-width: 54px;
}
.exinfo-additional-actions-block {
   display: flex;
   flex-direction: row;
   height: 20px;
}
.exinfo-additional-actions {
   display: inline-block;
   height: 20px;
   width: 20px;
   border-radius: 50%;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 14px;
   cursor: pointer;
}
.exinfo-account-info { margin-top: 16px }
.exinfo-account-label { display: inline-block }
.exinfo-additional-actions:not(:first-child) { margin-left: 4px }
.additional-phone-edit { background-image: url('../img/pencil.svg'); }
.additional-phone-del { background-image: url('../img/trash.svg'); }
.exinfo-account-availability {
   display: inline-block;
   margin-left: 8px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 14px;
   height: 20px;
   width: 20px;
}
.exinfo-account-availability-check { background-image: url('../img/check-black.svg'); }
.exinfo-account-panel { margin-top: 10px }
/* Додаткове обладнання пристрою (табличка) */
.device-equipment {
   margin-top: 8px;
   margin-bottom: 8px;
}
.device-equipment-top,
.device-actions-top {
   position: relative;
   width: 100%;
   height: 28px;
   line-height: 28px;
}
.device-equipment-title,
.device-actions-title {
   display: inline-block;
   padding-left: 2px;
   float: left;
}
.device-equipment-exinfo,
.device-actions-buttons {
   display: none;
   width: 100%;
   overflow: hidden;
}
.device-equipment-table {
   border: 1px solid #ccc;
}
.device-equipment-table td {
   font-size: 14px;
   background-color: #eaeaff;
   border: 1px solid #ccc; /*#2196f3*/
   padding: 4px 8px;
}
.device-equipment-table-head td {
   background-color: #f6f6f7;
}
.device-actions-panel {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: flex-start;
   margin-top: 14px;
   height: 30px;
}
.device-actions-item:not(:first-child) { margin-left: 8px }
.device-turn-on-day {
   display: inline-block;
   height: 28px;
   width: 28px;
   border-radius: 50%;
   background-image: url('../img/lamp.svg');
   background-repeat: no-repeat;
   background-position: center;
   background-size: 24px;
   cursor: pointer;
}
.device-action-button,
.device-deal-button,
.device-task-button {
   display: inline-block;
   border-radius: 32px;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;

   background-repeat: no-repeat;
   background-size: 24px;
}
.device-deal-button { margin-left: 2px }
.device-action-button {
   float: left;
   margin-left: 16px;
   margin-right: 16px;
   background-image: url('../img/gear.svg');
   background-position: center;
}
.device-action-button:active,
.device-task-button:active {
   opacity: 0.7;
}
.device-action-row {
   width: 100%;;
   padding: 0;
   margin-bottom: 12px;
}
.device-actions {
   display: none;
   position: fixed;

   top: 50%;
   -webkit-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
   transform: translateY(-50%);

   left: 2%;
   width: 96%;
   padding: 8px;
   padding-bottom: 16px;
   border-radius: 4px;
   box-shadow: 0 0 14px 1px #888;
   background-color: #fff;
   z-index: 9950;
}
.device-actions-top {
   width: 100%;
   height: 32px;
   line-height: 32px;
   border-bottom: 1px solid #ddd;
   margin-bottom: 16px;
   font-weight: bold;
}
.device-actions-top span { margin-left: 8px }
.device-actions-close {
   position: absolute;
   display: block;
   top: 0;
   right: 4px;
   width: 26px;
   height: 26px;
   border-radius: 50%;
   cursor: pointer;
   background-image: url('../img/cross.png');
   background-repeat: no-repeat;
   background-position: center;
   background-size: 10px;
}
.device-actions-close:hover { background-color: #ccc }
.actions-button {
   display: inline-block;
   padding: 4px 16px;
   width: 48%;
   color:  #fff;
   background-color: #0046aa;
   font-size: 10pt;
   text-align: center;
   border-radius: 6px;
   margin-left: 1%;
   margin-right: 1%;
   cursor: pointer;
}
.actions-button:active { background-color: #035ee1 }
.device-item-no-discount { background-color: #fff176 }
.device-item-no-tariff { background-color: #7fffef }
.device-status-label-nodiscount,
.device-status-label-notariff {
   display: inline-block;
   line-height: 18px;
   border-radius: 8px;
   padding: 0 8px;
   padding-right: 24px;
   height: 20px;
   color: #e53935;

   background-image: url('../img/warning-red.svg');
   background-repeat: no-repeat;
   background-position: center right 4px;
   background-size: 16px;
}
.device-status-label-nodiscount {
   background-color: #fff176;
   margin-left: 2px;
   cursor: pointer;
}
.device-status-label-nodiscount:hover {
   background-color: #fff6a9;
   outline: 2px solid #ffb4b4;
}
.device-status-label-notariff { background-color: #5bffeb; }
/* Кнопки-посилання на сторінки */
.device-links {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   width: 100%;
   height: 24px;
   line-height: 24px;
   margin: 16px auto;
   margin-top: 24px;
   margin-bottom: 32px;
}
.link {
   display: inline-block;
   color: #0065df;
   cursor: pointer;
   width: 28%;
   height: 24px;
   line-height: 24px;
   text-align: center;
   float: left;
}
.edit-device-popup { position: fixed !important }
.device-geolocation-link {
   display: inline-block;
   margin-left: auto;
   height: 24px;
   width: 24px;
}
.device-geolocation {
   display: inline-block;
   border-radius: 32px;
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   font-size: 20px;
   height: 24px;
   width: 24px;
}
.device-hidden { display: none }

/* Сторінка Історія */
#history-search {
   margin-top: 0;
}
#history-list {
   height: calc(100% - 40px);
}
.history-item {
   border-bottom: 3px solid #03a9f4;
   margin-bottom: 8px;
}
.history-cell {
   border-left: 1px solid #ddd;
   font-size: 9pt;
   padding: 4px;
}
.history-cell:first-child {
   border-left: none;
}
.history-date {
   background-color: #fff176;
}
.history-head {
   background-color: #bbd5fb;
   font-size: 8pt;
   font-weight: normal;
}
.history-item tr {
   border-top: 1px solid #ddd;
}
.history-item tr:first-child {
   border-top: none;
}

/* Сторінка Контакти */
.contact-search-wrapper {
   position: relative;
   width: calc(100% - 42px);
}
#contact-search-input {
   border-radius: 0 6px 6px 0;
   margin-left: 1px;
}
#contact-filter-block {
   flex-direction: row;
   align-items: center;
   height: 32px;
   width: 96%;
   margin: 0 auto;
   background-color: #fff;
   border-radius: 4px;
   margin-bottom: 8px;
}
#contact-list {
   height: calc(100% - 74px);
}
.contact-non-contact { background-color: #e0f7fa; }
.contact-non-account { background-color: #fff59d; }
.contact-no-name { background-color: #ff877e; color: #000 }
.contact-exinfo-table td {
   padding-top: 4px;
   padding-bottom: 4px;
}
.contact-actions {
   width: 100%;
   margin-top: 16px;
   margin-bottom: 16px;
}
.contact-updade-button {
   display: inline-block;
   padding: 8px 16px;
   width: 48%;
   color:  #fff;
   background-color: #0046aa;
   font-weight: bold;
   font-size: 10pt;
   text-align: center;
   border-radius: 6px;
   margin-left: 1%;
   margin-right: 1%;
   cursor: pointer;
}
.contact-update {
   display: inline-block;
   width: 28px;
   height: 28px;
   border-radius: 50%;
   text-align: center;
   line-height: 28px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 14px;
   background-image: url('../img/pencil.svg');
   cursor: pointer;
}
.contact-title {
   display: inline-flex;
   width: calc(100% - 128px);
   padding-left: 8px;
   padding-right: 8px;
   font-weight: bold;
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
}
.contact-title-cell {
   padding: 0 8px 0 0;
}
.contact-title-name {
   width: 40%;
   min-width: 150px;
   max-width: 40%;
}
.contact-title-phone {
   width: 128px;
}
.contact-title-position {
   width: 100%;
}
.contact-item-fold {
   text-align: center;
   line-height: 32px;
   margin-left: auto;
   font-size: 26px;
   cursor: pointer;
   height: 32px;
   width: 32px;
}
.contact-create-client {
   display: inline-block;
   width: 28px;
   height: 18px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 22px;
   background-image: url(../img/company.svg);
   cursor: pointer;
}
.contact-item-table {
   table-layout: fixed;
   word-break: break-word;
}
.contact-item-table tr:last-child {
   border-bottom: none;
}
.is-account,
.not-account {
   width: 100%;
   height: 22px;
   background-repeat: no-repeat;
   background-position: left center;
   background-size: 16px;
}
.is-account {
   background-image: url('../img/checked-checkbox.png');
}
.not-account {
   background-image: url('../img/unchecked-checkbox.png');
}
.contact-external-call {
   border-radius: 40px;
   margin-left: auto;
   line-height: 24px;
   min-height: 24px;
   min-width: 36px;
   cursor: pointer;
   font-size: 24px;
   color: #0262da;
   height: 24px;
   width: 36px;
}
.contact-geolocation-link {
   display: inline-block;
   width: 28px;
   height: 18px;
   float: right;
}
.contact-base-region {
   display: inline-block;
   width: 28px;
   height: 22px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px;
   background-image: url(../img/geolocation.svg);
   cursor: pointer;
}
.contact-bottom-panel {
   display: flex;
   flex-direction: row;
   margin-top: 8px;
   width: 100%;
   height: 32px;
}
.contact-bottom-button {
   display: inline-block;
   border-radius: 50%;
   height: 32px;
}
.contact-bottom-button:active {
   background-color: #bbdefb;
}
.contact-delete-button {
   width: 32px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px;
   background-image: url(../img/trash.svg);
   cursor: pointer;
}
.contact-menu-container {
   float: right;
   margin-left: auto;
}
.contact-link-to-company {
   display: inline-block;
   float: right;
   width: 40px;
   height: 20px;
   line-height: 20px;
   font-size: 26px;
   text-align: center;
   border-radius: 20px;
   cursor: pointer;
}

/* Карточка контату */
.contact-card {
   background-color: #fff;
   border-radius: 6px;
   margin-bottom: 6px;
   max-width: 940px;
   overflow: hidden;
   width: 100%;
}
.contact-card-top {
   position: relative;
   border-top-right-radius: 6px;
   border-top-left-radius: 6px;
   background-color: #fff;
   line-height: 32px;
   overflow: hidden;
   height: 33px;
   width: 100%;
}
.contact-menu-container { margin-right: 8px }
.contact-item-exinfo {
   display: none;
   border-top: 1px solid #ddd;
   margin-bottom: 8px;
   overflow: hidden;
}
.contact-main-info {
   position: relative;
   overflow: hidden;
   width: 100%;
}
.contact-car-row { background-color: #cfd8dc }
.contact-is-office-access-container,
.contact-is-edit-device-name-container,
.contact-is-not-approved-fuel-spend-container,
.contact-allow-panel { margin-top: 14px }
.contact-open-chat-button {
   margin-right: 2px;
   color: #ab47bc;
}
.contact-grid-type {
   background-color: #cdcdcd;
   border-radius: 40px;
   width: fit-content;
   line-height: 20px;
   min-height: 20px;
   font-size: 12px;
   padding: 0 12px;
   height: 20px;
   color: #111;
}
.contact-is-task-icon {
   margin-right: 4px;
   font-size: 14px;
   color: #ff79a7;
}
.contact-is-task { color: #4caf50 }
.contact-is-admin { color: #e91e63 }


.exinfo-label {
   max-width: 136px;
   min-width: 120px;
   width: 136px;
}
.exinfo-value {
   word-break: break-word;
   overflow: hidden;
   min-width: 0;
}
.exinfo-additional {
   position: relative;
   overflow: hidden;
   margin: 4px 0;
   width: 100%;
}
.exinfo-additional-top {
   justify-content: flex-start;
   flex-wrap: nowrap;
   height: 24px;
   width: 100%;
}
.exinfo-additional-title {
   display: inline-flex;
   flex-direction: row;
   width: calc(100% - 24px);
   line-height: 20px;
   height: 20px;
}
.exinfo-additional-add {
   border-radius: 50%;
   margin-left: 8px;
   min-height: 20px;
   min-width: 20px;
   cursor: pointer;
   height: 20px;
   width: 20px;
}
.exinfo-additional-fold {
   border-radius: 32px;
   line-height: 20px;
   min-height: 20px;
   min-width: 20px;
   cursor: pointer;
   height: 20px;
   width: 20px;
}
.exinfo-additional-content {
   display: none;
   overflow-x: auto;
   font-size: 14px;
   padding: 4px;
   width: 100%;
}
.exinfo-additional-phone {
   max-width: 140px;
   width: 140px;
}
.exinfo-account-container {
   background-color: #eee;
   border-radius: 6px;
   padding: 8px;
}
.exinfo-additional-table td { border: 1px solid #888 }
.exinfo-additional-th {
   background-color: #fff;
   color: #888;
}
.exinfo-additional-actions-td {
   width: 80px;
   max-width: 80px;
}
.exinfo-additional-actions-block {
   display: flex;
   flex-direction: row;
   height: 20px;
}
.exinfo-additional-actions {
   display: inline-block;
   border-radius: 32px;
   line-height: 20px;
   min-height: 20px;
   min-width: 20px;
   cursor: pointer;
   height: 20px;
   width: 20px;
}
.exinfo-additional-actions:not(:first-child) { margin-left: 18px }
.exinfo-account-info {
   margin-top: 16px;
   padding: 0 8px;
}
.exinfo-account-availability {
   display: inline-block;
   line-height: 20px;
   margin-left: 8px;
   min-height: 20px;
   min-width: 20px;
   font-size: 16px;
   color: #0262da;
   height: 20px;
   width: 20px;
}
.exinfo-account-availability-check { background-image: url('../img/check-black.svg'); }
.exinfo-account-blocked-background { background-color: #ffce86 }
.exinfo-account-blocked {
   font-weight: bold;
   font-size: 14px;
   color: #f44336;
}



#dxcontact .dx-command-select {
   width: 40px;
   min-width: 40px;
}
#dxcontact td {
   border-color: #bbb;
}

.task-company-input-container,
#tasks-company-filter-container,
#scheduler-company-filter-container,
#company-input-container,
#subcompany-input-container,
#subdevice-brandmodel-container,
#device-brandmodel-container,
#simpletask-input-container {
   display: block;
   width: 100%;
   height: 32px;
   border: 2px solid #ddd !important;
   background-color: #ecf9ff !important;
   border-radius: 6px !important;
   font-family: 'PT Sans';
   font-size: 10pt;
}
.task-company-input-container .dx-dropdowneditor-icon,
#tasks-company-filter-container .dx-dropdowneditor-icon,
#scheduler-company-filter-container .dx-dropdowneditor-icon,
#company-input-container .dx-dropdowneditor-icon,
#subcompany-input-container .dx-dropdowneditor-icon,
#subdevice-brandmodel-container .dx-dropdowneditor-icon,
#device-brandmodel-container .dx-dropdowneditor-icon,
#simpletask-input-container .dx-dropdowneditor-icon {
   background-color: inherit !important;
}

/* Сторінка Компанія ??? ????*/
/*#company-list {
   height: calc(100% - 40px);
   font-size: 14px;
}*/
.contact-form-label {
   margin-top: 12px;
   margin-bottom: 2px;
}
.contact-form-vblock {
   display: flex;
   flex-direction: row;
   margin: 8px 0;
}
.contact-form-input {
   display: block;
   width: 100%;
   height: 32px;
   border: 2px solid #ddd;
   background-color: #ecf9ff;
   border-radius: 6px;
   padding: 4px;
   padding-right: 30px;
   font-size: 10pt;
}
.contact-form-textarea {
   display: block;
   width: 100%;
   min-height: 32px;
   border: 2px solid #ddd;
   background-color: #ecf9ff;
   border-radius: 6px;
   padding: 4px;
   font-size: 10pt;
}
.contact-form-button {
   margin-top: 32px;
   width: 100%;
   text-align: center;
}
#company-is-test {
   margin-left: auto;
}
#contact-form textarea,
#subcontact-form textarea,
#task-form textarea,
.popup-textarea {
   resize: vertical;
   min-height: 32px;
   height: 60px;
}
#task-text {
   height: 80px;
   overflow-y: auto;
}
/* Нова версія контактів */
.contact-add-one-form {
   position: relative;
   overflow: hidden;
   overflow-y: auto;
   padding: 0 4px;
   height: 100%;
}
.contact-form-top-panel {
   background-color: #d3e3fd;
   border-radius: 4px;
   height: 40px;

   position: sticky;
   z-index: 15;
   top: 0;
}
.contact-group-container {
   margin-top: 16px;
}
.contact-account-opts-block {
   background-color: #eee;
   border-radius: 6px;
   padding: 8px;
}
.contact-account-devices-container,
.contact-account-reports-container {
   border: 1px solid #ddd;
   border-radius: 4px;
   overflow-y: auto;
   margin-top: 8px;
   height: 200px;
}
.contact-account-device-checkbox {
   margin: 6px;
}
.contact-description {
   padding: 8px;
   height: 50px;
}
.del-contact-info {
   background-color: #ecf9ff;
   border-radius: 6px;
   color: #478c8e;
   padding: 8px;
   width: 100%;
}
.del-contact-info-icon {
   margin-right: 8px;
   color: orange;
}
.contact-copy-value-container {
   display: inline-flex;
   margin-left: 8px;
}
.contact-account-blocked { background-color: #f44336 }

#company {
   position: relative;
   overflow-y: auto;
}
.company-top-block {
   display: flex;
   width: 96%;
   margin: 0 auto;
   margin-bottom: 8px;
}
.create-button {
   display: inline-block;
   width: 42px;
   height: 31px;
   line-height: 28px;
   border: 2px solid #d9d9d9;
   border-radius: 6px 0 0 6px;
   background-color: #0262da; /* #388e3c; */
   color: #bddaff; /* #24de00; */
   font-size: 20px;
   cursor: pointer;
}
.create-button:active {
   background-color: #176edc;
   color: #89bdff;
}
#company-search-input {
   border-radius: 0 6px 6px 0;
   margin-left: 1px;
}
#company-search {
   margin-top: 0;
}
.company-search-wrapper {
   position: relative;
   display: inline-block;
   width: 100%;
}
.company-card {
   background-color: #fff;
   margin-bottom: 6px;
   border-radius: 4px;
   overflow: hidden;
}
.company-status-icon {
   width: 20px;
   height: 20px;
   margin-left: 8px;
   margin-right: 4px;
}
.company-ok,
.company-old,
.company-test,
.company-paid,
.company-disable,
.company-all-devices-on-pause,
.company-disable-by-reason {
   background-repeat: no-repeat;
   background-position: center;
   background-size: 16px;
}
.company-ok {
   background-image: url(../img/ok-green.png);
}
.company-top-ok {
   background-color: #d5ffc4;
}
.company-test {
   background-image: url(../img/test-tube.png);
}
.company-top-test {
   background-color: #fff9c7;
}
.company-paid {
   background-image: url(../img/ok-green.png);
}
.company-disable {
   background-image: url(../img/stop.png);
}
.company-top-disable {
   background-color: #ffdbcc;
}
.company-top-all-devices-on-pause {
   background-color: #ffff00;
}
.company-old {
   background-image: url(../img/daemon.svg);
}
.company-all-devices-on-pause {
   background-image: url(../img/pause-circle.svg);
   background-size: 20px;
}
.company-disable-by-reason {
   background-image: url(../img/stop.svg);
   background-size: 20px;
}
.company-top-old {
   background-color: #7fffd4;
}
.company-top-disable-by-reason {
   background-color: #ff9d7e;
}
.company-devices {
   background-color: #d7ffd9;
}
.company-debt {
   background-color: #ffcfdf;
}
.company-debt-missing {
   color: #888;
}
.company-balance-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   width: 100%;
}
.company-balance-diff-container {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   margin-left: 8px;
   height: 20px;
}
.company-go-to-erp-accounting {
   display: inline-block;
   margin-left: auto;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px;
   background-image: url('../img/erp-accounting.png');
   cursor: pointer;
   height: 20px;
   width: 40px;
}
.company-binding-code {
   display: inline-block;
   line-height: 20px;
   height: 20px;
   padding: 0 16px;
   border-radius: 24px;
   background-color: #f3e5f5;
   cursor: pointer;
}
.cmp-num-dev {
   position: relative;
   height: 20px;
   line-height: 28px;
   overflow: hidden;
}
.company-number-of-devices {
   display: inline-block;
   float: left;
   height: 20px;
   line-height: 20px;
}
.company-link-to-devices {
   display: inline-block;
   float: right;
   width: 40px;
   height: 20px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 28px;
   background-image: url('../img/auto.svg');
   cursor: pointer;
}
.company-summary-tariff-item {
   border-radius: 8px;
   cursor: pointer;
   padding: 0 4px;
   color: #888;
}
.company-summary-tariff-item:hover { background-color: #bbdefb }
.company-summary-tariff-nonzero { font-weight: bold; color: #333 }
.company-edit-discount {
   display: inline-block;
   float: right;
   width: 40px;
   height: 20px;
   background-repeat: no-repeat;
   background-position: center;
   background-image: url('../img/pencil.svg');
   background-size: 14px;
   cursor: pointer;
}
.company-go-to-billing {
   display: inline-block;
   line-height: 20px;
   float: right;
   width: 40px;
   height: 20px;
   cursor: pointer;
}

/* Нова версія сторінки Компанія */
#company .search-result-box {
   left: -38px;
   width: calc(100% + 38px);
}
.client-top-panel {
   display: flex;
   flex-wrap: wrap;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   width: 100%;
   min-height: 40px;
   border-bottom: 1px solid #eee;
}
.client-top-button-block { display: inline-flex }
.company-title { width: calc(100% - 96px) }
.client-top-panel-button {
   display: inline-block;
   border: 2px solid #4482cf;
   border-radius: 24px;
   box-sizing: content-box;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 24px;
   overflow: hidden;
   cursor: pointer;
   height: 24px;
   width: 24px;
}
.client-top-panel-button:hover { background-color: #b3e5fc }
.client-top-panel-button:not(:last-child) { margin-right: 8px }
.subdevices-button { background-image: url(../img/devices.svg); }
.subcontact-button {
   background-size: 16px;
   background-image: url(../img/contact.svg);
}
.subdeal-button {
   background-size: 16px;
   background-image: url(../img/deal.svg);
}
.company-invoice-link {
   background-size: 20px;
   background-image: url(../img/credit-card.svg);
}
.client-switch-info-block {
   background-position: center;
   background-image: url(../img/next-right.svg);
   background-size: 16px;
   padding: 0;
   width: 24px;
}
.company-info-block { display: none }
.visible-block { display: block }
.switch-active {
   color: #fff;
   background-color: #64b5f6;
   background-image: url(../img/prev-left.svg);
}
.company-bottom-panel {
   margin-top: 4px;
   border-top: 1px solid #ddd;
   padding-top: 8px;
}
.company-exinfo { padding: 0 8px }
.company-exinfo-label {
   color: #777;
   font-size: 12px;
   min-width: 90px;
   width: 90px;
}
.company-exinfo-requisites-label {
   width: 194px !important;
}
.company-buttons-panel {
   display: flex;
   margin-top: 16px;
   width: 100%;
}
.company-second-buttons-block {
   padding: 0 4px;
}
.company-button {
   display: inline-block;
   padding: 0 24px;
   line-height: 20px;
   border-radius: 24px;
   border: 2px solid #4482cf;
   font-size: 14px;
   cursor: pointer;
   height: 24px;
}
.company-button:active {
   border-color: #4482cf;
   background-color: #b3e5fc;
}
.client-billing-indicator {
   border: 1px solid #ccc;
   border-radius: 32px;
   margin-right: 8px;
   min-height: 16px;
   min-width: 16px;
   height: 16px;
   width: 16px;
}
.client-billing-changed {
   margin-left: 8px;
}
.client-billing-block {
   background-color: #f1f8e9;
}
.client-reason-disable-chips {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   background-color: #ff5722;
   border-radius: 32px;
   min-height: 20px;
   height: 20px;
}
.client-reason-disable-icon {
   border-radius: 32px;
   line-height: 20px;
   min-height: 20px;
   margin-right: 2px;
   font-size: 14px;
   min-width: 20px;
   height: 20px;
   width: 20px;
   color: #fff;
}
.client-reason-disable-name {
   line-height: 20px;
   font-size: 16px;
   padding: 0 0 0 8px;
   height: 20px;
   color: #fff;
}
.company-exinfo-value-container,
.company-exinfo-button-container {
   display: flex;
   flex-direction: row;
   align-items: center;
}
.company-exinfo-button-container {
   padding-right: 8px;
   margin-left: auto;
}
.client-exinfo-group-button {
   border-radius: 32px;
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   cursor: pointer;
   height: 24px;
   width: 24px;
}
.client-exinfo-group-button:not(:first-child) {
   margin-left: 8px;
}
.client-exinfo-button {
   border-radius: 32px;
   line-height: 24px;
   margin-left: auto;
   min-height: 24px;
   min-width: 40px;
   cursor: pointer;
   height: 24px;
   width: 40px;
}
.client-not-disable-before-button { color: green }
.client-turn-on-button { color: #8abd00 }
.client-form-calendar-container {
   margin: 0 auto;
   height: 314px;
   width: 248px;
}
.client-form-calendar-container .air-datepicker { border: none }
.client-form-calendar-container .air-datepicker--content { height: 220px }
.air-datepicker-cell.-focus-,
.air-datepicker-cell.-selected- {
   border-radius: 42px !important;
}
.client-form-date-to-preset-container { margin-top: 8px }
.company-segment-chips {
   display: inline-flex;
   flex-direction: row;
   align-items: baseline;
   background-color: #cdf9ff;
   border-radius: 32px;
   margin-right: 4px;
   line-height: 20px;
   font-size: 14px;
   padding: 0 8px;
   height: 20px;
}
.company-sub-client-block {
   display: none;
}
.company-sub-client-a {
   display: inline-block;
   margin: 2px 0;
   overflow: hidden;
}
.company-sub-client-chips {
   display: inline-flex;
   flex-direction: row;
   align-items: baseline;
   font-family: 'Roboto-Regular';
   background-color: #cfd8dc;
   border-radius: 32px;
   margin-right: 4px;
   line-height: 24px;
   font-size: 14px;
   padding: 0 8px;
   height: 24px;
   color: #555;
}
.company-sub-client-chips:hover {
   background-color: #dedede;
   color: #1976d2;
}
.client-no-parent {
   position: relative;
   background-color: #ffe082;
}
.client-no-parent:after {
   content: '';
   position: absolute;
   background-color: #ff5722;
   border-radius: 24px;
   height: 8px;
   width: 8px;
   right: 0;
   top: 0;
}
.company-parent-client-a {
   display: inline-block;
   margin-left: auto;
}
.company-parent-client-button {
   border-radius: 40px;
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   height: 24px;
   width: 24px;
}
.edit-company-info {
   overflow: hidden;
   height: 100%;
}
.edit-company-container {
   position: relative;
   height: calc(100% - 88px);
   padding: 0 4px;
   overflow: hidden;
   overflow-y: auto;
   margin-top: 6px;
}
/* TODO: Винести це нагору */
.form-item {
   width: 100%;
   border: 2px solid #ddd;
   background-color: #ecf9ff;
   border-radius: 6px;
   padding: 4px;
   font-size: 10pt;
}
.form-item-input {}
.form-item-textarea {
   height: 86px;
   resize: none;
}
.company-potential-textarea { height: 28px; }
.company-description-textarea {
   padding: 4px 8px;
   height: 86px;
}
.company-submodule-top-block {
   display: flex;
}
.company-submodule-top-panel {
   display: flex;
   align-items: center;
   flex-direction: row;
   justify-content: space-between;
   width: 100%;
   height: 32px;
   background-color: #ffffff;
   border-radius: 0 4px 4px 0;
   margin-bottom: 6px;
   margin-left: 2px;
   overflow: hidden;
}
.company-submodule-deal-top-panel {
   display: flex;
   align-items: center;
   flex-direction: row;
   justify-content: space-between;
   flex-wrap: nowrap;
   background-color: #ffffff;
   border-radius: 4px;
   margin-bottom: 8px;
   height: 32px;
   width: 100%;
}
.company-submodule-top-panel-item { display: inline-flex }
.company-bottom-panel-cell {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   flex-wrap: wrap;
}
.company-submodule-close-button {
   display: inline-block;
   border-radius: 24px;
   margin-left: 8px;
   height: 24px;
   width: 24px;
   background-repeat: no-repeat;
   background-position: center;
   background-image: url(../img/prev-left.svg);
   background-size: 16px;
   cursor: pointer;
}
.company-submodule-handle-block {
   display: flex;
   flex-direction: row;
   align-items: center;
   background-color: #eee;
   min-height: 36px;
   height: 36px;
}
.client-additional-email-title,
.client-additional-email-table { font-size: 12px }
.client-additional-email-table td { padding: 4px }
.client-additional-email-email { min-width: 40% }
/* Пристрої в компанії */
#subdevices-list { height: calc(100% - 112px) }
#subdevices-filter-block {
   height: 32px;
   width: 100%;
   background-color: #fff;
   border-radius: 4px;
   margin-bottom: 6px;
}
#subcontact-buttons-block,
#subdevices-buttons-block,
#subdevices-search-container,
#subcontact-search-container {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   position: relative;
   height: 32px;
   width: 50%;
}
#subdevices-filter-block input,
#subcontact-search-container input {
   height: 32px;
   border: none;
   border-radius: 0;
   border-top-right-radius: 4px;
   border-bottom-right-radius: 4px;
   background-color: #ecf9ff;
   line-height: 32px;
}
.subdevice-status-filter-helper {
   display: block;
   background-repeat: no-repeat;
   background-position: center;
   background-image: url(../img/arrow-down.svg);
   background-size: 9px;
   cursor: pointer;
   height: 24px;
   width: 24px;
}
.subdevice-status-button {
   display: inline-flex;
   border: 2px solid #aaa;
   border-radius: 12px;
   text-align: center;
   line-height: 22px;
   font-family: 'Roboto-Regular';
   font-size: 8pt;
   padding: 0 2px;
   margin: 0 4px;
   height: 24px;
   width: 24px;
   cursor: pointer;
}
.subdevice-status-counter {
   display: inline-block;
   border-radius: 24px;
   text-align: center;
   width: 20px;
   height: auto;
}
.subdevice-status-label {
   display: none;
   margin: 0 4px;
   height: 24px;
}
.subdevice-status-active { background-color: #2196f3; color: #fff; }
.subdevice-status-pause { background-color: #ffa7a0; }
.subdevice-status-hidden { background-color: #aed581; }
.subdevice-status-logging { background-color: #ffeb3b; }
.subdevice-status-rouming { background-color: #ba68c8; color: #fff; }
.subdevice-status-azs { background-color: #bcaaa4; }
.subdevice-status-selected { border-color: #673ab7; }

#subdevices-environment-type-container { margin-left: 4px }
.subdevice-environment-type-button {
   border: 2px solid #333;
   border-radius: 32px;
   line-height: 22px;
   min-height: 24px;
   padding: 0 12px;
   font-size: 11px;
   height: 24px;
}
.subdevice-environment-type-button:not(:first-child) { margin-left: 4px }
.subdevice-environment-type-selected {
   background-color: #0262da;
   border-color: #0262da;
   color: #ecf9ff;
}
.subdeal-top-input {
   width: 100%;
   height: 26px;
   border: 1px solid #ddd;
   border-radius: 2px;
}
/* Історія */
#subdeal-scenario-panel {
   min-width: 186px;
   padding: 0 4px;
}
#subdeal-scenario-select {
   /* DEPRECATE !!! */
   margin-left: 4px;
   background-color: #ecf9ff;
}
#subdeal-search-panel {
   width: 100%;
}
.create-deal-button {
   display: inline-block;
   border-radius: 50%;
   text-align: center;
   line-height: 28px;
   margin-left: 6px;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
#subdeal-card-info-count {
   display: none;
}
.subdeal-period-buttons {
   position: relative;
   width: 28px;
   height: 28px;
   margin: 0 auto;
   border-radius: 50%;
   line-height: 28px;
   cursor: pointer;
}
.subdeal-period-buttons:hover {
   background-color: #eee;
}
.subdeal-period-buttons:active {
   background-color: #b3e5fc;
}
#tasks-date-panel { margin-left: auto }
#tasks-date-panel,
#subdeal-date-panel,
#gtasks-date-panel {
   align-items: center;
   flex-direction: row;
   min-width: 264px;
}
#tasks-date-panel .dx-editor-outlined,
#subdeal-date-panel .dx-editor-outlined,
#gtasks-date-panel .dx-editor-outlined {
   border: none !important;
}
.gear-preloader {
   display: none;
   position: fixed;
   top: 130px;
   left: calc(50% - 50px);
   width: 100px;
   height: 100px;
   background-image: url('../img/preloader-gear.svg');
   background-clip: content-box;
   background-repeat: no-repeat;
   background-position: center center;
   z-index: 999996;
}
#subtask-preloader,
#subdeal-preloader {
   left: calc(75% - 50px);
}
.subdeal-card {
   display: flex;
   position: relative;
   flex-direction: column;
   width: 100%;
   padding: 16px;
   padding-top: 8px;
   background-color: #ffffff;
   transition: all .5s;
   border-radius: 0;
   margin-bottom: 8px;
}
.subdeal-card-top {
   position: relative;
   display: flex;
   flex-direction: column;
   flex-wrap: nowrap;
   align-items: stretch;
   border-bottom: 1px solid #ccc;
   margin-bottom: 8px;
   width: 100%;
}
.subdeal-card-top-block {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
   height: 28px;
}
.subdeal-card-bottom-item {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   align-items: stretch;
   flex-wrap: nowrap;
}
.subdeal-card-bottom-cell {
   position: relative;
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   flex-wrap: nowrap;
   justify-content: space-between;
   line-height: 24px;
   height: 24px;
}
.subdeal-card-id-label,
.subdeal-card-id-value,
.subdeal-card-id-link {
   display: inline-block;
   line-height: 24px;
   height: 24px;
}
.subdeal-card-id-value {
   margin-left: 4px;
}
.subdeal-card-id-link {
   border-radius: 28px;
   background-color: #e8eaf6;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 13px;
   background-image: url(../img/link.svg);
   cursor: pointer;
   width: 24px;
}
.subdeal-card-id-link-container {
   margin-left: 32px;
   height: 24px;
}
.subdeal-card-subtask {
   background-color: #90caf9;
   border-radius: 24px;
   height: 24px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 17px;
   background-image: url(../img/subtask.svg);
}
.subdeal-card-mastertask {
   border-radius: 24px;
   height: 24px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 20px;
   background-image: url(../img/main.svg);
}
.subdeal-card-parentid-block {
   display: flex;
   flex-direction: row;
   border-radius: 24px;
   margin-bottom: 8px;
   text-align: center;
   line-height: 24px;
   height: 24px;
   width: 100%;
}
.subdeal-card-chain-button {
   display: inline-block;
   line-height: 20px;
   height: 24px;
   width: 124px;
   border: 2px solid #90caf9;
   border-radius: 24px;
   padding-left: 16px;
   text-align: center;
   cursor: pointer;

   background-repeat: no-repeat;
   background-position: left 8px center;
   background-size: 14px;
   background-image: url(../img/subtask.svg);
}
.subdeal-card-parentid-label {
   display: inline-block;
   line-height: 24px;
   padding: 0 16px;
   height: 24px;
   border-radius: 24px;
   background-color: #e3f2fd;
   margin-left: 16px;
   cursor: pointer;
}
/*.subdeal-card-notify-icon {
   position: absolute;
   display: inline-block;
   border-radius: 32px;
   text-align: center;
   line-height: 16px;
   min-height: 16px;
   min-width: 16px;
   font-size: 20px;
   color: #f44336;
   height: 16px;
   width: 16px;
   left: 2px;
   top: 6px;
}*/
.subdeal-card-back-to-tasks-button {
   position: sticky;
   top: 0;
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: flex-start;
   background-color: #b3e5fc;
   box-shadow: 0 1px 4px 0 #d9d9d9;
   padding: 0 8px;
   margin-bottom: 8px;
   width: 100%;
   height: 40px;
   z-index: 100;
   cursor: pointer;
}
.subdeal-card-back-to-tasks-button:active {
   background-color: #95deff;
}
.subdeal-card-back-to-tasks-icon {
   display: inline-flex;
   height: 28px;
   width: 28px;
   border-radius: 28px;
   margin-left: 10px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 17px;
   background-image: url(../img/return.svg);
}
.subdeal-card-back-to-tasks-label {
   display: inline-flex;
   align-self: center;
   margin-left: calc(50% - 132px);
   margin-right: auto;
   text-align: center;
   line-height: 40px;
   height: 40px;
}
.subdeal-filter-button-active {
   background-color: #ffd54f;
}
#subdeal-card-filter-popup {
   display: none;
   position: absolute;
   top: 64px;
   left: 0;
   width: 100%;
   padding: 8px;
   border-radius: 4px;
   background-color: #fff;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
   z-index: 100;
}
.subdeal-card-filter-popup-inner {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   align-items: center;
}
.subdeal-card-filter-popup-hblock {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   width: 100%;
}
.subdeal-card-filter-popup-hblock:not(:first-child) {
   margin-top: 8px;
}
.subdeal-card-filter-popup-item {
   position: relative;
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   height: 32px;
}
.subdeal-card-filter-popup-item-input {
   width: 100%;
   margin-right: 16px;
}
.subdeal-card-filter-popup-input {
   height: 26px;
   width: 100%;
   line-height: 26px;
   border: 1px solid #ccc;
   border-radius: 2px;
   padding: 0 8px;
}
#tasks-card-color-filter-red,
#subdeal-card-color-filter-red {
   background-color: #f44336;
   border: 2px solid #f44336;
}
#tasks-card-color-filter-yellow,
#subdeal-card-color-filter-yellow {
   background-color: #ffc107;
   border: 2px solid #ffc107;
}
#tasks-card-color-filter-green,
#subdeal-card-color-filter-green {
   background-color: #388e3c;
   border: 2px solid #388e3c;
}
.subdeal-card-color-filter-popup-button,
.subdeal-card-number-filter-popup-button {
   display: inline-block;
   width: 20px;
   height: 20px;
   line-height: 17px;
   text-align: center;
   border-radius: 50%;
   border: 2px solid #ccc;
   font-size: 8pt;
   font-family: "Roboto-Regular";
   cursor: pointer;
}
.subdeal-card-color-filter-popup-button:not(:first-child),
.subdeal-card-number-filter-popup-button:not(:first-child) {
   margin-left: 8px;
}
.subdeal-card-filter-popup-item-number { margin: 0 8px; }
.subdeal-card-filter-popup-close {
   display: block;
   width: 26px;
   height: 26px;
   border-radius: 50%;
   cursor: pointer;
   background-image: url('../img/up-chevron.svg');
   background-repeat: no-repeat;
   background-position: center;
   background-size: 16px;
}
.subdeal-scenario-color-filter-item-select,
.subdeal-scenario-number-filter-item-select {
   border: 2px solid #3d3d3d !important;
}
.subdeal-card-done-filter {
   display: inline-block;
   height: 20px;
   line-height: 17px;
   text-align: center;
   padding: 0 16px;
   border: 2px solid #ccc;
   border-radius: 18px;
   font-family: "Roboto-Regular";
   font-size: 8pt;
   cursor: pointer;
}
.subdeal-card-filter-reset {
   display: inline-block;
   height: 32px;
   line-height: 32px;
   padding: 0 16px;
   border-radius: 18px;
   background-color: #e8e8e8;
   cursor: pointer;
}
.subdeal-card-expand {
   position: absolute;
   display: inline-block;
   width: 28px;
   height: 28px;
   line-height: 28px;
   font-size: 22px;
   border-radius: 50%;
   cursor: pointer;
   right: 1px;
   top: 1px;
}
.subdeal-card-top-item {
   display: inline-flex;
   align-items: center;
   padding: 0;
   word-wrap: break-word;
   min-width: 50px;
}
.subdeal-card-top-item-actions { min-width: 130px }
.task-update-button { margin-left: 4px }
.subdeal-filter-button,
.tasks-card-view-mode-button,
.gtasks-scenario-filter-item,
.scheduler-scenario-filter-item {
   display: inline-block;
   padding: 8px 16px;
   line-height: 15px;
   overflow: hidden;
   cursor: pointer;
   height: 30px;
}
.tasks-scenario-filter-item-select,
.gtasks-scenario-filter-item-select,
.subdeal-scenario-filter-item-select,
.scheduler-scenario-filter-item-select,
.tasks-card-view-mode-item-select {
   border-bottom: 3px solid #1976d2;
}
.subdeal-card-expand:active { background-color: #b3e5fc }
.subdeal-card-priority {
   display: inline-block;
   font-family: "Roboto-Regular";
   border: 1px solid #ddd;
   border-radius: 50%;
   text-align: center;
   line-height: 20px;
   min-height: 20px;
   min-width: 20px;
   font-size: 10px;
   height: 20px;
   width: 20px;
}
.subdeal-filter-color-block,
.subdeal-filter-number-block { min-width: 138px }
.subdeal-priority-red { background-color: #f44336 }
.subdeal-priority-yellow { background-color: #ffc107; }
.subdeal-priority-green { background-color: #388e3c; }
/*.subdeal-card-top-item {
   padding: 0 8px;
}*/
.subdeal-card-priority-number {
   margin-left: 8px;
   margin-right: 2px;
}
.subdeal-card-hidden { display: none }
.subdeal-card-title {
   margin-right: 50px;
   font-weight: bold;
}
.subdeal-card-task-title {
   width: 100%;
   margin-bottom: 8px;
   overflow-wrap: break-word;
}
.subdeal-card-description {
   width: 100%;
   margin-bottom: 8px;
   overflow-wrap: break-word;
}
.subdeal-card-description blockquote,
.subdeal-formresult-table blockquote,
#gtasks-container blockquote {
   background-color: #ebeeff;
   border: 2px solid #fff;
   border-radius: 8px;
   font-style: italic;
   padding: 8px;
   margin: 0px;
   margin-top: 8px;
   overflow-wrap: break-word;
}
.subdeal-card-work,
.subdeal-card-electric-works { margin-bottom: 8px }
.subdeal-card-electric-works {
   background-color: #e3f2fd;
   border-radius: 8px;
   overflow: hidden;
   padding: 8px;
}
.subdeal-card-work { font-size: 14px }
.subdeal-card-work-field-value b { color: #555 }
.subdeal-card-contact,
.subdeal-card-contact-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   height: 24px;
}
.subdeal-card-contact-container { margin-bottom: 8px }
.subdeal-card-contact-value { margin-left: 4px }
.subdeal-card-wrong-contact {
   background-color: #ffdfdf;
   border-radius: 32px;
   padding: 0 8px;
   color: #f44336;
}
.subdeal-card-go-to-contact {
   margin-left: 8px;
   cursor: pointer;
}
.subdeal-card-date-plane {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-bottom: 8px;
   height: 24px;
   width: 100%;
}
.subdeal-card-files {
   overflow-wrap: break-word;
   width: 100%;
   opacity: 0;
}
.subdeal-card-files a { display: block }
.subdeal-card-files a:not(:first-child) { margin-top: -12px }
.subdeal-card-result {
   width: 100%;
   margin-bottom: 8px;
}
.subdeal-card-additional-item {
   width: 100%;
   margin-bottom: 8px;
   overflow-wrap: break-word;
}
.subdeal-card-separation-line {
   width: 100%;
   border-top: 1px solid #ccc;
   padding: 0;
   margin: 0;
   margin-bottom: 8px;
}
.subdeal-card-additional-small-item { color: #5f5f5f }
.subdeal-card-additional-title {
   width: 100%;
   margin-bottom: 2px;
}
.subdeal-card-additional-small-label { color: #777 }
.subdeal-card-missing { color: #8a8a8a }
.subdeal-card-status-icon {
   display: inline-block;
   line-height: 18px;
   font-size: inherit;
   border-radius: 24px;
   margin-left: 4px;
   background-repeat: no-repeat;
   background-position: center;
   height: 18px;
   width: 18px;
}
.subdeal-card-status-icon span { display: none }
.subdeal-card-status-empty {
   background-color: #fff;
   background-image: url('../img/empty.svg');
   background-size: 12px;
}
.subdeal-card-status-draft {
   background-color: #ffb300;
   background-image: url('../img/science.svg');
   background-size: 10px;
}
.subdeal-card-status-created {
   background-color: #888;
   background-image: url('../img/new-star.svg');
   background-size: 12px;
}
.subdeal-card-status {
   background-color: #43a047;
   background-image: url('../img/ok-circle-green.svg');
   background-size: 12px;
}
.subdeal-card-status-started {
   background-color: #1976d2;
   background-image: url('../img/play-circle.svg');
   background-size: 10px;
}
.subdeal-card-status-performed {
   background-color: #3f51b5;
   background-image: url('../img/play-circle.svg');
   background-size: 10px;
}
.subdeal-card-status-complete {
   color: #fff;
   margin-left: 6px;
}
.subdeal-card-status-for-revision {
   background-color: #e91e63;
   background-image: url('../img/skip-back.svg');
   background-size: 12px;
}
.subdeal-card-status-postpone {
   background-color: #9c27b0;
   background-image: url('../img/clock.svg');
   background-size: 12px;
}
.subdeal-card-status-finished {
   background-color: #9acd32;
   background-image: url('../img/cup.svg');
   background-size: 10px;
}
.subdeal-card-status-canceled {
   background-color: #eb4c42;
   background-image: url('../img/cancel.svg');
   background-size: 12px;
}
.subdeal-card-status-processed {
   background-color: #eb4c42;
   background-image: url('../img/ok-circle-green.svg');
   background-size: 12px;
}
.subdeal-card-bottom {
   display: flex;
   flex-direction: column;
   border-top: 1px solid #ccc;
   padding-top: 6px;
   margin-top: 6px;
   width: 100%;
}
.subdeal-card-bottom-cell:nth-child(even) {
   border-bottom: 1px solid #eee;
   border-top: 1px solid #eee;
}
.subdeal-card-bottom-cell-text {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   flex-wrap: nowrap;
   margin-left: 6px;
}
.subdeal-chain-content { width: 100% }
.subdeal-card-client {
   height: 24px;
   width: 100%;
}
.subdeal-card-fold-block {
   display: flex;
   flex-direction: row;
   align-items: center;
   height: 24px;
   width: 100%;
}
.subdeal-card-fold-button {
   border-radius: 32px;
   margin-left: auto;
   margin-right: 4px;
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   font-size: 24px;
   cursor: pointer;
   height: 24px;
   width: 24px;
}
.subdeal-card-rating-info { height: 20px }
.subdeal-card-rating-container {
   line-height: 20px;
   min-height: 20px;
   height: 20px;
}
.subdeal-card-rating-item { color: #ff9800 }
#subdeal-card-info-count {}
/* Карточки внутрі карточок */
.subdeal-inner-card { margin-bottom: 4px }
.subdeal-step-card {
   display: flex;
   flex-direction: column;
   width: 100%;
}
.subdeal-inner-card-top {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   flex-wrap: nowrap;
   line-height: 32px;
   height: 32px;
   width: 100%;
   overflow: hidden;
}
.subdeal-step-card-top {
   background-color: #eceff1;
   border-radius: 32px;
   padding: 0 8px;
}
.subdeal-step-card-title {
   display: inline-block;
   width: 100%;
}
.subdeal-form-card {
   border: 1px solid #d8d8d8;
   border-radius: 6px;
}
.subdeal-form-card-title { font-weight: bold }
.subdeal-inner-card-title {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   flex-wrap: nowrap;
   background-color: #8c3868;
   color: #fff;
   height: 32px;
   width: calc(100% - 32px);
   font-size: 13px;
}
.subdeal-inner-card-title:after {
   content: '';
   width: 32px;
   height: 32px;
   border-radius: 16px 0 0 16px;
   background-color: #fff;
   display:inline-block;
   vertical-align: middle;
   margin-right: -24px;
}
.subdeal-formresult-card-title {
   padding-left: 14px;
   border-top-left-radius: 16px;
   border-bottom-left-radius: 16px;
}
.subdeal-card-scenario-name {
   display: inline-block;
   line-height: 24px;
   height: 24px;
}
.subdeal-card-relationship {
   display: inline-block;
   margin-left: 4px;
   height: 24px;
   width: 24px;
}
.subdeal-card-title-item {
   display: inline-block;
   padding-right: 16px;
   height: 32px;
}
.subdeal-card-title-item-label { display: none }
.subdeal-card-title-item-text { margin-left: 6px }
.subdeal-card-inner-fold {
   display: inline-block;
   text-align: center;
   border-radius: 50%;
   line-height: 26px;
   min-height: 26px;
   min-width: 26px;
   cursor: pointer;
   font-size: 22px;
   height: 26px;
   width: 26px;
}
.subdeal-formresult-card-fold { background-color: #eee }
.subdeal-step-card-content,
.subdeal-form-card-content,
.subdeal-formresult-card-content {
   margin-top: 8px;
   padding: 0;
}
.subdeal-field-card {
   display: flex;
   flex-direction: row;
   width: 100%;
}
.subdeal-formresult-table {
   table-layout: fixed;
   font-size: 14px;
}
.subdeal-label-cell {
   font-size: 11px;
   min-width: 80px;
   width: 80px;
   color: #777;
}
.subdeal-formresult-header {
   background-color: #eee;
   color: #888;
}
.subdeal-formresult-id { color: #7ca9c0 }
.subdeal-formresult-table td {
   border: 1px solid #8af;
   word-wrap: break-word;
   word-break: break-all;
   padding: 4px;
}
.subdeal-card-tags-block,
.subdeal-card-actions-block {
   display: flex;
   flex-direction: row;
   align-items: center;
   flex-wrap: wrap;
   transition: all 0.5s ease;
   opacity: 0;
   width: 100%;
}
.subdeal-card-watchers {
   display: inline-flex;
   background-color: #dbdbdb;
   border-radius: 32px;
   line-height: 20px;
   padding: 0 8px;
   color: #3d3d3d;
   height: 20px;
}
.subdeal-card-watchers-icon {
   line-height: 20px;
   min-height: 20px;
   min-width: 20px;
   height: 20px;
   width: 20px;
}
.subdeal-card-watchers-text {
   line-height: 20px;
   padding: 0 4px;
}
.subdeal-card-tag {
   display: inline-flex;
   background-color: #e5efff;
   border-radius: 32px;
   line-height: 20px;
   cursor: pointer;
   padding: 0 8px;
   color: #1976d2;
   height: 20px;
}
.subdeal-card-tag:not(:first-child),
.subdeal-card-watchers:not(:first-child) {
   margin-left: 4px;
}
.subdeal-card-tag-count {
   font-family: 'Mono Regular';
   margin-left: 2px;
   font-size: 10px;
}
.subdeal-card-tag-loaded,
.subdeal-card-actions-loaded {
   margin-bottom: 8px;
   opacity: 1;
}
.subdeal-card-actions-block {
   flex-wrap: nowrap;
   background-color: #d3e3fd;
   border-radius: 4px;
}
.subdeal-card-actions-loaded {
   padding: 4px;
}
.subdeal-card-actions-button {
   display: inline-block;
   background-color: #3f51b5;
   border-radius: 32px;
   line-height: 26px;
   cursor: pointer;
   font-size: 12px;
   padding: 0 12px;
   height: 26px;
   color: #fff;
}
.subdeal-card-actions-button:not(:first-child) {
   margin-left: 6px;
}
.subdeal-card-rating-ondate {
   margin-left: 8px;
   font-size: 14px;
}
.subdeal-card-rating-comment {
   background-color: #fff3e0;
   border-radius: 6px;
   margin-top: 4px;
   font-size: 16px;
   padding: 8px;
}
.task-card-google-calendar {
   background-repeat: no-repeat;
   background-position: center;
   background-size: 16px;
   background-image: url(../img/google-calendar.svg);
}
.task-card-outlook {
   background-repeat: no-repeat;
   background-position: center;
   background-size: 16px;
   background-image: url(../img/outlook.svg);
}
.task-card-apple {
   background-repeat: no-repeat;
   background-position: center;
   background-size: 16px;
   background-image: url(../img/apple.svg);
}
.task-card-menu-container { margin-left: 8px }
.task-card-go-to-workday {
   margin-left: 8px;
   color: #2196f3;
}
.task-financial-department-icon {
   line-height: 26px;
   margin-right: 4px;
   min-height: 26px;
   min-width: 26px;
   height: 26px;
   width: 26px;
   color: green;
}
.fintask-performer-container {
   background-color: #efefef;
   border-radius: 6px;
   overflow-y: auto;
   padding: 0 8px;
   width: 100%;
}
.fintask-radio-container {
   width: auto;
}
.fintask-performer-item {
   display: flex;
   text-align: justify;
   white-space: nowrap;
   padding: 8px 16px;
   line-height: 15px;
   overflow: hidden;
   cursor: pointer;
   height: 30px;
   width: auto;
}
#companies-scroll-block {
   overflow: auto;
   height: calc(100% - 70px);
   width: 100%;
}
#companies-grid-top-panel {
   display: flex;
   flex-direction: row;
   align-items: center;
   background-color: #fff;
   border-bottom: 1px solid #eee;
   box-shadow: 0 1px 1px -1px #3335;
   height: 40px;
   width: 100%;
}
#companies-filter-indicator {
   left: 226px;
}
#companies-old-clients,
#companies-quick-books {
   background-repeat: no-repeat;
   background-position: center;
   background-size: 20px;
}
#companies-old-clients {
   background-image: url('../img/daemon.svg');
}
#companies-quick-books {
   background-image: url('../img/quickbooks.svg');
}
#companies-bottom-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   background-color: #d3e3fd;
   padding: 0 8px;
   height: 28px;
   width: 100%;
}
#companies-pager-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-left: auto;
   height: 28px;
}
.companies-pager-button {
   border-radius: 32px;
   line-height: 24px;
   height: 24px;
   width: 24px;
}
.companies-page-size-button {
   font-family: 'Roboto-Regular';
   line-height: 20px;
   font-size: 11px;
   cursor: pointer;
   padding: 0 4px;
   height: 20px;
   width: auto;
}
.companies-page-size-select {
   background-color: #0e8bc1;
   color: #fff;
}
#companies-table-container .dx-datagrid-total-footer {
   display: none
}
.companies-balance-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
}
.companies-balance-button {
   background-color: #4caf50;
   border-radius: 32px;
   line-height: 18px;
   font-size: 14px;
   cursor: pointer;
   padding: 0 8px;
   height: 18px;
   color: #fff;
}
.companies-balance-warning {
   line-height: 18px;
   min-height: 18px;
   min-width: 18px;
   cursor: pointer;
   color: #ff5722;
   height: 18px;
   width: 18px;
}
.companies-balance-negative {
   background-color: #ff9a92 !important;
}
/*.companies-balance-negative:hover {
   background-color: #ff9a92 !important;
}*/
.companies-balance-positive {
   background-color: #b3ffb6 !important;
}
/*.companies-balance-positive:hover {
   background-color: #b3ffb6 !important;
}*/
.subdeal-card-notify-icon,
.companies-rapid-notify-icon {
   position: absolute;
   background-color: #f44336;
   border-radius: 32px;
   line-height: 16px;
   min-height: 16px;
   min-width: 16px;
   font-size: 12px;
   cursor: pointer;
   height: 16px;
   width: 16px;
   color: #fff;
}
.companies-rapid-notify-icon {
   left: -4px;
   top: -4px;
}
.subdeal-card-notify-icon {
   left: 6px;
   top: 6px;
}
.subdeal-card-share-button {
   border-radius: 40px;
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   cursor: pointer;
   height: 24px;
   width: 24px;
}

/* SubCompany Тарифи */
.device-tariff-block {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   flex-wrap: nowrap;
}
.device-tariff { width: 100% }
.device-tariff-save {
   display: inline-block;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 20px;
   background-image: url('../img/save.svg');
   margin-left: 8px;
   height: 32px;
   width: 32px;
   cursor: pointer;
}
.taskcp4-fileuploader-container,
#simpletaskcp4-fileuploader-container {
   width: 96px;
   height: 36px;
}
.taskcp4-fileuploader-container .dx-fileuploader-wrapper,
.taskcp4-fileuploader-container .dx-fileuploader-input-wrapper,
#simpletaskcp4-fileuploader-container .dx-fileuploader-wrapper,
#simpletaskcp4-fileuploader-container .dx-fileuploader-input-wrapper {
   padding: 0px;
}
.simpletask-selected-item {
   line-height: 12px;
}
.simpletask-selected-item-name {
   font-size: 8pt;
}
.simpletask-selected-item-size {
   font-size: 8pt;
   color: #acacac;
}
.simpletask-deal-block-item,
.simpletask-tags-block-item {
   width: 100%;
}
.simpletask-public-block-item {
   position: relative;
   margin-bottom: auto;
   margin-top: 30px;
}
.task-result-block { padding: 0 8px 8px 8px }
.task-result-panel {
   margin-bottom: 8px;
   line-height: 32px;
   min-height: 32px;
   height: 32px;
}
.task-result-label {
   line-height: 32px;
   min-height: 32px;
   height: 32px;
   width: 100%;
}

/* Сторінка прихованого дзвінка */
#telephony-form {
   width: 96%;
   margin: 0 auto;
   background-color: #fff;
   border: 1px solid #eee;
   border-radius: 6px;
   padding: 0 16px;
}
#telephony-call-button {
   width: 140px;
   height: 38px;
   border-radius: 38px;
   margin: 18px auto;
   background-color: #419b45;
   color: #fff;
   text-align: center;
   line-height: 38px;
   padding-left: 20px;
   background-repeat: no-repeat;
   background-position: 16px center;
   background-size: 20px;
   background-image: url(../img/call-white.png);
   cursor: pointer;
}
#telephony-call-button:active {
   background-color: #48b34d;
}
.telephony-note {
   font-size: 9pt;
   color: #ff9800;
   font-style: italic;
}
.telnumber-search-box {
   display: none;
   position: absolute;
   top: 44px;
   width: 100%;
   max-height: 340px;
   background-color: #fff;
   border: 1px solid #eee;
   border-radius: 2px;
   box-shadow: 2px 2px 8px 0px #888;
   overflow-x: hidden;
   overflow-y: auto;
   z-index: 1010;
}
.telnumber-search-list {
   min-width: 100%;
   background-color: #fff;
}
.telnumber-search-box td {
   font-size: 9pt;
}
.telnumber-search-box tr {
   border-top: 1px solid #ddd;
}
.telnumber-noresult {
   display: block;
   width: 100%;
   padding: 4px 8px;
   font-size: 10pt;
}

/* Сторінка Перегляд даних */
#electric { margin-top: 0px }
.top-block {
   position: fixed;
   background-color: #dfdfdf;
   z-index: 1000;
   width: 100%;
}
.electric-no-data {
   margin-top: 100px;
   text-align: center;
   color: #aaa;
}
#electric-search { width: 100% }
#electric-list {
   display: none;
   height: calc(100% - 80px);
   margin-top: 80px;
   width: 100%;
}
#electric-list td {
   height: 28px;
   border: 1px solid #aaa;
   font-size: 9pt;
   padding: 0 4px;
}
.stabilization { background-color: #c6efce }
.ignition { position: relative }
.ignition:before {
   content: '';
   display: inline-block;
   position: absolute;
   background-color: #ff9800;
   height: 16px;
   width: 4px;
   left: -2px;
   top: 6px;
}
#electric-actions {
   position: relative;
   display: flex;
   flex-direction: row;
   align-items: center;
   background-color: #fff;
   margin: 0 auto;
   margin-bottom: 6px;
   min-height: 32px;
   height: 32px;
   width: 100%;
   padding: 0;
}
.electric-actions-button {
   display: inline-block;
   cursor: pointer;
}
#electric-calibrate {
   width: 32px;
   height: 32px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 24px;
   background-image: url(../img/gear.svg);
}
#electric-transfer {
   background-repeat: no-repeat;
   background-position: center;
   border-radius: 32px;
   margin-left: 8px;
   min-height: 28px;
   min-width: 28px;
   height: 28px;
   width: 28px;
}
#electric-transfer:active {
   background-color: #bbdefb;
}
.electric-pause {
   background-size:18px;
   background-image: url(../img/pause.svg);
}
.electric-play {
   background-size: 26px;
   background-image: url(../img/play.svg);
}
#electric-more {
   display: inline-block;
   width: 28px;
   height: 28px;
   margin-left: auto;
   margin-right: 4px;
   border-radius: 50%;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 22px;
   background-image: url(../img/more-vertical.svg);
}
.electric-more-open {
   -moz-transform: rotate(90deg);
   -webkit-transform: rotate(90deg);
   -o-transform: rotate(90deg);
   -ms-transform: rotate(90deg);
   transform: rotate(90deg);
}
#electric-more:active {
   background-color: #bbdefb;
}
.electric-display-block {
   position: relative;
   display: inline-block;
   height: 28px;
   margin-left: 8px;
}
#electric-current-step-display-drp1,
#electric-current-step-display-drp2 {
   width: 88px;
   height: 28px;
   line-height: 20px;
   font-family: 'Mono Bold';
   font-size: 12pt;
   padding: 4px;
   background-color: #f5f5f5;
   color: #333;
   cursor: default;
}
.electric-stop-button {
   display: inline-block;
   position: absolute;
   top: 6px;
   right: 4px;
   width: 16px;
   height:16px;
   border-radius: 50%;
   background-color: #f5f5f5;
}
.electric-stop-button-ready {
   background-color: #4caf50;
}
.electric-stop-button-complete {
   background-color: #ff7878;
   background-repeat: no-repeat;
   background-position: 1px center;
   background-size: 13px;
   background-image: url(../img/check.svg);
}
#electric-step-button {
   display: inline-block;
   float: left;
   width: 32px;
   height: 32px;
   line-height: 32px;
   font-size: 8pt;
   font-weight: bold;
   padding: 0 12px;
   background-color: #1976d2;
   color: #fff;
   cursor: pointer;

   background-repeat: no-repeat;
   background-position: center;
   background-size: 24px;
   background-image: url(../img/send.svg);
}
#electric-advanced {
   display: inline-block;
   border-radius: 32px;
   line-height: 28px;
   margin-left: 12px;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   font-size: 22px;
   height: 28px;
   width: 28px;
}
.visible-on { color: #00a693 }
.calibration-advanced {
   display: none;
}
#calibration-device-info {
   width: 100%;
   table-layout: fixed;
}
.calibration-device-row {
   width: 100%;
   margin-bottom: 8px;
}
.calibration-device-label {
   margin-right: 16px;
}
#calibration-client-name,
#calibration-device-name,
#calibration-device-type {
   display: inline-block;
}
#calibration-client-name {
   max-width: calc(100% - 4px);
}
.calibration-top-block {
   display: inline-block;
   padding: 2px;
   width: 33.3%;
}
#calibration-top-panel {
   position: relative;
   width: 100%;
   overflow: hidden;
   overflow-y: auto;
   padding: 4px;
}
#calibration-top-panel tr {
   border-bottom: 1px solid #b3e5fc;
}
.calibration-car-label {
   min-width: 44px;
   width: 54px;
}
#calibration-switch-drp1,
#calibration-switch-drp2 {
   display: inline-block;
   float: left;
   width: 32px;
   height: 32px;
   border-radius: 50%;
   margin-right: 16px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 24px;
   cursor: pointer;
}
#calibration-switch-drp1:active,
#calibration-switch-drp2:active {
   background-color: #bbdefb;
}
.calibration-switch-on {
   background-image: url(../img/switch-on.svg);
}
.calibration-switch-off {
   background-image: url(../img/switch-off.svg);
}
.calibration-switch-disable {
   background-image: url(../img/switch-disable.svg);
}
#calibration-drp-placement {
   display: inline-block;
   margin-left: 16px;
}
.imei-drp-block {
   width: 54%;
   width: calc(100% - 33.3% - 48px);
}
.placement-drp-select {
   border: 2px solid #ddd;
   border-radius: 6px;
   background-color: #ecf9ff;
   padding: 4px;
}
.calibration-top-row {
   display: block;
   width: 100%;
   overflow: hidden;
}
#electric-device-status {
   display: inline-block;
   border: 1px solid #1e90ff;
   border-radius: 16px;
   margin-left: 14px;
   min-height: 10px;
   min-width: 10px;
   height: 10px;
   width: 10px;
}
.electric-device-pause {
   background-color: #aed581;
}
.electric-device-hidden {
   background-color: #ffa7a0;
}
/* Додаткові дії */
#electric-more-actions {
   display: none;
   width: 100%;
   height: calc(100% - 120px);
   background-color: #fff;
   padding: 4px;
   box-shadow: 0px 2px 4px 0px #888;
   overflow: auto;
}
#electric-calibre-more,
#electric-send-message {
   width: 100%;
   height: 32px;
   line-height: 30px;
   border: 2px solid #1976d2;
   border-radius: 4px;
   font-size: 11pt;
   text-align: center;
   cursor: pointer;
}
#electric-equipment-block {
   width: 100%;
}
.calibration-message-block {
   width: 100%;
   margin-top: 8px;
}
.calibration-message-label {
   padding: 0;
   margin: 0;
}
#calibration-message-textarea {
   width: 100%;
   height: 64px;
   border: 1px solid #b3e5fc;
   resize: none;
}
.calibration-action-panel,
.calibration-bottom-panel {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
   margin-bottom: 8px;
   width: 100%;
}
.calibration-action-panel { margin-bottom: 8px; }
.calibration-bottom-panel { margin-top: 8px; }
#calibration-copy-fields {
   display: inline-block;
   position: relative;
   width: 24px;
   height: 24px;
   align-self: center;
   border-radius: 50%;

   background-image: url(../img/copy.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px;

   cursor: pointer;
}
#calibration-sound-mute {
   display: inline-block;
   position: relative;
   width: 24px;
   height: 24px;
   align-self: flex-end;
   border-radius: 50%;

   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px;

   cursor: pointer;
}
#calibration-remove-data:active,
#calibration-copy-fields:active,
#calibration-sound-mute:active {
   background-color: #bbdefb;
}
.calibration-volume {
   background-image: url(../img/volume.svg);
}
.calibration-mute {
   background-image: url(../img/mute.svg);
}
#calibration-device-turn-on-day {
   display: inline-block;
   height: 24px;
   width: 24px;
   border-radius: 50%;
   background-image: url(../img/lamp.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 22px;
   cursor: pointer;
}
/* Таблиця додаткового обладнання  */
#electric-phone-block {
   margin-top: 8px;
   overflow: hidden;
}
.electric-phone-item {
   display: inline-block;
   float: left;
   width: 50%;
   height: 32px;
   line-height: 32px;
   text-align: center;
}
#electric-geolocation {
   width: 100%;
   height: 32px;
   line-height: 32px;
   text-align: center;
}
.calibration-date-block {
   margin-top: 8px;
   margin-bottom: 8px;
   background-color: #1081e0;
}
.calibration-date-item {
   display: inline-block;
}
.calibration-date-label {
   display: inline-block;
   font-size: 10pt;
   margin-right: 8px;
   padding: 0 8px;
   color: #fff;
}
.calibration-date-input {
   display: inline-block;
   width: 64px;
   height: 24px;
   border: 2px solid #1081e0;
   border-radius: 0;
   font-family: 'Mono Regular';
}
.calibration-drp-cage {
   overflow: hidden;
}
.calibration-drp-block {
   display: none;
   width: 100%;
}
.visible-drp-block {
   display: block;
}
.calibration-drp-title {
   display: inline-block;
   float: left;
   height: 32px;
   line-height: 32px;
   padding-left: 4px;
   padding-right: 4px;
   color: #fff;
}
.reverse-switch {
   float: left;
}
.direction-label1, .direction-label2 {
   display: inline-block;
   float: left;
   height: 32px;
   line-height: 32px;
   font-size: 10pt;
}
.direction-label1 {
   margin-left: 16px;
   margin-right: -20px;
}
.direction-label2 {
   margin-left: 8px;
}
/* Тумблер Порожній/Повний */
.direction-switch {
   background-color: #d4a955 !important;
   box-shadow: none;
}
.direction-switch:after {
   left: 3px;
   background: #fff;
   box-shadow: none;
}
.switch-checkbox:checked + .direction-switch:after {
   left: calc(100% - 31px);
   transform: translateX(100%);
}
.switch-checkbox:checked + .direction-switch {
   background: #0262da !important;
}
.calibration-drp-next {
   width: 32px;
   height: 32px;
   float: right;
   border-radius: 50%;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px;
   background-image: url(../img/next-right.svg);
   cursor: pointer;
}
.calibration-drp-next:active {
   background-color: #bbdefb;
}
.section-drp1 {background-color: #456aaf;}
.section-drp2 {background-color: #d4a955;}
#electric-message {
   width: 100%;
   margin-top: 8px;
}
#electric-message textarea {
   width: 100%;
   height: 80px;
   resize: none;
   border: 1px solid #bdbdbd;
}
#calibration-device-equipmen {
   margin-top: 8px;
}
.calibration-form-label {
   margin-top: 2px;
   margin-bottom: 2px;
   margin-left: 4px;
   color: #fff;
}
.calibration-form-input {
   display: block;
   width: 100%;
   height: 32px;
   line-height: 32px;
   border: 2px solid #fff;
   padding: 4px;
   font-size: 10pt;
}
#calibration-table {
   margin-top: 8px;
}
.calibration-table-head {
   background-color: #ecf9ff;
   position: -webkit-sticky;
   position: sticky;
   z-index: 2;
   top: -1px;
}
.device-point {
   height: 28px;
}
.calibration-temp-table td {
   border: 1px solid #2196f3;
   font-size: 9pt;
   padding: 2px;
}
.calibration-check-indicator {
   width: 28px;
   min-width: 28px;
   height: 28px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px;
   cursor: pointer;
}
.calibration-unchecked {
   background-image: url(../img/checkbox-unchecked.svg);
}
.calibration-checked {
   background-image: url(../img/checkbox-checked.svg);
}
.calibration-ondate {
   width: 54px;
   min-width: 54px;
}
.calibration-ondate-advanced {
   width: 88px;
   min-width: 86px;
}
.step-litter {
   width: 38px;
   min-width: 28px;
   cursor: pointer;
}
.step-editor-bottom {
   margin-top: 16px;
}
.calibration-highlight {
   background-color: #d5e4ff;
}
.highlight-edit-row {
   background-color: #ffeb3b !important;
}
.calibration-step-label {
   margin-bottom: 4px;
}
.calibration-step-comment {
   height: 60px;
   resize: none;
}
.step-corrected {
   background-color: #80deea;
}
.calibration-stage-remove {
   width: 32px;
   height: 18px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 14px;
   background-image: url(../img/trash.svg);
   cursor: pointer;
}
#calibration-bottom-panel {
   margin-top: 8px;
   padding: 2px;
}
.calibration-bottom-button {
   display: inline-block;
   width: 120px;
   height: 32px;
   background-color: #1976d2;
   border-radius: 6px;
   color: #fff;
   font-size: 10pt;
   font-weight: bold;
   text-align: center;
   line-height: 32px;
   cursor: pointer;
}
#calibration-send-button {
   margin-right: 8px;
}
.calibration-popup {
   position: fixed !important;
}
.calibration-first-point {
   background-color: #c5e1a5;
}
#calibration-remove-data {
   position: relative;
   display: inline-block;
   width: 24px;
   height: 24px;
   border-radius: 50%;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px;
   background-image: url(../img/trash.svg);
   cursor: pointer;
}
#calibration-addition-helper {
   display: flex;
   align-items: center;
   flex-direction: row;
   justify-content: space-between;
   width: 100%;
   margin-top: 10px;
}
.calibration-addition-helper-label {}
#calibration-addition-more,
.electric-more-button {
   position: relative;
   display: inline-block;
   align-self: flex-end;
   width: 28px;
   height: 28px;
   border-radius: 50%;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 22px;
   background-image: url(../img/more-horizontal.svg);
   cursor: pointer;
}
#calibration-scenario-key-indicator {
   border-radius: 32px;
   text-align: center;
   margin-left: auto;
   margin-right: 6px;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   font-size: 28px;
   color: #f44336;
   height: 28px;
   width: 28px;
}
.electric-scenario-key-exists {
   color: #00b507 !important;
}
#calibration-addition-block {
   display: none;
   width: 100%;
}
.calibration-addition-label {
   margin: 0;
   padding: 0;
   padding-top: 4px;
   font-size: 10pt;
}
.calibration-addition-input {
   width: 100%;
   height: 28px;
   border: 1px solid #b3e5fc;
   padding: 4px;
   font-size: 10pt;
   line-height: 28px;
}
#calibration-copy-text {
   display: block;
   width: 100%;
   height: 180px;
   border: 2px solid #b3e5fc;
   border-radius: 6px;
   margin-top: 8px;
   resize: none;
}
#calibration-hidden-text {
   width: 1px;
   height: 1px;
   padding: 0;
   margin: 0;
}
.calibration-vertical-block {
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
   align-items: flex-start;
   justify-content: space-between;
   width: 100%;
}
.calibration-vertical-field {
   display: inline-block;
   width: 48%;
}
.calibration-row-block {
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
   align-items: center;
   justify-content: space-between;
   margin: 4px 0;
   width: 100%;
}
.calibration-label-cell,
.calibration-vallue-cell {
   display: inline-block;
}
.calibration-vallue-cell {
   margin-left: 8px;
}
#device-info-more {
   display: none;
}
.electric-form-block {
   display: none;
   width: 100%;
}
.electric-form-field {
   width: 100%;
}
.calibration-current-block {
   display: flex;
   flex-direction: row;
   justify-content: space-around;
   margin-top: 8px;
   width: 100%;
}
.calibration-current-item {
   display: inline-block;
   font-weight: bold;
   text-align: center;
}
.calibration-actions-block {
   display: flex;
   flex-direction: column;
   align-items: baseline;
   margin-top: 8px;
}
.calibration-actions-menu { font-size: 24px }
.calibration-actions-button {
   display: inline-block;
   background-color: #3f51b5;
   border-radius: 32px;
   line-height: 28px;
   cursor: pointer;
   font-size: 14px;
   padding: 0 16px;
   height: 28px;
   color: #fff;
}
.calibration-actions-button:not(:first-child) { margin-top: 12px }
/*.electric-calibration-action-form,
.electric-ins-device-form {
   position: relative;
   height: calc(100% - 50px);
   overflow: hidden;
   overflow-y: auto;
   padding: 0 4px;
}*/
.electric-scroll-form {
   position: relative;
   height: calc(100% - 50px);
   overflow: hidden;
   overflow-y: auto;
   padding: 0 4px;
}
.electric-is-install-container {
   margin-left: 16px;
}
.electric-auto-group {
   background-color: #d3e3fd;
   border-radius: 4px;
   padding: 6px;
}
.electric-date-container {
   display: flex;
   flex-direction: column;
   align-items: stretch;
   background-color: #eee;
   border-radius: 6px;
   margin-top: 8px;
   padding: 4px;
   height: auto;
   width: 100%;
}
.electric-tank-group-label {
   border-radius: 32px;
   padding: 0 8px;
   color: #fff;
}
.electric-tank1-group-label { background-color: #456aaf }
.electric-tank2-group-label { background-color: #d4a955 }
.electric-date-from-container,
.electric-date-to-container {
   width: 100%;
}
.electric-date-to-container {
   margin-left: 0px;
   margin-top: 8px;
}
.electric-deal-item {
   line-height: 34px;
   font-size: 14px;
   height: 34px;
}
.electric-deal-id {
   font-size: 12px;
   color: #03a9f4;
}
.electric-ins-calibration-form {
   position: relative;
}
.electric-send-progress-container {
   position: sticky;
   z-index: 900;
   height: 4px;
   width: 100%;
   top: 40px;
   left: 0;
}
.electric-progress-inner {
   background-color: #1e90ff;
   height: 100%;
   width: 0%;
}
#calibration-goto-device { font-size: 22px }

.erplite-copy-fields-button {
   border-radius: 32px;
   margin-left: auto;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}

/* Сторінка Задача */
#task-top-panel {
   display: flex;
   position: fixed;
   top: 40px;
   width: 100%;
   height: 40px;
   background-color: #fff;
   margin-bottom: 4px;
   padding-left: 4px;
   padding-right: 4px;
   border-bottom: 1px solid #d9d9d9;
   z-index: 1010;
}
#task-form {
   position: relative;
   width: 99%;
   margin: 0 auto;
   margin-top: 84px;
   margin-bottom: 8px;
   background-color: #fff;
   border-radius: 6px;
   padding: 2px 6px;
   padding-bottom: 16px;
}
.button-top-panel,
.button-bottom-panel {
   display: flex;
   width: 100%;
   margin-top: 8px;
   overflow: hidden;
   justify-content: space-between;
}
.button-bottom-panel {
   margin-top: 16px;
   margin-bottom: 16px;
}
#task-save-ordering {
   display: inline-block;
   width: 36px;
   height: 40px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 22px;
   background-image: url(../img/save.svg);
   cursor: pointer;
}
.task-first-label { margin-top: 0 }
.task-create-button {
   float: right;
   width: 150px;
   height: 40px;
   border-radius: 40px;
   margin-top: 8px;
   background-color: #03a9f4;
   color: #fff;
   text-align: center;
   line-height: 40px;
   cursor: pointer;
}
.task-create-button:active { background-color: #4fc3f7 }
.button-disable { background-color: #ccc !important }
.button-disable:active { background-color: #ccc !important }
.task-form-right-block { margin-left: auto }
.task-is-rating-container { margin-right: 8px }
.task-field-separator {
   display: inline-block;
   width: 4px;
   height: 32px;
   padding: 0 4px;
}
.task-geolocation {
   display: inline-block;
   width: 24px;
   height: 24px;
   margin-right: 16px;
   background-repeat: no-repeat;
   background-position: left center;
   background-size: 24px;
   background-image: url(../img/geolocation.svg);
   cursor: pointer;
}
.company-search-result,
#task-company-search-result {
   display: none;
   position: absolute;
   top: 41px;
   left: 36px;
   width: calc(100% - 40px);
   max-height: 200px;
   padding: 6px;
   margin: 0 auto;
   background-color: #fff;
   box-shadow: 0 4px 12px 0 #888;
   border-radius: 4px;
   font-size: 10pt;
   overflow: hidden;
   overflow-y: auto;
   z-index: 9980;
}
.task-company-search-cell {
   padding: 4px 0;
   margin: 0;
   cursor: pointer;
}
.task-company-search-cell:nth-child(even) { background-color: #e3f2fd }
.task-company-search-cell:hover { background-color: #81d4fa }
.task-textarea-box {
   height: inherit;
   min-height: 44px;
}
.task-textarea {
   min-height: 34px;
   overflow: hidden;
   overflow-y: auto;
}
.task-date-input { width: initial }
.task-checkbox-item { display: inline-block }
.task-checkbox { position: absolute }
.task-checkbox-inner-container { display: flex }
.task-is-notify-checkmark {
   position: relative;
   margin-right: 4px;
}
#task-display-stepinfo {
   display: inline-block;
   margin-left: 8px;
   font-weight: bold;
}
.task-scenario-select {
   margin-left: 8px;
   width: 100%;
}

/* Універсальна форма задачі */
.task-group-info {
   background-color: #eee;
   margin-left: 4px;
}
.task-group-info-item {
   margin-left: 4px;
}
.task-group-info-round {
   text-align: center;
   border-radius: 20px;
   line-height: 12px;
   min-width: 12px;
   height: 12px;
   width: 12px;
}
.task-group-info-chips {
   font-size: 12px;
   line-height: 18px;
   height: 18px;
}
.task-template-is-close-dialog-container {
   margin-top: 8px;
}
.task-color-block,
.task-order-block { margin: 8px }

/* ЗАДАЧА (міні БП) */
#simpletask {
   height: 100%;
   overflow: hidden;
}
#subask-form,
#simpletask-form,
.task-form-body {
   background-color: #fff;
   padding: 8px;
}
#simpletask-form {
   padding: 0;
   margin-top: 1px;
   height: calc(100% - 46px);
   overflow-y: auto;
   background-color: inherit;
}
#subtask-top-panel,
#simpletask-top-panel,
.task-top-panel {
   display: flex;
   flex-wrap: nowrap;
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
   box-shadow: 0 1px 1px -1px #3338;
   background-color: #fff;
   min-height: 40px;
   position: sticky;
   padding: 0 8px;
   height: 40px;
   z-index: 20;
   width: 100%;
   top: 0;
}
#simpletask-top-panel {
   position: sticky;
   margin: 0 auto;
   width: 100%;
   z-index: 1;
   top: 0px;
}
#simpletask-form-inner {
   background-color: #fff;
   padding: 8px;
}
.simpletask-fblock {
   width: 100%;
   border: 1px solid #ddd;
   border-radius: 4px;
   padding: 4px;
}
.simpletask-fblock-control {
   display: flex;
   flex-direction: row;
   height: 24px;
   width: 100%;
}
.simpletask-fblock:not(:first-child) { margin-top: 8px }
.simpletask-fblock-control-fold-button {
   display: inline-block;
   margin: 0 auto;
   border-radius: 50%;
   height: 20px;
   width: 20px;
   cursor: pointer;
   /*background-image: url(../img/drag-handle-horizontal.svg);*/
   background-repeat: no-repeat;
   background-position: center;
   background-size: 14px;
}
.simpletask-fblock-folded { padding-bottom: 0 }
.simpletask-block {
   display: flex;
   flex-direction: column;
   margin-top: 4px;
   margin-bottom: 4px;
}
.simpletask-vblock {
   display: flex;
   align-items: center;
   margin-top: 8px;
   margin-bottom: 8px;
}
.simpletask-duo-block { justify-content: space-between }
.simpletask-couple-block { width: 49% }
.simpletask-block-item { display: inline-block }
.simpletask-block-item:not(:first-child) { margin-left: 16px }
.simpletask-button {
   display: inline-block;
   padding: 0 16px;
   line-height: 24px;
   border: 2px solid #1976d2;
   border-radius: 28px;
   font-size: 14px;
   cursor: pointer;
   height: 28px;
}
.simpletask-top-button { margin-left: auto }
.simpletask-template-button { font-size: 18px }
.simpletask-block-label {
   padding: 4px 0;
   width: 100%;
}
.simpletask-fileuploader-add-label {
   line-height: 23px;
   height: 24px;
   padding: 0;
   padding-left: 8px;
}
.simpletask-textarea {
   min-height: 160px;
   height: 160px;
}
.simpletask-deal-item { width: 100% }
#simpletask-company-search-result {
   display: none;
   position: absolute;
   top: 41px;
   width: 100% ;
   max-height: 200px;
   padding: 6px;
   margin: 0 auto;
   background-color: #fff;
   box-shadow: 0 4px 12px 0 #888;
   border-radius: 4px;
   font-size: 10pt;
   overflow: hidden;
   overflow-y: auto;
   z-index: 9980;
}
.simpletask-color-block { display: inline-flex }
.simpletask-subblock { display: inline-flex }
.simpletask-color-item {
   display: inline-block;
   width: 24px;
   height: 24px;
   border-radius: 50%;
   cursor: pointer;
}
.simpletask-color-item:not(:first-child),
.simpletask-order-item:not(:first-child) { margin-left: 8px }
.simpletask-color-red {
   background-color: #f44336;
   border: 2px solid #f44336;
}
.simpletask-color-yellow {
   background-color: #ffc107;
   border: 2px solid #ffc107;
}
.simpletask-color-green {
   background-color: #388e3c;
   border: 2px solid #388e3c;
}
.simpletask-color-none {
   background-color: #ccc;
   border: 2px solid #ccc;
}
.simpletask-order-item {
   display: inline-block;
   width: 24px;
   height: 24px;
   line-height: 20px;
   text-align: center;
   border: 2px solid #ccc;
   border-radius: 50%;
   font-size: 9pt;
   cursor: pointer;
}
.simpletask-order-none {
   background-image: url(../img/cross.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 14px;
}
.simpletask-priority-block {
   flex-direction: row;
   justify-content: space-between;

}
.simpletask-color-item-select {
   border-color: #1976d2 !important;
   background-image: url(../img/check.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 14px;
}
.simpletask-order-item-select { border-color: #1976d2 !important }
.simpletask-dateto-label { width: 150px }
.simpletask-dateto-container {
   background-image: url(../img/date.svg);
   background-repeat: no-repeat;
   background-position: center right 8px;
   background-size: 20px;
   cursor: pointer;
}
.simpletask-popup-dateto-item,
.simpletask-popup-dateplane-item {
   margin-top: 8px;
   width: 100%;
}
.simpletask-popup-dateto-time-input {
   font-family: "Segoe UI";
   font-size: 14px;
}
#simpletask-selected-files { display: none }
.simpletask-popup-dateto-top-panel {
   display: flex;
   flex-direction: row;
   justify-content: space-around;
   margin-bottom: 8px;
   width: 100%;
}
.simpletask-popup-dateto-top-panel :first-child {
   border-top-left-radius: 6px;
   border-bottom-left-radius: 6px;
   border-right: 1px;
}
.simpletask-popup-dateto-top-panel :last-child {
   border-top-right-radius: 6px;
   border-bottom-right-radius: 6px;
}
.simpletask-responsible-block {
   padding: 0 8px;
   padding-top: 4px;
   padding-bottom: 10px;
   background-color: #e9eef6;
   border-radius: 6px;
   margin-top: 8px;
}
.simpletask-department-block { margin-top: 8px }
.simpletask-department-item {
   display: inline-block;
   border: 2px solid #ccc;
   background-color: #fff;
   line-height: 20px;
   padding: 0 8px;
   height: 24px;
   border-radius: 24px;
   font-size: 12px;
   cursor: pointer;
}
.simpletask-department-item:not(:first-child) { margin-left: 2px }
.simpletask-department-item-select {
   background-color: #2196f3;
   border-color: #1976d2;
   color: #fff;

   background-image: url(../img/ok-circle-green.svg);
   background-repeat: no-repeat;
   background-position: center right 4px;
   background-size: 14px;
   padding-right: 24px;
}
.simpletask-deadline-block {
   background-color: #e9eef6;
   border-radius: 6px;
   padding: 8px;
}
.task-dialog-title {
   font-family: 'Roboto-Regular';
   text-overflow: inherit;
   white-space: nowrap;
   width: fit-content;
   overflow: inherit;
}
.task-link-button-container {
   margin-left: 2px;
   height: 28px;
}
.task-form-link-button {
   display: flex;
   flex-direction: row;
   align-items: center;
   font-family: 'Roboto-Regular';
   background-color: #e8eaf6;
   border-radius: 32px;
   cursor: pointer;
   height: 28px;
}
.task-form-link-button-label {
   background-repeat: no-repeat;
   background-position: left 12px center;
   background-size: 13px;
   background-image: url(../img/link.svg);
   line-height: 28px;
   padding-left: 32px;
   height: 28px;
}
.task-form-link-button-value {
   padding-right: 14px;
   line-height: 28px;
   margin-left: 4px;
   height: 28px;
}
.task-form-status-button {
   background-color: #c2e7ff;
   border-radius: 40px;
   line-height: 20px;
   margin-left: 8px;
   min-height: 20px;
   cursor: pointer;
   padding: 0 8px;
   height: 20px;
   color: #333;
}
.task-form-status-icon {
   line-height: 20px;
   min-height: 20px;
   font-size: 12px;
   height: 20px;
}
.task-form-status-label {
   font-family: 'Roboto-Regular';
   line-height: 20px;
   margin-left: 4px;
   font-size: 12px;
}
.task-form-status-popover { z-index: 9999 }
.task-template-main-controls {
   background-color: #e8eaf6;
   height: fit-content;
   border-radius: 6px;
   padding: 0 8px 4px;
   margin: 0 8px;
}
.task-form-save,
.task-form-add-subtask,
.task-form-save-default-profile { margin-right: 12px }
.simpletask-tags-container { margin-top: 8px }
.simpletask-client-container {
   line-height: 32px;
   padding: 0 8px;
}
.task-tags-block { margin-top: 8px }
.task-priority-block { margin-top: 16px }
.task-quill-container { height: 184px }
.task-quill-container .ql-editor {
   font-family: 'Roboto-Regular';
   font-size: 14px;
}
.task-quill-container .ql-tooltip {
   left: 0 !important;
   z-index: 9999;
}
.task-view-raw-editor-button { margin-right: 4px }
.task-raw-editor {
   font-family: 'Mono Regular';
   background-color: #282923;
   font-size: 14px;
   color: #a6e22b;
}
.subdeal-card-description img {
   max-width: 100%;
   height: auto;
}
.task-form-complete {
   margin-right: 6px;
   font-size: 24px;
   color: #009d04;
}
.task-form-is-autocomplete { margin: 8px 4px }
.task-form-save-field {
   margin-right: 6px;
   font-size: 14px;
   color: #333;
}
.task-form-field-info-button {
   margin-right: 6px;
   color: #888;
}
.task-field-info-title { font-family: 'Roboto-Regular' }
.task-form-field-info-form {
   font-family: 'Roboto-Regular';
   background-color: #eee;
   border-radius: 6px;
   font-size: 14px;
   padding: 6px;
}
.task-form-refresh { margin-right: 12px }
.field-info-label {
   min-width: 56px;
   max-width: 58px;
   width: 58px;
}
.task-form-main-fields {
   min-height: 40px;
   min-width: 100%;
}
.task-form-addition-title {
   font-family: 'Roboto-Regular';
   margin-left: 4px;
   font-size: 14px;
}
.task-form-addition-fields { padding: 6px 0 }
.task-field-title {
   font-family: 'Roboto-Regular';
   font-size: 14px;
}
.task-form-hidden-fields {
   visibility: hidden;
   overflow: hidden;
   max-height: 0px;
   height: 0px;
}
.task-form-pin-fields {
   margin-right: 12px;
   transition: 0.1s;
}
.task-form-pin-fields:hover { background-color: #e9dbff }
.task-form-is-pin-fields {
   background-color: #eccbf1;
   color: #4e3bff;
}
.task-form-actions-container { margin-right: 12px }
.task-form-actions { font-size: 20px }
.task-time-to-complete { background-color: #eee }
.task-time-to-complete-input { border-color: #ddd; background-color: #fff }
.task-item-bottom-block {
   justify-content: flex-start;
   min-height: 32px;
   margin-top: 4px;
   width: 100%;
}

.draggable.dragging {
   background-color: #fdfd96;
   opacity: .5;
}



.task-dialog-content { padding: 0 4px }
.tasks-set-container { margin-top: 16px }
.task-builder-item { width: 100% }
.task-builder-item:not(:first-child) { margin-top: 8px }
.task-builder-item > *:not(:first-child) { margin-left: 8px }
.task-favorite-button {
   border-radius: 40px;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
.task-item-control-row { width: 100% }
.task-option-cell { width: auto }
.task-control-cell { margin-left: 4px }
.task-item-control-container {
   position: relative;
   display: flex;
   flex-direction: column;
   align-items: stretch;
   background-color: #eee;
   border-radius: 6px;
   overflow: hidden;
   margin-top: 8px;
   padding: 4px;
   height: auto;
   width: 100%;
}
.task-item-top-block {
   justify-content: flex-start;
   min-height: 28px;
   height: 28px;
   width: 100%;
}
.task-form-toggle-field {
   margin-right: 8px;
}
.task-item-drag-helper {
   line-height: 18px;
   min-height: 18px;
   cursor: grab;
   height: 18px;
   width: 30px;
}
.task-item-drag-helper:after { content: "\e945" }
.task-item-drag-helper:active { cursor: grabbing }
.task-item-number {
   position: absolute;
   background-color: #0097a7;
   border-radius: 32px;
   text-align: center;
   line-height: 14px;
   margin-right: 0px;
   min-height: 14px;
   min-width: 14px;
   font-size: 10px;
   height: 14px;
   width: 14px;
   color: #fff;
   left: 12px;
   top: 3px;
}
.task-form-fileuploader-info {
   margin-left: auto;
   font-size: 12px;
   color: #888;
}
.task-item-compare-block {
   position: absolute;
   left: 40px;
   top: 1px;
}
.task-compare-button {
   min-height: 18px;
   min-width: 18px;
   font-size: 16px;
   height: 18px;
   width: 18px;
}
.task-noop-placeholder {
   background-color: #dfe2f3;
   padding: 0 8px;
}
.task-noop-placeholder-text {
   display: inline-block;
   line-height: 28px;
   min-height: 28px;
   margin-left: 4px;
   color: #bdbdbd;
   height: 28px;
}
.task-item-disabled { background-color: #eee }
.task-preset-item-name { margin-left: 8px }
.task-preset-item-actions > *:not(:first-child) { margin-left: 4px }
.task-preset-item-button {
   border-radius: 40px;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   height: 28px;
   width: 28px;
}
.task-form-add-fileuploader { margin-right: 6px }

.task-form-field-dragging {
   background-color: #fdfd96;
   opacity: .5;
}

/* Форма нового шаблону */
.simpletask-template-block {
   border: 1px solid #ddd;
   border-radius: 6px;
   margin-top: 8px;
   padding: 6px;
}
.simpletask-menu-service-item {
   font-weight: 600;
   color: #555;
}

/* Модуль Уточнення */
.form-textarea-box {
   display: inline-flex;
   position: relative;
   width: 100%;
}
.form-textarea {
   resize: none;
   display: block;
   width: 100%;
   background-color: #cfe6fe;
   border: 2px solid #ddd;
   padding: 6px;
   margin: 0 auto;
   font-size: 14pt;
}

#clarify-items {
   display: block;
   width: 100%;
   background-color: #fff;
   padding: 4px 6px;
}
.input-block {
   width: 100%;
   margin-bottom: 16px;
}
.input-label {
   margin: 0;
   padding: 0;
   font-family: 'Nunito';
   font-size: 10pt;
}
.input-block input,
.input-block select {
   width: 100%;
   height: 32px;
   line-height: 32px;
   padding: 0 8px;
   font-family: 'Nunito';
   font-size: 12pt;
   border: 1px solid #ccc;
}
.input-block textarea {
   width: 100%;
   height: 100px;
   border: 1px solid #ccc;
   resize: none;
}
.clarify-item {
   position: relative;
   width: 100%;
   height: 32px;
   margin-bottom: 16px;
}
.clarify {
   position: relative;
   width: 100%;
}
#clarify-items > :not(:first-child) {
   margin-top: 8px;
}
#clarify-top-panel {
   width: 100%;
   position: relative;
   height: 40px;
   padding: 0 4px;
   margin-bottom: 6px;
   background-color: #fff;
   font-family: 'Nunito';
   font-size: 10pt;
}
#country-limit-item {
   float: right;
   height: 40px;
   margin-right: 8px;
   overflow: hidden;
}
.actions-block {
   padding: 4px;
   background-color: #fff;
}
.action-button {
   display: inline-block;
   margin-top: 2px;
   float: left;
   height: 36px;
   line-height: 36px;
   text-align: center;
   font-family: 'Nunito';
   font-size: 10pt;
   padding: 0 16px;
   cursor: pointer;
}
#share-button {}
#share-button:active {
   background-color: #03a9f4;
}
#share-button:hover,
.item-button:hover,
.action-button:hover,
.clarify-date-preset:hover {
   background-color: #d0daff;
}
.share-link-button {
   display: inline-block;
   width: 20%;
   height: 42px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 40px;
   cursor: pointer;
}
#share-sms {
   background-image: url(../img/share/sms.svg);
}
#share-twitter {
   background-image: url(../img/share/twitter.svg);
}
#share-telegram {
   background-image: url(../img/share/telegram.svg);
}
#share-whatsapp {
   background-image: url(../img/share/whatsapp.svg);
}
#share-viber {
   background-image: url(../img/share/viber.svg);
}
#share-task {
   background-image: url(../img/share/task.png);
}
#clarify-message-panel {
   width: 100%;
   padding: 6px;
   background-color: #fff;
}
.clarify-form-label {
   padding: 0;
   margin: 0;
   margin-bottom: 4px;
}
#clarify-textarea {
   width: 100%;
   height: 3em;
   resize: none;
   border: 1px solid #ccc;
}
#clarify-form-date-block {
   display: flex;
   position: relative;
   width: 100%;
}
.clarify-date-input {
   display: inline-block;
   width: 50%;
   height: 32px;
   border: 1px solid #ccc;
   padding: 4px;
   font-size: 10pt;
   margin-right: 4px;
   cursor: pointer;
}
#clarify-preset-date-block {
   width: 100%;
   margin-top: 8px;
}
.clarify-date-preset {
   display: inline-block;
   padding: 0 16px;
   height: 32px;
   line-height: 32px;
   cursor: pointer;
}
.clarify-botttom-panel {
   display: flex;
   position: relative;
   width: 100%;
   height: 36px;
   padding: 2px;
   background-color: #fff;
}
.clarify-add-item {
   display: flex;
}
#clarify-add-button {
   display: inline-block;
   width: 32px;
   height: 32px;
   border-radius: 50%;
   margin-left: 3px;
   background-image: url(../img/clarify-add.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 22px;
   cursor: pointer;
}
#clarify-add-button:hover {
   background-color: #eee;
}
.clarify-add-label {
   display: inline-block;
   height: 32px;
   line-height: 32px;
   margin-left: 4px;
}

/* Popup-вікно (модуля Уточнення) */
.editor-input {
   display: block;
   width: 100%;
   height: 32px;
   border: 2px solid #ddd;
   border-radius: 2px;
   padding: 4px;
   font-size: 10pt;
}
.editor-bottom {
   margin-top: 16px;
}
.editor-button {
   display: inline-block;
   width: 120px;
   height: 32px;
   background-color: #1976d2;
   border-radius: 2px;
   color: #fff;
   font-size: 10pt;
   font-weight: bold;
   text-align: center;
   line-height: 32px;
   cursor: pointer;
}
.next-button {
   margin-left: 12px;
}
.clarify-region-item {
   background-color: #e0f7fa;
}

.popup-input-block {
   position: relative;
}
.popup-form .popup-input-block:not(:last-child) {
   margin-top: 8px;
}
.popup-input-box {
   position: relative;
}
#waybill-device-list-box {
   border-radius: 6px;
}
.waybill-button-panel {}
.waybill-form-label {
   width: 100%;
   margin: 0;
   padding: 0;
   font-size: 11pt;
}
.waybill-input {
   width: 100%;
   height: 32px;
   padding: 4px;
   line-height: 32px;
   border: 1px solid #ccc;
   font-size: 11pt;
}
.waybill-type-block {
   width: 100%;
   margin-top: 8px;
}
.waybill-switch-block {
   display: flex;
   font-size: 10pt;
   height: 24px;
   line-height: 24px;
}
.waybill-type1,
.waybill-type2 {
   display: inline-block;
}
.waybill-type1 {
   margin-right: -20px;
}
.waybill-type2 {
   margin-left: 8px;
}
.waybill-type-switch {
   width: 37px;
   border: 2px solid #1976d2;
   background-color: inherit;
}
.waybill-type-switch:active {
   background-color: inherit;
}
.waybill-type-switch:after {
   width: 15px;
   height: 15px;
   top: 1px;
   left: 2px;
   background: #1976d2;
}
.switch-checkbox:checked + .waybill-type-switch {
   background-color: inherit;
}
.waybill-day {
   display: inline-flex;
   width: 48px;
   height: 20px;
   line-height: 20px;
}
.waybill-days-block {
   display: none;
   position: relative;
   height: 21px;
   margin-top: 8px;
}
.waybill-checkmark {
   position: relative;
   display: inline-block;
}
.checkbox-label {
   margin-left: 4px;
   font-size: 9pt;
}
.waybill-table {
   table-layout: fixed;
   margin-top: 8px;
   font-size: 10pt;
}
.waybill-table td {
   border: 1px solid #ccc;
   padding: 4px;
}
.waybill-table-head {
   font-weight: bold;
   background-color: #f1f2f6;
}
.waybill-time-input {
   width: 100%;
   border: none;
   height: 27px;
   padding: 0 4px;
}
.popup-input-drop-down {
   display: inline-block;
   position: absolute;
   top: 0;
   right: 0;
   width: 32px;
   height: 32px;

   background-image: url(../img/clarify/drop-down.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 22px;
   cursor: pointer;
}
.popup-input-drop-down:active {
   background-color: #ccc;
}
.waybill-device-list-item {
   margin: 0;
   padding: 8px;
   font-size: 11pt;
   cursor: pointer;
}
.waybill-device-list-item:hover {
   background-color: #eee;
}
.not-cpr-type {
   background-color: #ffbab5;
}
.waybill-table-region-name {
   max-width: 167px;
}
.waybill-table-region-time {
   padding: 0 !important;
   width: 80px;
   max-width: 80px !important;
}

/* Модуль Тарифи */
#billing-content .dx-datagrid-total-footer { display: none }
.billing-top-panel {
   border-bottom: 1px solid #ddd;
   overflow: hidden;
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
}
#billing-search-container { margin-right: 8px }
#billing-filter-indicator { left: 198px }
#billing-main-menu-container { margin-left: 8px }
#billing-container .dx-datagrid-total-footer { display: none }
.billing-middle-container { height: calc(100% - 80px) }
#billing-scroll-block {
   overflow: auto;
   height: 100%;
   width: 100%;
}
.billing-toggle-sidebar-button { transition: all 0.6s ease-out }
.billing-toggle-sidebar-button:hover {
   background-color: #a26eff;
   color: #772bff;
}
.billing-toggle-sidebar-button-select {
   background-color: #8745ff;
   color: #e1d0ff;
}
.billing-sidebar-period-container { margin-top: 16px }
#billing-total-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   font-family: 'Roboto-Regular';
   background-color: #ececec; /* #00bcd4; */
   border-top: 1px solid #ddd;
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
}
/*#billing-profile-panel {
   display: flex;
   height: 40px;
   background-color: #fff;
   align-items: center;
}
.billing-profile-button {
   height: 32px;
   padding: 0 24px;
   text-align: center;
   line-height: 32px;
   background-color: #64b5f6;
   border-radius: 4px;
   margin: 0 4px;
   cursor: pointer;
   color: #fff;
}
.billing-profile-button-selection {
   background-color: #ac8;
   background-image: url(../img/check.svg);
   background-repeat: no-repeat;
   background-position: 4px;
   background-size: 14px;
}*/
.billing-button-disable { color: #ccc }

/* Угоди* */
.deal-module {
   display: flex;
   flex-direction: column;
   position: relative;
   height: 100%;
}
.deal-top-panel {
   border-bottom: 1px solid #ddd;
   overflow: hidden;
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
}
#deal-search-container { margin-right: 8px; width: 100% }
.deal-search-input-v2 {
   background-color: #fff;
   border-radius: 80px;
   padding: 0 16px;
}
#deal-main-menu-container { margin-left: 8px }
#deal-total-count-container { display: none }
#deal-container .dx-datagrid-total-footer { display: none }
.deal-middle-container { height: calc(100% - 80px) }
#deal-scroll-block {
   overflow: auto;
   height: 100%;
   width: 100%;
}
.deal-toggle-sidebar-button { transition: all 0.6s ease-out }
.deal-toggle-sidebar-button:hover {
   background-color: #a26eff;
   color: #772bff;
}
.deal-toggle-sidebar-button-select {
   background-color: #8745ff;
   color: #e1d0ff;
}
.deal-sidebar-period-container { margin-top: 16px }
#deal-total-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   font-family: 'Roboto-Regular';
   background-color: #ececec; /* #00bcd4; */
   border-top: 1px solid #ddd;
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
}
#deal-mode-popup-panel {
   position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-top: 8px;
}
.deal-scenario-filter-block { width: auto }
/* Угода (картка) */
.upd-deal-form { padding: 0 4px }
.deal-form-top-block {
   position: -webkit-sticky;
   background-color: #fff;
   line-height: 40px;
   min-height: 40px;
   position: sticky;
   z-index: 12;
   height: 40px;
   width: 100%;
   top: 0;
}
.deal-form-title {
   min-width: fit-content;
   width: fit-content;
   margin-right: 8px;
}
.deal-form-id-label {
   font-family: 'Roboto-Regular';
   background-color: #c2e7ff;
   border-radius: 40px;
   line-height: 24px;
   min-height: 24px;
   cursor: pointer;
   padding: 0 10px;
   font-size: 14px;
   color: #3f51b5;
   height: 24px;
}
.deal-form-id-label-value { margin-left: 2px }
.deal-form-main-block {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   position: relative;
   height: 100%;
   width: 100%;
}
.deal-form-left-block,
.deal-form-right-block {
   position: relative;
   margin-top: 8px;
   padding: 0 4px;
   flex-shrink: 0;
   flex-grow: 1;
   height: 100%;
   width: 100%;
}
.deal-form-block-top {
   background-color: #fff;
   position: -webkit-sticky;
   position: sticky;
   height: 32px;
   width: 100%;
   z-index: 11;
   top: 40px;
}
.deal-form-right-block-item {
   display: none;
   flex-shrink: 0;
   flex-grow: 1;
}
.deal-right-mode-container { width: 100% }
.deal-multiplex-item {
   border: 1px solid #ccc;
   border-radius: 6px;
   padding: 6px;
}
.deal-control-container { width: 100% }
.deal-control-item {
   margin-top: 8px;
   width: 100%;
}
.deal-control-item > *:not(:first-child) { margin-left: 6px }
.deal-control-item-upd {}
.deal-control-item-del { color: red }
.deal-multiplex-panel {
   line-height: 28px;
   min-height: 28px;
   height: 28px;
   width: 100%;
}
.deal-multiplex-label {
   display: inline-block;
   line-height: 24px;
   min-height: 24px;
   height: 24px;
}
.deal-card-name-info { font-size: 24px }
.deal-goods-summary { margin-top: 8px }
.deal-goods-summary th,
.deal-goods-summary td {
   font-size: 14px;
   background-color: #f6f6f7;
   border: 1px solid #ccc;
   padding: 4px 8px;
}
.deal-goods-summary th {
   background-color: #f6f6f7;
   color: #777;
}
.deal-goods-count,
.deal-goods-total { height: 28px }
.deal-goods-count { width: 120px }
.deal-priority-block {
   justify-content: space-between;
   margin-bottom: 8px;
   margin-top: 16px;
   width: 100%;
}
.deal-form-file-panel {
   min-height: 28px;
   height: 28px;
   width: 100%;
}
.deal-form-add-file-item { font-size: 20px }
.deal-form-file-panel-label { margin-left: 4px }
.deal-form-file-block {
   margin-top: 8px;
   margin-bottom: 8px;
}
.deal-fileuploader-container {
   height: 40px;
   width: 96px;
}
.deal-fileuploader-container .dx-fileuploader-wrapper { padding: 0 }
.deal-fileuploader-container .deal-fileuploader-container {
   padding: 0;
   width: 0;
}
.deal-fileuploader-container .dx-button-content { padding: 4px 16px }
.deal-fileuploader-container .dx-fileuploader-input-wrapper::before {
   padding-top: 0
   margin-top: 0
}
.deal-fileuploader-container .dx-fileuploader-input-wrapper::after {
   padding-top: 0
   margin-top: 0
}
.deal-fileuploader-container .dx-fileuploader-input-wrapper { padding: 3px 0 }
.deal-form-console-container {
   display: none;
   position: fixed;
   box-shadow: 0px -2px 8px 0px #0000004f;
   border-top-right-radius: 8px;
   border-top-left-radius: 8px;
   background-color: #d4e3ff;
   overflow: hidden;
   width: 100%;
   z-index: 12;
   bottom: 0;
   left: 0;
}
.deal-form-toolbar {
   background-color: #3c6eff;
   min-height: 32px;
   height: 32px;
   width: 100%;
}
.deal-form-console {
   padding: 16px;
   width: 100%;
}
.deal-form-console-icon {
   line-height: 32px;
   margin-left: 14px;
   min-height: 32px;
   min-width: 32px;
   font-size: 32px;
   height: 32px;
   width: 32px;
}
.deal-form-toolbar-close {
   margin-right: 4px;
   color: #ccdeff;
}
.deal-form-response-info {
   background-color: #b5cfff;
   border-radius: 8px;
   overflow: hidden;
   padding: 8px;
}
.deal-form-response-table { background-color: #cbddff }
.deal-form-response-table td {
   vertical-align: middle;
   padding: 4px;
}
.deal-form-response-icon {
   display: inline-block;
   line-height: 22px;
   font-size: 16px;
   height: 22px;
}
.deal-form-response-table tr:nth-child(even) { background-color: #b5cfff }
.deal-form-response-name {
   min-width: 74px;
   width: 74px;
}
.deal-form-response-text,
.deal-form-response-error,
.deal-form-response-warning {
   background-color: #ffd168;
   border-radius: 6px;
   margin-top: 8px;
   padding: 8px;
}
.deal-form-response-warning { background-color: #ffd168 }
.deal-form-response-error { background-color: #fa6e79 }
.deal-departure-block { background-color: #e9f1ff }
.deal-invoices-total-label { color: #888 }
.deal-invoices-total { margin: 0 8px }

.task-color-item {
   display: inline-block;
   border-radius: 50%;
   cursor: pointer;
   height: 24px;
   width: 24px;
}
.task-color-item:not(:first-child),
.task-order-item:not(:first-child) { margin-left: 8px }
.task-color-red {
   background-color: #f44336;
   border: 2px solid #f44336;
}
.task-color-yellow {
   background-color: #ffc107;
   border: 2px solid #ffc107;
}
.task-color-green {
   background-color: #388e3c;
   border: 2px solid #388e3c;
}
.task-color-none {
   background-color: #ccc;
   border: 2px solid #ccc;
}
.task-order-item {
   display: inline-block;
   border: 2px solid #ccc;
   border-radius: 50%;
   text-align: center;
   line-height: 20px;
   cursor: pointer;
   font-size: 9pt;
   height: 24px;
   width: 24px;
}
.task-order-none {
   background-image: url(../img/cross.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 14px;
}
.task-color-item-select {
   border-color: #1976d2 !important;
   background-image: url(../img/check.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 14px;
}
.task-order-item-select { border-color: #1976d2 !important }
/* Рядок шляху до сторінки */
.deal-status-flowline {
   align-items: flex-start;
   background-color: #fff;
   overflow: hidden;
   overflow-x: auto;
   height: 38px;
   width: 100%;
}
.deal-status-flowline-notype {
   text-align: center;
   line-height: 28px;
   color: #79869f;
   width: 100%;
}
.deal-status-flowline-item {
   position: relative;
   display: inline-block;
   background-color: #607d8b;
   white-space: nowrap;
   width: fit-content;
   line-height: 28px;
   padding: 0 40px;
   font-size: 11pt;
   color: #eee;
}
.deal-status-flowline-item:nth-child(even) { background-color: #455a64; }
.deal-status-flowline-item:hover,
.deal-status-flowline-item:nth-child(even):hover {
   background-color: #333;
   cursor: pointer;
   color: #ffd54f;
}
.deal-status-flowline-item:hover:after,
.deal-status-flowline-item:nth-child(even):hover:after { background-color: #333 }
.deal-status-flowline-item:after {
   content: '';
   position: absolute;
   transform: scale(0.707) rotate(45deg);
   background-color: #607d8b;
   border-radius: 0 5px;
   height: 28px;
   right: -14px;
   width: 28px;
   z-index: 1;
   top: 0;
}
.deal-status-flowline-item:nth-child(even):after { background-color: #455a64 }
.deal-status-flowline-item:last-child:after { content: none }

.deal-status-flowline-item-passed { background-color: #4caf50 !important }
.deal-status-flowline-item-passed:after { background-color: #4caf50 !important }
.deal-status-flowline-item-passed:nth-child(even):after { background-color: #4caf50 !important }
.deal-status-flowline-item-passed:nth-child(even) { background-color: #4caf50 !important }
.deal-status-flowline-item-passed:nth-child(even):hover:after { background-color: #4caf50 !important }

.deal-right-menu-item { margin-right: 4px }
.deal-info-block {
   font-family: 'Roboto-Regular';
   background-color: #eee;
   border-radius: 6px;
   font-size: 14px;
   padding: 8px;
}
.deal-info-table-head {
   background-color: #eee;
   font-weight: normal;
   line-height: 32px;
   height: 32px;
   color: #888;
}
.deal-info-label {
   max-width: 80px;
   min-width: 80px;
   width: 80px;
}
.deal-talking-room-form {
   position: relative;
   padding-top: 8px;
   width: 100%;
}
.deal-talking-room-textarea {
   min-height: 38px;
   width: 100%;
}
.deal-talking-room-send {
   line-height: 32px;
   margin-left: 8px;
   min-height: 32px;
   min-width: 32px;
   height: 32px;
   width: 32px;
}
.deal-talking-room-info {
   line-height: 16px;
   min-height: 16px;
   padding: 0 6px;
   height: 16px;
   width: 100%;
}
.deal-talking-room-info-indicator {
   display: none;
   background-image: url(../img/talkroom-preloader.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 26px;
   min-height: 16px;
   min-width: 24px;
   height: 16px;
   width: 24px;
}
.deal-talking-room-info-text {
   line-height: 16px;
   margin-left: 4px;
   font-size: 10px;
   height: 16px;
}
.deal-comment-item {
   background-color: #e1f6d7;
   border-radius: 6px;
   margin-top: 8px;
   padding: 12px;
}
.deal-comment-top {
   min-height: 24px;
   font-size:11px;
   height: 24px;
   width: 100%;
}
.deal-comment-text { margin-top: 8px }
.deal-tasks-list,
.deal-departure-list { padding-top: 8px }
.deal-depatrure-card { box-shadow: 0 0 2px #777 }
.deal-departure-filter-container,
.deal-tasks-filter-container { width: 100% }
.deal-tasks-search-input { background-color: #fff }
.departure-card {
   box-shadow: 0 0 1px #000;
   border-radius: 6px;
   margin-top: 8px;
   padding: 4px 12px;
}
.departure-card-top {
   border-bottom: 1px solid #ddd;
   padding-bottom: 4px;
   min-height: 32px;
   height: 32px;
}
.departure-card-count {
   border: 1px solid #ddd;
   border-radius: 40px;
   text-align: center;
   line-height: 20px;
   min-height: 20px;
   min-width: 20px;
   font-size: 10px;
   height: 20px;
   width: 20px;
}
.departure-card-item {
   line-height: 24px;
   min-height: 24px;
}
.departure-card-item { margin-top: 8px }
.departure-card-label { margin-right: 4px }
.deal-rating-container { height: 32px }
.deal-form-rating-info {
   margin-top: 8px;
   min-height: 32px;
}
.deal-grid-status {
   background-color: #8ee;
   border-radius: 40px;
   width: fit-content;
   line-height: 20px;
   min-height: 20px;
   font-size: 12px;
   padding: 0 12px;
   height: 20px;
}
.deal-item-status-icon {
   border-radius: 24px;
   margin-right: 8px;
   min-height: 14px;
   min-width: 14px;
   height: 14px;
   width: 14px;
}
.deal-status-color-0 { background-color: #aaa }
.deal-status-color-1661 { background-color: #d9d9d9 }
.deal-status-color-1662 { background-color: #ffc107 }
.deal-status-color-1663 { background-color: #64b5f6 }
.deal-status-color-1664 { background-color: #ce93d8 }
.deal-status-color-1665 { background-color: #80cbc4 }
.deal-status-color-1699 { background-color: lightgreen }
.deal-status-color-1666 { background-color: #d4e157 }
.deal-status-color-1667 { background-color: #f8bbd0 }
.deal-status-color-1668 { background-color: #bcaaa4 }
.deal-status-color-1700 { background-color: #d9d9d9 }
.deal-status-color-1701 { background-color: #ffe28c }
.deal-status-color-1706 { background-color: #c5a4ff }
.deal-status-color-1707 { background-color: #60edff }
.deal-status-color-1708 { background-color: #bfe949 }
.deal-status-color-1709 { background-color: #ff6c9e; color: #fff }
.deal-status-color-1710 { background-color: #7e92ff }
.deal-waybill-list:first-child { margin-top: 8px }
.deal-go-to-accounting { color: #00ab00 }
#deal-container .dx-datagrid-content .dx-datagrid-table .dx-row > td,
#deal-container .dx-datagrid-content .dx-datagrid-table .dx-row > tr > td {
   vertical-align: middle;
}
.deal-invoice-table th {
   background-color: #ddd;
   border: 1px solid #fff;
   text-align: left;
   padding: 2px 6px;
   color: #777;
}
.deal-invoice-table td {
   border: 1px solid #ddd;
   padding: 2px 6px;
}
.deal-invoice-goods-title th {
   background-color: #fff;
   border: 1px solid #ddd;
   text-align: center;
}
.deal-invoice-table th:first-child,
.deal-invoice-goods-head th:first-child { border-left: 1px solid #ddd }
.deal-invoice-table th:last-child
.deal-invoice-goods-head th:last-child { border-right: 1px solid #ddd }
.deal-invoice-table-main { background-color: #c2ecff }
.deal-invoice-cached { color: #eb8c00 }
.deal-invoice-top-panel {
   background-color: #eee;
   border-radius: 6px;
   margin-bottom: 4px;
   min-height: 32px;
   margin-top: 8px;
   width: 100%;
}
.deal-invoice-card {
   background-color: #eee;
   border-radius: 8px;
   margin: 4px 0;
   padding: 8px;
}
.deal-invoice-card-panel {
   min-height: 38px;
   height: 38px;
   width: 100%;
}
.deal-invoice-card-title {
   background-color: #ffd400;
   border-radius: 32px;
   line-height: 24px;
   min-height: 24px;
   padding: 0 14px;
   color: #ff0000;
   height: 24px;
}
.deal-invoice-nodata {
   text-align: center;
   line-height: 40px;
   min-height: 40px;
   height: 40px;
   width: 100%;
   color: #888;
}
.deal-invoice-history-table { background-color: #f0f4f9 }
.deal-invoice-history-info { margin-top: 8px }
.deal-accountant-info-container,
.deal-act-works-container {
   border: 1px solid #ddd;
   border-radius: 6px;
   padding: 8px;
}
.deal-zero-item { color: #8e8e8e }
.deal-accountant-info-item { margin: 4px 0 }
.deal-accountant-info-cp1 {
   color: #888;
   padding: 0;
   margin: 0;
}
.deal-accountant-info-field {}
.deal-accountant-info-label {
   font-weight: 600;
   color: #555;
}
.deal-accountant-info-text {}
/* Calendar block */
.module-panel {
   padding: 2px;
   margin-bottom: 4px;
   background-color: #fff;
}
.datebox-drop-down-button {
   width: 30px;
   height: 30px;
   background-image: url('../img/date.svg');
   background-repeat: no-repeat;
   background-position: center;
   background-size: 18px;
}
.calendar-button {
   width: 32px;
   height: 30px;
   background-image: url('../img/date.svg');
   background-repeat: no-repeat;
   background-position: center;
   background-size: 24px;
}
.period-buttons {
   position: relative;
   width: 36px;
   height: 36px;
   margin: 0 auto;
   border-radius: 50%;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 24px;
   cursor: pointer;
}
.period-buttons:hover {
   background-color: #eee;
}
.period-buttons:active {
   background-color: #bbdefb;
}
#deal-date-back {
   background-image: url(../img/back.svg);
}
#deal-date-prev {
   background-image: url(../img/next.svg);
}
#calendar-container,
#subdeal-calendar-container {
   overflow: hidden;
}
#mode-popup-panel,
#calendar-popup-panel,
#gtasks-mode-popup-panel,
#gtasks-calendar-popup-panel {
   position: relative;
   display: flex;
   margin-bottom: 8px;
   justify-content: center;
}
.popup-calendar-buttons {
   display: inline-block;
   flex-grow: 1;
   height: 32px;
   padding: 0 16px;
   line-height: 28px;
   text-align: center;
   border: 2px solid #1976d2;
   cursor: pointer;
}
.popup-calendar-buttons:active {
   background-color: #e3f2fd;
}
#calendar-popup-panel :first-child,
#gtasks-calendar-popup-panel :first-child {
   border-top-left-radius: 6px;
   border-bottom-left-radius: 6px;
   border-right: 1px;
}
#calendar-popup-panel :last-child,
#gtasks-calendar-popup-panel :last-child {
   border-top-right-radius: 6px;
   border-bottom-right-radius: 6px;
}

/* Посилання на Веб-Форми */
#forms {
   margin-top: -6px;
}
#forms-title {
   width: 100%;
   padding: 0 24px;
   padding-top: 24px;
   background-color: #fff;
   font-size: 16pt;
}
#forms-container {
   display: flex;
   flex-direction: column;
   width: 100%;
   padding: 24px;
   background-color: #fff;
}
.forms-link {
   display: inline-block;
   width: auto;
   height: 32px;
   line-height: 32px;
   padding: 0 8px;
   padding-left: 32px;
   margin: 4px 0;
   border-radius: 6px;

   background-image: url(../img/link.svg);
   background-repeat: no-repeat;
   background-position: 8px center;
   background-size: 14px;
}
.forms-link:hover {
   background-color: #d8f5f8;
}

/* Компанії (таблиця) */
#container .dx-datagrid-headers { border-bottom: none }
#container .dx-datagrid-header-panel { padding-top: 6px }
#container .dx-datagrid-header-panel .dx-toolbar { margin-bottom: 6px }
#container .dx-button { border-width: 2px }
#container .dx-button-mode-contained { border-color: #4482cf }
#container .dx-datagrid-search-panel { border: 2px solid #4482cf }
#container .dx-toolbar-before { margin-left: 8px }
#container .dx-toolbar-after { margin-right: 8px }
#container .dx-datagrid-group-panel .dx-group-panel-item {
   border: 2px solid #4482cf;
   border-radius: 4px;
}
.companies-link-button {
   display: inline-block;
   text-align: center;
   line-height: 24px;
   border-radius: 50%;
   height: 24px;
   width: 24px;
   color: #1976d2;
   cursor: pointer;
}
.companies-span-warning {
   display: inline-block;
   width: auto;
   height: 20px;
   line-height: 19px;
   padding: 0 16px;
   padding-left: 32px;
   border-radius: 20px;
   background-color: #ffb300;
   color: #fff;
   margin-bottom: 8px;

   background-image: url(../img/warning-red.svg);
   background-repeat: no-repeat;
   background-position: 2px center;
   background-size: 18px;
}
#container .dx-header-filter { font-size: 12px }

.simpletask-file-block { flex-direction: column }
.simpletask-file-item {
   display: flex;
   flex-direction: row;
   align-items: center;
   width: 100%;
}
.simpletask-edit-file-list-block {
   flex-direction: column;
   min-height: 52px;
   width: 100%;
   border: 1px solid #ddd;
   border-radius: 6px;
   padding: 8px;
   overflow: hidden;
   overflow-y: auto;
}
.simpletask-edit-file-item {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   border-radius: 24px;
   padding-left: 8px;
   margin: 4px;
   width: 100%;
   height: 24px;
   cursor: default;
}
.simpletask-edit-file-item:hover { background-color: #f8f8f8 }
.simpletask-edit-file-name {
   display: inline-block;
   font-family: 'Roboto-Regular';
   line-height: 24px;
   font-size: 12px;
   height: 24px;
   width: auto;
}
.simpletask-edit-file-remove {
   display: inline-block;
   height: 24px;
   width: 24px;
   font-size: 18px;
   line-height: 24px;
   border-radius: 24px;
   text-align: center;
   color: #f44336;
   cursor: pointer;
}
.simpletask-file-item:not(:first-child) { margin-top: 6px }
.taskcp4-fileuploader-container { display: inline-block }
.taskcp4-selected-files {
   display: inline-block;
   min-height: 30px;
   width: calc(100% - 116px);
   border-radius: 6px;
   background-color: #ecf9ff;
   padding: 4px;
}
.taskcp4-fileuploader-add {
   display: inline-block;
   height: 24px;
   width: 24px;
   border-radius: 24px;
   text-align: center;
   line-height: 24px;
   cursor: pointer;

   background-image: url(../img/plus-circle.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 20px;
}
.simpletask-file-item-remove {
   display: inline-block;
   text-align: center;
   line-height: 28px;
   border-radius: 28px;
   margin-left: 4px;
   font-size: 21px;
   color: #f44336;
   height: 28px;
   width: 28px;
   cursor: pointer;
}

/* Утиліти */
.tool-preloader {
   display: none;
   background-image: url('../img/preloader-gear.svg');
   background-clip: content-box;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 40px;
   margin-left: 16px;
   height: 32px;
   width: 32px;
}
.tool-module-container {
   display: flex;
   flex-direction: column;
   background-color: #fff;
   height: calc(100% - 8px);
   border-radius: 4px;
   margin: 0 auto;
   padding: 16px;
   width: 96%;
}
.tool-module-title {
   margin-bottom: 16px;
   font-size: 24px;
}
.tool-module-item { display: inline-flex }
.tool-module-item-label {
   line-height: 28px;
   height: 28px;
}
.tools-move-item-50 {
   max-width: 47%;
   width: 47%;
}
.tools-move-v-item {
   display: flex;
   flex-direction: column;
   width: 100%;
}
.tools-move-h-item {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: flex-end;
   overflow: hidden;
   width: 100%;
}
.tool-module-control-container {
   height: 32px;
   width: 100%;
}
.tool-move-add-button-block { align-items: flex-end }
#tool-move-devices-add-button {
   border-radius: 24px;
   text-align: center;
   line-height: 28px;
   font-size: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
.tool-device-move-del {
   border-radius: 24px;
   text-align: center;
   line-height: 24px;
   cursor: pointer;
   font-size: 18px;
   margin: 0 auto;
   color: #f44336;
   height: 24px;
   width: 24px;
}
.tool-module-button { font-weight: normal }
.tool-device-move-count-label {}
.tool-device-move-count-value { margin-left: 6px }
.tool-device-move-count-units { margin-left: 4px }
#tool-move-device-list {
   position: relative;
   height: calc(100% - 128px);
   margin-top: 16px;
   overflow: auto;
   width: 100%;
}
#tool-device-move-table {
   table-layout: fixed;
   width: 100%;
}
#tool-device-move-table td {
   border: 1px solid #ddd;
   padding: 4px 8px;
}
.tool-device-move-cell-idx { width: 80px }
.tool-device-move-cell-id { width: 100px }
.tool-device-move-cell-imei { width: 180px }
.tool-device-move-cell-device { width: 40% }
.tool-device-move-cell-client { width: 40% }
.tool-device-move-cell-del {
   vertical-align: middle;
   text-align: center;
   width: 80px;
}
.tool-device-move-table-head {
   background-color: #f2f2f2;
   position: sticky;
   z-index: 1;
   top: 0;
}
.tool-device-move-table-head-cell {
   background-color: #f2f2f2;
   font-size: 14px;
   color: #888;
}
#tool-device-move-nodata {
   position: absolute;
   transform: translate(-50%, -50%);
   text-align: center;
   width: fit-content;
   line-height: 32px;
   padding: 0 6px;
   margin: 0 auto;
   height: 32px;
   left: 50%;
   top: 50%;
}
.tool-module-bottom-panel {
   justify-content: flex-start;
   margin-top: 16px;
}
#tool-module-move-title {
   background-image: url(../img/swap-driving.svg);
   background-repeat: no-repeat;
   background-position: left center;
   background-size: 28px;
   padding-left: 40px;
   margin-left: auto;
}
.tools-selector-item-row { border-bottom: 1px solid #ccc; padding: 0 }
.tools-selector-item-row:first-child { border-top: 1px solid #ccc }
.tools-selector-item-cell {
   display: inline-block;
   border-left: 1px solid #ccc;
   overflow: hidden;
   font-size: 12px;
   padding: 0 6px;
   width: 20%;
}
.tools-selector-item-cell:last-child { border-right: 1px solid #ccc }
.tools-selector-item-imei { max-width: 128px }
.tools-table td {
   border: 1px solid #ccc;
   vertical-align: top;
   padding: 4px 8px;
}
.tools-table-head {
   background-color: #e4e4e4;
   color: #888;
}
#tool-device-move-table tr:hover { background-color: #f0f0f0 }
.tools-table-action-cell {
   vertical-align: middle;
   text-align: center;
   min-width: 54px;
}
.tools-table-title-cell { font-weight: bold }
.tool-delete-points-highlight-edited { background-color: #ffa7a1 }
.tool-ang-value-row:hover { background-color: #eee }
/* Видалення точок */
.delete-points-container {
   display: flex;
   flex-direction: column;
   height: 100%;
}
.tool-delete-points-top-panel {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-bottom: 8px;
   height: 40px;
   width: 100%;
}
#tool-delete-points-title {
   padding-left: 40px;
   background-image: url(../img/location-disabled.svg);
   background-repeat: no-repeat;
   background-position: left center;
   background-size: 28px;
   min-height: 40px;
   margin-left: auto;
   font-size: 24px;
}
.delete-points-daterange-block {
   background-color: #e0e0e0;
   border-radius: 6px;
   padding: 8px;
}
.delete-points-search-input {
   background-color: #fff;
   padding-left: 8px;
   line-height: 32px;
   border-radius: 3px;
   height: 32px;
}
.delete-points-time-input {
   background-color: #fff;
   border-radius: 3px;
   line-height: 32px;
   font-size: 14px;
   padding: 0 6px;
   height: 32px;
}
.delete-points-clear-button { background-color: #f57c00; font-size: 14px }
.delete-points-comment-block { margin-bottom: 8px }
#tool-delete-points-list-container,
#tool-delete-points-history-container {
   overflow: hidden;
   min-height: 30px;
   margin-top: 8px;
}
#tool-delete-points-get-points {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   background-color: #5c6bc0;
   border-radius: 32px;
   text-align: center;
   line-height: 28px;
   cursor: pointer;
   margin: 8px 0;
   height: 28px;
   width: 100%;
   color: #fff;
}
.tool-get-points-icon {
   line-height: 28px;
   font-size: 14px;
   height: 28px;
   width: 28px;
}
.tool-get-points-label {
   line-height: 28px;
   height: 28px;
}
.tool-delete-points-box {
   height: 100%;
   width: 100%;
}
.tool-delete-points-list-group {
   height: calc(100% - 64px);
   width: 100%;
}
.tool-delete-points-history-group {
   height: calc(100% - 20px);
   width: 100%;
}
#tool-delete-points-table-container,
.tool-delete-points-history-scroll-block {
   overflow: auto;
   margin: 4px 0;
   height: 100%;
   width: 100%;
}
.tool-delete-points-history-table-head {
   background-color: #e4e4e4;
}
.tool-delete-points-history-table-head td {
   border-top: 1px solid #ddd;
   border-bottom: 1px solid #ddd;
}
.tool-delete-points-history-table td {
   border: 1px solid #ccc;
   font-size: 13px;
   padding: 2px 8px;
}
.tool-history-nodata-row {
   text-align: center;
   color: #aaa;
}

/* Модуль Задачі/Угоди  */
#tasks {
   display: flex;
   flex-direction: column;
   overflow: hidden;
   height: 100%;
   width: 100%;
}
#tasks-bottom-panel {
   position: relative;
   background-color: #eee;
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
   width: 100%;
}
#tasks-filter-indicator {
   left: 24px;
   top: 2px;
}
.tasks-middle-container {
   align-items: flex-start;
   height: calc(100% - 40px);
}
.tasks-sidebar-amount-block {
    background-color: #eee;
    border-radius: 3px;
    padding: 8px;
}
.tasks-filter-default-container {
   background-color: #efefef;
   border-radius: 6px;
   height: 28px;
}
.tasks-search-container { margin-bottom: 8px }
.tasks-filter-search {
   min-height: 28px;
   height: 28px;
}
.tasks-filter-input {
   background-color: #fff;
   line-height: 28px;
   border-radius: 3px;
   min-height: 28px;
   height: 28px;
   width: 100%;
}
.tasks-filter-clear { font-size: 18px }
.tasks-color-item {
    display: inline-block;
    border-radius: 50%;
    min-height: 20px;
    min-width: 20px;
    cursor: pointer;
    height: 20px;
    width: 20px;
}
.tasks-order-item {
    display: inline-block;
    border: 2px solid #ccc;
    border-radius: 50%;
    text-align: center;
    line-height: 18px;
    cursor: pointer;
    font-size: 9pt;
    height: 22px;
    width: 22px;
}
.tasks-color-item:not(:first-child),
.tasks-order-item:not(:first-child) { margin-left: 8px }
.tasks-color-item-select {
   border-color: #1976d2 !important;
   background-image: url(../img/check.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 12px;
}
.tasks-order-item-select { border-color: #1976d2 !important }
.tasks-priority-filter-block,
.tasks-filter-status-container,
.tasks-filter-department-container,
.tasks-filter-rating-container,
.tasks-filter-search-container { margin-top: 12px }
.tasks-refresh-button {
   margin-left: auto !important;
   color: #333;
}
#tasks-list {
   overflow-y: auto;
   padding: 0 4px;
   height: 100%;
   width: 100%;
}
#tasks .subdeal-card {
   margin: 6px auto;
   min-width: 100%;
   width: 100%;
}
#tasks-card-info-count { margin-left: auto }
#tasks-scenario-panel { min-width: 128px }
#tasks-card-filter {
   background-color: #fff;
   padding: 16px;
   border-radius: 4px;
}
.tasks-scenario-filter-item {
   padding: 8px 14px;
   line-height: 18px;
   overflow: hidden;
   cursor: pointer;
   font-size: 14px;
   height: 32px;
}
.tasks-card-filter-popup-item-input { width: 100% }
#tasks-date-presets-container { width: 100% }
.tasks-date-presets-filter { width: 100% }
.tasks-date-presets-filter-button,
.gtasks-date-presets-filter-button {
   background-color: #fff;
   border: 2px solid #4482cf;
   line-height: 26px;
   padding: 0 16px;
   cursor: pointer;
}
.tasks-date-presets-filter-button-select,
.gtasks-date-presets-filter-button-select { background-color: #9bdfff }
#tasks-card-view-mode-panel {
   padding: 0;
   padding-right: 16px;
}
#tasks-status-filter-container {
   padding-bottom: 2px;
   overflow: hidden;
   overflow-x: auto;
}
#tasks-status-filter-container::-webkit-scrollbar { height: 8px }
.tasks-card-done-filter { width: 100% }
.tasks-card-done-filter-button {
   display: inline-block;
   height: 20px;
   line-height: 17px;
   text-align: center;
   padding: 0 16px;
   border: 2px solid #ccc;
   border-radius: 18px;
   font-family: "Roboto-Regular";
   color: #fff;
   font-size: 8pt;
   cursor: pointer;
}
.tasks-card-done-filter-button:not(:last-child) { margin-right: 4px }
.tasks-card-done-filter-select {
   position: relative;
   border-color: #000;
}
.tasks-card-done-filter-select:after {
   content: '';
   position: absolute;
   top: 4px;
   left: 4px;
   height: 9px;
   width: 9px;
   border-radius: 12px;
   background-color: #ff5722;
}
.tasks-card-done-filter-button-created { color: #333 }
.tasks-card-done-filter-button-started { background-color: #1976d2 }
.tasks-card-done-filter-button-done { background-color: #43a047 }
.tasks-card-done-filter-button-revision { background-color: #e91e63 }
.tasks-card-done-filter-button-postponed { background-color: #9c27b0 }
.tasks-card-done-filter-button-finished { background-color: #9acd32 }
#tasks-responsible-filter-container,
#tasks-company-filter-container {
   height: 32px;
   width: 100%;
}
.tasks-filter-hblock:not(:first-child) { margin-top: 24px }
#tasks-card-filter-input {
   height: 32px;
   width: 100%;
   line-height: 32px;
   border: 2px solid #ccc;
   border-radius: 6px;
   padding: 0 8px;
}
.tasks-card-filter-vblock {
   display: inline-flex;
   flex-direction: column;
   border: 1px solid #e0e0e0;
   border-radius: 6px;
   padding: 8px 16px;
   overflow: hidden;
}
.tasks-card-filter-vblock-duo { width: 49% }
.tasks-card-filter-label {
   margin-bottom: 4px;
   width: 100%;
}
.tasks-is-overdue {
   background-color: #f556;
   letter-spacing: 0.5px;
   border-radius: 40px;
   margin-bottom: 1px;
   text-align: center;
   line-height: 18px;
   cursor: default;
   font-size: 11px;
   height: 18px;
   width: 100%;
   color: #fff;
}
.tasks-card-results-info {
   font-style: italic;
   font-size: 12px;
   color: #888;
}
.tasks-card-results-separator {
   border: 0px;
   display: block;
   border-top: 1px solid #bbb;
   margin: 8px 0;
   height: 1px;
   padding: 0;
   width: 50%;
}
.tasks-search-input {
   height: 32px;
   border: none;
   border-radius: 0;
   border-top-left-radius: 4px;
   border-bottom-left-radius: 4px;
   background-color: #ecf9ff;
   line-height: 32px;
}
.tasks-no-data-container {
   text-align: center;
   height: calc(100% - 50px);
   width: 100%;
}
.tasks-back-to-all-button {
   position: sticky;
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: flex-start;
   box-shadow: 0 1px 4px 0 #d9d9d9;
   background-color: #b3e5fc;
   margin-bottom: 8px;
   margin-top: 8px;
   cursor: pointer;
   padding: 0 8px;
   z-index: 100;
   height: 40px;
   width: 100%;
   top: 0;
}
.tasks-back-to-all-button:active { background-color: #95deff }
#tasks-fold-button {
   margin-left: auto;
   font-weight: bold;
}

/* Календар  */
#scheduler-top-block,
#scheduler-filter-block,
#scheduler-scroll-block {
   width: 100%;
}
.module-top-panel {
   display: flex;
   align-items: center;
   flex-direction: row;
   width: 100%;
   height: 32px;
   background-color: #ffffff;
}
#gtasks-filter-scenario,
#scheduler-filter-scenario { margin-left: 8px }
.scheduler-top-item:not(:first-child) { margin-left: 8px }
.scheduler-top-input {
   border: none;
   border-right: 6px solid #ecf9ff;
   border-radius: 2px;
   background-color: #ecf9ff;
   padding: 0 8px;
   line-height: 32px;
   height: 32px;
}
#gtasks-filter-block,
#scheduler-filter-block {
   display: none;
   position: relative;
   flex-direction: row;
   background-color: #e9eef6;
   padding: 4px 0;
}
.scheduler-filter-hblock {
   display: flex;
   align-items: center;
   justify-content: flex-start;
   width: 100%;
}
.scheduler-filter-vblock {
   display: inline-flex;
   flex-direction: column;
   padding: 8px;
   overflow: hidden;
}
.scheduler-top-right-block {
   display: inline-flex;
   align-items: center;
   justify-content: flex-start;
   flex-wrap: wrap;
   margin-left: auto;
}
#scheduler-author-selector,
#scheduler-performer-selector {
   min-width: 180px;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   background-image: url(../img/triangle-down.svg);
   background-repeat: no-repeat;
   background-position: center right 6px;
   background-size: 9px;
}
#gtasks-open-filter-button,
#scheduler-open-filter-button {
   position: relative;
   display: inline-block;
   width: 28px;
   height: 28px;
   border-radius: 32px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 19px;
   cursor: pointer;
}
#gtasks-card-info-count,
#scheduler-card-info-count {
   background-color: #e9eef6;
   border-radius: 28px;
   padding-left: 14px;
   margin-left: auto;
   margin-right: 6px;
   min-width: 106px;
   padding: 0 8px;
}
.scheduler-item-details {
   opacity: .7;
   white-space: pre-wrap;
}
.dx-scheduler-work-space.dx-scheduler-work-space-month .dx-scheduler-header-panel-cell {
   height: 20px;
}
.dx-scheduler-header-panel {
   margin-top: 1px;
}
.dx-scheduler-all-day-appointment, .dx-scheduler-timeline .dx-scheduler-appointment, .dx-scheduler-work-space-month .dx-scheduler-appointment {
   -webkit-box-shadow: inset 2px 0 0 0 #2196f3;
   box-shadow: inset 2px 0 0 0 #2196f3;
}
option {
   background-color: #fff;
   outline: none;
}
option:checked {
   background-color: #ccc;
}
#scheduler-card-dialog .popup-top {
   margin-bottom: 0;
}
#scheduler-card-dialog .popup-body {
   overflow: hidden;
}
#scheduler-card-dialog .subdeal-card {
   padding: 1px;
   height: 100%;
}
#scheduler-card-dialog .subdeal-card-bottom { margin-top: auto }
.subdeal-card-middle { overflow: auto }
.dx-scheduler-work-space-mouse-selection .dx-scheduler-all-day-appointments,
.dx-scheduler-work-space-mouse-selection .dx-scheduler-fixed-appointments,
.dx-scheduler-work-space-mouse-selection .dx-scheduler-scrollable-appointments {
   pointer-events: auto;
}
.dx-scrollable-content { min-width: inherit !important }
.scheduler-filter-top-block { margin: 4px 0 }
.scheduler-filter-bottom-block { margin-top: 4px }
.scheduler-filter-reset {
   display: inline-block;
   height: 32px;
   line-height: 32px;
   padding: 0 16px;
   border-radius: 18px;
   color: #fff;
   background-color: #4482cf;
   margin-left: 8px;
   cursor: pointer;
}
.scheduler-filter-reset:active { background-color: #64b5f6 }
.scheduler-client-filter-block { width: 49% }
.scheduler-filter-active { background-color: #ffd54f }
#gtasks-filter-counter,
#scheduler-filter-counter {
   display: none;
   position: absolute;
   text-align: center;
   line-height: 14px;
   border-radius: 24px;
   background-color: #f44336;
   font-family: 'Mono Regular';
   font-size: 9px;
   color: #fff;
   height: 14px;
   width: 14px;
   left: 18px;
   top: 0px;
}
.scheduler-task-embedded { border-radius: 0 }
.scheduler-task-embedded:not(:first-child) {
   margin: 0;
   margin-top: 8px;
}
#scheduler-scenario-chain .popup-body { background-color: #ddd }
#scheduler-scenario-chain .popup-top { margin-bottom: 0 }

/* Задачі (таблиця) */
.gtasks-module {
   display: flex;
   flex-direction: column;
   height: 100%;
}
#gtasks-top-panel {
   border-bottom: 1px solid #ddd;
   overflow: hidden;
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
}
#gtasks-search-container {
   margin-right: 8px;
   width: 100%;
}
.gtasks-search-input-v2 {
   background-color: #fff;
   border-radius: 80px;
   padding: 0 16px;
}
.gtasks-unread-indicator,
.gtasks-overdue-indicator,
.gtasks-archive-indicator,
.gtasks-workday-indicator {
   display: none;
   position: absolute;
   border-radius: 32px;
   line-height: 22px;
   min-height: 22px;
   min-width: 22px;
   font-size: 16px;
   cursor: pointer;
   height: 22px;
   width: 22px;
   color: #eee;
   right: 120px;
   top: 9px;
}
.gtasks-unread-indicator { background-color: #ff5722 }
.gtasks-overdue-indicator { background-color: #e91e63 }
.gtasks-workday-indicator { background-color: #72d500; color: #333 }
.gtasks-archive-indicator { background-color: #ff4483; font-size: 14px }
#gtasks-main-menu-container { margin-left: 6px }
#gtasks-container .dx-datagrid-total-footer { display: none }
#gtasks-date-panel { margin-left: 2px }
#gtasks-date-presets-container {
   max-width: 100%;
   width: 480px;
}
.gtasks-date-presets-block {
   width: 100%;
   margin: 0;
}
.gtasks-date-presets-filter-button { padding: 0 }
.gtasks-filter-next-block { margin-top: 8px }
#gtasks-filter-block { padding-bottom: 8px }
.gtasks-middle-container { height: calc(100% - 80px) }
#gtasks-scroll-block {
   overflow: auto;
   height: 100%;
   width: 100%;
}
.gtasks-filter-block-right-block {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   margin: 0 8px;
   margin-left: auto;
}
.gtasks-local-storage-reset {
   position: relative;
   border-radius: 24px;
   line-height: 24px;
   font-size: 20px;
   margin-left: 4px;
   color: #ff5050;
   cursor: pointer;
   height: 24px;
   width: 24px;
}
.gtasks-sub-task {
   display: inline-block;
   text-align: center;
   line-height: 24px;
   border-radius: 50%;
   height: 24px;
   width: 24px;
   cursor: pointer;
}
.gtasks-update {
   display: inline-block;
   width: 24px;
   height: 24px;
   border-radius: 50%;
   text-align: center;
   line-height: 24px;
   cursor: pointer;
}
.gtasks-row-actions-block {
   display: flex;
   flex-direction: row;
   align-items: center;
   position: relative;
}
.gtasks-actions-button { font-size: 24px }
.gtasks-toggle-row-btn {
   border-radius: 50%;
   line-height: 28px;
   margin-left: 4px;
   min-height: 28px;
   min-width: 28px;
   font-size: 24px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
.gtasks-full-text { display: none }
.gtasks-task-status-block {
   display: flex;
   flex-direction: row;
   align-items: center;
   line-height: 22px;
   height: 22px;
}
.gtasks-task-status-icon {
   display: inline-block;
   border-radius: 18px;
   margin-right: 2px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 10px;
   min-height: 16px;
   min-width: 16px;
   height: 16px;
   width: 16px;
}
.gtasks-status-text {
   display: inline-block;
   margin-left: 4px;
   line-height: 16px;
   height: 16px;
}
.gtasks-task-empty {
   background-color: #fff;
   background-image: url('../img/empty.svg');
   background-size: 14px;
}
.gtasks-task-draft {
   background-color: #ffb300;
   background-image: url('../img/science.svg');
}
.gtasks-task-create {
   background-color: #888;
   background-image: url('../img/new-star.svg');
   background-size: 18px;
}
.gtasks-task-started {
   background-color: #1976d2;
   background-image: url('../img/play-circle.svg');
}
.gtasks-task-postponed {
   background-color: #9c27b0;
   background-image: url('../img/clock.svg');
}
.gtasks-task-for-revision {
   background-color: #e91e63;
   background-image: url('../img/skip-back.svg');
}
.gtasks-task-complete,
.gtasks-task-processed {
   background-color: #43a047;
   background-image: url('../img/ok-circle-green.svg');
   background-size: 11px;
}
.gtasks-task-finished {
   background-color: #9acd32;
   background-image: url('../img/cup.svg');
}
.gtasks-task-canceled {
   background-color: #eb4c42;
   background-image: url('../img/cancel.svg');
   background-size: 11px;
}
.gtasks-task-archive {
   background-color: #ff81ba;
   background-image: url('../img/archive.svg');
   background-size: 11px;
}
.gtasks-task-reject {
   background-color: #eb4c42;
   background-image: url('../img/trash.svg');
   background-size: 11px;
}
.gtasks-result-block { margin-top: 8px }
.gtasks-is-overdue { background-color: #ffecec }
.gtasks-overdue-flag { color: red }
.gtasks-date-back { margin-right: 4px }
.gtasks-date-prev { margin-left: 4px }
.gtasks-master-details-description { width: 480px }
.gtasks-description-cell {
   display: inline-block;
   white-space: break-spaces;
   overflow-wrap: break-word;
   overflow: hidden;
   min-width: 480px;
   width: 480px;
}
.gtasks-description-dialog-cell {
   min-width: 200px;
   width: 200px;
}
.gtasks-master-details-dialog { width: 500px }
.gtasks-search-input {
   background-color: #fff;
   line-height: 28px;
   border-radius: 3px;
   height: 28px;
   width: 200px;
}
.gtasks-search-clear { font-size: 18px }
.gtasks-master-details-table td {
   border: 1px solid #ccc;
   vertical-align: top;
   padding: 4px 8px;
}
.gtasks-master-details-head {
   background-color: #ececec;
   color: #888;
}
.gtasks-tag-loaded {
   margin-top: 8px;
   opacity: 1;
}
.gtasks-master-details-label{ margin-top: 8px }
.gtasks-master-details-watchers-block { margin-top: 8px }
.gtasks-files-block {
   border: 1px solid #ccc;
   background-color: #ebeeff;
   border-radius: 4px;
   padding: 8px;
   opacity: 1;
}
.gtasks-master-details-name {
   white-space: normal;
   overflow-x: hidden;
   min-width: 200px;
   width: 200px;
}
.gtasks-support-dialog-item {
   background-color: #dedede;
   border-top-left-radius: 15px;
   border-top-right-radius: 15px;
   border-bottom-right-radius: 15px;
   white-space: normal;
   overflow-x: hidden;
   margin: 4px 0;
   padding: 12px;
   cursor: text;
   user-select: text;
   -webkit-user-select: text;
}
.gtasks-master-details-dialog-description {
   min-width: 200px;
   width: 200px;
}
.gtasks-support-user-item {
   border-top-left-radius: 15px;
   border-top-right-radius: 15px;
   border-bottom-left-radius: 15px;
   border-bottom-right-radius: 0;
   background-color: #bad8df;
}
.gtasks-card-relationship {
   display: inline-block;
   margin-right: 8px;
   height: 24px;
   width: 24px;
}
.gtasks-toggle-sidebar-button { transition: all 0.6s ease-out }
.gtasks-toggle-sidebar-button:hover {
   background-color: #a26eff;
   color: #772bff;
}
.gtasks-toggle-sidebar-button-select {
   background-color: #8745ff;
   color: #e1d0ff;
}
.gtasks-sidebar-amount-block {
   background-color: #eee;
   border-radius: 6px;
   margin-top: 16px;
   padding: 8px;
}
.gtasks-sidebar-mode-item {
   font-family: 'Roboto-Regular';
   line-height: 22px;
   font-size: 11px;
   padding: 0 8px;
   height: 22px;
}
.gtasks-sidebar-mode-item-select { background-color: #b2ebf2 }
.gtasks-sidebar-amount-container { margin-top: 16px }
.gtasks-sidebar-amount {
   border-radius: 6px;
   background-color: #00bcd4;
}
.gtasks-sidebar-amount-label {
   font-family: 'Roboto-Regular';
   margin-bottom: 10px;
   font-size: 16px;
   color: #aaa;
   width: 100%;
}
.gtasks-sidebar-amount-label > *:not(:first-child) { margin-left: 8px }
.gtasks-sidebar-amount-button {
   font-family: 'Roboto-Regular';
   line-height: 22px;
   font-size: 10px;
   padding: 0 7px;
   height: 22px;
}
.gtasks-sidebar-amount-button-select { background-color: #b2ebf2 }
.gtasks-sidebar-period-container { margin-top: 16px }
.gtasks-sidebar-label {
   font-family: 'Roboto-Regular';
   font-size: 16px;
}
.gtasks-sidebar-close-button {
   font-weight: bold;
   margin-left: 10px;
}
.gtasks-sidebar-confirm-button { margin-left: auto }
.gtasks-sidebar-back-button { margin-left: 10px }
.gtasks-sidebar-calendar-container { margin: 0 auto }
.gtasks-sidebar-calendar-container .air-datepicker { border: none }
.gtasks-sidebar-user-container { margin-top: 8px }
.gtasks-back-to-all-tasks-button {
   background-color: #e0e0e0;
   border-radius: 40px;
   line-height: 26px;
   margin-top: 14px;
   min-height: 26px;
   padding: 0 16px;
   cursor: pointer;
   height: 26px;
}
.gtasks-back-to-all-tasks-button > *:not(:first-child) { margin-left: 8px }
#gtasks-total-count-container { display: none }
#gtasks-total-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   font-family: 'Roboto-Regular';
   background-color: #ececec;
   border-top: 1px solid #ddd;
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
}
/* Налаштування шаблонів задач */
.settings-module { overflow: hidden }
#settings-task-template-top-panel {
   position: fixed;
   border-bottom: 1px solid #ddd;
   height: 40px;
   width: 100%;
}
.task-template-add-button { background-color: #333 }
#settings-task-template-mode-container { margin-left: 8px }
#settings-task-template-list {
   background-color: #fff;
   margin-top: 40px;
   overflow: auto;
   padding-bottom: 8px;
   height: calc(100% - 40px);
}
.settings-task-template-action-cell { width: 80px }
.settings-task-template-action-block {
   display: flex;
   flex-direction: row;
   align-items: center;
   padding: 0 4px;
   width: 100%;
}
.settings-task-template-action {
   display: inline-block;
   border-radius: 32px;
   line-height: 24px;
   text-align: center;
   cursor: pointer;
   height: 24px;
   width: 24px;
}
.settings-task-template-action:not(:first-child) { margin-left: 8px }
.settings-task-template-upd { font-size: 16px}
.settings-task-template-del { color: #f88 }
.settings-task-template-id-cell { width: 80px }
.settings-task-template-form-label {
   margin: 4px;
   padding: 0;
}
.settings-task-template-del-cell { width: 40px }
.task-template-ins-form { padding: 0 4px }
/* Налаштування тегів */
#settings-task-tags-top-panel { height: 40px }
#settings-company-container {
   overflow: hidden;
   overflow-y: auto;
   height: 100%;
}
/* Налаштування Компаній */
.settings-company-block {
   position: relative;
   background-color: #fff;
   border-radius: 6px;
   padding: 8px;
   margin: 8px;
}
.settings-company-scroll-block {
   height: calc(100% - 40px);
   overflow: auto;
   width: 100%;
}
.settings-company-top-panel {
   display: flex;
   flex-direction: row;
   align-items: center;
   background-color: #fff;
   padding: 0 8px;
   height: 40px;
   width: 100%;
}
.settings-company-block-title {
   margin-left: auto;
   font-family: 'Roboto-Regular';
   font-weight: bold;
   line-height: 40px;
   height: 40px;
}
.refrash-company-segment-button {
   background-color: #333;
   line-height: 28px;
   margin-left: 16px;
   min-height: 28px;
   min-width: 28px;
   height: 28px;
   width: 28px;
}
.settings-company-segment-action-cell { width: 48px }
.settings-master-details-container { padding: 8px }
/* Налаштування катрочки Авто */
.settings-no-data-cell {
   text-align: center;
   line-height: 32px;
   height: 32px;
   color: #bbb;
}
.settings-table td {
   border: 1px solid #ccc;
   vertical-align: middle;
   padding: 4px 8px;
}
.settings-car-field-row { cursor: pointer }
.settings-car-fields-action-cell { width: 40px }
.settings-car-field-api-group-container,
.settings-car-field-css-group-container { margin-top: 12px }
.settings-car-field-master-details { visibility: collapse }
.settings-car-values-action-cell { width: 40px }

/* Перегляд (окремих ресурсів) */
.share-module {
   position: relative;
   overflow: auto;
   height: 100%;
}
#single-task-top-panel {
   border-bottom: 1px solid #eee;
   box-shadow: 0 1px 1px -1px #3335;
   height: 40px;
}
#single-task-container {
   position: relative;
   margin: 0 auto;
   margin-top: 6px;
   max-width: 900px;
   overflow-y: auto;
   height: calc(100% - 46px);
}
.single-task-no-data-container {
   text-align: center;
   height: 100%;
   width: 100%;
}
.single-task-no-data-text {
   padding-top: 16px;
   color: #aaa;
}
.single-task-go-to-company {
   margin-left: 4px;
   font-size: 20px;
}
#share-tasks-fold-button {
   margin-left: auto;
   font-weight: bold;
}
/* Форма */
#share-form-container {
   height: 100%;
   width: 100%;
}

/* Склад */
.storage-content {
   height: calc(100% - 38px);
}
.storage-scroll-block {
   overflow: auto;
   height: calc(100% - 82px);
   width: 100%;
}
.storage-grid-top-panel {
   display: flex;
   flex-direction: row;
   align-items: center;
   background-color: #fff;
   border-bottom: 1px solid #eee;
   box-shadow: 0 1px 1px -1px #3335;
   height: 40px;
   width: 100%;
}
.storage-form {
   position: relative;
   overflow: hidden;
   height: 100%;
}
#storage-top-panel {
   border-bottom: 1px solid #eee;
   height: 40px;
}
#storage-top-panel > div:not(:first-child) {
   margin-left: 8px;
}
#storage-add-button {
   color: #009607;
}
#storage-move-button {
   color: #1976d2;
}
.storage-search-card-container {
   border-bottom: 1px solid #eee;
   box-shadow: 0 1px 1px -1px #3335;
   height: 40px;
}
#storage-search-container { width: 100%; }
.storage-top-panel {
   background-color: #d3e3fd;
   border-radius: 4px;
   padding: 6px;
}
.storage-top-panel > *:not(:first-child) {
   margin-left: 8px;
}
.storage-top-block {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
}
#storage-fold-all-button {
   font-size: 28px;
}
.storage-add-block {
   margin-left: auto !important;
}
.storage-round-action-button {
   line-height: 28px;
   margin-right: 8px;
   color: #fff;
   height: 28px;
   width: 28px;
}
.storage-add-item {
   background-color: #0362d9;
}
.storage-remove-all-item {
   background-color: #f44336;
   font-size: 14px;
}
.storage-add-template {
   background-color: #eee;
   border-radius: 6px;
   padding: 6px;
}
.storage-counter-button {
   background-color: #0362d9;
   color: #fff;
}
.storage-counter-button:active {
   background-color: #0976ff;
}
.storage-fold-group-button {
   background-color: #fff;
}
.storage-form-content {
   max-width: 860px;
   overflow: hidden;
   margin: 0 auto;
   height: 100%;
}
.storage-description {
   font-size: 14px;
   height: 80px;
   padding: 8px;
}
.storage-textarea {
   font-family: 'Roboto-Regular';
   resize: vertical;
   font-size: 12pt;
   min-height: 38px;
   padding: 4px 8px;
}
.storage-template-clear {
   line-height: 28px;
   margin-left: 8px;
   margin-top: 24px;
   color: #607d8b;
   height: 28px;
   width: 28px;
}
.storage-scroll-container {
   border: 1px solid #d3d3d3;
   border-radius: 6px;
   overflow-y: auto;
   margin-top: 8px;
   height: 100%;
}
.storage-add-list {
   min-height: 40px;
   padding: 8px;
}
.storage-one-stuff {
   position: relative;
   background-color: #e8eaf6;
   border-radius: 6px;
   margin: 4px 0;
   padding: 4px;
}
.storage-one-top-block {
   display: flex;
   flex-direction: row;
   align-items: center;
   height: 16px;
   width: 100%;
}
.storage-one-count {
   background-color: #fff;
   border-radius: 20px;
   text-align: center;
   line-height: 16px;
   font-size: 10px;
   height: 16px;
   width: 26px;
}
.storage-remove-one {
   background-color: #f33;
   border-radius: 20px;
   margin-left: auto;
   line-height: 16px;
   cursor: pointer;
   font-size: 12px;
   height: 16px;
   width: 16px;
   color: #fff;
}
.storage-template-input {
   background-color: #fff;
}
.storage-settings-container {
   margin-top: 8px;
}
.storage-top-panel-info {
   background-color: #7dafff;
   border-radius: 32px;
   line-height: 28px;
   margin-left: 8px;
   padding: 0 10px;
   font-size: 14px;
   height: 28px;
   color: #fff;
}
.storage-tariff-checkbox-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   background-color: #ecf9ff;
   border-radius: 32px;
   line-height: 28px;
   padding: 0 12px;
   height: 28px;
}
.storage-preset-button-container {
   margin-left: auto;
}
.storage-search-panel {
   display: flex;
   flex-direction: row;
   align-items: center;
   height: 40px;
}
#storage-card-container {
   position: relative;
   overflow: hidden;
   overflow-y: auto;
   margin-top: 8px;
   height: calc(100% - 90px);
}
.storage-card {
   display: flex;
   flex-direction: column;
   background-color: #fff;
   border-radius: 0px;
   padding: 8px;
}
.storage-card:not(:first-child) {
   margin-top: 8px;
}
.storage-card-top-panel {
   display: flex;
   flex-direction: row;
   align-items: center;
   line-height: 32px;
   height: 32px;
}
.storage-card-actions {
   display: inline-flex;
   flex-direction: row;
   align-items: center;
}
.storage-action-button {
   border-radius: 32px;
   line-height: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
.storage-action-button:not(:first-child) {
   margin-left: 6px;
}
.storage-select-container {
   position: relative;
   display: inline-flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   margin-right: 4px;
   height: 28px;
   width: 28px;
}
.storage-del-button {
   color: #f44336;
}
.storage-card-title {
   background-color: #d3e3fd;
   border-radius: 32px;
   line-height: 28px;
   margin-left: 8px;
   font-size: 14px;
   padding: 0 10px;
   height: 28px;
}
.storage-card-fold-button {
   border-radius: 32px;
   line-height: 28px;
   margin-left: auto;
   margin-right: 4px;
   cursor: pointer;
   font-size: 28px;
   height: 28px;
   width: 28px;
}
.storage-card-content {
   margin-top: 4px;
   padding: 0 8px;
}
.storage-card-table tr:nth-child(odd) {
   background-color: #f8f8f8;
}
.storage-card-table td {
   border: 1px solid #f8f8f8;
   padding: 4px 8px;
}
.storage-card-label {
   font-size: 14px;
   font-weight: bold;
   max-width: 114px;
   width: 114px;
}
.storage-card-footer {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-top: 8px;
   padding: 0 8px;
   height: 32px;
}
.storage-form-top-panel {
   background-color: #d3e3fd;
   border-radius: 4px;
   height: 40px;
}
.storage-progress-container {
   border: 2px solid #f44336;
   border-radius: 24px;
   margin-left: auto !important;
   margin-right: 4px;
   overflow: hidden;
   min-height: 16px;
   min-width: 16px;
   height: 16px;
   width: 16px;
}
.storage-progress-inner {
   background-color: #f44336;
   height: 16px;
   width: 0px;
}
.storage-progress-complete {
   border-color: #4caf50;
   background-color: #4caf50;
}
.storage-move-info {
   margin-top: 8px;
   height: 100%;
   width: 100%;
}
.storage-move-info-names {
   background-color: #f3f3f3;
   overflow: hidden;
   overflow-y: auto;
   max-height: 120px;
   padding: 8px;
}
.storage-info-table {
   background-color: inherit;
}
.storage-checkbox-block {
   flex-direction: column;
   margin-top: 6px;
}
.storage-next-group {
   margin-top: 8px;
}
.storage-info-table td {
   border: 1px solid #ccc;
   font-size: 14px;
   padding: 0 8px;
}
.storage-info-table-head {
   background-color: #e4e4e4;
}
.storage-group-info-item {
   font-family: 'Roboto-Regular';
   background-color: #b3e5fc;
   border-radius: 24px;
   line-height: 20px;
   margin-left: 4px;
   padding: 0 10px;
   font-size: 11px;
   height: 20px;
}
.storage-history-container {
   overflow: auto;
}
.storage-history-table-head {
   background-color: #dce775;
}
.storage-history-table td {
   border: 1px solid #ccc;
   font-size: 14px;
   padding: 0 8px;
}
.storage-grid-delete {
   color: #f33 !important;
}
.storage-checkbox {
   background-color: transparent;
   border-radius: 4px;
}
.storage-checkbox-item {
   margin-left: 4px;
}
.storage-checkbox-item:not(:first-child) {
   margin-top: 8px;
}
.storage-row-edited {
   background-color: #ffd54f;
}
.storage-addition-equipment-container {
   margin-top: 8px;
}
.storage-addition-equipment-panel {
   display: flex;
   flex-direction: row;
   align-items: center;
}
.storage-equipment-add-button-container {
   height: 28px;
}
.storage-add-equipment-button {
   display: inline-block;
   border-radius: 32px;
   line-height: 28px;
   font-size: 26px;
   cursor: pointer;
   color: #000000;
   height: 28px;
   width: 28px;
}
.storage-equipment-add-label {
   font-family: 'Roboto-Regular';
   line-height: 28px;
   margin-left: 8px;
   font-size: 14px;
   height: 28px;
}
.storage-additional-equipment-item-conttrol {
   display: flex;
   flex-direction: row;
   align-items: center;
   height: 32px;
   width: 100%;
}
.storage-addition-equipment-item { margin-top: 8px }
.storage-addition-equipment-item-remove-button {
   display: inline-block;
   border-radius: 28px;
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   cursor: pointer;
   margin: 0 8px;
   height: 24px;
   width: 24px;
   color: #f33;
}
.storage-history-container {
   position: relative;
   overflow: auto;
   height: calc(100% - 48px);
}
.storage-history-table-date {
   background-color: #dce775 !important;
   min-width: 124px;
   width: 124px;
}
.storage-history-table-imei {
   min-width: 128px;
   width: 138px;
}
.storage-filtered-by-today {
   background-color: #ffccbc !important;
   border-color: #ff5722 !important;
}
#storage-total-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   background-color: #d3e3fd;
   padding: 0 8px;
   height: 40px;
   width: 100%;
}
.storage-total-item {
   display: flex;
   flex-direction: row;
   align-items: center;
   line-height: 40px;
   min-height: 40px;
   font-size: 14px;
   height: 40px;
   color: #222;
}
.storage-total-item:not(:first-child) { margin-left: 16px }
.storage-total-label { font-weight: 700 }
.storage-total-value { margin-left: 4px }
#storage-view-mode-container { margin-right: 8px }
.storage-remove-error-block,
.storage-remove-warning-block {
   border-radius: 6px;
   padding: 8px;
}
.storage-remove-error-block { background-color: #fa6e79 }
.storage-remove-warning-block { background-color: #ffd168 }
/* Обладнання на складі */
.storage-devices-scroll-block {
   overflow: auto;
   height: calc(100% - 80px);
   width: 100%;
}
#storage-devices-container .dx-datagrid-total-footer { display: none }
#storage-devices-container .dx-datagrid .dx-header-filter { color: #8b4cff }
#storage-devices-container .dx-datagrid .dx-header-filter-empty { color: #75757580 }
#storage-devices-total-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   background-color: #b891ff;
   font-family: 'Roboto-Regular';
   padding: 0 8px;
   height: 40px;
}
#storage-devices-pager-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-left: auto;
   height: 28px;
}
#storage-devices-filter-indicator {
   display: none;
   position: absolute;
   background-color: #ffc107;
   border-radius: 32px;
   line-height: 18px;
   min-height: 18px;
   min-width: 18px;
   font-size: 13px;
   height: 18px;
   width: 18px;
   left: 226px;
   top: 0;
}
.datagrid-filter-applied { background-color: #ffe494 }
.device-equipmen-nodata {
   text-align: center;
   color: #8d8d8d;
}
.devices-toggle-auto-columns-active {
   background-color: #a4e3ff !important;
   box-shadow: inset 0 0 0px 2px #2196f3;
}
#car-container .dx-datagrid-header-panel,
#deal-container .dx-datagrid-header-panel,
.grid-container .dx-datagrid-header-panel,
#gtasks-container .dx-datagrid-header-panel,
#bills-container .dx-datagrid-header-panel,
#billing-content .dx-datagrid-header-panel,
#accounts-container .dx-datagrid-header-panel,
#storage-table-container .dx-datagrid-header-panel,
#storage-devices-container .dx-datagrid-header-panel,
#companies-table-container .dx-datagrid-header-panel {
   background-color: #ececec;
   position: sticky;
   z-index: 2;
   top: 0px;
}

/* Налаштування пристрою */
#device-top-panel {
   border-bottom: 1px solid #ddd;
   height: 40px;
   padding: 0;
}
.device-add-one-storage-button {
   border-radius: 32px;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   font-size: 20px;
   cursor: pointer;
   margin: 0 4px;
   height: 28px;
   width: 28px;
}
#device-menu-button {
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: center;
   cursor: pointer;
   min-height: 40px;
   min-width: 40px;
   height: 40px;
   width: 40px;
}
.device-progress-container {
   border: 2px solid #f44336;
   border-radius: 24px;
   overflow: hidden;
   min-height: 16px;
   min-width: 16px;
   height: 16px;
   width: 16px;
}
#device-search-container {
   margin: 0 4px;
   width: 100%;
}
.device-search-input {
    background-color: #fff;
    line-height: 28px;
    border-radius: 3px;
    height: 28px;
}
.device-search-custom-item-container { height: 100% }
.device-search-custom-item-container:hover {
   background-color: inherit;
   color: inherit;
}
.device-search-custom-item {
   border-bottom: 2px solid #03a9f4;
   width: 100%;
}
.device-search-custom-item:hover { background-color: #b2ebf2 }
.device-search-custom-item-row { border-top: 1px solid #ddd }
.device-search-custom-item-cell {
   line-height: 16px;
   font-size: 12px;
   height: 16px;
}
.device-adaptive-block-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-left: auto;
}
.device-adaptive-block-button {
   display: block;
   line-height: 40px;
   cursor: pointer;
   font-size: 28px;
   height: 40px;
   width: 40px;
}
.device-adaptive-block {
   display: none;
   position: fixed;
   border-bottom: 1px solid #ddd;
   background-color: #fff;
   padding: 2px 0;
   z-index: 900;
   width: 100%;
   top: 80px;
   left: 0;
}
#device-content-container {
   position: relative;
   display: flex;
   flex-direction: row;
   align-items: center;
   overflow-y: auto;
   height: calc(100% - 40px);
   width: 100%;
}
.device-menu-button-open { background-color: #5cd5fb }
#device-menu-block {
   display: none;
   position: sticky;
   background-color: #fff;
   border-right: 1px solid #ddd;
   min-width: 40px;
   height: 100%;
   width: 40px;
   top: 0px;
}
.device-left-menu-button {
   line-height: 40px;
   min-height: 40px;
   min-width: 40px;
   cursor: pointer;
   height: 40px;
   width: 40px;
}
#device-content {
   padding: 4px;
   height: 100%;
   width: 100%;
}

/* Картки пристроїв (DeviceCard) */
.device-card {
   position: relative;
   background-color: #fff;
   margin: 0 auto;
   margin-bottom: 6px;
   border-radius: 4px;
   max-width: 1280px;
}
.device-card-top {
   position: relative;
   display: flex;
   justify-content: space-between;
   flex-direction: row;
   align-items: center;
   line-height: 40px;
   overflow: hidden;
   height: 40px;
   width: 100%;
}
.device-card-fold-button {
   margin-left: auto;
   line-height: 40px;
   min-height: 40px;
   min-width: 40px;
   cursor: pointer;
   font-size: 32px;
   height: 40px;
   width: 40px;
}
.device-card-content { display: none }
.device-card-inner-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   align-items: flex-start;
   padding: 8px;
}
.device-card-left-block {
   height: 100%;
   width: 100%;
}
.device-card-right-block { display: none }
.device-big-image {
   background-position: center;
   background-repeat: no-repeat;
   background-size: 240px;
   height: 240px;
   width: 240px;
}
.device-main-info-container {
   display: flex;
   flex-direction: row;
   align-items: flex-start;
   margin-bottom: 8px;
   height: 50px;
}
.device-main-info {
   display: flex;
   flex-direction: column;
   font-family: 'Roboto-Regular';
   height: 50px;
}
.device-imei-block {
   display: flex;
   flex-direction: row;
   align-items: center;
   font-size: 24px;
   height: 30px;
}
.device-info-label { color: #888 }
.device-imei-label { font-weight: 700 }
.device-info-value {
   margin-left: 4px;
   font-weight: 700;
}
.device-type-block {
   display: flex;
   flex-direction: row;
   align-items: center;
   height: 20px;
}
.device-main-menu-container { margin-left: auto }
.device-select-block-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   background-color: #f2f2f2;
   height: 48px;
}
.device-blocks {
   margin-top: 8px;
   height: 100%;
   width: 100%;
}
.device-block-container {
   display: none;
   height: 100%;
   width: 100%;
}
.device-info-block { display: block }
.device-exinfo-table tr { border-bottom: 1px solid #d7d7d7 }
.device-exinfo-table td {
   padding-top: 4px;
   padding-bottom: 4px;
}
.device-settings-bottom-block {
   margin-top: 14px;
   width: 100%;
}
.device-save-settings-button,
.device-save-hardware-button { background-color: #333 }
.device-move-block { background-color: #aaf }
.device-support-block {
   display: flex;
   flex-direction: row;
   align-items: center;
   padding: 8px;
   width: 100%;
}
.device-support-doc {
   cursor: pointer;
   border-radius: 50px;
   line-height: 38px;
   font-size: 24px;
   color: #777;
   height: 38px;
   width: 38px;
}
.device-exinfo-label {
   max-width: 124px;
   width: 124px;
}
.device-exinfo-value-block {
   display: flex;
   flex-direction: row;
   align-items: center;
   width: 100%;
}
.device-copy-button-container { margin-left: auto }
.device-copy-imei-button { margin-left: 8px }
.device-copy-button {
   border-radius: 32px;
   line-height: 24px;
   font-weight: 700;
   font-size: 16px;
   cursor: pointer;
   height: 24px;
   width: 24px;
   color: #888;
}
.device-upd-last-point {
   display: inline-block;
   border-radius: 32px;
   line-height: 24px;
   margin-left: 8px;
   min-height: 24px;
   cursor: pointer;
   min-width: 24px;
   font-size: 20px;
   color: #0065df;
   height: 24px;
   width: 24px;
}
.device-status-chips {
   display: inline-flex;
   flex-direction: row;
   align-items: baseline;
   border-radius: 32px;
   font-size: 14px;
   padding: 0 8px;
   height: 20px;
}
.device-status-chips-pause { background-color: #ffa7a0 }
.device-status-chips-hidden { background-color: #aed581 }
.device-status-chips-rouming { background-color: #ffc1ff }
.device-status-chips-logging { background-color: #b2ebf2 }
.device-status-chips-demo { background-color: #ffeb3b }
.device-status-chips-storage {
   background-color: #0065df;
   color: #fff;
}
.device-status-chips-notariff {
   background-color: #ff5722;
   font-weight: bold;
   color: #fff;
}
.device-card-history-button,
.device-quick-actions-button { font-size: 22px; }
.device-equipment-panel {
   display: flex;
   flex-direction: row;
   align-items: center;
   border: 1px solid #ccc;
   border-bottom: none;
   background-color: #e0e0e0;
   padding: 0 8px;
   height: 40px;
}
.device-equipment-add-container {
   display: none;
   background-color: #f9f9fc;
   border-left: 1px solid #ccc;
   border-right: 1px solid #ccc;
   padding: 8px;
}
.device-add-equipment { background-color: #333 }
.device-is-rouming-container,
.device-is-save-tracks-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin: 8px 0;
   margin-left: auto;
   height: 32px;
}
.device-go-to-company {
   font-size: 22px;
   cursor: pointer;
}
.device-scroll-block {
   overflow-x: auto;
   width: 100%;
}
.device-card-bottom-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: space-around;
   padding: 8px;
}
.device-card-bottom-button {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   cursor: pointer;
}
.device-card-button-icon {
   line-height: 28px;
   height: 28px;
   width: 28px;
}
.device-card-button-label {
   line-height: 28px;
   padding-right: 10px;
   height: 28px;
}
.device-go-to-calibration {
   background-color: #f2f2f2;
   border-radius: 32px;
}
.device-card-bottom-button:not(:first-child) { margin-left: 16px }
.device-equipment-table-actions {
   max-width: 46px;
   width: 46px;
}
.device-calibration-item {
   font-size: 16px;
   width: 49%;
}
.device-calibration-current-drp1 { background-color: #c6daff }
.device-calibration-current-drp2 { background-color: #ffe4af }
.device-preset-button-container { margin-left: auto }
.device-preset-info-container { margin-left: 8px }
.device-preset-info { background-color: #fff59d }
.device-result-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   line-height: 32px;
   padding: 0 8px;
}
.device-result-chips {
   display: flex;
   flex-direction: row;
   align-items: center;
   border-radius: 32px;
   height: 24px;
}
.device-result-chips-icons {
   border-radius: 32px;
   line-height: 24px;
   min-height: 24px;
   min-width: 24px;
   font-size: 18px;
   height: 24px;
   width: 24px;
}
.device-result-chips-icons-ok { color: #11a544; }
.device-result-chips-icons-error { color: #ef5350; }
.device-result-chips-value {
   padding-right: 8px;
   padding-left: 4px;
   color: #000;
}
/* Акаунти клієнтів */
#accounts-top-panel {
   border-bottom: 1px solid #ddd;
   overflow: hidden;
   padding: 0 8px;
   height: 40px;
}
#accounts-filter-indicator { left: 234px }
#accounts-scroll-block {
   height: calc(100% - 80px);
   overflow: auto;
   width: 100%;
}
#accounts-total-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   background-color: #83c8ff;
   font-family: 'Roboto-Regular';
   padding: 0 8px;
   height: 40px;
}
#accounts-pager-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-left: auto;
   height: 28px;
}
#accounts-container .dx-datagrid-total-footer { display: none }

/* Конструктор фільтрів */
/*.filter-dialog { font-family: 'Roboto-Regular' !important }*/
.filter-dialog-content { padding: 0 4px }
.filters-set-container { margin-top: 16px }
.filter-builder-item { width: 100% }
.filter-builder-item:not(:first-child) { margin-top: 8px }
.filter-builder-item > *:not(:first-child) { margin-left: 8px }
.filter-favorite-button {
   border-radius: 40px;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
.filter-item-control-row { width: 100% }
.filter-option-cell { width: auto; }
.filter-control-cell {
   margin-left: 4px;
   overflow: hidden;
   width: 100%;
}
.filter-item-control-container {
   position: relative;
   display: flex;
   flex-direction: column;
   align-items: stretch;
   background-color: #dfe2f3;
   border-radius: 6px;
   overflow: hidden;
   margin-top: 8px;
   padding: 4px;
   height: auto;
   width: 100%;
}
.filter-item-top-block {
   min-height: 18px;
   height: 18px;
   width: 100%;
}
.filter-item-drag-helper {
   line-height: 18px;
   min-height: 18px;
   margin: 0 auto;
   cursor: grab;
   height: 18px;
   width: 40px;
}
.filter-item-drag-helper:after { content: "\e25d" }
.filter-item-drag-helper:active { cursor: grabbing }
.filter-item-number {
   position: absolute;
   background-color: #0097a7;
   border-radius: 32px;
   text-align: center;
   line-height: 14px;
   margin-right: 0px;
   min-height: 14px;
   min-width: 14px;
   font-size: 10px;
   height: 14px;
   width: 14px;
   color: #fff;
   left: 12px;
   top: 3px;
}
.filter-item-compare-block {
   position: absolute;
   left: 40px;
   top: 1px;
}
.filter-compare-button {
   min-height: 18px;
   min-width: 18px;
   font-size: 16px;
   height: 18px;
   width: 18px;
}
.filter-noop-placeholder {
   background-color: #dfe2f3;
   padding: 0 8px;
}
.filter-noop-placeholder-text {
   display: inline-block;
   line-height: 28px;
   min-height: 28px;
   margin-left: 4px;
   color: #bdbdbd;
   height: 28px;
}
.filter-item-disabled { background-color: #eee }
.filter-preset-item-name { margin-left: 8px }
.filter-preset-item-actions > *:not(:first-child) { margin-left: 4px }
.filter-preset-item-button {
   border-radius: 40px;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   height: 28px;
   width: 28px;
}
/*@font-face {
   font-family: DXIcons;
   src:
      local("DevExtreme Generic Icons"),
      local("devextreme_generic_icons"),
      url("icons/dxicons.woff2") format("woff2"),
      url("icons/dxicons.woff") format("woff"),
      url("icons/dxicons.ttf") format("truetype");
   font-weight: 400;
   font-style: normal
}*/
.workday-is-complete-container { margin-top: 16px }
.workday-plan-user-container { margin-top: 8px }
.gtasks-workday-plan-is-complete { background-color: #aed581 }

/* Модуль Авто */
#car-search-container { margin-right: 8px }
#car-total-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   background-color: #ececec;
   border-top: 1px solid #ddd;
   font-family: 'Roboto-Regular';
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
}
#car-container .dx-datagrid-total-footer { display: none }
.device-fields-container { margin-top: 16px }
.car-form-id-label {
   font-family: 'Roboto-Regular';
   font-size: 14px;
   color: #888;
}
.car-edit-form { padding: 0 4px }

/* Налаштування Авто */
.settings-car-submodule { display: none; }
.settings-car-top-panel {
   background-color: #fff;
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
   width: 100%;
}
.car-tools-button {
   display: inline-flex;
   flex-direction: row;
   text-align: center;
   align-items: center;
   font-family: 'Roboto-Regular';
   background-color: #0362d9;
   border-radius: 32px;
   line-height: 28px;
   overflow: hidden;
   font-size: 14px;
   padding: 0 16px;
   cursor: pointer;
   height: 28px;
   color: #fff;
}
.car-tools-button span { margin-left: 8px }

.bills-module {
   display: flex;
   flex-direction: column;
   height: 100%;
}
.bills-top-panel {
   border-bottom: 1px solid #ddd;
   overflow: hidden;
   min-height: 40px;
   padding-right: 8px;
   padding-left: 2px;
   height: 40px;
}
#bills-search-container { margin-right: 8px }
#bills-filter-indicator { left: 198px }
#bills-container .dx-datagrid-total-footer { display: none }
.bills-middle-container { height: calc(100% - 160px) }
.bills-side-panel {
   min-width: 100%;
   padding: 0 8px;
   width: 100%;
}
#bills-scroll-block {
   overflow: auto;
   height: 100%;
   width: 100%;
}
.bills-toggle-sidebar-button { transition: all 0.6s ease-out }
.bills-toggle-sidebar-button:hover {
   background-color: #a26eff;
   color: #772bff;
}
.bills-toggle-sidebar-button-select {
   background-color: #8745ff;
   color: #e1d0ff;
}
.bills-sidebar-period-container { margin-top: 16px }
#bills-total-container {
   display: flex;
   flex-direction: row;
   align-items: center;
   font-family: 'Roboto-Regular';
   background-color: #ececec;
   border-top: 1px solid #ddd;
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
}
#bills-tracker-count-container,
#bills-teltonika-count-container,
#bills-smarttrack-count-container,
#bills-can-count-container,
#bills-drp-count-container,
#bills-repair-count-container,
#bills-calibration-count-container { display: none; }
.bills-master-details-description {
   display: inline-block;
   white-space: break-spaces;
   overflow-wrap: break-word;
   overflow: hidden;
}
.bills-period-block {
   justify-content: space-around;
   max-width: 280px;
}
.bills-date-prev,
.bills-date-next { font-size: 26px }
#bills-url-params-indicator {
   position: absolute;
   background-color: #f06292;
   border-radius: 32px;
   line-height: 14px;
   min-height: 14px;
   min-width: 14px;
   font-size: 10px;
   height: 14px;
   width: 14px;
   color: #fff;
   left: 2px;
   top: 2px;
}
.bills-add-work {
   position: absolute;
   left: 8px;
}
.bills-employee-block {
   justify-content: space-around;
   min-height: 40px;
   height: 40px;
}
.bills-employee-button {
   font-family: 'Roboto-Regular';
   background-color: #eee;
   border-radius: 40px;
   line-height: 22px;
   min-height: 22px;
   font-size: 12px;
   color: #a3a3a3;
   padding: 0 8px;
   margin: 0 4px;
   height: 22px;
}
.bills-employee-button-select {
   background-color: #1976d2;
   color: #eee;
}
.bills-accounting-block {
   background-color: #e8eaf6;
   font-size: 12px;
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
   width: 100%;
}
.bills-imprest-block {
   background-color: #d9d9d9;
   border-radius: 4px;
   padding-left: 4px;
   height: 28px;
   width: 116px;
}
.bills-for-pay-block {
   display: none;
   background-color: #fff;
   border-radius: 4px;
   padding: 0 4px;
   height: 28px;
}
.bills-paid-block { display: none }
.bills-accounting-label { color: #3f51b5; }
.bills-success { color: green }
.bills-warning { color: #f44336 }
.bills-edit-title { width: 100% }
#bills-edit-popup .dx-button { border-radius: 40px }
.bills-close-button { margin-left: 14px }
.bills-side-buttons-block {
   box-shadow: 0 1px 0px 0px #ddd;
   background-color: #fff;
   position: -webkit-sticky;
   position: sticky;
   padding: 8px 0;
   z-index: 2;
   top: 0;
}
.bills-field-info {
   background-color: #eee;
   border-radius: 6px;
   padding: 6px;
}
.dx-popup-wrapper { z-index: 9999 !important }
/* Форма Створити рахунок */
.іnvoice-type-container { border-radius: 6px; background-color: #e6f0ff }
.invoice-form-goods-panel {
   background-color: #e8eaf6;
   position: -webkit-sticky;
   border-radius: 6px;
   position: sticky;
   min-height: 40px;
   margin: 8px 4px;
   padding: 0 8px;
   height: 40px;
   z-index: 14;
   top: 0;
}
.invoice-add-button { font-size: 18px }
.invoice-del-goods-button {
   margin-left: auto;
   color: #ef5350;
}
.іnvoice-goods-item {
   background-color: #eee;
   border-radius: 6px;
   margin: 6px 4px;
   padding: 4px;
}
.invoice-goods-number {
   font-family: 'Roboto-Regular';
   background-color: #607d8b;
   border-radius: 32px;
   text-align: center;
   line-height: 16px;
   margin-left: 4px;
   min-height: 16px;
   font-size: 11px;
   min-width: 16px;
   color: #eceff1;
   height: 16px;
   width: 16px;
}
.іnvoice-goods-item-panel {
   min-height: 28px;
   height: 28px;
   width: 100%;
}
.invoice-form-goods-count {
   font-family: 'Roboto-Regular';
   background-color: #fff;
   border-radius: 2px;
   line-height: 24px;
   padding: 0 4px;
   font-size: 12px;
   color: #3f3f3f;
   height: 24px;
}

/* Маршрути */
.waybill-card {
   position: relative;
   background-color: #fff;
   transition: all .5s;
   margin-bottom: 8px;
   border-radius: 0;
   padding-top: 8px;
   padding: 0 16px 16px;
   width: 100%;
}
.waybill-card-top {
   border-bottom: 1px solid #ddd;
   min-height: 40px;
   height: 40px;
}
.waybill-card-count {
   display: inline-block;
   font-family: "Roboto-Regular";
   border: 1px solid #ddd;
   border-radius: 50%;
   text-align: center;
   line-height: 20px;
   min-height: 20px;
   min-width: 20px;
   font-size: 10px;
   height: 20px;
   width: 20px;
}
.waybill-card-id-container {
   font-family: 'Roboto-Regular';
   background-color: #c2e7ff;
   border-radius: 40px;
   line-height: 24px;
   min-height: 24px;
   cursor: pointer;
   padding: 0 10px;
   font-size: 14px;
   color: #3f51b5;
   height: 24px;
}
.waybill-card-scenario {}
.waybill-card-content {}
.waybill-card-item { margin-top: 8px }
.waybill-card-label { margin-right: 8px }
.waybill-card-points {
   border: 1px solid #ddd;
   border-radius: 6px;
   margin-top: 8px;
   padding: 8px;
}
.waybill-item-number {
   position: absolute;
   font-family: 'Roboto-Regular';
   background-color: #5094b4;
   border-radius: 32px;
   text-align: center;
   line-height: 14px;
   margin-right: 0px;
   min-height: 14px;
   min-width: 14px;
   font-size: 10px;
   height: 14px;
   width: 14px;
   color: #fff;
   left: 12px;
   top: 3px;
}
.waybill-item-remove {
   position: absolute;
   border-radius: 32px;
   line-height: 16px;
   min-height: 16px;
   min-width: 16px;
   font-size: 16px;
   cursor: pointer;
   color: #ff774c;
   height: 16px;
   width: 16px;
   right: 12px;
   top: 2px;
}
.waybills-geolocation-link {
   display: block;
   line-height: 32px;
   min-height: 32px;
   height: 32px;
}

#region, #events, #message, #settings,
#messageCallPoint {
   display: flex;
   flex-direction: column;
   overflow: hidden;
   height: 100%;
   width: 100%;
}
/* Регіони */
.region-pager-input {
   line-height: 24px;
   min-height: 24px;
   font-size: 14px;
   border: none;
   height: 24px;
   width: 100px;
}
.region-share-indicator {
   display: none;
   position: absolute;
   background-color: #c5d800;
   border-radius: 32px;
   line-height: 22px;
   min-height: 22px;
   min-width: 22px;
   font-weight: 800;
   font-size: 16px;
   cursor: pointer;
   height: 22px;
   right: 108px;
   width: 22px;
   color: #111;
   top: 9px;
}
.region-grid-map-button {
   margin-right: 8px;
   font-size: 14px;
   color: #47c14c;
}

/* Події */
#events-grid .dx-datagrid-total-footer { display: none }
.events-search-container { width: 100% }
.events-menu-container { margin-right: 8px }
.events-middle-container {
   align-items: flex-start;
   height: calc(100% - 80px);
}
.events-sidebar-amount-block {
   background-color: #ececec;
   border-radius: 6px;
   margin-top: 16px;
   padding: 8px;
}
.events-sidebar-mode-item-select { background-color: #b2ebf2 }
.events-sidebar-amount-container { margin-top: 16px }
.events-sidebar-amount {
   background-color: #00bcd4;
   border-radius: 6px;
}
.events-sidebar-amount-label {
   font-family: 'Roboto-Regular';
   margin-bottom: 10px;
   font-size: 16px;
   color: #aaa;
   width: 100%;
}
.events-sidebar-amount-label > *:not(:first-child) { margin-left: 8px }
.events-sidebar-amount-button {
   font-family: 'Roboto-Regular';
   line-height: 22px;
   font-size: 10px;
   padding: 0 7px;
   height: 22px;
}
.events-sidebar-amount-button-select { background-color: #b2ebf2 }
.events-sidebar-period-container { margin-top: 16px }
.events-period-buttons {
   position: relative;
   border-radius: 50%;
   line-height: 28px;
   min-height: 28px;
   min-width: 28px;
   cursor: pointer;
   height: 28px;
   width: 28px;
}
.events-period-buttons:hover { background-color: #444 }
.events-period-buttons:active { background-color: #455a63 }
.events-calendar-popup-panel {
   justify-content: center;
   position: relative;
   margin-bottom: 8px;
}
.popup-calendar-buttons {
   display: inline-block;
   flex-grow: 1;
   height: 32px;
   padding: 0 16px;
   line-height: 28px;
   text-align: center;
   border: 2px solid #1976d2;
   cursor: pointer;
}
.popup-calendar-buttons:active { background-color: #e3f2fd }
.events-calendar-popup-panel :first-child {
   border-top-left-radius: 6px;
   border-bottom-left-radius: 6px;
   border-right: 1px;
}
.events-calendar-popup-panel :last-child {
   border-bottom-right-radius: 6px;
   border-top-right-radius: 6px;
}
.events-mode-popup-panel {
   position: relative;
   justify-content: center;
   margin-top: 8px;
}
.events-sidebar-mode-container { margin-top: 16px }
.events-scenario-filter-block { width: auto }
.events-scenario-filter-item {
   padding: 8px 14px;
   line-height: 18px;
   overflow: hidden;
   cursor: pointer;
   font-size: 14px;
   height: 32px;
}
.events-scenario-filter-item-select { border-bottom: 3px solid #1976d2 }
.event-grid-type-1 { background-color: #ffe28c }
.event-grid-type-2 { background-color: #7ca7ff }
.event-grid-type-3 { background-color: #00bcd4 }
.event-grid-type-4 { background-color: #e966ff }
.event-grid-type-5 { background-color: #8cd835 }
.event-grid-type-6 { background-color: #548aa4 }
.event-grid-type-7 { background-color: #a1887f }
.event-grid-binding-link { color: #3faaff }
.add-event-form { padding: 0 6px }
.event-message-block { margin-top: 8px }
.event-waybill-helper-icon {
   background-color: #8ee;
   border-radius: 40px;
   line-height: 12px;
   margin-right: 6px;
   min-height: 12px;
   min-width: 12px;
   font-size: 8px;
   height: 12px;
   width: 12px;
   color: #111;
}
.event-grid-color {
   background-color: grey;
   width: fit-content;
   border-radius: 40px;
   line-height: 20px;
   min-height: 20px;
   font-size: 12px;
   padding: 0 12px;
   height: 20px;
   color: #000;
}
.event-grid-color-1 { color: #fff; background-color: #ff2e1f }
.event-grid-color-2 { background-color: #f2d900 }
.event-grid-color-3 { background-color: #00d300 }
.waybill-status-color-1682 { background-color: #ffb300 } /* Чернетка */
.waybill-status-color-1683 { background-color: #00b5a4 } /* Заявка */
.waybill-status-color-1705 { background-color: #3f51b5; color: #eee; } /* Маршрут */
.waybill-status-color-1684 { background-color: #03a9f4 } /* В роботі */
.waybill-status-color-1685 { background-color: #6cca00 } /* Виконано */
.waybill-status-color-1686 { background-color: #ff3232; color: #eee; } /* Скасовано */
.waybill-status-color-1687 { background-color: #e91e63; color: #fff } /* Архів */
.waybill-status-color-1688 { background-color: #bcaaa4 } /* Брак */
.task-grid-color-1, .task-grid-color-1490 { background-color: #ff5549; color: #fff }
.task-grid-color-2, .task-grid-color-1546 { background-color: #ffcf3e }
.task-grid-color-3, .task-grid-color-1547 { background-color: #00ca08 }

#devicePaused {
   height: calc(100% - 8px);
   background-color: #fff;
   border-radius: 6px;
   padding: 16px;
}
.device-paused-top-panel {
   position: relative;
   background-color: #fff;
   min-height: 40px;
   padding: 0 8px;
   height: 40px;
}
.tools-device-paused-title {
   font-family: 'Roboto-Regular';
   font-size: 24px;
}
.tools-device-paused-help {
   background-color: #dfffba;
   text-align: center;
   border-radius: 6px;
   margin-top: 16px;
   padding: 16px;
}
.tools-device-paused-info {
   background-color: #d4faff;
   border-radius: 6px;
   margin-top: 16px;
   padding: 16px;
}
.tools-device-paused-help-icon {
   margin-right: 8px;
   color: orange;
}

/* Аналітичні дані пристрою */
.device-analytics-top-panel {
   background-color: #e2e2e2;
   height: 40px;
}
.device-analytics-device { width: 300px }
.device-analytics-container,
.device-analytics-chart { width: 100% }
.device-analytics-container {
   display: grid;
   position: relative;
   grid-template-columns: calc(100% - 42px) 42px;
   justify-content: space-between;
   justify-items: stretch;
   align-items: start;
}
.device-analytics-chart-toolbar {
   background-color: grey;
   min-height: 100%;
   min-width: 42px;
   flex-shrink: 0;
   flex-grow: 1;
   padding: 8px;
   height: 100%;
   width: 42px;
}
/* Повідомлення (налаштування) */
.notify-search-container { width: 100% }
.notify-middle-container {
   align-items: flex-start;
   height: calc(100% - 80px);
}
.notify-sidebar-amount-block {
   background-color: #ececec;
   border-radius: 6px;
   margin-top: 16px;
   padding: 8px;
}
#notify-grid .dx-datagrid-total-footer { display: none }
.message-settings-form { padding: 0 4px }
.add-call-point-button { margin-left: 6px }
.notify-message-application-combo {
   position: relative;
   padding: 2px 6px 6px 6px;
   background-color: #eee;
   border-radius: 6px;
   margin: 6px 0;
}
.notify-message-application-name {
   font-family: 'Roboto-Regular';
   width: 100%;
   padding: 0;
   margin: 0;
}
/* Шаблони тікетів */
.ticket-template-search-container { width: 100% }
.ticket-template-middle-container {
   align-items: flex-start;
   height: calc(100% - 80px);
}



#divChartPanel {
   width: 100%;
   display: flex;
   flex-flow: column;
   overflow: hidden;
   min-height: 220px;
   height: 220px
}
#divChartPanelTitle {
   width: 100%;
   height: 25px;
   min-height: 25px;
   display: flex;
   flex-flow: row;
   color: #5d5c6d;
   background: #c8c9d0 url(/img/Commons/PopupHeaderBackGround.png) repeat-x left top;
   font-weight: 600;
   align-items: center;
   padding-right: 4px;
   padding-left: 4px;
   box-sizing: border-box
}
#divChartPanelContent {
   display: flex;
   height: 20px;
   flex-grow: 1;
   padding: 0;
   box-sizing: border-box;
   display: inline-flex;
   flex-flow: row;
   width: 100%;
   height: 100%;
   position: relative;
   background-color: #fff
}
#dxChartWidget {
   display: flex;
   height: 100%;
   width: calc(100% - 36px);
   position: relative
}
.dxc-tooltip {
   z-index: 10000 !important;
   padding: 0 !important
}
.chart-drag-area {
   position: absolute;
   width: 1px;
   height: 100%;
   background-color: rgba(255,0,0,.5);
   border: 0;
   z-index: 999;
   visibility: visible
}
.btnToolBarChart,
.btnToolBarChartChecked {
   width: 26px;
   height: 26px;
   background-color: #fff;
   overflow: visible;
   border-radius: 34px;
   border: 1px solid #98adbe;
   cursor: pointer;
   display: flex;
   justify-content: center;
   align-items: center
}
.btnToolBarChart {
   color: #98adbe
}
.btnToolBarChart .icon-chart-fuel,.btnToolBarChartChecked .icon-chart-fuel {
   width: 14px;
   height: 14px;
   background-size: cover
}
.btnToolBarChart .icon-chart-fuel {
   background-image: url('../../img/Bottom/Chart/fuel.svg')
}
.btnToolBarChart .icon-chart-fuel:hover,.btnToolBarChartChecked .icon-chart-fuel {
   background-image: url('../../img/Bottom/Chart/fuelSel.svg')
}
.btnToolBarChart .icon-chart-axle,.btnToolBarChartChecked .icon-chart-axle {
   width: 22px;
   height: 22px;
   background-size: cover
}
.btnToolBarChart .icon-chart-axle {
   background-image: url('../../img/Bottom/Chart/axle.svg')
}
.btnToolBarChart .icon-chart-axle:hover,.btnToolBarChartChecked .icon-chart-axle {
   background-image: url('../../img/Bottom/Chart/axleSel.svg')
}
.btnToolBarChart .icon-chart-rotation,.btnToolBarChartChecked .icon-chart-rotation {
   width: 20px;
   height: 20px;
   background-size: cover
}
.btnToolBarChart .icon-chart-rotation {
   background-image: url('../../img/Bottom/Chart/rotation.svg')
}
.btnToolBarChart .icon-chart-rotation:hover,.btnToolBarChartChecked .icon-chart-rotation {
   background-image: url('../../img/Bottom/Chart/rotationSel.svg')
}
.btnToolBarChart .icon-chart-voltage,.btnToolBarChartChecked .icon-chart-voltage {
   width: 18px;
   height: 18px;
   background-size: cover
}
.btnToolBarChart .icon-chart-voltage {
   background-image: url('../../img/Bottom/Chart/voltage.svg')
}
.btnToolBarChart .icon-chart-voltage:hover,.btnToolBarChartChecked .icon-chart-voltage {
   background-image: url('../../img/Bottom/Chart/voltageSel.svg')
}
.btnToolBarChart.dx-icon-print,.btnToolBarChartСhecked.dx-icon-print .btnToolBarChart.dx-icon-decreaselinespacing,.btnToolBarChartChecked.dx-icon-decreaselinespacing,.btnToolBarChart.dx-icon-tips,.btnToolBarChartChecked.dx-icon-tips,.btnToolBarChart.dx-icon-fill,.btnToolBarChartChecked.dx-icon-fill,.btnToolBarChart.dx-icon-redo,.btnToolBarChartChecked.dx-icon-redo,.btnToolBarChart.dx-icon-sun,.btnToolBarChartChecked.dx-icon-sun,.btnToolBarChart.dx-icon-increaseindent,.btnToolBarChartChecked.dx-icon-increaseindent {
   font-size: 20px
}
.btnToolBarChart.dx-icon-decreaselinespacing {
   transform: rotate(90deg)
}
.btnToolBarChartChecked,
.btnToolBarChart:hover {
   color: #0089c2;
   border-color: #0089c2
}
#chartToolbar {
   display: flex;
   flex-direction: column;
   width: 36px;
   height: 100%;
   box-sizing: border-box;
   padding-top: 6px;
   padding-right: 5px
}
#chartToolbar > div:not(:first-child) {
   margin-top: 4px
}
#chartWidgetCustomLegend {
   border: 1px solid #d3d3d3;
   border-radius: 4px;
   padding: 2px;
   box-sizing: border-box;
   background-color: #f0f0f0;
   font-size: 9px !important;
   position: absolute
}
#chartWidgetCustomLegend > div {
   font-size: 9px !important
}
#chartContainer {
   padding: 0;
   width: 100%;
   display: inline-flex;
   flex-flow: row;
   width: 100%;
   height: 100%;
   position: relative;
   background-color: #fff
}
#chartWidgetCustomLegend i {
   position: absolute;
   right: 1px;
   top: 0;
   margin-top: -3px;
   cursor: pointer;
   font-size: 11px;
   color: #838794;
   font-weight: bold
}


#message-call-point-grid .dx-datagrid-total-footer { display: none }
.message-call-point-search-container { width: 100% }
.message-call-point-menu-container { margin-right: 8px }
.message-call-point-middle-container {
   align-items: flex-start;
   height: calc(100% - 80px);
}



/* Темна тема */

.dark-theme .mf-component:hover { background-color: #3c4861 }
.dark-theme .mf-component:active { background-color: #2b5ec3 }
.dark-theme .mf-custom-search-result { background-color: #2a364d }
.dark-theme .mf-custom-search-result-item:hover {
   background-color: #2f3b53;
   color: #65b8ff;
}
.dark-theme .mf-custom-search-result-item-info { color: #c4cdd9 }
.dark-theme .search-global-filter-button { background-color: #101725 }
.dark-theme .search-filter-select,
.dark-theme .search-global-filter-button-select { background-color: #283593 !important }
.dark-theme .mf-search-input {
   background-color: #101725;
   border: 2px solid #434a59;
   color: #e2e8f0;
}
.dark-theme .mf-select-search-result-item:hover {
   background-color: #1a202c;
   color: #4a95ff;
}
.dark-theme .mf-datepicker-element,
.dark-theme .mf-dialog { background-color: #273144 }
.dark-theme .mf-dialog-top-panel,
.dark-theme .mf-dialog-top-panel-v2 { border-bottom: 1px solid #3e4b61 }
.dark-theme .mf-tag-box,
.dark-theme .mf-textarea,
.dark-theme .mf-text-input,
.dark-theme .mf-dropdown-search,
.dark-theme .mf-number-box-input,
.dark-theme .mf-datetime-box-element,
.dark-theme .mf-datepicker-element,
.dark-theme .delete-points-time-input {
   background-color: #101725;
   border: 2px solid #434a59;
   color: #e2e8f0;
}
.dark-theme .mf-datetime-box-input {
   background-color: #101725;
   color: #e2e8f0;
}
.dark-theme .mf-radio-button { color: #e2e8f0 }
.dark-theme .mf-select-search-result-list,
.dark-theme .mf-dropdown-menu { background-color: #2a364d }
.dark-theme .mf-dropdown-menu-item:not(.mf-dropdown-menu-item-sticky):hover { background-color: #1a202c }
.dark-theme .mf-select-search-values-area { background-color: #414d65 }
.dark-theme .mf-togglebox { border: 1px solid #505d76 }
.dark-theme .mf-file-uploader-list { background-color: #264d6a }
.dark-theme .button-disable { background-color: #676767 !important }
/* TagBox */
.dark-theme .mf-tag-box-list-container { background-color: #2a364d }
.dark-theme .mf-tag-box-search-container { background-color: #20293c }
.dark-theme .mf-tag-box-search {
   background-color: #101725;
   border-color: #434a59;
   color: #e2e8f0;
}
.dark-theme .mf-tag-box-button-panel { background-color: #273144 }
.dark-theme .mf-tag-box-list { background-color: #2a364d }
.dark-theme .mf-tag-box-list-item:hover { background-color: #1a202c }
.dark-theme .mf-tag-box-button:hover {
   background-color: #59667e;
   color: #e2e8f0;
}
/* Виринаюче інформаційне віконце */
.dark-theme .mf-snackbar { background-color: #3b4a68; }
.dark-theme .mf-snackbar-v2 {
   background-color: #313742;
   color: #e2e8f0;
}
.dark-theme .mf-snackbar-v2-icon { color: #b0bed0 }
.dark-theme .mf-snackbar-v2-text { color: #e2e8f0 }
.dark-theme .mf-snackbar-v2-close {
   background-color: #313742;
   color: #b0bed0;
}
/* Уточнення */
.dark-theme .mf-clarify-element {
   background-color: #101725;
   border-color: #434a59;
}
.dark-theme .mf-clarify-input {
   background-color: #101725;
   color: #e2e8f0;
}
.dark-theme .mf-clarify-actions { border-left-color: #434a59 }
/* Вибір дати і часу */
.dark-theme .mf-datepicker-datepicker { overflow: hidden }
.dark-theme .air-datepicker {
   border: 1px solid #101725;
   background: #101725;
   color: #e2e8f0;
}
.dark-theme .mf-datepicker-timepicker-container { background-color: #273144 }
.dark-theme .mf-datepicker-top-panel { background-color: #273144 }
.dark-theme .mf-datepicker-datepicker { background-color: #273144 }
.dark-theme .air-datepicker-nav { border-bottom: 1px solid #3a4760 }
.dark-theme .air-datepicker-nav--title:hover,
.dark-theme .air-datepicker-cell.-focus-,
.dark-theme .air-datepicker-nav--action:hover { background: #283651 }
.dark-theme .mf-datepicker-timepicker-container-v2 { background-color: #273144 }
.dark-theme .mf-time-picker-toggle {
   border: 2px solid #798994;
   background-color: #273144;
}
.dark-theme .mf-time-picker-toggle-select { background-color: #00a9bf }
.dark-theme .mf-datepicker-element { background-color: #273144 }
/* Меню */
.dark-theme .mf-menu { background-color: #273144 }
.dark-theme .mf-menu-item-selected { background-color: #68c3ff }
.dark-theme .mf-menu-item:not(.mf-menu-item-selected):hover { background-color: #37435a }
.dark-theme .mf-menu-item-counter { background-color: #2b82ff }
.dark-theme .mf-menu-dropdown {
   border: 1px solid #2a364d;
   background-color: #2a364d;
}
.dark-theme .mf-menu-dropdown-item:not(.mf-menu-item-selected):hover { background-color: #394864 }
.dark-theme .mf-menu-more-marked { background-color: #375163 }
/* Календар */
.dark-theme .mf-calendar-component { background-color: #273144 }
.dark-theme .mf-calendar-day,
.dark-theme .mf-calendar-month-item,
.dark-theme .mf-calendar-month-year,
.dark-theme .mf-calendar-prev-button,
.dark-theme .mf-calendar-next-button { color: #e2e8f0 }
.dark-theme .mf-calendar-today { outline-color: #1ca8dd }
.dark-theme .mf-calendar-current-month { background-color: #1ca8dd }
.dark-theme .mf-calendar-selected { background-color: #006af0 }
.dark-theme .mf-calendar-day:not(.mf-calendar-selected, .mf-calendar-today):hover,
.dark-theme .mf-calendar-month-item:hover { background-color: #2c4069 }
.dark-theme .mf-calendar-other-month { color: #8292a6 }
.dark-theme .mf-calendar-day-name { color: #ff9800 }
.dark-theme .mf-selectbox-input {
   border: 2px solid #434a59;
   background-color: #101725;
}
.dark-theme .mf-selectbox-list-container { background-color: #2a364d }
.dark-theme .mf-list-element { background-color: #2a364d }
.dark-theme .mf-list-item { color: #e2e8f0 }
.dark-theme .mf-list-item-nodata { color: #acb4bf }
.dark-theme .mf-list-item:not(.mf-list-selected, .mf-list-item-selected, .mf-list-item-nodata):hover { background-color: #1a202c }
.dark-theme .mf-list-selected { background-color: #245087 }
.dark-theme .mf-list-group-header {
   background-color: #202a3f;
   color: #e2e8f0;
}
.dark-theme .mf-list-group-header-title { color: #8d9cb1 }
.dark-theme .mf-list-item-selected { background-color: #1b4b6b }

.dark-theme .mf-popover {
   border: 1px solid #2a364d;
   background-color: #2a364d;
}
.dark-theme .mf-popover-arrow-outer { background-color: #2a364d }
.dark-theme .mf-popover-arrow-inner { background-color: #2a364d }

.dark-theme .mf-disabled {
   background: #1e273a !important;
   color: #7d848d !important;
}
/* Обгортка контролів */
.dark-theme .mf-control-wrapper-info {
   border: 1px solid #434a59;
   background-color: #202a3f;
}
.dark-theme .mf-selectbox-input-wrapper { background-color: transparent }
.dark-theme .mf-selectbox-input-placeholder {
   border: 2px solid #202a3f;
   background-color: #202a3f;
}
/* DateTimeBoxV2 */
.dark-theme .mf-time-picker-element-v2 {
   --mf-fade-top: linear-gradient(to bottom, rgb(39 49 68) 0%, rgba(60, 60, 60, 0) 100%);
   --mf-fade-bottom: linear-gradient(to top, rgb(39 49 68) 0%, rgba(60, 60, 60, 0) 100%);
   --mf-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.3), 0 8px 15px -6px rgba(0, 0, 0, 0.3);
   --mf-overlay-border: #3e4b61;
   --mf-text-inactive: #a3a3a3;
   --mf-text-active: #ffffff;
   --mf-separator: #737373;
   --mf-border: #273144;
   --mf-bg: #273144;
}

.dark-theme .popup-window {
   box-shadow: 0 0 4px 0 #000000cc;
   background-color: #273144;
}
.dark-theme .popup-top { border-bottom-color: #434a59 }
.dark-theme .form-item {
   background-color: #101725;
   border-color: #434a59;
   color: #e2e8f0;
}
.dark-theme .search-filter-button {
   background-color: #1a202c;
   border: 2px solid #3c8cee;
   color: #e2e8f0;
}
.dark-theme .search-result-box {
   box-shadow: 0 4px 12px 0 #000000c2;
   background-color: #1a202c;
}
.dark-theme .search-result-box tr { border-top: 1px solid #434a59 }
.dark-theme .device-search-item:hover { background-color: #3c4559 }
.dark-theme .device-search-item { border-bottom: 2px solid #006e9f }

.dark-theme .create-button {
   border: 2px solid #0262da;
   background-color: #0262da;
   color: #bddaff;
}
.dark-theme .form-combo { background-color: #1a202c }
.dark-theme .priority-color-item-select { color: #000 }
/* Загальні стилі ERP */
.dark-theme a { color: #349aff }
.dark-theme .erplite-side-panel {
   border-right: 1px solid #434a59;
   background-color: #1a202c;
}

.dark-theme .erplite-form-input {
   border: 2px solid #434a59;
   background-color: #101725;
   color: #e2e8f0;
}
.dark-theme .erplite-grey-slim-button { background-color: #47494d }
.dark-theme .erplite-default-container { background-color: #394459 }
.dark-theme .module-top-panel { background-color: #1a202c }
.dark-theme .highlight-matches {
   background-color: #ffd117;
   color: #111;
}
.dark-theme .erplite-panel { background-color: #293242 }

.dark-theme .grid-filter-indicator {
   background-color: #ffc000;
   color: #333;
}

html.dark-theme,
body.dark-theme,
.dark-theme table {
   background-color: #1a202c; /* Темний фон */
   color: #e2e8f0; /* Світлий текст */
}
.dark-theme input[type=number]:hover::-webkit-inner-spin-button, 
.dark-theme input[type=number]:hover::-webkit-outer-spin-button { 
   /*-webkit-appearance: none;*/
   opacity: 0.4;
}
.dark-theme input[type=number]:focus::-webkit-inner-spin-button, 
.dark-theme input[type=number]:focus::-webkit-outer-spin-button { 
   opacity: 0.4;
}
.dark-theme option { background-color: #2a364d }
.dark-theme option:hover { background-color: #2a364d }
.dark-theme #main-menu {
   border-right-color: #3e4b61;
   box-shadow: 6px 0 10px 0 #000;
   background-color: #1a202c;
}
.dark-theme #top-panel {
   border-bottom-color: #333d4e;
   background-color: #1a202c;
}
.dark-theme #top-title { color: #e2e8f0 }
.dark-theme #metro-container { background-color: #1a202c }
.dark-theme .metro-item-container { border-color: #1a202c }
.dark-theme .metro-item-icon { color: #333 }
.dark-theme .metro-item-container:hover {
   background-color: #7888a7;
   opacity: 0.8;
}
.dark-theme #main-menu-top {
   border-bottom-color: #3e4b61;
   background-color: #293242;
}
.dark-theme #main-menu-version,
.dark-theme #main-menu-account { color: #e2e8f0 }
.dark-theme #main-menu-info { background-color: #1b263b }
.dark-theme .main-menu-item,
.dark-theme .main-menu-group-item { color: #e2e8f0 !important}
.dark-theme .main-menu-item:hover,
.dark-theme .main-menu-group-item:hover { background-color: #2f3b53 }
.dark-theme .main-menu-group-title { background-color: #314a4c }
.dark-theme .current-page {
   border-right-color: #2196f3;
   background: rgb(255,255,255);
   background: linear-gradient(90deg, rgba(51,51,51,1) 0%, rgba(63,48,132,1) 32%, #ff9800 100%);
}
.dark-theme #top-horizontal-menu-container {
   border-bottom-color: #434a59;
   background-color: #242b39;
}
.dark-theme .horizontal-menu-item { color: #e2e8f0 }
.dark-theme .current-page-horisontal { background-color: #054a6a }
.dark-theme .horizontal-menu-item:hover { background-color: #2b364b }
.dark-theme #global-create-financial-task-button { color: #00c800; }
.dark-theme .card-status-icon { color: #e2e8f0 }
/* Пристрій */
.dark-theme #device-top-panel,
.dark-theme .device-adaptive-block { background-color: #222939 }
.dark-theme #device-top-panel { border-bottom: 1px solid #353e50 }
.dark-theme .device-search-custom-item { background-color: #2a364d }
.dark-theme .device-search-custom-item:hover { background-color: #2b364b }
.dark-theme .device-search-custom-item-row { border-top: 1px solid #374257 }
.dark-theme .device-info-label { color: #9daccf }
.dark-theme .device-card,
.dark-theme .device-exinfo-table,
.dark-theme .device-select-block-container { background-color: #212d44 }
.dark-theme .device-exinfo-table tr { border-bottom: 1px solid #495773 }
.dark-theme .device-item-exinfo { border-top-color: #434a59 }
.dark-theme .device-item,
.dark-theme .contact-item { background-color: #212d44 }
.dark-theme .device-item-no-tariff {
   background-color: #00d0b5;
   color: #111;
}
.dark-theme .device-item-no-discount {
   background-color: #e0c900;
   color: #111;
}
.dark-theme .device-card-right-block { border: 1px solid #434a59 }
.dark-theme .device-go-to-calibration { background-color: #234b98 }
.dark-theme .device-status-chips-pause { background-color: #ff3626 }
.dark-theme .device-status-chips-hidden { background-color: #4e9200 }
.dark-theme .device-status-chips-rouming { background-color: #da00ff }
.dark-theme .device-status-chips-notariff { background-color: #e83800 }
.dark-theme .device-status-chips-logging { background-color: #0097a9 }
.dark-theme .device-status-chips { color: #e2e8f0 }
.dark-theme .device-upd-last-point { color: #499bff }
.dark-theme .device-equipment-panel {
   background-color: #222939;
   border-color: #333d4e;
}
.dark-theme .device-add-equipment { background-color: #0362d9; }
.dark-theme .device-equipment-table td {
   background-color: #222939;
   border-color: #434a59;
}
.dark-theme .device-calibration-current-drp1 { background-color: #007e9a }
.dark-theme .device-calibration-current-drp2 { background-color: #ad6700 }
.dark-theme .device-save-settings-button,
.dark-theme .device-save-hardware-button { background-color: #0362d9 }
.dark-theme .device-equipment-add-container {
   border-right: 1px solid #434a59;
   border-left: 1px solid #434a59;
   background-color: #222939;
 }
/* Історія */
.dark-theme .search-input {
   border: 2px solid #434a59;
   background-color: #101725;
   color: #e2e8f0;
 }
.dark-theme .history-date { background-color: #3c6065 }
.dark-theme .history-head { background-color: #354257 }
.dark-theme .history-item tr { border-top-color: #434a59 }
.dark-theme .history-cell { border-left-color: #434a59 }
/* Компанії */
.dark-theme .company-card { background-color: #212d44 }
.dark-theme #subdevices-filter-block { background-color: #212d44 }
.dark-theme #subdevices-filter-block input,
.dark-theme #subcontact-search-container input { background-color: #284d5e }
.dark-theme #subdeal-card-filter-popup { background-color: #2a364d }
.dark-theme .subdeal-card-filter-reset { background-color: #3a4c70 }
.dark-theme .subdeal-card-filter-popup-input {
   background-color: #101725;
   border-color: #434a59;
}
.dark-theme .company-submodule-top-panel { background-color: #212d44 }
.dark-theme .subdevice-status-active { background-color: #008eff }
.dark-theme .subdevice-status-pause { background-color: #d94439 }
.dark-theme .subdevice-status-hidden { background-color: #96e63b; color: #111 }
.dark-theme .subdevice-status-logging { background-color: #ddcb2b; color: #111 }
.dark-theme .subdevice-status-rouming { background-color: #ba1cd5 }
.dark-theme .subdevice-status-azs { background-color: #795548 }
.dark-theme .subdevice-status-selected { border-color: #fff }
.dark-theme #company-create-task-button,
.dark-theme .company-title { color: #333 }
.dark-theme .company-top-ok { background-color: #8eff61 }
.dark-theme .client-switch-info-block { background-color: #8eff61 }
.dark-theme .client-top-panel-button {
   background-color: #00d1ff;
   color: #101725;
}
.dark-theme .select-submenu {
   background-color: #008dff;
   border-color: #008dff;
   color: #fff;
}
.dark-theme .exinfo-table { background-color: #212d44 }
.dark-theme .exinfo-table tr { border-bottom: 1px solid #365563 }
.dark-theme .exinfo-additional-th {
   background-color: #212d44;
   color: #b6c1cf;
}
.dark-theme .exinfo-additional-table td { border-color: #434a59; }
.dark-theme .company-exinfo-label { color: #bbc9e4 }
.dark-theme .company-devices { background-color: #043c07 }
.dark-theme .client-billing-block { background-color: #354522 }
.dark-theme .client-top-panel { border-bottom: 1px solid #40506f }
.dark-theme .company-segment-chips {
   background-color: #00c5df;
   color: #111;
}
.dark-theme .company-binding-code { background-color: #b815d0 }
.dark-theme .company-summary-tariff-item:hover { background-color: #37648a }
.dark-theme .company-bottom-panel { border-top-color: #212d44 }
.dark-theme .company-submodule-deal-top-panel { background-color: #1f2739 }
.dark-theme .company-summary-tariff-nonzero { color: #eee }
/* Компанії (таблиця) */
.dark-theme #companies-grid-top-panel {
   border-bottom-color: #434a59;
   background-color: #1a202c;
}
.dark-theme #companies-grid-search-container { background-color: #1a202c }
.dark-theme #companies-bottom-container{
   border-top: 1px solid #333d51;
   background-color: #233049;
}
/* Контакти */
.dark-theme .contact-card { background-color: #212835 }
.dark-theme .contact-card-top { background-color: #212835 }
.dark-theme .contact-non-account {
   background-color: #ffc61c;
   color: #111;
}
.dark-theme .contact-non-contact {
   background-color: #7af0ff;
   color: #111;
}
.dark-theme .contact-item-exinfo { border-top: 1px solid #212835 }
.dark-theme .exinfo-account-container { background-color: #1a202c }
.dark-theme .exinfo-account-info { background-color: #212835 }
.dark-theme .exinfo-account-availability { color: #3790ff }
.dark-theme .exinfo-account-blocked { color: #ff5245 }
.dark-theme .contact-form-top-panel { background-color: #33466a }
.dark-theme .del-contact-info {
   background-color: #006899;
   color: #96fcff;
}
.dark-theme .contact-form-input {
   background-color: #101725;
   border-color: #434a59;
   color: #e2e8f0;
}
.dark-theme .contact-car-row { background-color: #173e4f }
/* Задачі  */
.dark-theme .task-top-panel {
   box-shadow: 0 1px 1px -1px #3338;
   background-color: #273144;
}
.dark-theme #tasks-list { background-color: #101725 }
.dark-theme .task-form-body { background-color: #273144 }
.dark-theme .task-form-status-button { background-color: #48b7ff }
.dark-theme .task-form-link-button { background-color: #204d71 }
.dark-theme .task-form-field-info-form,
.dark-theme .task-item-control-container { background-color: #1a202c }
.dark-theme .fintask-performer-container { background-color: #2f4163 }
.dark-theme .tasks-sidebar-amount-block { background-color: #2b3447 }
.dark-theme .tasks-refresh-button { color: #b8b8b8 }
.dark-theme #tasks-bottom-panel { background-color: #233049 }
.dark-theme .gtasks-sidebar-amount { background-color: #00e2ff }
.dark-theme .gtasks-sidebar-amount-button,
.dark-theme .events-sidebar-amount-button { color: #333 }
.dark-theme .gtasks-sidebar-amount-button-select,
.dark-theme .gtasks-sidebar-mode-item-select,
.dark-theme .events-sidebar-amount-button-select {
   background-color: #006673;
   color: #00ffff;
}
.dark-theme .subdeal-card { background-color: #292d37 }
.dark-theme .subdeal-card-id-link { background-color: #3d4a93 }
.dark-theme .subdeal-card-top { border-bottom-color: #414d65 }
.dark-theme .subdeal-card-bottom { border-top-color: #414d65; }
.dark-theme .subdeal-card-actions-block { background-color: #213352 }
.dark-theme .subdeal-card-electric-works { background-color: #1d384b }
.dark-theme .subdeal-card-work-field-value b { color: #82a9c8 }
.dark-theme .subdeal-card-additional-small-item { color: #b5bcca }
.dark-theme .subdeal-card-separation-line { border-top-color: #414d65 }
.dark-theme .subdeal-period-buttons:hover { background-color: #3e485e }
.dark-theme .simpletask-deadline-block { background-color: #1a202c }
.dark-theme .subdeal-card-description blockquote,
.dark-theme .subdeal-formresult-table blockquote,
.dark-theme #gtasks-container blockquote {
   background-color: #222c62;
   border: 2px solid #2e4781;
}
.dark-theme .gtasks-support-user-item { background-color: #257689 }
.dark-theme .gtasks-support-dialog-item { background-color: #5a5a5a; }
.dark-theme .taskcp4-selected-files { background-color: #414e67 }
.dark-theme #gtasks-top-panel { border-bottom: 1px solid #333d51 }
.dark-theme #gtasks-total-container { border-top: 1px solid #434a59; background-color: #233049 }
.dark-theme .gtasks-workday-plan-is-complete { background-color: #4c771a }
.dark-theme .gtasks-is-overdue { background-color: #b02525 }
.dark-theme .gtasks-master-details-head {
   background-color: #233049;
   color: #859ac3;
}
.dark-theme .gtasks-files-block {
   background-color: #293651;
   border-color: #233049;
}
.dark-theme .subdeal-step-card-top { background-color: #254d67 }
.dark-theme .subdeal-inner-card-title:after { background-color: #273144 }
.dark-theme .subdeal-formresult-header {
   background-color: #232935;
   color: #8babc0;
}
.dark-theme .subdeal-formresult-card-fold { background-color: #254d67 }
.dark-theme .gtasks-sidebar-amount-block { background-color: #233049; }
.dark-theme .popup-calendar-buttons { color: #e2e8f0 }
.dark-theme .tasks-is-overdue { background-color: #c74a4e }
.dark-theme .subdeal-card-rating-item { color: #ffad33 }
.dark-theme .subdeal-card-rating-comment {
   background-color: #ffaf30;
   color: #111;
}
.dark-theme .subdeal-card-tag {
   background-color: #404e64;
   color: #7dbeff;
}
.dark-theme .subdeal-card-wrong-contact {
   background-color: #533c3c;
   color: #ffaba6;
}
.dark-theme .subdeal-card-bottom { border-top-color: #414d65 }
.dark-theme .subdeal-card-bottom-cell:nth-child(even) {
   border-bottom-color: #414d65;
   border-top-color: #414d65;
}
.dark-theme .task-color-item-select { border-color: #1b8eff !important }
.dark-theme .subdeal-card-priority { border-color: #697388; }
.dark-theme .subdeal-priority-green { background-color: #1fb626 }
.dark-theme .subdeal-priority-red { background-color: #ff4d40 }
/* Статуси */
.dark-theme .subdeal-card-status-created { background-color: #5b5b5b }
.dark-theme .subdeal-card-status-performed { background-color: #3f5aed }
.dark-theme .subdeal-card-status-finished { background-color: #699d00 }
.dark-theme .filter-item-control-container { background-color: #414d65 }
.dark-theme .subdeal-card-back-to-tasks-button,
.dark-theme .tasks-back-to-all-button {
   box-shadow: 0 1px 4px 0 #000000c8;
   background-color: #006c9e;
}
.dark-theme .subdeal-card-parentid-label { background-color: #165686 }
/* Нова форма задачі */
.dark-theme .task-form-is-pin-fields {
   background-color: #eb68ff;
   color: #1900ff;
}
/* Угоди */
.dark-theme #deal-scroll-block { background-color: #1a202c; }
.dark-theme .deal-top-panel { border-bottom-color: #333d4e }
.dark-theme .deal-status-flowline { background-color: #273144 }
.dark-theme .deal-form-top-block { background-color: #42516d }
.dark-theme .deal-form-block-top { background-color: #273144 }
.dark-theme .deal-form-id-label { background-color: #68c3ff }
.dark-theme .deal-info-block { background-color: #1a202c }
.dark-theme .deal-info-table-head { background-color: #273144 }
.dark-theme .deal-multiplex-item { border: 1px solid #55637f }
.dark-theme .deal-goods-summary th {
   background-color: #1d2b47;
   color: #8daae0;
}
.dark-theme .deal-goods-summary th,
.dark-theme .deal-goods-summary td {
   background-color: #273144;
   border: 1px solid #55637f;
}
.dark-theme #deal-total-container {
   border-top: 1px solid #333d51;
   background-color: #233049;
}
.dark-theme .deal-grid-status { color: #111 }
.dark-theme .deal-comment-item { background-color: #29535c }
.dark-theme .deal-go-to-accounting { color: #00ef00 }
.dark-theme .deal-form-console-container { background-color: #383d46 }
.dark-theme .deal-form-response-info { background-color: #273144 }
.dark-theme .deal-form-response-table tr:nth-child(even) { background-color: #273144 }
.dark-theme .deal-form-toolbar-close { color: #b3ceff }
.dark-theme .deal-form-toolbar { background-color: #005db9 }
.dark-theme .deal-form-response-warning {
   background-color: #ffbf00;
   color: #111;
}
.deal-form-response-text,
.deal-form-response-error,
.deal-form-response-warning {
   background-color: #ffb100;
   color: #333;
}
.dark-theme .deal-invoice-table th {
   background-color: #273144;
   border-color: #434a59;
   color: #9eadc1;
}
.dark-theme .deal-invoice-table td { border-color: #373d4a }
.dark-theme .deal-invoice-goods-title th {
   background-color: #1a202c;
   border-color: #434a59;
}
.dark-theme .deal-invoice-table th:first-child,
.dark-theme .deal-invoice-goods-head th:first-child { border-left-color: #434a59 }
.dark-theme .deal-invoice-table th:last-child
.dark-theme .deal-invoice-goods-head th:last-child { border-right-color: #434a59 }
.dark-theme .deal-invoice-table-main { background-color: #006491 }
.dark-theme .deal-invoice-cached { color: #ffdd81 }
.dark-theme .deal-invoice-top-panel { background-color: #2d394f }
.dark-theme .deal-invoice-card { background-color: #1a202c }
.dark-theme .deal-invoice-history-table { background-color: #313742 }
.dark-theme .deal-accountant-info-container { border: 1px solid #414d65 }
.dark-theme .deal-accountant-info-cp1 { color: #7e8ca6 }
.dark-theme .deal-accountant-info-label { color: #a0acbb }

.dark-theme #gtasks-card-info-count,
.dark-theme #scheduler-card-info-count { background-color: #2b3a59 }
/* Склад */
.dark-theme .storage-history-table-head { background-color: #3e5864 }
.dark-theme .storage-history-table-date { background-color: #00699a !important }
.dark-theme .storage-history-table td { border-color: #434a59 }
.dark-theme .storage-top-panel-info { background-color: #3884ff }
/* Акти електриків */
.dark-theme .bills-top-panel { border-bottom: 1px solid #343d50 }
.dark-theme .bills-accounting-block { background-color: #1d263b }
.dark-theme .bills-for-pay-block,
.dark-theme .bills-imprest-block { background-color: #000 }
.dark-theme .bills-side-buttons-block {
   box-shadow: 0 1px 0px 0px #333d51;
   background-color: #1a202c;
}
.dark-theme .bills-employee-button { background-color: #394151 }
.dark-theme .bills-employee-button-select { background-color: #006dd9 }
.dark-theme #bills-total-container {
   border-top: 1px solid #333d51;
   background-color: #233049;
}
.dark-theme .bills-accounting-label { color: #9baaff }
/* Форма Створити рахунок */
.dark-theme .іnvoice-type-container { background-color: #24506d }
.dark-theme .invoice-form-goods-panel { background-color: #2c5876 }
.dark-theme .invoice-form-goods-count {
   background-color: #101725;
   color: #e2e8f0;
}
.dark-theme .іnvoice-goods-item { background-color: #3b4456 }
.dark-theme .task-form-field-info-button { color: #c7c7c7 }
/* Двусторонній дзвінок */
.dark-theme #telephony-form {
   background-color: #242b38;
   border-color: #434a59;
}
.dark-theme .telnumber-search-box {
   box-shadow: 0 4px 12px 0 #000000c2;
   background-color: #1a202c;
   border: 1px solid #1a202c;
}
.dark-theme .telnumber-search-box tr { border-top: 1px solid #434a59 }
/* Форми */
.dark-theme #forms-title { background-color: #2b3447 }
.dark-theme #forms-container { background-color: #2b3447 }
.dark-theme .forms-link:hover {
   background-color: #17646c;
   color: #a4f6ff;
}
/* Авто */
.dark-theme #car-total-container,
.dark-theme #billing-total-container {
   border-top-color: #333d51;
   background-color: #233049;
}
/* Тарифи */
.dark-theme .billing-top-panel { border-bottom-color: #434a59; }
.dark-theme .entry-input {
   background-color: #101725;
   border-color: #434a59;
   color: #e2e8f0;
}
/* Акаунти */
.dark-theme #accounts-total-container {
   border-top: 1px solid #333d51;
   background-color: #233049;
}
.dark-theme #accounts-top-panel { border-bottom-color: #434a59 }
.dark-theme #accounts-search-container { background-color: #1a202c }

.dark-theme .card-exinfo-table tr:nth-child(even) { background-color: #212835 }
.dark-theme .storage-form-top-panel { background-color: #2b4268 }
.dark-theme .storage-total-item { color: #e2e8f0 }

/* Налаштування */
.dark-theme #settings-task-template-list { background-color: #1a202c }
.dark-theme #settings-task-template-top-panel { border-bottom-color: #434a59 }
.dark-theme .tools-table-head {
   background-color: #293242;
   color: #9aa5bc;
}
.dark-theme .tools-table td { border-color: #434a59 }
.dark-theme .task-template-main-controls { background-color: #1a202c }
.dark-theme .tool-module-container { background-color: #222d42 }
.dark-theme #tool-device-move-table td { border-color: #434a59 }
.dark-theme .tool-device-move-table-head-cell {
   background-color: #242b39;
   color: #95a5c3;
}
.dark-theme .delete-points-daterange-block { background-color: #414855 }
/* Перенос пристроїв */
.dark-theme .tools-selector-item-cell { border-left: 1px solid #434a59 }
.dark-theme .tools-selector-item-row { border-bottom: 1px solid #434a59 }
.dark-theme .tools-selector-item-row:first-child { border-top: 1px solid #434a59 }
.dark-theme .tools-selector-item-cell:last-child { border-right: 1px solid #434a59 }
.dark-theme .tools-selector-item-row:hover { background-color: #43516b }
.dark-theme .tool-device-move-del { color: #ff655a }
.dark-theme #tool-device-move-table tr:hover { background-color: #2f3348 }

.dark-theme .settings-company-block { background-color: #293242 }
.dark-theme .settings-company-top-panel { background-color: #293242 }
.dark-theme .task-template-add-button { background-color: #101725 }
.dark-theme .refrash-company-segment-button { background-color: #101725 }

.dark-theme .settings-car-top-panel { background-color: #293242 }
.dark-theme .settings-table td { border: 1px solid #434a59 }

.dark-theme #single-task-top-panel { border-bottom: 1px solid #1a202c }
/* Маршрути */
.dark-theme .waybill-card {
   background-color: #292d37;
   border: 1px solid #434a59;
}
.dark-theme .waybill-card-id-container { background-color: #68c3ff }
.dark-theme .waybill-card-top { border-bottom-color: #434a59 }
.dark-theme .waybill-card-points { border-color: #434a59 }

/* TODO: переглянути це нагромадження */
.dark-theme .task-company-input-container,
.dark-theme #tasks-company-filter-container,
.dark-theme #scheduler-company-filter-container,
.dark-theme #company-input-container,
.dark-theme #subcompany-input-container,
.dark-theme #subdevice-brandmodel-container,
.dark-theme #device-brandmodel-container,
.dark-theme #simpletask-input-container {
   background-color: #233049 !important;
   border: 2px solid #434a59 !important;
}
.dark-theme .dx-dropdowneditor-icon { color: #e2e8f0 }

.dark-theme .dx-widget {
   background-color: #1a202c;
   color: #e2e8f0;
}
.dark-theme .dx-list .dx-empty-message,
.dark-theme .dx-list-item {
   background-color: #2a364d;
   border-top-color: #434a59;
   color: #e2e8f0;
}
.dark-theme .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected {
   background-color: #1a202c;
   color: #fff;
}
.dark-theme .dx-list-item .dx-state-hover { background-color: #233049 !important }
.dark-theme #container .dx-datagrid-headers { border-bottom: 1px solid #434a59 }
.dark-theme .dx-datagrid-headers { border-bottom-color: #434a59 }
.dark-theme #car-container .dx-datagrid-header-panel,
.dark-theme #deal-container .dx-datagrid-header-panel,
.dark-theme #gtasks-container .dx-datagrid-header-panel,
.dark-theme #bills-container .dx-datagrid-header-panel,
.dark-theme #billing-content .dx-datagrid-header-panel,
.dark-theme #accounts-container .dx-datagrid-header-panel,
.dark-theme #storage-table-container .dx-datagrid-header-panel,
.dark-theme #storage-devices-container .dx-datagrid-header-panel,
.dark-theme .dx-datagrid-header-panel { background-color: #233049 }
.dark-theme .dx-datagrid>.dx-datagrid-headers,
.dark-theme .dx-datagrid>.dx-datagrid-rowsview,
.dark-theme .dx-datagrid>.dx-datagrid-total-footer { background-color: #1a202c }
.dark-theme .dx-datagrid-borders>.dx-datagrid-rowsview,
.dark-theme .dx-datagrid-borders>.dx-datagrid-total-footer { border-bottom: 1px solid #313a4d }
.dark-theme .dx-datagrid-borders .dx-datagrid-rowsview,
.dark-theme .dx-datagrid-headers+.dx-datagrid-rowsview,
.dark-theme .dx-datagrid-rowsview.dx-datagrid-after-headers { border-top: none }
.dark-theme .dx-datagrid-headers .dx-datagrid-table .dx-row > td { border-bottom-color: #434a59 }
.dark-theme .dx-datagrid-headers .dx-datagrid-table .dx-row > td { border-bottom-color: #333d4e }
.dark-theme .dx-datagrid .dx-column-lines > td {
   border-right: 1px solid #434a59;
   border-left: 1px solid #434a59;
}
.dark-theme .dx-datagrid .dx-row-lines > td { border-bottom-color: #434a59 }
.dark-theme .dark-theme .dx-datagrid-borders>.dx-datagrid-filter-panel,
.dark-theme .dark-theme .dx-datagrid-borders>.dx-datagrid-headers { border-top-color: #434a59 }
.dark-theme .dx-datagrid-borders>.dx-datagrid-headers,
.dark-theme .dx-datagrid-borders>.dx-datagrid-rowsview,
.dark-theme .dx-datagrid-borders>.dx-datagrid-total-footer {
   border-right: 1px solid #434a59;
   border-left: 1px solid #434a59;
}
.dark-theme .dx-datagrid-borders>.dx-datagrid-filter-panel,
.dark-theme .dx-datagrid-borders>.dx-datagrid-headers { border-top-color: #434a59 }
.dark-theme .dx-datagrid-rowsview .dx-master-detail-row:not(.dx-datagrid-edit-form) .dx-master-detail-cell,
.dark-theme .dx-datagrid-rowsview .dx-master-detail-row:not(.dx-datagrid-edit-form)>.dx-datagrid-group-space {
   background-color: #1a202c;
}
.dark-theme .dx-datagrid-table .dx-data-row.dx-state-hover:not(.dx-selection):not(.dx-row-inserted):not(.dx-row-removed):not(.dx-edit-row):not(.dx-row-focused) > td:not(.dx-focused) {
   background-color: #233049;
   color: #e2e8f0;
}
.dark-theme #container .dx-state-hover { background-color: #233049 }
.dark-theme #container .dx-state-active { background-color: #2b4068 }
.dark-theme .dx-button-mode-contained {
   background-color: #1a202c;
   border-color: #ddd;
   color: #e2e8e3;
}
.dark-theme .dx-datagrid-rowsview .dx-row.dx-group-row:not(.dx-row-focused) {
   background-color: #233049;
   color: #c1cbda;
}
.dark-theme .dx-datagrid-rowsview .dx-row.dx-group-row td {
   border-bottom-color: #434a59;
   border-top-color: #434a59;
}
.dark-theme .dx-datagrid-column-chooser .dx-overlay-content { background-color: #273144 }
.dark-theme .dx-popup-wrapper > .dx-overlay-content { border-color: #273144 }
.dark-theme .dx-treeview-item-with-checkbox .dx-treeview-item { color: #e2e8f0; }
.dark-theme .dx-popup-title { color: #e2e8f0 }
.dark-theme .dx-popup-wrapper > .dx-overlay-content {
   background-color: #273144;
   border-color: #273144;
}
.dark-theme .dx-list-select-all { border-bottom-color: #434a59; }
.dark-theme .dx-button-mode-text .dx-icon { color: #e2e8f0 }
.dark-theme .dx-texteditor-input {
   background-color: #101725;
   color: #e2e8f0;
}
.dark-theme .dx-texteditor.dx-editor-outlined {
   background-color: #233049;
   border-color: #434a59;
}
.dark-theme .dx-editor-cell .dx-texteditor,
.dark-theme .dx-editor-cell .dx-texteditor .dx-texteditor-input { background-color: #1a202c }
.dark-theme .dx-overlay-wrapper { color: #e2e8f0 }

.dark-theme .mini-card-content { border-top: 1px solid #434a59 }
.dark-theme .minideal-card { background-color: #292d37 }
.dark-theme .events-sidebar-amount-block { background-color: #233049 }
.dark-theme .events-sidebar-amount { background-color: #00e2ff }
.dark-theme .erplite-bottom-panel {
   border-top: 1px solid #434a59;
   background-color: #233049;
}
.dark-theme .module-top-panel { border-bottom: 1px solid #434a59; }
.dark-theme .mf-region-editor-top-panel { background-color: #1a202c }
/* Нотифікації */
.dark-theme .notify-message-application-combo { background-color: #1b222d }


/* Неперекриваємі властивості */
.dx-gridbase-a11y-status-container { display: none !important }
.del-button { background-color: #f44336 }
.batch-button { background-color: #f57c00 }
.current-card { box-shadow: inset 0 0 0 3px #fb8c00; }
.filter-clear-button { color: #bbb }
.popup-first-paragraph { margin-top: 0 }
.popup-form-textarea {
   resize: vertical;
   min-height: 28px;
}
.mobile-module {
   margin-top: 6px;
   height: calc(100% - 8px);
}
/* TODO: це видалити !!! */
/*.top-horizontal-menu-button-down { background-image: url('../img/arrow-down.svg') }
.top-horizontal-menu-button-up { background-image: url('../img/arrow-up.svg') }*/
#container .dx-placeholder { line-height: 14px }
.task-form .dx-button-content,
.task-ins-task .dx-button-content,
.tasks-upd-task .dx-button-content,
.subdeal-actions-form .dx-button-content { padding: 4px 16px }
#container .dx-datagrid-group-space {
   width: 30px !important;
   max-width: 30px !important;
}
#container .dx-state-active { background-color: #ecf9ff }
#container .dx-header-row > td > .dx-datagrid-text-content { white-space: nowrap }
#container .dx-checkbox-icon {
   height: 18px;
   width: 18px;
   font-size: 14px;
   border-color: #d1d1d1;
   color: #1976d2;
}
.dx-scheduler-appointment { color: #333 }
.dx-texteditor-input-container { align-items: center }
.grid-content {
   overflow: hidden;
   height: 100%;
   width: 100%;
}
.grid-scroll-content { width: fit-content }
.blinker-class { animation: blink 0.5s linear infinite }
@keyframes blink {
   25% { opacity: 0.5; }
   50% { opacity: 0; }
   75% { opacity: 0.5; }
}
.instance-preload {
   /* Локальний прелоадер контролів */
   margin: 0 auto;
   height: 28px;
   width: 28px;

   background-position: center;
   background-repeat: no-repeat;
   background-image: url(../img/preloader-gear.svg);
   background-size: 28px;
}
.invoice-preloader {
   background-image: url(../img/invoice-preloader.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 32px;
   margin: 0 auto;
   height: 32px;
   width: 32px;
}
/*@keyframes arrow-bounce {
   0%, 100% { transform: translateY(0); }
   50% { transform: translateY(4px); }
}
#arrowPath {
   animation: arrow-bounce 1.5s infinite ease-in-out;
}*/
.actions-description {
   min-height: 180px;
   height: 180px;
   padding: 8px;
}
.erplite-missing-description {
   margin: 16px auto 8px auto;
   background-color: #b1c360;
   border-radius: 16px;
   padding: 16px;
   width: 360px;
}
.erplite-missing-description-img {
   background-position: center;
   background-repeat: no-repeat;
   background-image: url(../img/yoda.jpg);
   background-color: #fff;
   background-size: 310px;
   border-radius: 250px;
   overflow: hidden;
   margin: 0 auto;
   height: 300px;
   width: 360px;
}
.erplite-yoda-info {
   background-color: #b1c360;
   border-radius: 40px;
   padding: 4px 8px;
}
.erplite-yoda-icon {
   background-position: center;
   background-repeat: no-repeat;
   background-image: url(../img/yoda.jpg);
   background-color: #fff;
   background-size: 22px;
   border-radius: 80px;
   overflow: hidden;
   margin: 0 auto;
   height: 36px;
   width: 36px;
}
.device-yoda-icon {
   border: 4px solid #b1c360;
   margin-right: 8px;
   margin-left: auto;
}
.grid-unfold-row td {
   word-wrap: break-word;
   white-space: normal;
}

/* Анімація */
@keyframes slideInDown {
   from {
      opacity: 0;
      transform: translateY(-20px);
   }
   to {
      opacity: 1;
      transform: translateY(0);
   }
}
@keyframes fadeOutDown {
   from {
      opacity: 1;
      transform: translateY(0);
   }
   to {
      opacity: 0;
      transform: translateY(-20px);
   }
}
@keyframes slideInUp {
   from {
      opacity: 0;
      transform: translateY(20px);
   }
   to {
      opacity: 1;
      transform: translateY(0);
   }
}
@keyframes fadeOutUp {
   from {
      opacity: 1;
      transform: translateY(0);
   }
   to {
      opacity: 0;
      transform: translateY(20px);
   }
}

/*@media (hover: hover) {
   a:hover {
      background-color: red;
      color: white;
   }
}*/

/* Планшетна компоновка */
@media screen and (min-width: 520px) {
   #entry-container {
      margin: 0 auto;
      width: 420px;
   }
   #container {
      position: relative;
      width: 420px;
      min-width: 320px;
      margin: 0 auto;
      margin-top: 40px;
      overflow: hidden;
   }
   #top-panel { z-index: 1000 }
   #main-menu { z-index: 1055 }
   #task-top-panel { width: 420px }
   .erp-desktop {
      width: 100% !important;
      margin-top: 40px !important;
   }
   .slide-main-menu { width: 296px !important }
   .popup-window,
   .device-actions { width: 410px }
   #infoBox {
      position: fixed;
      top: 350px;
      left: 50%;
      width: 340px;
      padding: 24px 16px;
      margin-left: -170px;
      background-color: #fff;
      border-radius: 8px;
      box-shadow: 1px 1px 10px 4px #888;
      font-size: 10pt;
      z-index: 9999;

      background-image: url('../img/info.svg');
      background-repeat: no-repeat;
      background-position: 16px center;
      background-size: 32px;
   }
   .top-block { width: 420px }
   #simpletask-top-panel { width: 420px }
   .company-exinfo-label {
      font-size: inherit;
      min-width: 134px;
      width: 134px;
   }
}
@media screen and (min-width: 800px) {
   *::-webkit-scrollbar {
      background-color: transparent;
      -webkit-border-radius: 1ex;
      border-radius: 1ex;
      height: 10px;
      width: 10px;
   }
   *::-webkit-scrollbar-track {
      background-color: rgba(0, 0, 0, 0.1);
      border-radius: 1ex;
   }
   *::-webkit-scrollbar-thumb {
      -webkit-border-radius: 1ex;
      background-color: rgba(0, 0, 0, 0.3);
   }
   *::-webkit-scrollbar-corner {
      background: #d9d9d9;
   }

   #bills-tracker-count-container,
   #bills-teltonika-count-container,
   #bills-smarttrack-count-container,
   #bills-can-count-container,
   #bills-drp-count-container,
   #bills-repair-count-container,
   #bills-calibration-count-container { display: inherit; }

   .dx-overlay-wrapper {
      height: auto !important;
      width: auto !important;
   }

   .mf-datepicker-element {
      display: flex;
      flex-direction: row;
   }
   .mf-datepicker-dial { margin-top: 16px }
   .mf-dialog-top-panel {
      line-height: 32px;
      height: 32px;
   }
   .mf-datetime-box-form {
      display: flex;
      flex-direction: row;
      align-items: center;
   }

   .form-item-number {
      position: static;
      margin-right: 8px;
      line-height: 17px;
      min-height: 17px;
      min-width: 17px;
      height: 17px;
      width: 17px;
   }

   #main-window { width: 50% }
   #metro-container {
      grid-template-columns: auto auto auto auto;
      border-radius: 8px;
      height: auto;
   }
   .metro-item-container { padding: 32px 24px }
   .metro-item-text { font-size: 16px }

   .popup-window { position: fixed }

   #top-panel { z-index: 1000 }

   #task-top-panel { width: 420px }
   #top-loading { left: 36px }

   .simpletask-department-item:not(:first-child) {
      margin-left: 8px;
   }

   .gtasks-date-presets-block { margin: 16px 8px }
   .gtasks-date-presets-filter-button { padding: 0 16px }
   #deal-total-count-container,
   #gtasks-total-count-container { display: flex }

   .module,
   .submodule,
   .tool-module { font-size: inherit }
   /*.submodule,*/
   .couplemodule,
   .tool-module {
      position: relative;
      width: 98%;
      height: 100%;
      overflow: hidden;
   }
   .multimodule {
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      justify-content: flex-start;
      height: 100%;
      overflow: hidden;
   }
   .module-container,
   .submodule-container {
      width: 50%;
      height: 100%;
      overflow: hidden;
   }
   .submodule-container {
      position: relative;
      height: 100%;
      background-color: inherit;
      z-index: inherit;
      right: inherit;
      top: inherit;
   }
   .mobile-module {
      margin-top: 6px;
      height: calc(100% - 8px);
   }
   .submodule-list { height: calc(100% - 40px) }

   .minideal-card { border-radius: 4px }

   #company-list { font-size: inherit }
   .client-top-panel-button {
      display: inline-block;
      height: 24px;
      line-height: 24px;
      padding: 0 14px;
      padding-left: 42px;
      border: 2px solid #4482cf;
      border-radius: 24px;
      font-size: 14px;
      box-sizing: content-box;
      background-repeat: no-repeat;
      background-position: 12px center;
      background-size: 24px;
      cursor: pointer;
      width: inherit;
   }
   .client-switch-info-block {
      background-position: center;
      background-size: 16px;
      padding: 0;
      width: 24px;
   }
   .company-submodule-top-panel-item {
      display: inline-flex;
      overflow: hidden;
   }
   .subcontact-button {
      background-size: 16px;
      background-image: url(../img/contact.svg);
   }
   .subdeal-button {
      background-size: 16px;
      background-image: url(../img/deal.svg);
   }
   .company-invoice-link {
      background-size: 20px;
      background-image: url(../img/credit-card.svg);
   }
   .company-submodule-handle-block { display: none }
   #subdevices-list { height: calc(100% - 80px) }
   .subdevice-status-button {
      display: inline-flex;
      border: 2px solid #aaa;
      border-radius: 12px;
      text-align: center;
      line-height: 22px;
      font-family: 'Roboto-Regular';
      font-size: 8pt;
      padding: 0 2px;
      margin: 0 4px;
      height: 24px;
      width: auto;
      cursor: pointer;
   }
   .subdevice-status-label { display: inline }
   .subdevice-status-counter {
      display: inline-block;
      max-width: 32px;
      width: 24px;
      height: 24px;
   }
   .subdevice-status-selected { border-color: #673ab7; }
   .subdeal-card { border-radius: 4px }
   .subdeal-card-top {
      position: relative;
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      border-bottom: 1px solid #ccc;
      margin-bottom: 8px;
      height: 36px;
      width: 100%;
   }
   .subdeal-card-id-link-container { margin-left: 8px }
   .subdeal-card-actions-block {
      background-color: #d3e3fd;
      border-radius: 4px;
   }
   .subdeal-card-actions-button {
      display: inline-block;
      background-color: #3f51b5;
      border-radius: 32px;
      line-height: 28px;
      cursor: pointer;
      font-size: 14px;
      padding: 0 16px;
      height: 28px;
      color: #fff;
   }
   .subdeal-card-actions-button:not(:first-child) { margin-left: 8px }
   .subdeal-card-actions-loaded { padding: 8px }
   .subdeal-card-status-icon {
      height: 20px;
      font-size: 11pt;
   }
   .subdeal-card-status-icon span { display: inline }
   .subdeal-card-status-complete {
      color: #fff;
      margin-left: 6px;
      font-size: 11pt;
   }
   .subdeal-card-bottom-item { height: 21px }
   .subdeal-card-additional-small-item { font-size: 14px }
   .subdeal-card-status-draft {
      background-image: url('../img/science.svg');
      background-position: center right 4px;
      background-size: 15px;
      width: 102px;
   }
   .subdeal-card-status-created {
      width: 102px;
      background-image: url('../img/new-star.svg');
      background-position: center right 4px;
      background-size: 17px;
   }
   .subdeal-card-status {
      width: 102px;
      background-position: center right 4px;
      background-size: 17px;
   }
   .subdeal-card-status-started {
      width: 104px;
      background-position: center right 4px;
      background-size: 15px;
   }
   .subdeal-card-status-performed {
      width: 118px;
      background-position: center right 4px;
      background-size: 15px;
   }
   .subdeal-card-status-for-revision {
      width: 140px;
      background-position: center right 4px;
      background-size: 17px;
   }
   .subdeal-card-status-postpone {
      width: 112px;
      background-position: center right 4px;
      background-size: 17px;
   }
   .subdeal-card-status-finished {
      width: 112px;
      background-position: center right 4px;
      background-size: 15px;
   }
   .subdeal-card-status-canceled {
      width: 100px;
      background-position: center right 4px;
      background-size: 17px;
   }
   #subdeal-filter-scenario { margin-left: auto; }
   .subdeal-card-top-item {
      min-width: 140px;
      padding: 0 8px;
   }
   #subdeal-card-filter-popup { top: 34px }
   .subdeal-card-bottom-item {
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      flex-wrap: nowrap;
      height: 24px;
   }
   .subdeal-card-bottom-cell {
      line-height: 18px;
      height: 18px;
   }
   .subdeal-card-bottom-cell:nth-child(even) {
      border-bottom: none;
      border-top: none;
   }
   .subdeal-card-title { margin-right: 0 }
   .subdeal-card-expand {
      position: static;
      display: inline-block;
      width: 28px;
      height: 28px;
      line-height: 28px;
      font-size: 22px;
      border-radius: 50%;
      cursor: pointer;
   }
   .tasks-is-overdue {
      font-size: 14px;
      line-height: 22px;
      height: 22px;
   }
   .subdeal-chain-content { padding: 0 4px }
   .subdeal-step-card-content,
   .subdeal-form-card-content,
   .subdeal-formresult-card-content {
      margin-top: 0;
      padding: 8px 16px;
   }
   .subdeal-inner-card-top { padding: 0 8px }
   .subdeal-card-title-item-label { display: inline }
   .subdeal-label-cell {
      font-size: inherit;
      min-width: 160px;
      width: 210px;
   }
   .subdeal-inner-card-title { font-size: inherit }
   .subdeal-formresult-table { font-size: inherit }
   #subdeal-card-info-count {
      display: inline-block;
      margin-right: 16px;
      margin-left: auto;
   }

   .storage-card { border-radius: 6px }
   .storage-checkbox-block {
      flex-direction: row;
      margin-top: 16px;
   }
   .storage-action-button:not(:first-child) { margin-left: 4px }

   .next-button { margin-left: 8px }

   #device-search-container {
      margin: 0 4px;
      width: 430px;
   }
   .device-add-one-storage-button { margin-left: 8px }
   .device-adaptive-block-container { margin-left: 8px }
   .device-adaptive-block-button { display: none; }
   .device-adaptive-block {
      display: flex;
      flex-direction: row;
      align-items: center;
      position: static;
      border-bottom: none;
   }
   .device-card-inner-container {
      display: flex;
      flex-direction: row;
      align-items: center;
      align-items: flex-start;
      padding: 8px;
   }
   .device-card-left-block {
      height: 100%;
      width: 100%;
   }
   .device-card-right-block {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      border: 1px solid #ddd;
      border-radius: 4px;
      margin-left: 8px;
      min-width: 250px;
      width: 250px;
   }
   .device-card-bottom-container { justify-content: flex-start }
   .device-copy-button-container { margin-left: 8px; }
   .storage-checkbox-item:not(:first-child) { margin-top: 0 }
   .device-select-block-container { height: auto }
   .device-exinfo-label {
      max-width: 150px;
      width: 150px;
   }

   #share-form-container {
      margin: 0 auto;
      height: 100%;
      width: 640px;
   }

   .electric-date-container {
      flex-direction: row;
      align-items: center;
      background-color: #fff;
      padding: 0;
      height: 40px;
      width: 100%;
   }
   .electric-date-to-container {
      margin-left: 8px;
      margin-top: 0px;
   }

   .fintask-performer-item {
      text-align: center;
      width: auto;
   }

   #tasks-list { padding: 0 6px }
   #tasks .subdeal-card {
      min-width: 640px;
      max-width: 860px;
   }

   .gtasks-search-input { width: 228px }
   #billing-filter-indicator { left: 226px }
   .filter-item-control-container {
      flex-direction: row;
      align-items: center;
      padding: 0 4px;
      height: 40px;
      width: 100%;
   }
   .filter-item-top-block { width: auto }
   .filter-item-drag-helper {
      line-height: 28px;
      min-height: 28px;
      min-width: 28px;
      cursor: grab;
      height: 28px;
      width: 28px;
   }
   .filter-item-drag-helper:after {
      content: "\e945";
   }
   .filter-item-number {
      position: static;
      margin-right: 8px;
      line-height: 17px;
      min-height: 17px;
      min-width: 17px;
      height: 17px;
      width: 17px;
   }
   .filter-option-cell { width: 180px }
   .filter-control-cell { margin-left: initial }
   .filter-item-compare-block {
      position: static;
      margin-left: 2px
   }
   .filter-compare-button {
      min-height: 28px;
      min-width: 28px;
      font-size: 18px;
      height: 28px;
      width: 28px;
   }
   .filter-noop-placeholder-text { display: none }

   .deal-form-main-block {
      display: grid;
      grid-template-columns: 50% 50%;
      justify-content: space-between;
      justify-items: stretch;
      align-items: start;
   }

   .bills-paid-block,
   .bills-for-pay-block { display: flex }
   .bills-side-panel {
      min-width: 430px;
      width: 430px;
   }

   .waybill-card {
      box-shadow: 0 0 2px #777;
      /*border: 1px solid #ddd;*/
      border-radius: 4px;
   }
   .waybill-item-number {
      position: static;
      margin-right: 8px;
   }
   .waybill-item-remove { position: static }

   /* Темна тема */

   .dark-theme *::-webkit-scrollbar-track { background-color: #2b3447 }
   .dark-theme *::-webkit-scrollbar-thumb { background-color: #414d65 }
   .dark-theme *::-webkit-scrollbar-corner { background: #3c4a66 }
}