/*@import "base.css";*/

/* >>> dark-mode */
html[theme='dark-mode']:not(.no-dark-mode-invert) {
  filter: invert(1) hue-rotate(180deg);
}

.no-dark-mode-invert {
  filter: none;
}

html {
  transition: color 300ms, background-color 300ms;
}

/* <<< dark-mode */

html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

body {
  font-family: var(--main-font-family);
  font-size: var(--main-font-size);
  color: var(--main-primary-text-color);
}

/*
::selection {
  background: var(--main-primary-color);
}
*/

/* >>> override jquery-ui */
.ui-widget-content {
  font-family: var(--main-font-family) !important;
  font-size: var(--main-font-size) !important;
  /*background: var(--custom-lightgray-color) !important;*/
  background: red;
  border: 1px solid var(--main-divider-color) !important;
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
  border: none !important;
}

/* <<< override jquery-ui */

/* >>> helpers */
/* TODO: quasar like styles */
/* TODO: добавить остальыне стороны */
.gl-mt-xs {
  margin-bottom: var(--main-margin-xs);
}
.gl-mt-sm {
  margin-top: var(--main-margin-sm);
}

.gl-mb-xs {
  margin-bottom: var(--main-margin-xs);
}

.gl-ml-xs {
  margin-left: var(--main-margin-xs);
}

.gl-ml-sm {
  margin-left: var(--main-margin-sm);
}

.gl-mb-sm {
  margin-bottom: var(--main-margin-sm);
}

.gl-mr-xs {
  margin-right: var(--main-margin-xs);
}
.gl-mr-sm {
  margin-right: var(--main-margin-sm);
}
.gl-mr-md {
  margin-right: var(--main-margin-md);
}

.gl-mb-md {
  margin-bottom: var(--main-margin-md);
}

.gl-mb-lg {
  margin-bottom: var(--main-margin-lg);
}

.gl-pa-xs {
  padding: var(--main-margin-xs);
}
.gl-pa-sm {
  padding: var(--main-margin-sm);
}

.gl-text-subtext {
  font-size: var(--main-font-size-sm);
}

.gl-text-italic {
  font-style: italic;
}

.gl-text-bold {
  font-weight: bold;
}

.gl-text-lighter {
  color: var(--main-secondary-text-color);
}

.gl__only-admin-highlight {
  border: 1px dashed var(--main-accent-color) !important;
}

.gl-text-color__positive {
  color: var(--main-positive-color);
}

.gl-text-color__negative {
  color: var(--main-negative-color);
}

.gl-round-8 {
  border-radius: 4px;
  width: 8px;
  height: 8px;
}

.gl-round-10 {
  border-radius: 5px;
  width: 10px;
  height: 10px;
}

/* <<< helpers */

/*body {*/
/*  overflow: hidden;*/
/*}*/

input,
select,
textarea {
  font-family: var(--main-font-family);
  font-size: var(--main-font-size);
}

input, select, textarea, label, button {
  line-height: inherit;
  box-sizing: border-box;
}


::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.1);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.3);
  border-radius: 4px;
}

/* >>> .gl-striped__table */
.gl-striped__table {
  border-collapse: separate;
  border-spacing: 2px;
  border: 1px solid var(--main-divider-color);
  margin-bottom: 1rem;
}

.gl-striped__table thead td, .gl-striped__table tfoot td {
  background-color: var(--custom-gray-color);
  font-weight: bold;
}

.gl-striped__table tbody tr:nth-child(2n) td {
  background: var(--custom-gray-color);
}

.gl-striped__table tbody tr:hover td {
  background-color: var(--custom-gray-color);
}

/* <<< .gl-striped__table */

/* TODO: заменить на gl-striped__table  */
.table-stripped {
  border-collapse: separate;
  border-spacing: 2px;
  border: 1px solid var(--main-divider-color);
}

.table-stripped > div:nth-child(2n) > div {
  background: var(--custom-gray-color);
}

.table-stripped > div:hover > div {
  background-color: var(--custom-gray-color);
}

.gl-pointer {
  cursor: pointer;
}

.gl-pretty-json, .gl-pretty-xml, .gl-pretty-text {
  white-space: pre-wrap;
}

.gl-available-button {
  background: var(--main-positive-color) !important;
  color: #eeeeee;
}

.gl-primary-button {
  background: var(--main-primary-color);
  color: #eeeeee;
}

.gl-link-icon {
  color: var(--main-primary-color);
  cursor: pointer;
}

.gl-link-button {
  color: var(--main-primary-color);
  cursor: pointer;
  outline: none;
  display: inline;
  border-bottom: 1px dotted;
  text-decoration: none;
}

.gl-link-icon:hover,
.gl-link-button:hover {
  color: var(--main-accent-color);
}

/* >>> соответствует цветам подсистем */
.gl-department__health {
  background: #aa6666;
  color: var(--main-primary-icon-color);
}

.gl-department__police {
  background: #226688;
  color: var(--main-primary-icon-color);
}

.gl-department__emergency {
  background: #d0c866;
  color: var(--main-primary-text-color);
}

.gl-department__community {
  background: #c8a2c8;
  color: var(--main-primary-text-color);
}

.gl-department__other {
  background: var(--custom-lightgreen-color);
}

/* <<< соответствует цветам подсистем */

.gl-title-required:after {
  content: ' *';
  color: var(--main-negative-color);
}

.gl-title-required-grey:after {
  content: ' *';
  color: var(--main-secondary-text-color);
}

.leaflet-contextmenu {
  overflow-y: scroll;
  max-height: 200px;
}


/* значок online */
.gl-online-badge.online {
  background: var(--main-positive-color);
}

.gl-online-badge.offline {
  background: var(--custom-darkgray-color);
}

/* интеграционные логи */
.delivery-created {
  background: var(--main-info-color) !important;
}

.delivery-succeed {
  background: var(--main-positive-color) !important;
}

.delivery-failure {
  background: var(--main-negative-color) !important;
  color: var(--main-primary-icon-color) !important;
}

/* цвет иконки на locate для устаревших сингалов */
.gl-signal-lost-icon {
  color: #999;
}

/* форма видео звонка */
.gl-video-call video {
  border: 1px solid #CCC;
  background: black;
}

.gl-video-call .remotes {
  margin-top: 20px;
}

.gl-video-call .remotes video {
  height: 120px;
}

.gl-tag-badge {
  display: inline-block;
  border-radius: 10px;
  padding: 4px 5px;
  margin-bottom: 2px;

  background: var(--custom-gray-color);
  color: var(--main-primary-text-color);
}

.gl-tag-system {
  background: var(--main-accent-color);
  color: var(--main-primary-icon-color);
}

/*@import "loader.css";*/
.gl-loader-screen {
  display: flex;
  height: 100%;
  width: 100%;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  color: var(--main-dark-primary-color);
  background-color: var(--main-primary-icon-color);
}

.gl-loader-screen .gl-subsystem-logo {
  width: 64px;
  height: 64px;
  margin-bottom: 15px;
  animation: swing;
  animation-duration: 2s;
  animation-iteration-count: infinite;
}

.gl-loader-screen .gl-subsystem-logo i {
  background: var(--main-dark-primary-color);
}

.gl-loader-screen .content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 1.2rem;
}

.gl-header__icon_disconnected {
  color: var(--main-negative-color);
}

.gl-header__header_bar_connecting {
  background: var(--main-negative-color) !important;
}

.gl-telephony__disconnected {
  background: var(--main-warning-color) !important;
}

/* >>> demo installation styles */
.gl-body__env-demo-main .gl-header {
  background-color: var(--main-info-color) !important;
}
/* <<< demo installation styles */

/*@import "workspace.css";*/
.gl-header {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  height: 60px;
  background-color: var(--custom-old-dark-header-color);
  color: var(--main-primary-icon-color);
  z-index: 100;
}

.gl-header .gl-subsystem-logo i {
  background: var(--main-accent-color); /*заставили не primary*/
}

.gl-header__system-bar {
  position: relative;
  height: 20px;
  background: var(--custom-gray-color);
  border-bottom: 1px solid var(--custom-lightgray-color);
}

.gl-header__system-bar * {
  font-size: 0.8rem;
}

.gl-header__system-bar .split__left {
  padding-left: 5px;
}

.gl-header__system-bar .split__right {
  padding-right: 5px;
}

.gl-header__system-bar .split > div > div {
  margin-top: 1px;
}

.gl-header__system-icon {
  color: #ffffff;
  cursor: pointer;
  margin-left: 5px;
  margin-right: 5px;
}

.gl-header__icon {
  color: var(--main-primary-icon-color);
  cursor: pointer;
  margin-top: 8px;
}

.gl-telephony {
  position: absolute;
  left: 0;
  top: 60px;
  right: 0;
  height: 40px;
  background: var(--custom-old-dark-header-color);
  color: var(--main-light-primary-color);
  z-index: 10;
}

.gl-workspace {
  /* absolute - не помогает занят 100% */
  /* TODO: fixed - исчезает scroll на menu */
  position: fixed;
  right: 0;
  top: 60px;
  bottom: 50px;
  left: 0;
}

.gl-form-body__scrollable-workaround {
  /*overflow: scroll;*/
}

/* при наличии телефонии */
.gl-workspace-with-telephony {
  top: 100px !important;
}

.gl-footer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  height: 50px;
  background: white;
  border-top: solid 2px var(--custom-lightgray-color);
  z-index: 100;
}

.gl-footer__switch {
  padding: 5px;
}

.gl-footer__switch_item {
  display: inline-block;
  background: var(--custom-lightgray-color);
  color: #333333;
  padding: 5px;
  font-size: 0.8rem;
  cursor: pointer;
  margin: 3px;
}

.gl-footer__switch_item:hover {
}

.gl-footer__switch_item.active {
}

/* для того чтобы прятать некоторые вещи видимые только через консоль */
.gl-hidden-for-dev, .gl-hidden {
  display: none;
}

/* >>> cards__edit_recent */
.gl-cards__edit_recent {
  position: relative;
  display: none;
  height: 0;
}

.gl-cards__edit_recent-visible {
  display: block !important;
  height: 200px;
}

.gl-recent-grid-container {
  height: 100%;
}

.gl-cards__edit_recent .btn-close {
  position: absolute;
  top: 12px;
  right: 24px;
}

/* <<< cards__edit_recent */

/*@import "icons.css";*/
.icon-8 {
  width: 8px !important;
  height: 8px !important;
  text-align: center !important;
  font-size: 8px !important;
}

.icon-12 {
  width: 12px !important;
  height: 12px !important;
  text-align: center !important;
  font-size: 12px !important;
}

.icon-16 {
  width: 16px !important;
  height: 16px !important;
  text-align: center !important;
  font-size: 16px !important;
}

.icon-20 {
  width: 20px !important;
  height: 20px !important;
  text-align: center !important;
  font-size: 1.42rem !important;
}

.icon-24 {
  width: 24px !important;
  height: 24px !important;
  text-align: center !important;
  font-size: 24px !important;
}

.icon-32 {
  width: 32px !important;
  height: 32px !important;
  text-align: center !important;
  font-size: 32px !important;
}

.icon-64 {
  width: 64px !important;
  height: 64px !important;
  text-align: center !important;
  font-size: 64px !important;
}

.icon-128 {
  width: 128px !important;
  height: 128px !important;
  text-align: center !important;
  font-size: 128px !important;
}

.tile-icon-8 {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 8px !important;
  height: 8px !important;
  margin-left: -4px !important;
  margin-top: -4px !important;
}

.tile-icon-16 {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 16px !important;
  height: 16px !important;
  margin-left: -8px !important;
  margin-top: -8px !important;
}

.tile-icon-24 {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 24px !important;
  height: 24px !important;
  margin-left: -12px !important;
  margin-top: -12px !important;
}

.tile-icon-32 {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 32px !important;
  height: 32px !important;
  margin-left: -16px !important;
  margin-top: -16px !important;
}

.tile-icon-64 {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 64px !important;
  height: 64px !important;
  margin-left: -32px !important;
  margin-top: -32px !important;
}

.tile-icon-128 {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 128px !important;
  height: 128px !important;
  margin-left: -64px !important;
  margin-top: -64px !important;
}

/*@import "menu.css";*/
/* >>> main menu */
.gl-main-menu-page {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  overflow-y: scroll;
  padding: 1rem;
}

.gl-main-menu {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  /*grid-auto-rows: minmax(120px, auto);*/
  grid-gap: 2rem;
}

.gl-menu__item-container {
  background: #e5e5e5;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 3px;
  cursor: pointer;
  aspect-ratio: 1;
  min-width: 130px;
  max-width: 180px;
  padding: 0.3rem;
}

.gl-menu__item {
  text-align: center;
}

.gl-menu__item:hover {
  color: var(--main-primary-color);
}

.gl-menu__item .icon {
  font-size: 3.6rem;
  opacity: 0.5; /* OLD_DESIGN: */
}
.gl-menu__item:hover .icon {
  opacity: 1; /* OLD_DESIGN: */
}

.gl-menu__item .title {
  margin-top: 1rem;
  font-weight: bold;
}


/*
.gl-menu__item:nth-child(5n+1) {
  clear: left;
}


.gl-menu__item:hover .gl-menu__item_title,
.gl-menu__item:hover [class*=icon] {
  color: var(--main-accent-color);
  opacity: 1;
}

.gl-menu__item [class*=icon] {
  color: #212121;
  opacity: 0.5;
}

.gl-menu__item {
  background: #e5e5e5;
  border-radius: 3px;
  position: relative;
  cursor: pointer;
  margin: 1.5rem;
  width: 130px;
  height: 130px;
  float: left;
}

.gl-menu__item_title {
  margin-top: 0.3rem;
  text-align: center;
}
 */
/* >>> main menu */

/*@import "cards.css";*/
.gl-cards-form {
  /*background: linear-gradient(to top, #f0f0f0, #ffffff);*/
}

.gl-cards-form__filter {
  display: flex;
  align-items: center;
  padding: 0.5rem;
}

.gl-cards-form__filter .group {
  display: flex;
  align-items: center;
  margin-right: 0.8rem;
}

.gl-cards-form__filter .group .title {
  padding-right: 0.5rem;
}

.gl-cards-form__filter .status-buttons {
  display: flex;
  align-items: center;
}

/* TODO: заменить на button */
.gl-cards-form__filter .status-buttons button {
  padding: 5px;
  margin: 2px;
  /*background: white;*/
  white-space: nowrap;
}

/* TODO: заменить на active */
.gl-cards-form__filter_status_checked {
  background: var(--main-primary-color) !important;
  color: white !important;
  border-color: var(--main-primary-color) !important;
}

.gl-cards__status_box {
  display: inline-block;
  width: 20px;
  height: 10px;
  margin: 5px;
}

.gl-cards__status_created {
  background-color: var(--main-negative-color) !important;
  color: var(--main-primary-icon-color)
}

.gl-cards__status_assigned {
  background-color: var(--main-warning-color) !important;
  color: var(--main-primary-icon-color)
}

.gl-cards__status_opened {
  background-color: #ddbb22 !important;
  color: var(--main-primary-icon-color)
}

.gl-cards__status_accepted {
  background-color: var(--main-info-color) !important;
  color: var(--main-primary-icon-color)
}

.gl-cards__status_done {
  background-color: var(--main-positive-color) !important;
  color: var(--main-primary-icon-color) !important;
}

.gl-cards__status_canceled {
  background-color: var(--custom-darkgray-color) !important;
  color: #eeeeee !important;
}

.gl-cards__status_finished {
  background-color: inherit;
  color: inherit;
}

/*.gl-cards__color_general {*/
/*  background: var(--custom-darkgray-bg-color);*/
/*}*/
/*.gl-cards__color_sufferers {*/
/*  background: #E57373 !important;*/
/*  color: var(--main-primary-icon-color) !important;*/
/*}*/
/*.gl-cards__color_deads {*/
/*  background: #EF5350 !important;*/
/*  color: var(--main-primary-icon-color) !important;*/
/*}*/
/*.gl-cards__color_accidents {*/
/*  background: #2196F3 !important;*/
/*  color: var(--main-primary-icon-color) !important;*/
/*}*/
/*.gl-cards__color_criminals {*/
/*  background: #1565C0 !important;*/
/*  color: var(--main-primary-icon-color) !important;*/
/*}*/
/*.gl-cards__color_scenario {*/
/*  background: var(--main-info-bg-color) !important;*/
/*  color: #eeeeee !important;*/
/*}*/
/*.gl-cards__color_fires {*/
/*  background: #FFB300 !important;*/
/*  color: var(--main-primary-text-color) !important;*/
/*}*/
/*.gl-cards__color_terrors {*/
/*  background: #757575 !important;*/
/*  color: var(--main-primary-icon-color) !important;*/
/*}*/
/*.gl-cards__color_applicant {*/
/*  background: var(--custom-darkgray-bg-color) !important;*/
/*  color: var(--main-primary-text-color) !important;*/
/*}*/


.gl-cards__view_header {
  left: 0;
  top: 0;
  right: 0;
  height: 40px;
  color: #212121;
  padding: 7px 10px 0 10px;
  line-height: 40px;
  background: var(--custom-lightgray-color);
}

.gl-cards__view_header .gl-icon-btn {
  font-size: 1.5rem;
  display: inline-block;
  margin-right: 0.8rem;
}

.gl-cards__view {
  /*padding: 10px;*/
}

.gl-cards__view .title {
  font-weight: bold;
  margin-bottom: 6px;
}

.gl-cards__view_section {
  padding: 5px 0;
}

.gl-cards__view_section h3 {
  font-size: 1rem;
}

.gl-cards__view_section.ui-accordion {
  margin: 15px 0;
}

.gl-cards__view_section.ui-accordion .ui-accordion-header {
  font-weight: bold;
  text-decoration: underline;
}

.gl-cards__view_section.ui-accordion .ui-accordion-content {
  padding: 0;
}

.gl-cards__view_section.ui-accordion .table {
  border-collapse: collapse;
}

.gl-cards__view_section.ui-accordion .table tr:nth-child(2n + 1) td {
  background: var(--custom-lightgray-color);
}

.gl-cards__view_section.ui-accordion .table tr:nth-child(2n) td {
  background: none;
  border-top: solid 1px var(--main-divider-color);
}

.gl-cards__view_section > .title {
  padding: 10px 0;
  /*text-decoration: underline;*/
}

.gl-cards__view_section .table, .gray-table {
  width: 100%;
  border-collapse: collapse;
}

.gl-cards__view_section .table-no-border-spacing {
  border-spacing: 0;
  padding: 0 2px 2px 0;
}

.gl-cards__view_section .table td, .gray-table td {
  padding: 8px;
  border: 1px solid var(--main-divider-color);
}

.gl-cards__view_section .table .title td {
  background-color: var(--custom-gray-color) !important;
}

.gl-cards__view_section .table tr:nth-child(2n) td, .gray-table tr:nth-child(2n) td {
  background: #FFF;
}

.gl-cards__view_section .table tr:nth-child(2n + 1) td, .gray-table tr:nth-child(2n + 1) td {
  background: var(--custom-lightgray-color);
}

.gl-cards__view_section .assignments_history_item {
  border-bottom: 1px solid #eeeeee;
}

.gl-cards__view_section .assignments_history_title {
  padding-top: 15px;
}

.gl-cards__assignments_history .card-row td {
  font-weight: bold;
}

.gl-cards__view_data {
  width: 100%;
}

.gl-cards__view_data > .section > .title {
  width: 200px;
}

.gl-cards__view_data .section {
  border-bottom: 1px solid #eeeeee;
}

.gl-cards__view_data .section > div {
  padding: 5px 10px;
}

.gl-cards__view .foreign {
  background: var(--custom-lightgray-color);
  padding: 5px;
  margin-top: 3px;
}

.gl-cards__view .foreign .row{
  margin-bottom: 0.1rem;
}

.gl-cards__view .foreign .row .row-title {
  /* 'эмуляция полужирного */
  text-shadow: 0.1px 0.1px 0px #000;
}

.gl-cards__view .foreign .specific ul {
  margin-top: 3px;
}

.gl-cards__view_data .removed {
  background: var(--main-warning-color);
  color: #eeeeee;
}

.gl-cards__edit {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}

.gl-cards__edit .highlighted-description {
  background: var(--custom-lightgray-color);
  padding: 0.8rem;
}

.action-button {
  font-weight: 600;
}

.action-button-shortcut {
  display: block;
  font-size: 0.8rem;
}

.gl-action-buttons {
  margin: 40px 0;
}

/* TODO: применить gl-button */
.gl-cards__edit .action-button {
  min-height: 50px;
  max-height: 70px;
  padding: 6px;
  margin: 4px;
  cursor: pointer;
  background-color: var(--custom-lightgray-color);
  border-width: 2px;
  border-style: solid;
  border-color: var(--custom-lightgray-color);
  color: var(--main-primary-icon-color);
}

.gl-cards__edit .action-button.gl-cards__color_general {
  /*
  NEW_DESIGN:
  background-color: var(--custom-darkgray-color);
  border-color: var(--custom-darkgray-color);
  color: var(--main-primary-text-color);
  */

  background-color: #888888;
  border-color: var(--custom-darkgray-color);
  color: #eeeeee;
}

/* NEW_DESIGN:
.gl-cards__edit .action-button.gl-cards__color_general:hover {
  background-color: white;
  border-color: var(--custom-darkgray-color);
  color: var(--main-primary-text-color);
}
*/

.gl-cards__edit .action-button.gl-cards__color_sufferers {
  /* NEW_DESIGN:
  border-color: #E57373;
  background-color: #E57373;
  color: var(--main-primary-icon-color);
  */

  border-color: #aa6666;
  background: #aa6666 !important;
  color: #eeeeee !important;
}

/* NEW_DESIGN:
.gl-cards__edit .action-button.gl-cards__color_sufferers:hover {
  background-color: white;
  border-color: #E57373;
  color: var(--main-primary-text-color);
}
*/

.gl-cards__edit .action-button.gl-cards__color_deads {
  /* NEW_DESIGN:
  background-color: #EF5350;
  border-color: #EF5350;
  color: var(--main-primary-icon-color);
  */
  background: #884444 !important;
  color: #eeeeee !important;
}

/* NEW_DESIGN:
.gl-cards__edit .action-button.gl-cards__color_deads:hover {
background-color: white;
border-color: #EF5350;
color: var(--main-primary-text-color);
}
*/

.gl-cards__edit .action-button.gl-cards__color_accidents {
  /* NEW_DESIGN:
  background-color: #2196F3;
  border-color: #2196F3;
  color: var(--main-primary-icon-color);
  */
  background: #4488aa !important;
  color: #eeeeee !important;
}

/* NEW_DESIGN:
.gl-cards__edit .action-button.gl-cards__color_accidents:hover {
background-color: white;
border-color: #2196F3;
color: var(--main-primary-text-color);
}
*/

.gl-cards__edit .action-button.gl-cards__color_criminals {
  /* NEW_DESIGN:
  background-color: #1565C0;
  border-color: #1565C0;
  color: var(--main-primary-icon-color);
  */
  background: #226688 !important;
  color: #eeeeee !important;
}

/* NEW_DESIGN:
.gl-cards__edit .action-button.gl-cards__color_criminals:hover {
background-color: white;
border-color: #1565C0;
color: var(--main-primary-text-color);
}
*/

.gl-cards__edit .action-button.gl-cards__color_scenario {
  background-color: var(--main-info-color);
  border-color: var(--main-info-color);
  color: var(--main-primary-icon-color);
}

.gl-cards__edit .action-button.gl-cards__color_scenario:hover {
  background-color: white;
  border-color: var(--main-info-color);
  color: var(--main-primary-text-color);
}


.gl-cards__edit .action-button.gl-cards__color_fires {
  /* NEW_DESIGN:
  background-color: #FFB300;
  border-color: #FFB300;
  color: var(--main-primary-icon-color);
  */
  background: #d0c866 !important;
  color: #222222 !important;
}

/* NEW_DESIGN:
.gl-cards__edit .action-button.gl-cards__color_fires:hover {
background-color: white;
border-color: #FFB300;
color: var(--main-primary-text-color);
}
*/

.gl-cards__edit .action-button.gl-cards__color_terrors {
  /* NEW_DESIGN:
  background-color: #757575;
  border-color: #757575;
  color: var(--main-primary-icon-color);
  */
  background: #666666 !important;
  color: #eeeeee !important;
}

/* NEW_DESIGN:
.gl-cards__edit .action-button.gl-cards__color_terrors:hover {
background-color: white;
border-color: #757575;
color: var(--main-primary-text-color);
}
*/

.gl-cards__edit .action-button.gl-cards__color_applicant {
  /* NEW_DESIGN:
  background-color: var(--custom-darkgray-color);
  border-color: var(--custom-darkgray-color);
  color: var(--main-primary-icon-color);
  */
  background: #888888 !important;
  color: #eeeeee !important;
}

/* NEW_DESIGN:
.gl-cards__edit .action-button.gl-cards__color_applicant:hover {
background-color: white;
border-color: var(--custom-darkgray-color);
color: var(--main-primary-text-color);
}
*/

.gl-cards__edit .action-button.gl-cards__color_recent {
  background-color: #66aa66;
  border-color: #66aa66;
  color: var(--main-primary-text-color);
}

.gl-cards__edit .action-button.gl-cards__color_recent:hover {
  background-color: white;
  border-color: #66aa66;
  color: var(--main-primary-text-color);
}

.gl-cards__edit input[type=text], .gl-cards__edit input[type=date], .gl-cards__edit textarea {
  width: 100%;
}

.gl-cards__edit .action-button.gl-cards__refresh {
  background: #D8BFD8 !important;
  color: var(--main-primary-text-color);
}

.gl-cards__edit_form-column {
  padding: 0.3rem 0.5rem;
  border-left: 1px solid var(--custom-gray-color);
  border-right: 1px solid var(--custom-gray-color);
  /*background-color: var(--main-lightgray-bg-color);*/
}

.gl-cards__preview-column {
  width: 35%;
}

.gl-card_smaller-table {
  font-size: 0.9rem;
}

/* значек в списке назначений */
.gl-assignments-table .gl-online-badge {
  position: absolute;
  right: 3px;
  top: 3px;
}

.gl-assignments-table .recipient-column {
  position: relative;
}

.gl-assignments-table .recipient-column .organization-column {
  display: flex;
  align-items: center;
}

.gl-assignments-table .scenario-task-column {
  font-size: 0.8rem;
}

.gl-assignments-table .scenario-task-column .info {
  font-style: italic;
  margin-top: 6px;
}

/* >>> .gl-cards__edit_page */
.gl-cards__edit_page .row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
}

.gl-cards__edit_page .section {
  margin-bottom: var(--main-margin-md);
}

.gl-cards__edit_page .section-fields {
  margin-bottom: 0.5rem;
}

/*.gl-cards__edit_page .table.section-fields > div > div:first-child {*/
/*  width: 200px;*/
/*}*/


.gl-cards__edit_page .block {
  margin-bottom: 0.6rem;
}

.gl-cards__edit_page > .title {
  margin-bottom: 1rem;
}

.gl-cards__edit_page .section .row > div {
  padding-top: 6px;
}

.gl-cards__edit_page .app__div-table {
  width: 100%;
}

.gl-cards__edit_page .app__div-table > div > div {
  padding-bottom: 5px;
}

.gl-cards__edit_page .remove-block {
  padding-top: 10px;
  font-weight: bold;
  cursor: pointer;
  color: var(--main-negative-color);
}

.gl-cards__edit_page .remove-assignment {
  cursor: pointer;
}

.gl-cards__edit_page .organization {
  padding: 5px 5px 5px 5px;
  border: 0;
  border-bottom: 1px solid #eeeeee;
  cursor: pointer;
  position: relative;
}

.gl-cards__edit_page .organization.selected {
  opacity: 0.7;
}

.gl-cards__edit_page .organization .alias {
  font-weight: bold;
}

.gl-cards__edit_page .organization .name {
  font-size: 0.8rem;
}

.gl-cards__edit_page .organization .address {
  font-size: 0.8rem;
}

.gl-cards__edit_page .organization-assigned {
  background: var(--custom-lightgray-color);
  color: var(--main-primary-text-color);
}

/* значек в списке организаций для назначения */
.gl-cards__edit_page .organization .gl-online-badge {
  position: absolute;
  right: 10px;
  top: 10px;
}
/* <<< .gl-cards__edit_page */

.gl-cards__edit_title {
  white-space: nowrap;
}

.gl-cards__edited_card_highlight, .gl-cards__edited_card_highlight td {
  background-color: #ccbb66 !important;
}

.gl-cards__created_by_edds {
  border-left: 5px solid var(--main-positive-color);
}

.gl_cards {
  padding-left: 10px;
}

.gl-cards__phone_shortcut {
  cursor: pointer;
  display: inline-block;
  width: 24px;
  height: 24px;
  padding: 5px;
  background: white;
  border: 1px solid var(--main-divider-color);
}

.gl-cards__phone_list {
  font-family: var(--main-font-family);
  font-size: var(--main-font-size);
  position: absolute;
  left: -8px;
  top: 15px;
  z-index: 5;
}

.gl-cards__phone_list table {
  border-collapse: collapse;
}

.gl-cards__phone_list td {
  background: white !important;
  border: 1px solid var(--main-divider-color);
  cursor: pointer;
  white-space: nowrap;
  font-weight: bold;
  text-align: left;
}

.gl-cards__phone_list td:hover {
  background: var(--custom-lightgray-color) !important;
}

.gl-cards__eds {
  background: url("data:image/gif;base64,R0lGODlhEAAQANUzAG5ubsbGxtLS0p2dndTU1MzMzKmpqe/v72RkZPb29l9fX/39/dzc3Pz8/L6+vry8vPLy8rq6uoaGhsrKytnZ2fn5+cXFxcLCwpiYmMPDw4uLi3x8fM3Nzefn59vb24mJieTk5IODg6ioqMHBweHh4cjIyJeXl7CwsJqamqCgoNfX17S0tNDQ0MnJyejo6N/f33JycvDw8Pf39/Ly8gAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAADMALAAAAAAQABAAAAarwJlwlnAYViuDIzFsHlKCxaLREKQOTeGAsYhgMCIIY5BlpBqGVGJh0By2zYyjI8EKJaVIpmlxCDRNEhErFk1WIygzFRUzJicDAkMcKw8PKy2YLZSWHEJnMqChoglkMx8yMamqMRAQMR4hQjAxLrW2tSAELABCCC4vwMEvFCwTBQq9wxQqKgS6BROYyDMIL8y6LNAtAdzTCCTXLNnbARcX0xsw6uvqAO4AGzNBADs=") no-repeat;
  padding-left: 20px;
}

.gl-cards__eds_ok {
  background: url("data:image/gif;base64,R0lGODlhEAAQANU/AKGgs/6EA/6jDYxKGXs+E3tJHNKiS/7zNtzc4/6LBcyZR6mpur6+ze/v8p6dr/39/f6rEOKtV7S0xvb2+Lm6w/6OCNHS2/6vEoWGnfz8+cfFzJiYq/69HYuLn/6rDdnKueG2gYxoU/58AP7nJPz278PD0P6SBv6SCf6zDf7JG6JeFbyAKsO/v/7AJKGMfqiotPLy8KSPgf79Zf7wQLx6IqJsIefn57KursjIyP3zOv68Fv6aCv7kI4xTHv7RHvLy8iH5BAEAAD8ALAAAAAAQABAAAAazwJ/wN2EsJJIFYzJsNgCWxyOTsQAaTaED8aBsNi8YwpFFADILwOSx6DS2zRLDhsEKMThKqalhWDpNGBQSGk0fACwxPyQkPy43Dh9DIAoGBgoRmRGVlyBCKzI5BzmkpQcHMzRCNQc8rq88IyM8KCpCPTw+uru6KQI7A0IFPjrFxjoXOxUmBMIcFxcQEAK/JxUJCc0/BRzSvzvWCQHj2gUtHh7fJuIBIiLaIT3y8/ID9gMhP0EAOw==") no-repeat;
  padding-left: 20px;
}

.gl-cards__eds_wrong {
  background: url("data:image/gif;base64,R0lGODlhEAAQAOZ/AKVgG9c4OKGgs4xTHtKiS9zc456dr+/v8ntJHMyZR/7zNr6+zf7kI4WGnf7RHsPD0P3zOuR3d4uLn/69HeG2gffX1/7nJP6rDf6rEPbR0amputnKudg7O7m6w8fFzNHS28wAANAWFsjIyNKcP751KLZwHLVvHNi3jbS0xtycM9XV2v68Fvy7G/7HWpOTptSdYaSPgf/SnsR/G7Z1J+fn5/b2+P7Rbvj4+PLy8Lx5J/Py8tATE6Ghs9AUFPPz9bRuHJxcHYxoU76OV/7AJKGMfqJsIf/ZqN2oU8O/v+bUrdefMMy2ooxKGeyKDeW3d8J9JvHj4/Pu7vLBwdygSKGhtKamtPXMzP3eltYwMLJoGsaNRLVpGv79ZcDAy8JxGfvvPMZ6F/7oR/7wQLpsF9OdOMOdhNeYOOOkGpubq7Kurv6lR9eJHPz8+fC3t/K8vP6vErx6IsCRX/Ly892nZfPz852drryAKr+AK8/P2c0EBLJqGJKSpfPz9NQrK8wBAfLy8iH5BAEAAH8ALAAAAAAQABAAAAflgH9/BwJ4e3JUPAs1go2CBgU+Ll0qVR8CB45/BQJsGgJ8dWg4BQaaDws0DZk3GhIHkI4eCx8Sjg0iHQ+OGwJIMH86gg0dKB6NFAkEBAlHWoJEaQYbjXZcEApfI3d/U8rMFIJFCgwMZCVJfzLYCmJwggMMDko/gnN6FhZhNnF0fwgOWOQQ5ATAGQdXsPgB0QcKgglvUpj4MwbMihZ9QlSI4KfPQwwYzJz4A6CJET8ZrISQ4gfBkAsX1jz58yJLDD9telTIACLIgJ8zhPwh4UUNBz8R3OwIoOnPki1AmJThkCdPgCiBAAA7") no-repeat;
  padding-left: 20px;
}

.gl-cards__eds_title {
  font-weight: bold;
  text-decoration: underline;
}

.gl-cards__eds_clickable {
  cursor: pointer;
}

#gl-cards__eds_info {
  display: none;
}

.gl-cards__eds_info_verified {
  color: green;
  font-weight: bold;
}

.gl-cards__eds_info_wrong {
  color: #ff0000;
  font-weight: bold;
}

.gl-cards__eds_db_mismatch_table {
  border: 1px solid var(--main-divider-color);
  border-collapse: collapse;
}

.gl-cards__eds_db_mismatch_table td {
  border: 1px solid var(--main-divider-color);
  padding: 10px;
}

.gl-cards__eds_db_mismatch_table thead td {
  font-weight: bold;
}

.gl-cards__view .created-card {
  /*padding 30 чтобы было место для иконки редактирования*/
  padding: 0 30px 10px 0;
  text-align: right;
  font-weight: bold;
}

/* блоки карточки */
control[type=group] {
}

control[type=group] .cards__edit_section {
  padding: 15px;
  margin: 15px 0;
  border: 1px solid var(--main-divider-color);
}

control[type=group] .table > div > div, .cards__edit_section__rows > div > div {
  padding: 5px 0;
}

control[type=group] .cards__edit_section-remove {
  margin-bottom: 8px;
  display: inline-block;
}

.gl-card-view-block {
  position: relative;
  border: 1px dashed transparent;
  background: #fff;
}

.gl-card-view-block + .gl-card-view-block:before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 1px;
  background: var(--custom-lightgray-color);;
}

.gl-card-view-block ul {
  margin: 0;
}

.gl-card-view-block .title {
  margin-bottom: 6px;
}

.gl-card-padding__view {
  padding: 10px;
}

.card-title {
  padding-bottom: 1rem;
}

.gl-card-margin {
  margin: 10px 10px 10px 0;
}

.gl-card-edit-block,
.gl-card-remove-block,
.gl-card-remove-block {
  color: rgba(0, 0, 0, .3);
}

.gl-card-edit-block:hover,
.gl-card-remove-block:hover,
.gl-card-remove-block:hover {
  cursor: pointer;
  color: rgba(0, 0, 0, .9);
}

.gl-editable-table {
  position: absolute;
  top: 0;
  right: 0;
}

.gl-card-remove-block {
  padding-left: 10px;
}

.gl-remove-foreign-info {
  position: initial !important;
  float: right;
}

.form-view-card .gl-card-view-block:before,
.form-view-card .gl-editable-table {
  display: none;
}

.form-view-card .content-block {
  margin-top: 6px;
}

.egis-search-result .row {
  margin-bottom: 12px;
  border-bottom: 1px solid #CCC;
  padding: 3px 3px 12px 3px;
  position: relative;
}

.egis-search-result .row.selected {
  background: var(--custom-lightgray-color);
}

.egis-search-result .row .small {
  font-size: 0.8rem;
  color: #555;
}

.egis-search-result .row .preloader {
  position: absolute;
  right: 0px;
  top: 0px;
}

.gl-pull-abonent-location {
  bottom: 10px;
  right: 10px;
  z-index: 10;
  position: absolute;
  width: 140px;
}

.gl-pull-abonent-info {
  margin: 1rem 0;
}

.gl-pull-abonent-info-block {
  margin: .5rem 0;
}

.gl-pull-abonent-location-btn, .gl-pull-abonent-info-btn {
  cursor: pointer;
  background: white;
  padding: 8px 10px;
  float: left;
  border-radius: 4px;
}

.gl-pull-abonent-info-btn {
  float: none;
}

.gl-pull-abonent-location-btn.active, .gl-pull-abonent-info-btn.active {
}

.gl-pull-abonent-location-btn [class^=icon], .gl-pull-abonent-info-btn [class^=icon] {
  margin-right: 4px;
}

.gl-cards__view_header .camera-off,
.gl-cards__map_header .camera-off {
  opacity: 0.4
}

#popup_map {
  height: 100%;
}

.jBox-title {
  background-color: #212121 !important;
  color: var(--main-primary-icon-color);
  height: 36px;

  font-family: var(--main-font-family);
  font-size: 1rem;
  font-weight: bold;
}

.gl-popupmap-disable-camera {
  top: 5px;
  right: 10px;
  z-index: 10;
  position: absolute;
}

.gl-map-btn-block {
  z-index: 10;
  margin: 5px 0;
}

.gl-popupmap-disable-camera .camera-disable-btn,
.gl-map-btn-block .gl-map-btn,
.gl-map-fullscreen-btn {
  cursor: pointer;
  line-height: 25px;
  background: white;
  padding: 0 10px;
  white-space: nowrap;
  border-radius: 4px;
}

.gl-map-fullscreen-btn {
  position: absolute;
  z-index: 100;
  left: 25px;
  margin-top: -40px;
}

.gl-layers-control {
  z-index: 100;
  cursor: pointer;
}

.gl-cards__view_section .gl-layers-control {
  right: 10px !important;
  bottom: auto !important;
  margin-top: -45px;
}

/*@import "admin.css";*/
.gl-admin-form {
  /*background: linear-gradient(to top, #f0f0f0, #ffffff);*/
}

.gl-admin-form .editor-column {
  border-left: 1px solid var(--main-divider-color);
}

.gl-admin-form__menu {
  min-width: 300px;
}

.gl-admin-form__menu_item {
  padding: 10px;
  margin: 2px;
  background: var(--custom-gray-color);
  cursor: pointer;
}

.gl-admin-form__menu_item.active {
  background: var(--custom-lightgray-color);
  color: #000000;
}

.gl-admin-form__menu_group {
  padding: 10px;
  margin: 2px;
  color: #000000;
  font-weight: bold;
}

.gl-action {
  text-decoration: underline;
  cursor: pointer;
}

.gl-hint {
  text-decoration: none;
  border-bottom: 1px dashed;
  cursor: pointer;
}

/* перенесено из шаблона Glonass/Admin/Form/Form.ejs */
.grid-edit-table {
  border-spacing: 1px;
  border-collapse: separate;
}

.grid-edit-table > div > div {
  padding: 10px;
  background: var(--custom-lightgray-color);
}

.grid-edit-table input[type=text], .grid-edit-table input[type=password], .grid-edit-table input[type=date], .grid-edit-table textarea {
  width: 100%;
}

/*@import "map.css";*/
.relative {
  position: relative;
}

.gl-map {
  position: relative;
  border: 1px solid var(--main-divider-color);
}

.gl-absolute-map {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0
}

.gl-map-form {
  position: relative;
  background: white;
}

.gl-map__marker-mode {
  cursor: crosshair !important;
}

.gl-map-popup .title {
  font-weight: bold;
  margin-bottom: 3px;
}

.gl-map-popup .row {
  margin-bottom: 1px;
}

.gl-map-popup ul {
  margin: 3px 0 0 0;
  padding-left: 25px;
}

.gl-map-form .action, .gl-map-popup .action {
  text-decoration: underline;
  color: #446677;
  cursor: pointer;
}

.gl-map-panel {
  background: rgba(0, 0, 0, 0.5);
  padding: 10px;
  color: var(--main-primary-icon-color);
}

.gl-map-panel .title {
  font-weight: bold;
  margin-bottom: 10px;
}

.gl-map-panel .row {
  margin-bottom: 10px;
}

.gl-map-panel .action {
  text-decoration: underline;
  color: lightblue;
  cursor: pointer;
}

.gl-map-panel .slider-container {
  padding: 3px 8px;
}

/* виджет выбора параметров отображения слоя */
.gl-layer-options-widget {
  position: absolute;
  right: 0;
  bottom: 100%;
  background: white;
  width: 300px;
  height: 250px;
  padding: 5px;
}

.gl-layer-options-widget * {
  font-size: 0.8rem;
}

.gl-layer-options-widget input {
  width: 100%;
  height: 20px;
  padding: 2px;
}

.gl-map-mark {
  bottom: 10px;
  left: 10px;
  z-index: 10;
  position: absolute;
}

.gl-map-mark-btn {
  cursor: pointer;
  background: white;
  padding: 8px 10px;
  white-space: nowrap;
  margin-right: 15px;
  float: left;
  border-radius: 4px;
}

.gl-map-mark-btn.active {
}

.gl-map-mark-btn [class^=icon] {
  margin-right: 4px;
}

.gl-visible-for-developers {
  display: none;
}

/* кнопки в контейнере карты*/
.gl-map-inner-button {
  color: var(--main-primary-text-color);
  cursor: pointer;
  background: white;
  padding: 8px;
  border-radius: 6px;
}

.gl-map-inner-button:active {
  background: lightgrey;
}

/* текст о том что карта открыта в full-size*/
.gl-map-fullsize-text {
  color: gray;
  padding: 10px;
  border: 1px solid var(--main-divider-color);
}

/*@import "reports.css";*/
.gl-report__title {
  font-size: 1.28rem;
  margin-bottom: 0.8rem;
  font-weight: bold;
}

.gl-report__header {
  padding: 10px;
}

.gl-report__header .table > div > div {
  padding: 5px;
}

.gl-report__body {
  padding: 10px;
}

.gl-report__table td, .gl-report__table th {
  padding: 5px;
}

.gl-report__table thead td, .gl-report__table tfoot td {
  background: var(--custom-gray-color);
  font-weight: bold;
}

.gl-reports-form .recent {
  min-width: 300px;
  border-left: 1px solid var(--main-divider-color);
  vertical-align: top;
}

.gl-reports-form .icon {
  font-size: 1.28rem;
}

.gl-reports-form .recent .header {
  background: var(--custom-gray-color);
  padding: 15px 10px;
}

.gl-reports-form .recent .item {
  padding: 10px;
  margin: 2px;
  cursor: pointer;
}

.gl-reports-form .recent .created {
  background: var(--custom-lightgray-color);
}

.gl-reports-form .recent .processing {
  background: var(--main-info-color);
}

.gl-reports-form .recent .ready {
  background: var(--main-positive-color);
  color: var(--main-primary-icon-color);
}

.gl-reports-form .recent .failed {
  background: var(--main-negative-color);
  color: var(--main-primary-icon-color);
}

.gl-reports-form .recent .item.notify {
  -webkit-animation-timing-function: ease-in;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-delay: 1s;
  -webkit-animation-duration: 2s;
  -webkit-animation-name: ready-reports;
  animation-name: ready-reports;
}

@-webkit-keyframes ready-reports {
  0% {
    background: var(--main-info-color);;
  }
  100% {
    background: var(--main-positive-color)
  }
}

.report-table {
  border: 1px solid #e2e2e2;
  border-radius: 4px;
  width: 100%;
  background: #fff;
}

.report-table .thead > div {
  color: #446660;
  text-transform: uppercase;
  /* white-space: nowrap; */
  border-bottom: 2px solid #F7F7F7;
}

.report-table > div > div {
  padding: 12px 15px;
  vertical-align: middle;
  line-height: 21px;
  color: #222;
}

.report-table > div:not([class="thead"]):nth-child(2n) > div {
  background-color: rgba(242, 245, 246, .5);
}

.report-table .textarea-description {
  width: 100%;
}

.report .action-button {
  background: #446660;
  color: #fff;
  padding: 5px 20px;
  cursor: pointer;
  border-bottom: 2px solid #013D33;

  display: inline-block;
  line-height: 21px;
}

.report .action-button:hover {
  background: #4D7870;
}

/*@import "form.css";*/
.gl-form-triple {
}

.gl-form-triple > div {
  display: block;
  float: left;
}

.gl-form-triple > div:nth-child(1) {
  width: 33%;
  height: 100%;
}

.gl-form-triple > div:nth-child(2) {
  width: 34%;
  height: 100%;
}

.gl-form-triple > div:nth-child(3) {
  width: 33%;
  height: 100%;
}

.gl-form-triple > div:nth-child(3):after {
  content: "";
  clear: both;
  display: block;
}

/*@import "widgets.css";*/
.gl-events-calendar .header {
  margin-bottom: 12px;
}

.gl-events-calendar .header .buttons {
  width: 100px;
}

.gl-events-calendar .month-name {
  font-weight: bold;
  text-align: right;
}

.gl-events-calendar .cells table {
  border-collapse: collapse;
}

.gl-events-calendar td {
  border: 1px solid var(--main-divider-color);
  width: 14%;
}

.gl-events-calendar thead td {
  background: var(--custom-gray-color);
  font-weight: bold;
  text-align: center;
  padding: 10px;
}

.gl-events-calendar .cells .selected {
  background: var(--main-primary-color);
}

.gl-events-calendar .cells .outmonth {
  color: var(--main-divider-color);
}

.gl-events-calendar .cell {
  height: 120px;
  position: relative;
}

.gl-events-calendar .cell .content {
  padding: 5px;
}

.gl-events-calendar .events-count {
  position: absolute;
  right: 5px;
  bottom: 5px;
  font-size: 3.28rem;
}

/*@import "monitoring.css";*/
.gl-monitoring-form {
  background: white;
}

.gl-monitoring__items {
  min-width: 300px;
  background: var(--custom-lightgray-color);
}

.gl-monitoring__items_table {
  border-collapse: separate;
  border-spacing: 2px;
}

.gl-monitoring__item {
  cursor: pointer;
}

.gl-monitoring__item_info_container {
  background: white;
  height: 0;
  border: 1px solid var(--main-divider-color);
}

.gl-monitoring__item_info {
}

.gl-monitoring__item_info > div {
  padding: 10px;
}

.gl-monitoring__item_info .title span {
  font-weight: bold;
  font-size: 1.28rem;
}

.gl-monitoring__item_info__cols > div {
  margin-right: 10px;
}

.gl-monitoring__item_info__icons > div {
  margin-left: 10px;
  color: #888888;
  cursor: pointer;
}

/*@import "notifications.css";*/

.gl-header__notifications-bar {
  position: relative;
  color: var(--main-primary-icon-color);
}

.gl-header__notifications-bar .group {
  position: relative;
  margin-right: 15px;
  cursor: pointer;
}

.gl-header__notifications-bar .counter {
  position: absolute;
  top: -5px;
  right: -8px;
  width: 15px;
  height: 15px;
  font-size: 0.8rem;
  font-weight: bold;
  color: var(--main-primary-text-color);
  vertical-align: middle;
  text-align: center;
  border-radius: 6px;
  background: var(--main-accent-color);;
}

.gl-header__notifications-bar .items-wrapper {
  position: absolute;
  top: 35px;
  left: -15px;
  border: 1px solid var(--main-divider-color);
  border-radius: 3px;
  background: white;
  color: var(--main-primary-text-color);
}

.gl-header__notifications-bar .items-container:before {
  position: absolute;
  top: -10px;
  left: 16px;
  content: '';
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #f5f7fa;
}

.gl-header__notifications-bar .items-container {
  overflow-y: scroll;
  width: 400px;
  min-height: 65px;
}

.gl-header__notifications-bar .items-container .gl-notification {
  background-color: #f5f7fa;
  border-bottom: 1px solid #c5d0db;
}

.gl-notification {
  padding: 10px;
}

.gl-notification .header {
  position: relative;
  margin-bottom: 6px;
  font-weight: bold;
  font-size: 1.1em;
}

.gl-notification .header .close {
  position: absolute;
  right: -8px;
  top: -8px;
  cursor: pointer;
}

.gl-notification .buttons-bar {
  margin-top: 12px;
}

.gl-notification .datetime {
  margin-top: 12px;
}

.gl-notification .colored-labels {
  position: relative;
  top: .3em;
  display: inline-block;
}

.gl-notification .colored-labels i {
  display: inline-block;
  width: 1.4em;
  height: 1.4em;
  border-radius: .7em;
  cursor: help;
  margin-right: .1em;
}

/*@import "duty.css";*/
.gl-workspace__duty {
  width: 300px;
}

.btn-disabled {
  opacity: 0.3;
}

.gl-duty-form {
  /*background: var(--custom-lightgray-bg-color);*/
}

.gl-card-duty-buttons-container {
  display: flex;
  align-items: center;
}

.gl-duty__header {
  color: var(--main-primary-icon-color);
}

.gl-duty__header > .table {
  border-collapse: separate;
  border-spacing: 2px;
}

.gl-duty__header-icon {
  padding: 5px 0;
  border: 1px solid var(--main-divider-color);
  background: var(--custom-gray-color);
  color: var(--main-primary-text-color);
  cursor: pointer;
}

.gl-duty__header-icon:hover {
  background: var(--custom-gray-color);
}

.gl-duty__header-icon_checked, .gl-duty__header-icon_checked:hover {
  background: var(--main-primary-color);
  color: var(--main-primary-icon-color)
}

.gl-duty__header_blink {
  background-color: #ccbb66 !important;
  color: #333333 !important;
}

.gl-duty__header-icon.notify {
  animation-timing-function: ease-in;
  animation-iteration-count: infinite;
  animation-delay: 0s;
  animation-duration: 3.5s;
  animation-name: colorStatusTab;
}

.gl-duty__header-icon.notify .icon-16 {
  display: inline-block;
  animation: bounce;
  animation-duration: 2s;
  animation-iteration-count: infinite;
}

.gl-duty__cards {
  overflow-y: auto;
}

.gl-duty__card {
  padding: 0.3rem;
  margin: 7px 4px;
  background: white;
  border: 1px solid var(--main-divider-color);
  cursor: pointer;
}

.gl-duty__card.selected {
  /*animation-timing-function: ease-out;*/
  /*animation-delay: 0s;*/
  /*animation-duration: 3.5s;*/
  /*animation-name: colorItem;*/
  /*background: var(--main-primary-color);*/
  animation: bounce;
  animation-duration: 2s;
}

.gl-card-duty-form {
  background: white;
}

.gl-card-duty-form-preview-container {
  width: 40%;
}

.gl-card-duty-form .map {
  position: relative;
}

.map {
  border: 1px solid var(--main-divider-color);
}

.gl-card-duty-form .increase-map-button {
  cursor: pointer;
  position: absolute;
  top: 20px;
  right: 20px;
  width: 20px;
  height: 20px;
  z-index: 10;
}

.gl-card-duty-form .gl-card-duty-actions {
  margin: 10px 0 10px 0;
}

.gl-card-duty-form .status-button {
  display: inline-block;
  width: 180px;
  height: 50px;
  padding: 10px;
  margin: 2px;
}

.task-description {
  font-style: italic;
  font-size: 0.8rem;
}

.gl-card-duty-actions > div > div {
  padding: 0 5px;
}

.gl-card-duty-manual-arrival-time {
  display: flex;
  align-items: center;
  padding: 0 10px;
}

@keyframes colorStatusTab {
  0% {
    background: var(--main-accent-color);
  }
  100% {
    background: var(--main-negative-color);
  }
}

@keyframes colorItem {
  0% {
    background: var(--main-warning-color);
  }
  100% {
    background: var(--main-accent-color);
  }
}

/*@import "videocalls.css";*/
.videocalls-form .info {
  margin-bottom: 3px;
  font-size: 0.8rem;
}

.videocalls-form .person-name {
  font-weight: bold;
  margin-bottom: 6px;
}

.videocalls__filter {
  padding-right: 20px;
  padding-left: 20px;
  color: #212121;
  background: white;
}

.videocalls__filter .table > div > div {
  padding: 10px 5px;
}

.videocalls__filter .filter_period {
  width: 100px;
}

.videocalls__filter .filter_description {
  width: 300px;
}

.videocalls__filter button.button {
  background-color: #888888;
  color: #eeeeee;
  border: none;
}

.description-column .section {
  margin-bottom: 6px;
}

.videocalls__filter .filter_buttons_block {
  vertical-align: bottom !important;
}

/*@import "cards-archive.css";*/
.cards-archive__filter {
  padding: 3px;
}

.cards-archive__filter .buttons {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-end;
}

.cards-archive__filter .buttons div {
  margin-right: 0.5rem;
}

.cards-archive__filter .line {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.cards-archive__filter .line .block {
  margin: 6px 3px 3px;
}

.cards-archive__filter ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.cards-archive__filter ul li {
  display: inline;
  margin: 0 4px 0 0;
}

.cards-archive__filter .label {
  font-weight: bold;
  margin-bottom: 0.2em;
}


.cards-archive__filter .additional {
  display: none;
}

.gl-search-highlight {
  background: yellow;
}

/* >>> gl-icon-btn */
.gl-icon-btn {
  cursor: pointer;
  color: var(--main-primary-text-color);
}
.gl-icon-btn.primary {
  color: var(--main-primary-color);
}
.gl-icon-btn.negative {
  color: var(--main-negative-color);
}
.gl-icon-btn.positive {
  color: var(--main-positive-color);
}
.gl-icon-btn.warning {
  color: var(--main-warning-color);
}
.gl-icon-btn.info {
  color: var(--main-info-color);
}
.gl-icon-btn.accent {
  color: var(--main-accent-color);
}
.gl-icon-btn:hover {
  opacity: 0.8;
}
.gl-icon-btn:active {
  transform: translateY(2px);
}
/* <<< gl-icon-btn */

/* >>> buttons */
/* TODO: active -  лучше selected */
button, .gl-button {
  /*min-height: 32px;*/
  font-size: 0.9rem;
  padding: 0.4rem;

  background-color: var(--main-light-primary-color);
  border-color: var(--main-light-primary-color);
  color: var(--main-primary-text-color);

  border-style: solid;
  border-width: 2px;
  cursor: pointer;
  transition-duration: 0.4s;
}
button:hover, .gl-button:hover, button.active {
  background-color: white;
  border-color: var(--main-light-primary-color);
  color: var(--main-primary-text-color);
}

button.disabled, .gl-button.disabled {
  /*background-color: var(--main-secondary-text-color) !important;*/
  /*border-color: var(--main-secondary-text-color) !important;*/
  /*color: var(--main-primary-icon-color) !important;*/
  opacity: 0.5;
}

button.primary, .gl-button.primary {
  background-color: white;
  border-color: var(--main-primary-color);
  color: var(--main-primary-color);
}
button.primary:hover, .gl-button.primary:hover, button.primary.active {
  background-color: var(--main-primary-color);
  border-color: var(--main-primary-color);
  color: var(--main-primary-icon-color);
}

button.negative, .gl-button.negative {
  background-color: white;
  border-color: var(--main-negative-color);
  color: var(--main-negative-color);
}
button.negative:hover, .gl-button.negative:hover, button.negative.active {
  background-color: var(--main-negative-color);
  border-color: var(--main-negative-color);
  color: var(--main-primary-icon-color);
}

button.positive, .gl-button.positive {
  background-color: white;
  border-color: var(--main-positive-color);
  color: var(--main-positive-color);
}
button.positive:hover, .gl-button.positive:hover {
  background-color: var(--main-positive-color);
  border-color: var(--main-positive-color);
  color: var(--main-primary-icon-color);
}

button.accent, .gl-button.accent {
  background-color: white;
  border-color: var(--main-accent-color);
  color: var(--main-accent-color);
}
button.accent:hover, .gl-button.accent:hover, button.accent.active {
  background-color: var(--main-accent-color);
  border-color: var(--main-accent-color);
  color: var(--main-primary-icon-color);
}

button.info, .gl-button.info {
  background-color: white;
  border-color: var(--main-info-color);
  color: var(--main-info-color);
}
button.info:hover, .gl-button.info:hover, button.info.active {
  background-color: var(--main-info-color);
  border-color: var(--main-info-color);
  color: var(--main-primary-icon-color);
}

button:active, .gl-button:active {
  transform: translateY(2px);
}

button.size__small, .gl-button.size__small {
  padding: 0 10px;
}
button.size__large, .gl-button.size__large {
  padding: 10px;
}

/* old */
button.old-yellow, .gl-button.old-yellow {
  background-color: var(--custom-old-yellow-color);
  border-color: var(--custom-old-yellow-color);
  color: var(--main-primary-text-color);
}
button.old-yellow:hover, .gl-button.old-yellow:hover, button.old-yellow.active {
  background-color: white;
  border-color: var(--custom-old-yellow-color);
  color: var(--main-primary-text-color);
}
button.old-pink, .gl-button.old-pink {
  background-color: white;
  border-color: var(--custom-old-pink-color);
  color: var(--main-primary-text-color);
}
button.old-pink:hover, .gl-button.old-pink:hover, button.old-pink.active {
  background-color: var(--custom-old-pink-color);
  border-color: var(--custom-old-pink-color);
  color: var(--main-light-primary-color);
}

/* >>> hotfix для fill-bg кнопок на card-edit*/
.btn-save-card.positive {
  background: var(--main-positive-color);
  color: var(--main-primary-icon-color)
}
.btn-save-card.old-yellow, .btn-save-card.old-yellow:hover {
  background: var(--custom-old-yellow-color);
  color: var(--main-primary-text-color)
}
.btn-save-card.info {
  background: var(--main-info-color);
  color: var(--main-primary-icon-color)
}
/* <<< hotfix для fill-bg кнопок на card-edit*/

/* >>> вернул старые кнопки на duty form */
.gl-card-duty-form .status-button {
  display: inline-block;
  width: 180px;
  height: 50px;
  padding: 10px;
  margin: 2px;
  background: #CCC;
  cursor: pointer;
  border: 1px solid lightgrey;
}

.gl-duty__status_created {
  background: #cc4444 !important;
  color: #eeeeee;
}

.gl-duty__status_opened {
  background: #ddbb22 !important;
  color: #333333;
}

.gl-duty__status_accepted {
  background: #8888cc !important;
  color: #eeeeee;
}

.gl-duty__status_done {
  background: #52A657 !important;
  color: #eeeeee;
}

/* <<< вернул старые кнопки на duty form */
/* <<< buttons */

.colors-form .color-example {
  border: 1px solid var(--main-divider-color);
  display: inline-block;
  width: 1.3rem;
  height: 1.3rem;
}