:root {
  --header-height: 56px;
}
button.btn,
a.btn,
input[type="button"].btn,
input[type="submit"].btn,
div.btn {
  --bs-btn-padding-x: 1.5rem;
  --bs-btn-padding-y: 0;
  --bs-btn-font-family: var(--font-bold);
  --bs-border-radius: 1rem;
  --bs-btn-line-height: 125%;
  --bs-btn-font-size: 1rem;
  border-radius: var(--bs-btn-border-radius);
  padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
  font-size: var(--bs-btn-font-size);
  line-height: var(--bs-btn-line-height);
  border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}
button.btn .icon-mask,
a.btn .icon-mask,
input[type="button"].btn .icon-mask,
input[type="submit"].btn .icon-mask,
div.btn .icon-mask {
  width: 1.25rem;
}
button.btn.btn-sm,
a.btn.btn-sm,
input[type="button"].btn.btn-sm,
input[type="submit"].btn.btn-sm,
div.btn.btn-sm {
  --bs-btn-padding-y: 0rem;
  --bs-btn-padding-x: 1rem;
  --bs-btn-font-size: 0.875rem;
  --bs-border-radius-sm: 0.75rem;
}
button.btn.btn-sm .icon-mask,
a.btn.btn-sm .icon-mask,
input[type="button"].btn.btn-sm .icon-mask,
input[type="submit"].btn.btn-sm .icon-mask,
div.btn.btn-sm .icon-mask {
  width: 1rem;
}
button.btn .glyphicon,
a.btn .glyphicon,
input[type="button"].btn .glyphicon,
input[type="submit"].btn .glyphicon,
div.btn .glyphicon {
  background-color: var(--bs-btn-color);
}
.btn-symbol {
  border: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  text-decoration: none;
  cursor: pointer;
  background: var(--bs-btn-bg);
  color: var(--bs-btn-color);
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  font-size: 1.25rem;
  line-height: 1.2;
  position: relative;
}
.btn-symbol .bi {
  font-size: 1rem;
}
.btn-symbol .icon-mask {
  width: 1.25rem !important;
  height: 1.25rem !important;
}
.btn-symbol.btn-sm {
  width: 1.5rem;
  height: 1.5rem;
  font-size: 1rem;
}
.btn-symbol.btn-sm .bi {
  font-size: 0.75rem;
}
.btn-symbol.btn-lg {
  width: 2.5rem;
  height: 2.5rem;
}
.btn:before,
.btn-symbol:before {
  content: "";
  pointer-events: none;
  position: absolute;
  opacity: 0;
  transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  border-radius: var(--bs-btn-border-radius);
  inset: 0;
  background-color: var(--bs-btn-color);
}
.btn:hover:before,
.btn-symbol:hover:before {
  opacity: 0.08;
}
.btn:focus:before,
.btn-symbol:focus:before {
  opacity: 0.12;
}
.btn .icon-mask,
.btn-symbol .icon-mask {
  background-color: var(--bs-btn-color);
}
.btn-primary {
  --bs-btn-color: var(--On-primary);
  --bs-btn-bg: var(--Primary);
  --bs-btn-border-color: var(--Primary);
  --bs-btn-hover-color: var(--On-primary);
  --bs-btn-hover-bg: var(--Primary);
  --bs-btn-hover-border-color: var(--Primary);
  --bs-btn-focus-shadow-rgb: 0, 68, 68;
  --bs-btn-active-color: var(--On-primary);
  --bs-btn-active-bg: var(--Primary);
  --bs-btn-active-border-color: var(--Primary);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--On-primary);
  --bs-btn-disabled-bg: var(--Primary);
  --bs-btn-disabled-border-color: var(--Primary);
}
.btn-info,
.btn-blue {
  --bs-btn-color: var(--On-info-container);
  --bs-btn-bg: var(--Info-container);
  --bs-btn-border-color: var(--Info-container);
  --bs-btn-hover-color: var(--On-info-container);
  --bs-btn-hover-bg: var(--Info-container);
  --bs-btn-hover-border-color: var(--Info-container);
  --bs-btn-focus-shadow-rgb: 26, 26, 186;
  --bs-btn-active-color: var(--On-info-container);
  --bs-btn-active-bg: var(--Info-container);
  --bs-btn-active-border-color: var(--Info-container);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--On-info-container);
  --bs-btn-disabled-bg: var(--Info-container);
  --bs-btn-disabled-border-color: var(--Info-container);
}
.btn-danger,
.btn-error,
.btn-red {
  --bs-btn-color: var(--On-error-container);
  --bs-btn-bg: var(--Error-container);
  --bs-btn-border-color: var(--Error-container);
  --bs-btn-hover-color: var(--On-error-container);
  --bs-btn-hover-bg: var(--Error-container);
  --bs-btn-hover-border-color: var(--Error-container);
  --bs-btn-focus-shadow-rgb: 186, 26, 26;
  --bs-btn-active-color: var(--On-error-container);
  --bs-btn-active-bg: var(--Error-container);
  --bs-btn-active-border-color: var(--Error-container);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--On-error-container);
  --bs-btn-disabled-bg: var(--Error-container);
  --bs-btn-disabled-border-color: var(--Error-container);
}
.btn-success,
.btn-green {
  --bs-btn-color: var(--On-success-container);
  --bs-btn-bg: var(--Success-container);
  --bs-btn-border-color: var(--Success-container);
  --bs-btn-hover-color: var(--On-success-container);
  --bs-btn-hover-bg: var(--Success-container);
  --bs-btn-hover-border-color: var(--Success-container);
  --bs-btn-focus-shadow-rgb: 26, 186, 26;
  --bs-btn-active-color: var(--On-success-container);
  --bs-btn-active-bg: var(--Success-container);
  --bs-btn-active-border-color: var(--Success-container);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--On-success-container);
  --bs-btn-disabled-bg: var(--Success-container);
  --bs-btn-disabled-border-color: var(--Success-container);
}
.btn-outline {
  --bs-btn-border-color: var(--Outline);
}
.btn-check:checked + .btn,
.btn.active,
.btn.show {
  --bs-btn-color: var(--On-secondary);
  --bs-btn-bg: var(--Secondary);
  --bs-btn-border-color: var(--Secondary);
  --bs-btn-hover-color: var(--On-secondary);
  --bs-btn-hover-bg: var(--Secondary);
  --bs-btn-hover-border-color: var(--Secondary);
  --bs-btn-active-color: var(--On-secondary);
  --bs-btn-active-bg: var(--Secondary);
  --bs-btn-active-border-color: var(--Secondary);
  --bs-btn-disabled-color: var(--On-secondary);
  --bs-btn-disabled-bg: var(--Secondary);
  --bs-btn-disabled-border-color: var(--Secondary);
}
.agro__header button.btn.btn-green,
.agro__header button.btn.btn-success {
  background-color: var(--Success-container);
  color: var(--On-success-container);
}
.agro__header button.btn.btn-error {
  background-color: var(--Error-container);
  color: var(--On-error-container);
}
.agro__header .plus-btn:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M440-440H200v-80h240v-240h80v240h240v80H520v240h-80v-240Z'/%3E%3C/svg%3E");
}
body.dark-theme .agro__header .plus-btn:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%2310380c'%3E%3Cpath d='M440-440H200v-80h240v-240h80v240h240v80H520v240h-80v-240Z'/%3E%3C/svg%3E");
}
.agro__header .minus-btn {
  position: relative;
  cursor: pointer;
}
.agro__header .minus-btn:after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M200-440v-80h560v80H200Z'/%3E%3C/svg%3E");
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  display: block;
  top: 50%;
  right: 50%;
  transform: translate(50%, -50%);
}
body.dark-theme .agro__header .minus-btn:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%2310380c'%3E%3Cpath d='M200-440v-80h560v80H200Z'/%3E%3C/svg%3E");
}
.datepicker table tr td span.active.active,
.datepicker table tr td span.active.disabled,
.datepicker table tr td span.active.disabled.active,
.datepicker table tr td span.active.disabled.disabled,
.datepicker table tr td span.active.disabled:active,
.datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active.disabled:hover.active,
.datepicker table tr td span.active.disabled:hover.disabled,
.datepicker table tr td span.active.disabled:hover:active,
.datepicker table tr td span.active.disabled:hover:hover,
.datepicker table tr td span.active.disabled:hover[disabled],
.datepicker table tr td span.active.disabled[disabled],
.datepicker table tr td span.active:active,
.datepicker table tr td span.active:hover,
.datepicker table tr td span.active:hover.active,
.datepicker table tr td span.active:hover.disabled,
.datepicker table tr td span.active:hover:active,
.datepicker table tr td span.active:hover:hover,
.datepicker table tr td span.active:hover[disabled],
.datepicker table tr td span.active[disabled] {
  background: var(--success);
}
.elevated-card,
.filled-card,
.elevated-card {
  border-radius: 4px;
  padding-top: 16px !important;
  padding-bottom: 16px !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}
.elevated-card {
  background: var(--white);
  box-shadow: var(--elevation-2);
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3), 0px 2px 6px 2px rgba(0, 0, 0, 0.15);
}
.outlined-card {
  background: var(--white);
  border: 1px solid var(--primary-300);
}
.filled-card {
  background: var(--primary-100);
}
.checkbox [type=checkbox],
[type=radio] {
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 20px;
  height: 20px;
  border: 2px solid var(--success);
  border-radius: 4px;
  position: relative;
  transition: 0.2s;
  vertical-align: sub;
  flex-shrink: 0;
}
.checkbox [type=checkbox]:before,
[type=radio]:before {
  content: "";
  position: absolute;
  transition: 0.2s;
}
.checkbox [type=checkbox]:after,
[type=radio]:after {
  content: "";
  position: absolute;
  top: -4px;
  bottom: -4px;
  right: -4px;
  left: -4px;
  background: var(--primary);
  border-radius: 4px;
  opacity: 0;
  pointer-events: none;
  transition: 0.2s;
}
.checkbox [type=checkbox]:hover,
[type=radio]:hover {
  border-color: var(--success-600);
}
.checkbox [type=checkbox]:active,
[type=radio]:active {
  border-color: var(--success-800);
}
.checkbox [type=checkbox]:active:after,
[type=radio]:active:after {
  top: -6px;
  bottom: -6px;
  right: -6px;
  left: -6px;
  opacity: 0.1;
}
.checkbox [type=checkbox]:before {
  top: 2px;
  left: 5px;
  width: 5px;
  height: 10px;
  border-right: 1px solid transparent;
  border-bottom: 1px solid transparent;
  transform: rotate(45deg);
}
.checkbox [type=checkbox]:checked {
  background: var(--success);
}
.checkbox [type=checkbox]:checked:before {
  border-color: var(--white);
}
.checkbox [type=checkbox]:hover:checked {
  background: var(--success-600);
}
.checkbox [type=checkbox]:active:checked {
  background: var(--success-800);
}
[type=radio]:before {
  top: 3px;
  left: 3px;
  width: 10px;
  height: 10px;
  border-radius: 2px;
  background: transparent;
  transform: scale(0);
}
[type=radio]:checked {
  border-color: var(--success);
}
[type=radio]:checked:before {
  transform: scale(1);
  background: var(--success);
}
[type=radio]:hover:checked {
  border-color: var(--success-600);
}
[type=radio]:hover:checked:before {
  background: var(--success-600);
}
[type=radio]:active:checked {
  border-color: var(--success-800);
}
[type=radio]:active:checked:before {
  background: var(--success-800);
}
.dropdown-menu {
  border: none;
  filter: drop-shadow(0px 2px 8px rgba(51, 65, 85, 0.15));
}
.dropdown-item {
  color: var(--primary);
}
.dropdown-item:hover,
.dropdown-item:focus {
  color: var(--white);
  background-color: var(--primary);
}
.dropdown-item.active,
.dropdown-item:active {
  color: var(--white);
  background-color: var(--success);
}
:root {
  --elevation-1: 0px 1px 2px rgba(0, 0, 0, 0.3), 0px 1px 3px 1px rgba(0, 0, 0, 0.15);
  --elevation-2: 0px 1px 2px rgba(0, 0, 0, 0.3), 0px 2px 6px 2px rgba(0, 0, 0, 0.15);
  --elevation-3: 0px 4px 8px 3px rgba(0, 0, 0, 0.15), 0px 1px 3px rgba(0, 0, 0, 0.3);
  --elevation-4: 0px 6px 10px 4px rgba(0, 0, 0, 0.15), 0px 2px 3px rgba(0, 0, 0, 0.3);
  --elevation-5: 0px 8px 12px 6px rgba(0, 0, 0, 0.15), 0px 4px 4px rgba(0, 0, 0, 0.3);
}
.elevation-1 {
  box-shadow: var(--elevation-1);
}
.elevation-2 {
  box-shadow: var(--elevation-2);
}
.elevation-3 {
  box-shadow: var(--elevation-3);
}
.elevation-4 {
  box-shadow: var(--elevation-4);
}
.elevation-5 {
  box-shadow: var(--elevation-5);
}
.flex {
  display: flex !important;
}
.flex-align-center {
  display: flex !important;
  align-items: center !important;
}
.flex-justify-end {
  display: flex !important;
  justify-content: flex-end !important;
}
.flex-justify-between {
  display: flex !important;
  justify-content: space-between !important;
}
@font-face {
  font-family: 'ManropeRegular';
  src: url('/fonts/ManropeRegular.eot');
  src: url('/fonts/ManropeRegular.eot') format('embedded-opentype'), url('/fonts/ManropeRegular.woff2') format('woff2'), url('/fonts/ManropeRegular.woff') format('woff'), url('/fonts/ManropeRegular.ttf') format('truetype'), url('/fonts/ManropeRegular.svg#ManropeRegular') format('svg');
}
@font-face {
  font-family: 'ManropeMedium';
  src: url('/fonts/ManropeMedium.eot');
  src: url('/fonts/ManropeMedium.eot') format('embedded-opentype'), url('/fonts/ManropeMedium.woff2') format('woff2'), url('/fonts/ManropeMedium.woff') format('woff'), url('/fonts/ManropeMedium.ttf') format('truetype'), url('/fonts/ManropeMedium.svg#ManropeMedium') format('svg');
}
@font-face {
  font-family: 'ManropeBold';
  src: url('/fonts/ManropeBold.eot');
  src: url('/fonts/ManropeBold.eot') format('embedded-opentype'), url('/fonts/ManropeBold.woff2') format('woff2'), url('/fonts/ManropeBold.woff') format('woff'), url('/fonts/ManropeBold.ttf') format('truetype'), url('/fonts/ManropeBold.svg#ManropeBold') format('svg');
}
html {
  font-size: 100%;
}
body {
  font-family: var(--font-regular);
  font-weight: 400;
  line-height: 1.5;
  font-size: 87.5%;
}
p {
  margin-bottom: 1rem;
}
h1,
h2,
h3,
h4,
h5 {
  margin: 0.75rem 0 1.25rem;
  font-family: var(--font-bold);
  font-weight: 400;
  line-height: 1.3;
}
h1 {
  margin-top: 0;
  font-size: 2.8125rem;
}
@media (max-width: 600px) {
  h1 {
    font-size: 1.75rem;
  }
}
h2 {
  font-size: 2.25rem;
}
@media (max-width: 600px) {
  h2 {
    font-size: 1.375rem;
  }
}
h3 {
  font-size: 1.75rem;
}
@media (max-width: 600px) {
  h3 {
    font-size: 1.125rem;
  }
}
h4 {
  font-size: 1.375rem;
}
@media (max-width: 600px) {
  h4 {
    font-size: 1rem;
  }
}
h5 {
  font-size: 1rem;
}
@media (max-width: 600px) {
  h5 {
    font-size: 0.875rem;
  }
}
small,
.text_small {
  font-size: 0.75rem;
}
b,
strong {
  font-family: var(--font-bold);
}
th,
.VPopup-title {
  font-family: var(--font-bold);
}
.highcharts-container * {
  font-family: var(--font-regular) !important;
}
.logo {
  width: 24px;
  height: 24px;
  background: url("/images/logo.gif") no-repeat center;
  background-size: contain;
}
.icon-mask {
  display: inline-block;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  flex-shrink: 0;
  transition: var(--transition-primary);
  background-color: var(--On-surface);
}
.icon-mask.loading {
  width: 24px;
  height: 24px;
  -webkit-mask-image: url("/images/loading.svg");
          mask-image: url("/images/loading.svg");
}
.icon-mask.widgets {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/widgets.svg");
          mask-image: url("/images/icons/widgets.svg");
}
.icon-mask.options {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/cogs.svg");
          mask-image: url("/images/icons/cogs.svg");
}
.icon-mask.bind {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/attachment.svg");
          mask-image: url("/images/icons/attachment.svg");
}
.icon-mask.fullscreen {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/fullscreen.svg");
          mask-image: url("/images/icons/fullscreen.svg");
}
.icon-mask.connect {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/connect.svg");
          mask-image: url("/images/icons/connect.svg");
}
.icon-mask.delete {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/delete.svg");
          mask-image: url("/images/icons/delete.svg");
}
.icon-mask.plus {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/plus.svg");
          mask-image: url("/images/icons/plus.svg");
}
.icon-mask.minus {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/minus.svg");
          mask-image: url("/images/icons/minus.svg");
}
.icon-mask.plus-box {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/plus-box.svg");
          mask-image: url("/images/icons/plus-box.svg");
}
.icon-mask.database-edit {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/database-edit.svg");
          mask-image: url("/images/icons/database-edit.svg");
}
.icon-mask.info {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/information.svg");
          mask-image: url("/images/icons/information.svg");
}
.icon-mask.check-outline {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/check-circle-outline.svg");
          mask-image: url("/images/icons/check-circle-outline.svg");
}
.icon-mask.check {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/check-circle.svg");
          mask-image: url("/images/icons/check-circle.svg");
}
.icon-mask.layers {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/layers.svg");
          mask-image: url("/images/icons/layers.svg");
}
.icon-mask.folder {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/folder.svg");
          mask-image: url("/images/icons/folder.svg");
}
.icon-mask.filter {
  width: 24px;
  height: 24px;
  -webkit-mask-image: url("/images/icons/filter.svg");
          mask-image: url("/images/icons/filter.svg");
}
.icon-mask.screenshot {
  width: 24px;
  height: 24px;
  -webkit-mask-image: url("/images/icons/screenshot.svg");
          mask-image: url("/images/icons/screenshot.svg");
}
.icon-mask.edit,
.icon-mask.update {
  width: 24px;
  height: 24px;
  -webkit-mask-image: url("/images/icons/edit.svg");
          mask-image: url("/images/icons/edit.svg");
}
.icon-mask.copy {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/copy.svg");
          mask-image: url("/images/icons/copy.svg");
}
.icon-mask.save {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/save.svg");
          mask-image: url("/images/icons/save.svg");
}
.icon-mask.cancel {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/close.svg");
          mask-image: url("/images/close.svg");
}
.icon-mask.apply {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/check.svg");
          mask-image: url("/images/icons/check.svg");
}
.icon-mask.refresh {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/refresh.svg");
          mask-image: url("/images/icons/refresh.svg");
}
.icon-mask.download {
  width: 24px;
  height: 24px;
  -webkit-mask-image: url("/images/icons/download.svg");
          mask-image: url("/images/icons/download.svg");
}
.icon-mask.timer {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/timer.svg");
          mask-image: url("/images/icons/timer.svg");
}
.icon-mask.align-horizontal {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/align-horizontal-center.svg");
          mask-image: url("/images/icons/align-horizontal-center.svg");
}
.icon-mask.align-vertical {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/align-vertical-center.svg");
          mask-image: url("/images/icons/align-vertical-center.svg");
}
.icon-mask.code {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/code.svg");
          mask-image: url("/images/icons/code.svg");
}
.icon-mask.restart {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/restart.svg");
          mask-image: url("/images/icons/restart.svg");
}
.icon-mask.view {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/eye.svg");
          mask-image: url("/images/icons/eye.svg");
}
.icon-mask.menu {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/menu.svg");
          mask-image: url("/images/icons/menu.svg");
}
.icon-mask.list {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/list.svg");
          mask-image: url("/images/icons/list.svg");
}
.icon-mask.help {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/help.svg");
          mask-image: url("/images/icons/help.svg");
}
.icon-mask.desc {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/desc.svg");
          mask-image: url("/images/icons/desc.svg");
}
.icon-mask.table-chart {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/table-chart.svg");
          mask-image: url("/images/icons/table-chart.svg");
}
.icon-mask.upgrade {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/upgrade.svg");
          mask-image: url("/images/icons/upgrade.svg");
}
.icon-mask.paste {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/paste.svg");
          mask-image: url("/images/icons/paste.svg");
}
.icon-mask.preview {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/preview.svg");
          mask-image: url("/images/icons/preview.svg");
}
.icon-mask.construction {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/construction.svg");
          mask-image: url("/images/icons/construction.svg");
}
.icon-mask.edit-note {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/edit-note.svg");
          mask-image: url("/images/icons/edit-note.svg");
}
.icon-mask.web {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/web.svg");
          mask-image: url("/images/icons/web.svg");
  background-color: var(--Web);
}
.icon-mask.android {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/android.svg");
          mask-image: url("/images/icons/android.svg");
  background-color: var(--Android);
}
.icon-mask.iOS {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/apple.svg");
          mask-image: url("/images/icons/apple.svg");
  background-color: var(--Apple);
}
.icon-mask.api {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/api.svg");
          mask-image: url("/images/icons/api.svg");
  background-color: var(--Api);
}
.icon-mask.bar-chart {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/bar-chart.svg");
          mask-image: url("/images/icons/bar-chart.svg");
}
.icon-mask.dashboard {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/dashboard.svg");
          mask-image: url("/images/icons/dashboard.svg");
}
.icon-mask.category {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/category.svg");
          mask-image: url("/images/icons/category.svg");
}
.icon-mask.users {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/users.svg");
          mask-image: url("/images/icons/users.svg");
}
.icon-mask.script-text {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/script-text.svg");
          mask-image: url("/images/icons/script-text.svg");
}
.icon-mask.projects {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/projects.svg");
          mask-image: url("/images/icons/projects.svg");
}
.icon-mask.nodes {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/nodes.svg");
          mask-image: url("/images/icons/nodes.svg");
}
.icon-mask.account {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/account.svg");
          mask-image: url("/images/icons/account.svg");
}
.icon-mask.upload {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/upload.svg");
          mask-image: url("/images/icons/upload.svg");
}
.icon-mask.settings {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/settings.svg");
          mask-image: url("/images/icons/settings.svg");
}
.icon-mask.sun {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/sun.svg");
          mask-image: url("/images/icons/sun.svg");
}
.icon-mask.moon {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/moon.svg");
          mask-image: url("/images/icons/moon.svg");
}
.icon-mask.drag-handle {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/drag-handle.svg");
          mask-image: url("/images/icons/drag-handle.svg");
}
.show-all > .icon-mask.eye {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/eye.svg");
          mask-image: url("/images/icons/eye.svg");
}
.hide-all > .icon-mask.eye {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/eye-off.svg");
          mask-image: url("/images/icons/eye-off.svg");
}
.glyphicon.glyphicon-remove,
.glyphicon.glyphicon-plus {
  display: inline-block;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  flex-shrink: 0;
  transition: var(--transition-primary);
  width: 20px;
  height: 20px;
}
.glyphicon.glyphicon-remove {
  -webkit-mask-image: url("/images/icons/delete.svg");
          mask-image: url("/images/icons/delete.svg");
}
.glyphicon.glyphicon-plus {
  -webkit-mask-image: url("/images/icons/plus.svg");
          mask-image: url("/images/icons/plus.svg");
}
.ui-widget {
  font-family: system-ui, sans-serif;
}
.ui-widget.ui-widget-content {
  border-color: var(--primary-300);
}
.ui-widget {
  color: var(--primary);
  background-color: var(--white);
  padding: 0;
  display: flex;
  flex-direction: column;
  margin: 8px;
  max-height: calc(100vh - 16px);
}
.ui-widget-header {
  border: none;
  background: transparent;
  font-family: var(--font-bold);
}
.ui-dialog {
  border-radius: 6px;
}
.ui-dialog .ui-dialog-content {
  overflow: auto;
  padding: 16px;
}
.ui-dialog .ui-dialog-titlebar {
  display: flex;
  font-size: 18px;
  font-weight: 600;
  padding: 12px 16px;
  border-bottom: 1px solid var(--primary-300);
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
}
.ui-dialog .ui-dialog-titlebar-close {
  box-sizing: content-box;
  background: transparent url(/images/icons/close.svg) center / 24px auto no-repeat;
  border-radius: 50%;
  opacity: 0.5;
  cursor: pointer;
  transition: 0.2s;
  position: relative;
  width: 32px;
  height: 32px;
  top: 0;
  right: 0;
  margin: 0;
  margin-left: auto;
  padding: 0;
  border: none;
}
.ui-dialog .ui-dialog-titlebar-close:hover,
.ui-dialog .ui-dialog-titlebar-close:focus {
  opacity: 1;
  transform: rotate(90deg);
  background-color: var(--light-secondary-text-color);
}
.ui-widget-overlay {
  opacity: 1;
  background: var(--modal-overlay-color);
}
.modal_default_main {
  border: 1px solid var(--primary-300) !important;
  border-radius: 6px;
  color: var(--primary);
  background-color: var(--white);
  padding: 0;
  display: flex;
  flex-direction: column;
  margin: 8px;
  max-height: calc(100vh - 16px);
}
.modal_default_ok,
.modal_default_cancel {
  font-family: var(--font-bold);
  font-size: 1rem;
  line-height: 1.25;
  border-radius: 0.625rem;
  min-height: 3rem;
  padding: 0 1.5rem;
  color: var(--button-color);
  box-shadow: none;
  border: 2px solid;
  border-color: var(--button-bc);
  background-color: var(--button-bg) !important;
  transition: 0.2s;
}
.modal_default_ok:hover,
.modal_default_cancel:hover {
  color: var(--white);
  border-color: var(--button-hover);
  background-color: var(--button-hover) !important;
  box-shadow: var(--shadow-hover);
  animation: shadowHover 0.2s;
}
.modal_default_ok:active,
.modal_default_cancel:active {
  color: var(--white);
  border-color: var(--button-active);
  background-color: var(--button-active) !important;
  box-shadow: var(--shadow-active);
  animation: shadowActive 0.2s;
}
.modal_default_ok {
  --button-color: var(--white);
  --button-bg: var(--primary);
  --button-bc: var(--primary);
  --button-hover: var(--primary-600);
  --button-active: var(--primary-800);
}
.modal_default_cancel {
  --button-color: var(--primary);
  --button-bg: var(--white);
  --button-bc: var(--primary);
  --button-hover: var(--primary-600);
  --button-active: var(--primary-800);
}
.navbar {
  box-shadow: 0px 2px 8px rgba(51, 65, 85, 0.15);
  background-color: var(--white);
}
.navbar .dropdown-menu {
  z-index: 1101;
}
.nav-link {
  font-size: 1rem;
  color: var(--primary);
}
.nav-link:hover,
.nav-link:focus {
  color: var(--success);
}
.navbar-brand {
  display: flex;
  gap: 8px;
  align-items: center;
  color: var(--primary);
  font-family: var(--font-bold);
}
.theme-toggler {
  cursor: pointer;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  padding: 8px;
  margin: 2px;
  background: transparent;
  transition: 0.2s;
}
.theme-toggler:hover,
.theme-toggler:focus {
  background: var(--success-600);
}
.select2-container--krajee-bs3 .select2-selection {
  box-shadow: none;
  border: 0.0625rem solid var(--primary-200);
  transition: 0.2s;
}
.select2-container--krajee-bs3 .select2-selection:hover {
  border-color: var(--primary-300);
}
.select2-container--krajee-bs3 .select2-selection--multiple {
  overflow: hidden;
  min-height: 2.5rem;
}
.select2-container--krajee-bs3 .select2-selection--multiple .select2-search--inline .select2-search__field {
  font-family: inherit;
  height: 2.375rem;
  padding: 0.3125rem;
  margin-left: 0.4375rem;
  font-size: 1rem;
  line-height: 175%;
  color: var(--primary);
}
.select2-container--krajee-bs3 .select2-selection--multiple.select2-selection--clearable {
  border-color: var(--primary);
}
.select2-container--krajee-bs3 .select2-selection--multiple .select2-selection__choice {
  min-height: 1.75rem;
  margin: 0.3125rem 0 0 0.125rem;
  padding: 0 0.5rem 0 0.625rem;
  font-size: 1rem;
  line-height: 1.625;
  background: var(--primary-200);
  border: 0.03125rem solid var(--primary-300);
  color: var(--primary);
  border-radius: 1rem;
}
.select2-container--krajee-bs3 .select2-selection--multiple .select2-selection__choice__remove {
  margin: 0.375rem 0 0 0.5rem;
}
.select2-container--krajee-bs3 .select2-selection--multiple .select2-selection__clear,
.select2-container--krajee-bs3 .select2-selection--multiple .select2-selection__choice__remove {
  --icon: url("data:image/svg+xml,%3Csvg width='14' height='15' viewBox='0 0 14 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 0.25C3.11719 0.25 0 3.39453 0 7.25C0 11.1328 3.11719 14.25 7 14.25C10.8555 14.25 14 11.1328 14 7.25C14 3.39453 10.8555 0.25 7 0.25ZM9.89844 9.68359C10.1172 9.95703 10.0898 10.3672 9.81641 10.6133C9.70703 10.7227 9.54297 10.75 9.40625 10.75C9.21484 10.75 9.02344 10.6953 8.88672 10.5312L7 8.28906L5.08594 10.5312C4.94922 10.6953 4.75781 10.75 4.56641 10.75C4.42969 10.75 4.29297 10.7227 4.15625 10.6133C3.88281 10.3672 3.85547 9.95703 4.07422 9.68359L6.125 7.25L4.07422 4.84375C3.85547 4.57031 3.88281 4.16016 4.15625 3.91406C4.42969 3.69531 4.83984 3.72266 5.08594 3.99609L7 6.23828L8.88672 3.99609C9.13281 3.72266 9.54297 3.69531 9.81641 3.91406C10.0898 4.16016 10.1172 4.57031 9.89844 4.84375L7.84766 7.25L9.89844 9.68359Z' fill='%23334155'/%3E%3C/svg%3E%0A");
  --icon-hover: url("data:image/svg+xml,%3Csvg width='14' height='15' viewBox='0 0 14 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 0.25C3.11719 0.25 0 3.39453 0 7.25C0 11.1328 3.11719 14.25 7 14.25C10.8555 14.25 14 11.1328 14 7.25C14 3.39453 10.8555 0.25 7 0.25ZM9.89844 9.68359C10.1172 9.95703 10.0898 10.3672 9.81641 10.6133C9.70703 10.7227 9.54297 10.75 9.40625 10.75C9.21484 10.75 9.02344 10.6953 8.88672 10.5312L7 8.28906L5.08594 10.5312C4.94922 10.6953 4.75781 10.75 4.56641 10.75C4.42969 10.75 4.29297 10.7227 4.15625 10.6133C3.88281 10.3672 3.85547 9.95703 4.07422 9.68359L6.125 7.25L4.07422 4.84375C3.85547 4.57031 3.88281 4.16016 4.15625 3.91406C4.42969 3.69531 4.83984 3.72266 5.08594 3.99609L7 6.23828L8.88672 3.99609C9.13281 3.72266 9.54297 3.69531 9.81641 3.91406C10.0898 4.16016 10.1172 4.57031 9.89844 4.84375L7.84766 7.25L9.89844 9.68359Z' fill='%23EF4444'/%3E%3C/svg%3E%0A");
  opacity: 1;
  background-repeat: no-repeat;
  background-position: center;
  font-size: 0;
  width: 14px;
  height: 15px;
  background-image: var(--icon);
  transition: 0.2s;
}
.select2-container--krajee-bs3 .select2-selection--multiple .select2-selection__clear:hover,
.select2-container--krajee-bs3 .select2-selection--multiple .select2-selection__choice__remove:hover {
  opacity: 1;
  background-image: var(--icon-hover);
}
.select2-container--krajee-bs3 .select2-selection--multiple .select2-selection__clear {
  top: 0.25rem;
  right: 0.25rem;
}
.select2-container--krajee-bs3.select2-container--open .select2-selection,
.select2-container--krajee-bs3 .select2-selection:focus {
  box-shadow: none;
  border-color: var(--primary);
}
.select2-container--krajee-bs3 .select2-dropdown {
  box-shadow: none;
  border-color: var(--primary);
}
.select2-container--krajee-bs3 .select2-results__option.select2-results__option--selected,
.select2-container--krajee-bs3 .select2-results__option[aria-selected=true] {
  color: var(--white);
  background-color: var(--success);
}
.select2-container--krajee-bs3 .select2-results__option--highlighted[aria-selected] {
  background-color: var(--primary);
}
.s2-togall-button {
  color: var(--success);
  font-family: var(--font-bold);
}
.margin-left-auto {
  margin-left: auto !important;
}
.margin-bottom-0 {
  margin-bottom: 0 !important;
}
.margin-bottom-4 {
  margin-bottom: 4px !important;
}
.margin-right-4 {
  margin-right: 4px !important;
}
.margin-top-12 {
  margin-top: 12px !important;
}
.margin-bottom-12 {
  margin-bottom: 12px !important;
}
.margin-vertical-12 {
  margin-top: 12px !important;
  margin-bottom: 12px !important;
}
.margin-left-12 {
  margin-left: 12px !important;
}
.margin-right-12 {
  margin-right: 12px !important;
}
.margin-bottom-20 {
  margin-bottom: 20px !important;
}
/********************************/
.padding-top-16 {
  padding-top: 16px !important;
}
.padding-bottom-16 {
  padding-bottom: 16px !important;
}
.padding-left-16 {
  padding-left: 16px !important;
}
.padding-right-16 {
  padding-right: 16px !important;
}
.padding-16 {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}
.padding-top-40 {
  padding-top: 40px !important;
}
.padding-bottom-40 {
  padding-bottom: 40px !important;
}
.padding-vertical-40 {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}
.grid-view {
  overflow: auto;
}
.table-actions {
  display: flex;
  justify-content: flex-end;
}
.table-actions > a,
.table-actions > button {
  border: 0.0625rem solid var(--primary);
  color: var(--primary);
  border-radius: 0.375rem;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.2s;
}
.table-actions > a:not(:last-child),
.table-actions > button:not(:last-child) {
  margin-right: 4px;
}
.table-actions > a:hover,
.table-actions > button:hover {
  color: var(--white);
  background-color: var(--primary-600);
  box-shadow: var(--shadow-hover);
}
.table-actions > a:active,
.table-actions > button:active {
  color: var(--white);
  background-color: var(--primary-800);
  box-shadow: var(--shadow-active);
  animation: shadowActive 0.2s;
}
:root {
  --filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='20' width='20'%3E%3Cpath fill='%23596245' d='m10 17-3.375-3.375 1.063-1.063L10 14.875l2.312-2.313 1.063 1.063ZM7.688 7.438 6.625 6.375 10 3l3.375 3.375-1.063 1.063L10 5.125Z'/%3E%3C/svg%3E");
  --filter-icon-up: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='20' width='20'%3E%3Cpath fill='%23596245' d='M9.25 16V6.875l-4.188 4.187L4 10l6-6 6 6-1.062 1.062-4.188-4.187V16Z'/%3E%3C/svg%3E");
  --filter-icon-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='20' width='20'%3E%3Cpath fill='%23596245' d='m10 16-6-6 1.062-1.062 4.188 4.187V4h1.5v9.125l4.188-4.187L16 10Z'/%3E%3C/svg%3E");
}
.table-panel-item {
  display: flex;
}
.agro__header + .vgt-wrap.agro .vgt-table.agro thead tr:first-child th:first-child,
.agro__header + .vgt-wrap.agro .vgt-table.agro thead tr:first-child td:first-child {
  border-top-left-radius: 0;
}
.agro__header + .vgt-wrap.agro .vgt-table.agro thead tr:first-child th:last-child,
.agro__header + .vgt-wrap.agro .vgt-table.agro thead tr:first-child td:last-child {
  border-top-right-radius: 0;
}
.toggle-button {
  display: flex;
  margin: 0;
}
.toggle-button > label {
  padding: 0;
}
.toggle-button > label + input[type="checkbox"] {
  margin-left: 8px;
}
.toggle-button input[type="checkbox"] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  position: relative;
  margin: 0;
  cursor: pointer;
  background: var(--primary-100);
  border: 1px solid var(--primary-300);
  width: 56px;
  height: 28px;
  border-radius: 40px;
  transition: 0.2s;
}
.toggle-button input[type="checkbox"]:focus {
  outline: none;
}
.toggle-button input[type="checkbox"]:before {
  content: "";
  position: absolute;
  left: 0px;
  top: 0px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background-color: var(--white);
  transition: 0.2s;
  border: 1px solid var(--primary-200);
  pointer-events: none;
}
.toggle-button input[type="checkbox"]:after {
  content: "";
  position: absolute;
  left: -4px;
  top: -4px;
  right: -4px;
  bottom: -4px;
  border-radius: 10px;
  transition: 0.2s;
  opacity: 0.05;
  pointer-events: none;
}
.toggle-button input[type="checkbox"]:hover:before {
  border-color: var(--primary);
}
.toggle-button input[type="checkbox"]:hover:checked {
  background: var(--success-600);
}
.toggle-button input[type="checkbox"]:active:after {
  background-color: var(--primary);
}
.toggle-button input[type="checkbox"]:checked {
  background: var(--success);
  border-color: var(--success-800);
}
.toggle-button input[type="checkbox"]:checked:before {
  left: 30px;
  border-color: var(--success-600);
}
.toggle-button input[type="checkbox"] + label {
  margin-left: 8px;
}
.toggle-button-label {
  font-weight: normal;
  margin: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  cursor: pointer;
}
:root {
  --font-regular: 'ManropeRegular', serif;
  --font-medium: 'ManropeMedium', serif;
  --font-bold: 'ManropeBold', serif;
  --primary: #334155;
  --primary-100: #F1F5F9;
  --primary-200: #E2E8F0;
  --primary-300: #CBD5E1;
  --primary-500: #64748B;
  --primary-600: #475569;
  --primary-800: #1E293B;
  --primary-900: #0F172A;
  --white: #FFF;
  --success: #0F766E;
  --success-600: #0D9488;
  --success-800: #115E59;
  --success-900: #134E4A;
  --error: #EF4444;
  --error-600: #DC2626;
  --error-700: #B91C1C;
  --info: #0EA5E9;
  --info-600: #0284C7;
  --info-700: #0369A1;
  --shadow-hover: 0px 4px 6px rgba(0, 0, 0, 0.15);
  --shadow-active: inset 0px 2px 6px rgba(0, 0, 0, 0.15);
}
@keyframes shadowActive {
  0% {
    box-shadow: var(--shadow-hover);
  }
  50% {
    box-shadow: none;
  }
  100% {
    box-shadow: var(--shadow-active);
  }
}
@keyframes shadowHover {
  0% {
    box-shadow: var(--shadow-active);
  }
  50% {
    box-shadow: none;
  }
  100% {
    box-shadow: var(--shadow-hover);
  }
}
.wrap {
  display: flex;
  flex-direction: column;
  padding: 0.75rem;
  margin: 0 auto;
}
@media (min-width: 75em) {
  .wrap {
    height: 100%;
  }
}
@media (max-width: 160em) {
  .wrap {
    max-width: none;
  }
}
@media (min-width: 160.0625em) {
  .wrap {
    max-width: 156.25rem;
  }
}
.wrap-grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
}
.wrap-flex {
  display: flex;
  flex-wrap: wrap;
  row-gap: 1.5rem;
  margin: 0 -0.75rem;
}
.wrap-flex > * {
  padding: 0 0.75rem;
  flex: 1 1 33.333%;
  min-width: 10rem;
}
.success-bg {
  background-color: var(--success) !important;
}
.danger-bg {
  background-color: var(--error) !important;
}
/*
      Fonts
*/
/*
      Colors
*/
:root {
  --background-color-true: #f4f4f5;
  --background-color: #fff;
  --border-color: #dfe1e5;
  --surface-color: #fff;
  --scrollbar-color: rgba(0, 0, 0, 0.2);
  --input-background-color: #fff;
  --input-border-color: #dfe1e5;
  --primary-color: #3390ec;
  --light-primary-color: rgba(51, 144, 236, 0.08);
  --dark-primary-color: #157ce1;
  --primary-text-color: #1C1B1F;
  --secondary-color: #c4c9cc;
  --secondary-text-color: #707579;
  --light-secondary-text-color: rgba(112, 117, 121, 0.08);
  --danger-color: #df3f40;
  --dark-danger-color: #bf191a;
  --success-color: #0ac630;
  --dark-success-color: #02a823;
  --progress-color: #ffcd6a;
  --dark-progress-color: #ffa85c;
  --light-danger-color: rgba(223, 63, 64, 0.08);
  --avatar-online-color: #0ac630;
  --avatar-color-top: var(--peer-avatar-blue-top);
  --avatar-color-bottom: var(--peer-avatar-blue-bottom);
  --chatlist-status-color: var(--avatar-online-color);
  --chatlist-pinned-color: #a2abb2;
  --badge-text-color: #fff;
  --link-color: #00488f;
  --ripple-color: rgba(0, 0, 0, 0.08);
  --poll-circle-color: var(--border-color);
  --message-background-color: var(--surface-color);
  --message-checkbox-color: #61c642;
  --message-checkbox-border-color: #fff;
  --message-secondary-color: var(--secondary-color);
  --message-out-background-color: #eeffde;
  --light-message-out-background-color: rgba(238, 255, 222, 0.08);
  --dark-message-out-background-color: #d9ffb5;
  --message-out-link-color: var(--link-color);
  --message-out-primary-color: #4fae4e;
  --message-out-status-color: var(--message-out-primary-color);
  --message-out-audio-play-button-color: #fff;
  --table-striped-color: #f2f2f2;
  --widget-item-color: rgba(112, 117, 121, 0.08);
  --range-primary-color: #3390ec;
  --range-track-color: #dfe1e5;
  --range-handle-color-hover: #157ce1;
  --primary-icon-color: #707579;
  --dark-icon-color: #000;
  --modal-overlay-color: rgba(0, 0, 0, 0.5);
}
/*
      Transitions
*/
:root {
  --transition-primary: 0.2s ease;
  --transition-slide: 0.4s cubic-bezier(0, 0, 0.18, 1.19);
  --transition-checkbox: 0.25s ease;
  --transition-window-time: 0.3s;
  --transition-modal-time: 0.8s;
  --transition-window-easing: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-window: var(--transition-window-time) var(--transition-window-easing);
  --transition-modal: var(--transition-modal-time) var(--transition-window-easing);
  --transition-standard-easing: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-standard-in-time: 0.3s;
  --transition-standard-out-time: 0.25s;
  --transition-standard-in: var(--transition-standard-in-time) var(--transition-standard-easing);
  --transition-standard-out: var(--transition-standard-out-time) var(--transition-standard-easing);
}
/*
      Shadows
*/
:root {
  --dropdown-shadow: 0px 2px 8px 1px rgba(0, 0, 0, 0.24);
  --small-dropdown-shadow: 0px 2px 8px 1px rgba(0, 0, 0, 0.12);
}
/*
      Svg
*/
.multiple-blocks {
  display: flex;
  flex-wrap: wrap;
}
.multiple-blocks-y8x8 {
  margin: -4px;
}
.multiple-blocks-y8x8 > * {
  padding: 4px;
}
.multiple-blocks-y16x16 {
  margin: -8px;
}
.multiple-blocks-y16x16 > * {
  padding: 8px;
}
.multiple-blocks-y30x30 {
  margin: -15px;
}
.multiple-blocks-y30x30 > * {
  padding: 15px;
}
.multiple-blocks-y32x24 {
  margin: -16px -12px;
}
.multiple-blocks-y32x24 > * {
  padding: 16px 12px;
}
.multiple-blocks-y40x24 {
  margin: -20px -12px;
}
.multiple-blocks-y40x24 > * {
  padding: 20px 12px;
}
.multiple-blocks.count-blocks4 > * {
  width: 25%;
}
.multiple-blocks.count-blocks3 > * {
  width: 33.33%;
}
.multiple-blocks.count-blocks2 > * {
  width: 50%;
}
@media (max-width: 1199px) {
  .multiple-blocks.notebook-blocks2 > * {
    width: 50%;
  }
}
@media (max-width: 991px) {
  .multiple-blocks.tablet-y16x16 {
    margin: -8px;
  }
  .multiple-blocks.tablet-y16x16 > * {
    padding: 8px;
  }
  .multiple-blocks.tablet-y32x16 {
    margin: -16px -8px;
  }
  .multiple-blocks.tablet-y32x16 > * {
    padding: 16px 8px;
  }
  .multiple-blocks.tablet-y40x16 {
    margin: -20px -8px;
  }
  .multiple-blocks.tablet-y40x16 > * {
    padding: 20px 8px;
  }
  .multiple-blocks.tablet-blocks4 > * {
    width: 25%;
  }
  .multiple-blocks.tablet-blocks3 > * {
    width: 33.33%;
  }
  .multiple-blocks.tablet-blocks2 > * {
    width: 50%;
  }
  .multiple-blocks.tablet-blocks1 > * {
    width: 100%;
  }
}
@media (max-width: 500px) {
  .multiple-blocks.smobile-blocks2 > * {
    width: 50%;
  }
  .multiple-blocks.smobile-blocks1 > * {
    width: 100%;
  }
}
.flex-blocks-r-8 > *:not(:last-child) {
  margin-right: 8px;
}
.flex-blocks-r-24 > *:not(:last-child) {
  margin-right: 24px;
}
.flex-blocks-b-16 > *:not(:last-child) {
  margin-bottom: 16px;
}
.block-grow {
  flex-grow: 2;
}
.logo {
  width: 24px;
  height: 24px;
  background: url("/images/logo.gif") no-repeat center;
  background-size: contain;
}
.icon-mask {
  display: inline-block;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  flex-shrink: 0;
  transition: var(--transition-primary);
  background-color: var(--On-surface);
}
.icon-mask.loading {
  width: 24px;
  height: 24px;
  -webkit-mask-image: url("/images/loading.svg");
          mask-image: url("/images/loading.svg");
}
.icon-mask.widgets {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/widgets.svg");
          mask-image: url("/images/icons/widgets.svg");
}
.icon-mask.options {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/cogs.svg");
          mask-image: url("/images/icons/cogs.svg");
}
.icon-mask.bind {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/attachment.svg");
          mask-image: url("/images/icons/attachment.svg");
}
.icon-mask.fullscreen {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/fullscreen.svg");
          mask-image: url("/images/icons/fullscreen.svg");
}
.icon-mask.connect {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/connect.svg");
          mask-image: url("/images/icons/connect.svg");
}
.icon-mask.delete {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/delete.svg");
          mask-image: url("/images/icons/delete.svg");
}
.icon-mask.plus {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/plus.svg");
          mask-image: url("/images/icons/plus.svg");
}
.icon-mask.minus {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/minus.svg");
          mask-image: url("/images/icons/minus.svg");
}
.icon-mask.plus-box {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/plus-box.svg");
          mask-image: url("/images/icons/plus-box.svg");
}
.icon-mask.database-edit {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/database-edit.svg");
          mask-image: url("/images/icons/database-edit.svg");
}
.icon-mask.info {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/information.svg");
          mask-image: url("/images/icons/information.svg");
}
.icon-mask.check-outline {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/check-circle-outline.svg");
          mask-image: url("/images/icons/check-circle-outline.svg");
}
.icon-mask.check {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/check-circle.svg");
          mask-image: url("/images/icons/check-circle.svg");
}
.icon-mask.layers {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/layers.svg");
          mask-image: url("/images/icons/layers.svg");
}
.icon-mask.folder {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/folder.svg");
          mask-image: url("/images/icons/folder.svg");
}
.icon-mask.filter {
  width: 24px;
  height: 24px;
  -webkit-mask-image: url("/images/icons/filter.svg");
          mask-image: url("/images/icons/filter.svg");
}
.icon-mask.screenshot {
  width: 24px;
  height: 24px;
  -webkit-mask-image: url("/images/icons/screenshot.svg");
          mask-image: url("/images/icons/screenshot.svg");
}
.icon-mask.edit,
.icon-mask.update {
  width: 24px;
  height: 24px;
  -webkit-mask-image: url("/images/icons/edit.svg");
          mask-image: url("/images/icons/edit.svg");
}
.icon-mask.copy {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/copy.svg");
          mask-image: url("/images/icons/copy.svg");
}
.icon-mask.save {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/save.svg");
          mask-image: url("/images/icons/save.svg");
}
.icon-mask.cancel {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/close.svg");
          mask-image: url("/images/close.svg");
}
.icon-mask.apply {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/check.svg");
          mask-image: url("/images/icons/check.svg");
}
.icon-mask.refresh {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/refresh.svg");
          mask-image: url("/images/icons/refresh.svg");
}
.icon-mask.download {
  width: 24px;
  height: 24px;
  -webkit-mask-image: url("/images/icons/download.svg");
          mask-image: url("/images/icons/download.svg");
}
.icon-mask.timer {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/timer.svg");
          mask-image: url("/images/icons/timer.svg");
}
.icon-mask.align-horizontal {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/align-horizontal-center.svg");
          mask-image: url("/images/icons/align-horizontal-center.svg");
}
.icon-mask.align-vertical {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/align-vertical-center.svg");
          mask-image: url("/images/icons/align-vertical-center.svg");
}
.icon-mask.code {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/code.svg");
          mask-image: url("/images/icons/code.svg");
}
.icon-mask.restart {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/restart.svg");
          mask-image: url("/images/icons/restart.svg");
}
.icon-mask.view {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/eye.svg");
          mask-image: url("/images/icons/eye.svg");
}
.icon-mask.menu {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/menu.svg");
          mask-image: url("/images/icons/menu.svg");
}
.icon-mask.list {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/list.svg");
          mask-image: url("/images/icons/list.svg");
}
.icon-mask.help {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/help.svg");
          mask-image: url("/images/icons/help.svg");
}
.icon-mask.desc {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/desc.svg");
          mask-image: url("/images/icons/desc.svg");
}
.icon-mask.table-chart {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/table-chart.svg");
          mask-image: url("/images/icons/table-chart.svg");
}
.icon-mask.upgrade {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/upgrade.svg");
          mask-image: url("/images/icons/upgrade.svg");
}
.icon-mask.paste {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/paste.svg");
          mask-image: url("/images/icons/paste.svg");
}
.icon-mask.preview {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/preview.svg");
          mask-image: url("/images/icons/preview.svg");
}
.icon-mask.construction {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/construction.svg");
          mask-image: url("/images/icons/construction.svg");
}
.icon-mask.edit-note {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/edit-note.svg");
          mask-image: url("/images/icons/edit-note.svg");
}
.icon-mask.web {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/web.svg");
          mask-image: url("/images/icons/web.svg");
  background-color: var(--Web);
}
.icon-mask.android {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/android.svg");
          mask-image: url("/images/icons/android.svg");
  background-color: var(--Android);
}
.icon-mask.iOS {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/apple.svg");
          mask-image: url("/images/icons/apple.svg");
  background-color: var(--Apple);
}
.icon-mask.api {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/api.svg");
          mask-image: url("/images/icons/api.svg");
  background-color: var(--Api);
}
.icon-mask.bar-chart {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/bar-chart.svg");
          mask-image: url("/images/icons/bar-chart.svg");
}
.icon-mask.dashboard {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/dashboard.svg");
          mask-image: url("/images/icons/dashboard.svg");
}
.icon-mask.category {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/category.svg");
          mask-image: url("/images/icons/category.svg");
}
.icon-mask.users {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/users.svg");
          mask-image: url("/images/icons/users.svg");
}
.icon-mask.script-text {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/script-text.svg");
          mask-image: url("/images/icons/script-text.svg");
}
.icon-mask.projects {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/projects.svg");
          mask-image: url("/images/icons/projects.svg");
}
.icon-mask.nodes {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/nodes.svg");
          mask-image: url("/images/icons/nodes.svg");
}
.icon-mask.account {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/account.svg");
          mask-image: url("/images/icons/account.svg");
}
.icon-mask.upload {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/upload.svg");
          mask-image: url("/images/icons/upload.svg");
}
.icon-mask.settings {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/settings.svg");
          mask-image: url("/images/icons/settings.svg");
}
.show-all > .icon.eye {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/eye.svg");
          mask-image: url("/images/icons/eye.svg");
}
.hide-all > .icon.eye {
  width: 20px;
  height: 20px;
  -webkit-mask-image: url("/images/icons/eye-off.svg");
          mask-image: url("/images/icons/eye-off.svg");
}
.glyphicon.glyphicon-remove,
.glyphicon.glyphicon-plus {
  display: inline-block;
  -webkit-mask-size: contain;
          mask-size: contain;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  flex-shrink: 0;
  transition: var(--transition-primary);
  width: 20px;
  height: 20px;
}
.glyphicon.glyphicon-remove {
  -webkit-mask-image: url("/images/icons/delete.svg");
          mask-image: url("/images/icons/delete.svg");
}
.glyphicon.glyphicon-plus {
  -webkit-mask-image: url("/images/icons/plus.svg");
          mask-image: url("/images/icons/plus.svg");
}
body {
  --Background: #fbf8ff;
  --On-background: #1b1b21;
  --Surface: #fbf8ff;
  --On-surface: #1b1b21;
  --On-surface-variant: #46464f;
  --Primary: #565992;
  --On-primary: #ffffff;
  --Secondary: #5c5d72;
  --On-secondary: #ffffff;
  --Surface-container: #f0ecf4;
  --Surface-container-low: #f5f2fa;
  --Surface-container-high: #eae7ef;
  --On-surface-container: #1b1b21;
  --Primary-container: #e1e0ff;
  --On-primary-container: #12144b;
  --Secondary-container: #e2e0f9;
  --On-secondary-container: #191a2c;
  --Tertiary-container: #ffd8ed;
  --On-tertiary-container: #2e1125;
  --Error: #ba1a1a;
  --On-error: #ffffff;
  --Error-container: #904a43;
  --On-error-container: #ffffff;
  --Success: #1aba1a;
  --Success-container: #3f6836;
  --On-success-container: #ffffff;
  --Info: #1a1aba;
  --Info-container: #565992;
  --On-info-container: #ffffff;
  --Alert: #ffcc00;
  --On-alert: #000000;
  --Tertiary-fixed: #d4bdef;
  --On-tertiary-fixed: #23133a;
  --Outline: #777680;
  --On-success: #ffffff;
  --Inverse-primary: #bfc1ff;
  --Surface-bright: #fbf8ff;
  --Agro-primary: var(--Surface-container);
  --On-agro-primary: var(--On-surface-container);
  --sub-menu-text: var(--On-surface-container);
  --Agro-plus-btn: var(--Tertiary);
  --On-agro-plus-btn: var(--On-tertiary-container);
  --sub-menu: #e2e6e1;
  --custom-filter: #252525;
  --custom-filter-label: #8f8f8f;
  --btn-color: #ffffff;
  --btn-green: #56c131;
  --btn-blue: #3761ea;
  --Agro-border: var(--Outline);
  --bs-body-bg: var(--Background);
  --bs-body-color: var(--On-background);
  --bs-border-color: var(--Outline);
  --bs-card-border-color: var(--Outline);
  --bs-tertiary-bg: var(--Surface-container);
  --bs-secondary-rgb: 208, 232, 231;
  --bs-success-rgb: 26, 186, 26;
  --bs-danger-rgb: 186, 26, 26;
  --bs-light-rgb: 251, 248, 255;
  --background-color: var(--Surface-bright);
  --border-color: var(--Outline);
}
body .table {
  --bs-table-striped-bg: var(--Surface-container);
}
body .dp__theme_light {
  --dp-background-color: var(--Background);
  --dp-text-color: var(--On-background);
  --dp-hover-color: var(--Secondary-container);
  --dp-hover-text-color: var(--On-secondary-container);
  --dp-hover-icon-color: var(--On-secondary-container);
  --dp-primary-color: var(--Primary);
  --dp-primary-disabled-color: #6bacea;
  --dp-primary-text-color: var(--On-primary);
  --dp-secondary-color: var(--Inverse-primary);
  --dp-border-color: var(--Outline);
  --dp-menu-border-color: var(--Outline);
  --dp-border-color-hover: #a8acab;
  --dp-disabled-color: var(--Inverse-primary);
  --dp-scroll-bar-background: var(--Surface-container-high);
  --dp-scroll-bar-color: var(--On-surface-container);
  --dp-success-color: var(--Success);
  --dp-success-color-disabled: #a3d9b1;
  --dp-icon-color: var(--On-surface-variant);
  --dp-danger-color: var(--Error);
  --dp-marker-color: var(--Error);
  --dp-tooltip-color: #fafafa;
  --dp-disabled-color-text: #8e8e8e;
  --dp-highlight-color: rgb(25 118 21%);
  --dp-range-between-dates-background-color: var(--dp-hover-color, #f3f3f3);
  --dp-range-between-dates-text-color: var(--dp-hover-text-color, #212121);
  --dp-range-between-border-color: var(--dp-hover-color, #f3f3f3);
}
body.dark-theme {
  --Background: #131318;
  --On-background: #e4e1e9;
  --Surface: #131318;
  --On-surface: #e4e1e9;
  --On-surface-variant: #c7c5d0;
  --Primary: #bfc1ff;
  --On-primary: #282b60;
  --Secondary: #c5c4dd;
  --On-secondary: #2e2f42;
  --Surface-container: #1f1f25;
  --Surface-container-low: #1b1b21;
  --Surface-container-high: #2a292f;
  --On-surface-container: #e4e1e9;
  --Primary-container: #3e4178;
  --On-primary-container: #e1e0ff;
  --Secondary-container: #454559;
  --On-secondary-container: #e2e0f9;
  --Tertiary-container: #5f3c52;
  --On-tertiary-container: #ffd8ed;
  --Outline: #918f9a;
  --Inverse-primary: #565992;
  --Surface-bright: #39383f;
  --Error-container: #ffb4ab;
  --On-error-container: #561e19;
  --Success-container: #a4d396;
  --On-success-container: #10380c;
  --Info-container: #bfc1ff;
  --On-info-container: #282b60;
  --bs-secondary-rgb: 44, 65, 65;
}
.success-bg {
  background-color: var(--Success) !important;
}
.danger-bg {
  background-color: var(--Error) !important;
}
.bootstrap-timepicker-widget.dropdown-menu:after {
  border-bottom-color: var(--Surface-container-low);
}
.bootstrap-timepicker-widget table td a {
  color: var(--On-surface-container);
}
.bootstrap-timepicker-widget table td a:hover {
  background-color: var(--Secondary-container);
  color: var(--On-secondary-container);
  border-color: var(--Outline);
}
.page-header,
.general-section {
  display: flex;
  gap: 0.75rem;
  width: 100%;
  margin: 0 auto;
}
@media (min-width: 62em) and (max-width: 74.9375em) {
  .page-header,
  .general-section {
    flex-direction: column;
  }
}
.page-title,
.page-navbar {
  padding: 1rem;
}
.page-title,
.page-navbar,
.general-section__aside,
.general-section__container {
  border-radius: 1rem;
  background: var(--Surface-container);
  color: var(--On-surface-container);
}
.page-title,
.general-section__aside {
  flex-shrink: 0;
}
@media (min-width: 75em) {
  .page-title,
  .general-section__aside {
    width: 20rem;
  }
}
@media (min-width: 120.0625em) {
  .page-title,
  .general-section__aside {
    width: 30rem;
  }
}
.page-header {
  margin-bottom: 0.75rem;
}
.page-title {
  display: grid;
  align-items: center;
  justify-content: center;
}
.page-title h1 {
  font-size: 1.5rem;
  margin: 0;
}
@media (min-width: 62em) and (max-width: 74.9375em) {
  .page-title {
    order: 1;
  }
}
@media (max-width: 61.9375em) {
  .page-title {
    flex-grow: 1;
  }
}
.page-navbar {
  box-shadow: none;
}
.page-navbar .dropdown-menu[data-bs-popper] {
  left: auto;
  right: 0;
}
@media (min-width: 62em) {
  .page-navbar {
    flex-grow: 1;
  }
}
.general-section {
  height: 100%;
  min-height: 0;
}
.general-section .nav-tabs {
  --bs-nav-tabs-link-active-bg: var(--Primary-container);
  --bs-nav-tabs-link-active-border-color: var(--bs-border-color) var(--bs-border-color) var(--Primary-container);
  --bs-nav-tabs-link-active-color: var(--On-primary-container);
}
.general-section .list-group {
  --bs-list-group-bg: var(--Surface-container);
  --bs-list-group-color: var(--On-surface-container);
  --bs-list-group-action-hover-bg: var(--Primary-container);
  --bs-list-group-action-hover-color: var(--On-primary-container);
  --bs-list-group-active-bg: var(--Primary);
  --bs-list-group-active-border-color: var(--Primary);
  --bs-list-group-active-color: var(--On-primary);
}
@media (max-width: 74.9375em) {
  .general-section {
    flex-direction: column;
  }
}
.general-section__aside,
.general-section__container {
  overflow: hidden;
}
.general-section__aside > .overflow-auto,
.general-section__container > .overflow-auto {
  height: 100%;
  display: flex;
  flex-direction: column;
  scrollbar-color: var(--Secondary) var(--Secondary-container);
}
.general-section__container {
  flex-grow: 1;
}
.general-section__aside-actions,
.general-section__aside-items,
.general-section__container-tabs,
.general-section__container-tab {
  padding-left: 1rem;
  padding-right: 1rem;
  padding-bottom: 1rem;
}
.general-section__aside-actions,
.general-section__container-tabs {
  padding-top: 1rem;
  position: sticky;
  top: 0;
  background-color: var(--Surface-container);
  z-index: 10;
}
.general-section__aside-title,
.general-section__aside-footer {
  padding: 1rem;
  border-radius: 1rem;
  background: var(--Primary-container);
  color: var(--On-primary-container);
  font-size: 1rem;
}
.general-section__aside-footer {
  margin-top: auto;
}
.general-section__aside-actions {
  display: flex;
  gap: 0.25rem;
  align-items: center;
}
.general-section__container-tab {
  padding-top: 1rem;
}
.general-section__container-tabs + .general-section__container-tab {
  padding-top: 0;
}
html,
body {
  height: 100%;
  min-height: 100%;
}
.fixed-top {
  z-index: 1000;
}
.hidden,
.hide {
  display: none !important;
}
.w-0 {
  width: 0 !important;
}
.svg.load-file {
  -webkit-mask-image: url("/images/report/load_file.svg");
          mask-image: url("/images/report/load_file.svg");
  width: 12px;
  height: 15px;
}
.image-loader,
.image-loader-ajax,
.image-loader-inline {
  background: url('/images/spinner.gif') no-repeat center;
  min-width: 80px;
  min-height: 80px;
  background-size: 80px;
}
.image-loader.little,
.image-loader-ajax.little,
.image-loader-inline.little,
.image-loader.less,
.image-loader-ajax.less,
.image-loader-inline.less {
  background-image: url("/images/spinner.gif");
}
.image-loader.little,
.image-loader-ajax.little,
.image-loader-inline.little {
  min-width: 24px;
  min-height: 24px;
  background-size: 24px;
}
.image-loader.less,
.image-loader-ajax.less,
.image-loader-inline.less {
  min-width: 18px;
  min-height: 18px;
  background-size: 18px;
}
.image-loader.middle,
.image-loader-ajax.middle,
.image-loader-inline.middle {
  min-width: 50px;
  min-height: 50px;
  background-size: 50px;
}
.report-filter {
  padding: 16px;
  background: var(--primary-100);
  border: 1px solid var(--primary-300);
  border-radius: 4px;
  margin: 20px 0;
}
@media (max-width: 767px) {
  .report-filter {
    padding: 12px;
  }
}
.report-filter .report-filter-item-wrap {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -12px;
  row-gap: 24px;
}
.report-filter .report-filter-item {
  padding: 0 12px;
  width: 20%;
  position: relative;
}
@media (max-width: 1400px) and (min-width: 992px) {
  .report-filter .report-filter-item {
    width: 45%;
  }
}
@media (max-width: 991px) {
  .report-filter .report-filter-item {
    width: 90%;
  }
}
@media (max-width: 767px) {
  .report-filter .report-filter-item {
    width: 98%;
  }
}
.report-filter .report-filter-item.invisible-block {
  display: none;
}
.report-filter .report-filter-item .remove-btn {
  --icon: url("data:image/svg+xml,%3Csvg width='14' height='15' viewBox='0 0 14 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 0.25C3.11719 0.25 0 3.39453 0 7.25C0 11.1328 3.11719 14.25 7 14.25C10.8555 14.25 14 11.1328 14 7.25C14 3.39453 10.8555 0.25 7 0.25ZM9.89844 9.68359C10.1172 9.95703 10.0898 10.3672 9.81641 10.6133C9.70703 10.7227 9.54297 10.75 9.40625 10.75C9.21484 10.75 9.02344 10.6953 8.88672 10.5312L7 8.28906L5.08594 10.5312C4.94922 10.6953 4.75781 10.75 4.56641 10.75C4.42969 10.75 4.29297 10.7227 4.15625 10.6133C3.88281 10.3672 3.85547 9.95703 4.07422 9.68359L6.125 7.25L4.07422 4.84375C3.85547 4.57031 3.88281 4.16016 4.15625 3.91406C4.42969 3.69531 4.83984 3.72266 5.08594 3.99609L7 6.23828L8.88672 3.99609C9.13281 3.72266 9.54297 3.69531 9.81641 3.91406C10.0898 4.16016 10.1172 4.57031 9.89844 4.84375L7.84766 7.25L9.89844 9.68359Z' fill='%23334155'/%3E%3C/svg%3E%0A");
  --icon-hover: url("data:image/svg+xml,%3Csvg width='14' height='15' viewBox='0 0 14 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 0.25C3.11719 0.25 0 3.39453 0 7.25C0 11.1328 3.11719 14.25 7 14.25C10.8555 14.25 14 11.1328 14 7.25C14 3.39453 10.8555 0.25 7 0.25ZM9.89844 9.68359C10.1172 9.95703 10.0898 10.3672 9.81641 10.6133C9.70703 10.7227 9.54297 10.75 9.40625 10.75C9.21484 10.75 9.02344 10.6953 8.88672 10.5312L7 8.28906L5.08594 10.5312C4.94922 10.6953 4.75781 10.75 4.56641 10.75C4.42969 10.75 4.29297 10.7227 4.15625 10.6133C3.88281 10.3672 3.85547 9.95703 4.07422 9.68359L6.125 7.25L4.07422 4.84375C3.85547 4.57031 3.88281 4.16016 4.15625 3.91406C4.42969 3.69531 4.83984 3.72266 5.08594 3.99609L7 6.23828L8.88672 3.99609C9.13281 3.72266 9.54297 3.69531 9.81641 3.91406C10.0898 4.16016 10.1172 4.57031 9.89844 4.84375L7.84766 7.25L9.89844 9.68359Z' fill='%23EF4444'/%3E%3C/svg%3E%0A");
  position: absolute;
  right: 0;
  top: 20px;
  background-repeat: no-repeat;
  background-position: center;
  font-size: 0;
  width: 14px;
  height: 15px;
  background-image: var(--icon);
  transition: 0.2s;
  cursor: pointer;
}
.report-filter .report-filter-item .remove-btn:hover {
  background-image: var(--icon-hover);
}
.report-filter .report-filter-item select.form-control {
  height: 42px;
}
.report-filter .report-filter-item.button-block {
  width: 100%;
}
.report-filter .report-filter-item.button-block .btn-success {
  width: 40px;
  height: 40px;
  padding: 0;
  min-width: unset;
  min-height: unset;
  border: 1px solid #171940;
  border-radius: 5px;
  background: #ffffff;
  outline: 0;
  transition: 0.2s;
}
.report-filter .report-filter-item.button-block .btn-success svg {
  transition: 0.2s;
}
.report-filter .report-filter-item.button-block .btn-success:hover {
  background: #171940;
}
.report-filter .report-filter-item.button-block .btn-success:hover svg * {
  fill: #ffffff;
}
.report-filter .report-additional-filter {
  display: none;
  width: 100%;
}
.report-filter .report-additional-filter.show-filter-block {
  display: block;
}
.report-filter .report-additional-filter .report-additional-filter-inside {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 15px;
}
.report-filter .show-filter,
.report-filter .show-additional-filter {
  height: 40px;
  align-self: flex-end;
  background: transparent;
  border: 2px solid var(--primary);
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 16px;
  margin-bottom: 2px;
  transition: 0.2s;
  cursor: pointer;
}
.report-filter .show-filter:hover,
.report-filter .show-additional-filter:hover {
  border-color: var(--primary-600);
  background: var(--primary-600);
  box-shadow: var(--shadow-hover);
}
.report-filter .show-filter:active,
.report-filter .show-additional-filter:active {
  border-color: var(--primary-800);
  background: var(--primary-800);
  box-shadow: var(--shadow-active);
  animation: shadowActive 0.2s;
}
.report-filter .show-filter {
  width: 40px;
}
@media (max-width: 1400px) {
  .report-filter .show-filter {
    margin-left: 10px;
  }
}
.report-filter .show-filter:hover:before,
.report-filter .show-filter:active:before,
.report-filter .show-filter:hover:after,
.report-filter .show-filter:active:after {
  background: var(--white);
}
.report-filter .show-filter:before,
.report-filter .show-filter:after {
  content: '';
  position: absolute;
  width: 14px;
  height: 2px;
  background: var(--primary);
  display: block;
  transition: 0.2s;
}
.report-filter .show-filter:after {
  width: 2px;
  height: 14px;
}
.report-filter .show-additional-filter {
  padding-right: 20px;
  padding-left: 16px;
  font-family: var(--font-bold);
  position: relative;
}
.report-filter .show-additional-filter span {
  font-size: 0.875rem;
  line-height: 1.14285714;
  color: var(--primary);
  padding-left: 4px;
  transition: 0.2s;
}
.report-filter .show-additional-filter .icon-mask {
  background-color: var(--primary);
}
.report-filter .show-additional-filter:hover .icon-mask,
.report-filter .show-additional-filter:active .icon-mask {
  background-color: var(--white);
}
.report-filter .show-additional-filter:hover span,
.report-filter .show-additional-filter:active span {
  color: var(--white);
}
.report-filter .show-additional-filter.active-btn {
  border-style: dashed;
}
.table-footer {
  font-family: var(--font-bold);
}
.action-link {
  width: 0;
}
.action-link > span {
  display: flex;
}
.cursor-pointer {
  cursor: pointer;
}
.temporary-alert {
  position: fixed;
  bottom: 20px;
  left: 50%;
  right: 20px;
  z-index: 2000;
}
.form-label {
  font-size: 0.875rem;
  display: block;
  margin-bottom: 0.25rem;
}
.form-label > .form-control,
.form-label > .dp__main {
  margin-top: 4px;
}
.preview-img {
  width: 80px;
  height: 80px;
}
td .preview-img {
  width: 40px;
  height: 40px;
  padding: 0;
}
.vgt-responsive {
  overflow-x: initial !important;
}
.show-message-circle {
  display: inline-flex;
  background-color: #F62B37;
  position: relative;
  border-radius: 40px;
  height: 20px;
  line-height: 1.25;
  padding: 3px 5px;
  z-index: 1;
  top: -8px;
  min-width: 20px;
  margin-left: 1px;
  font-size: 12px;
  color: #FFF;
  font-weight: normal;
  align-items: center;
  justify-content: center;
}
#tooltip {
  word-break: break-word;
  border-radius: 4px;
  position: absolute;
  z-index: 2000;
  padding: 8px 16px;
  width: auto;
  max-width: 280px;
  transition: var(--transition-primary);
  background: var(--Background);
  box-shadow: var(--small-dropdown-shadow);
}
.v-collapse {
  transition: height 300ms cubic-bezier(0.33, 1, 0.68, 1);
  display: flex;
  flex-wrap: wrap;
  row-gap: 0.5rem;
}
.collapse-block {
  margin: 0.5rem 0;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.collapse-block > .collapse-button {
  margin: 0;
}
.collapse-button {
  display: flex;
  gap: 0.75rem;
  padding: 0.625rem 1.25rem;
  font-weight: 300;
  align-items: center;
  cursor: pointer;
  background: var(--Agro-primary);
  color: var(--On-agro-primary);
  border-radius: 12px;
  font-size: 0.875rem;
  line-height: 1.143;
  margin: 8px 0;
  border: none;
  width: 100%;
}
.collapse-button:after {
  content: "";
  border: 0.125rem solid var(--Outline);
  border-left-width: 0.25rem;
  border-bottom-width: 0.25rem;
  border-left-color: transparent;
  border-top-color: transparent;
  display: inline-flex;
  transform: rotate(45deg);
  margin-top: -0.25rem;
  margin-left: auto;
  transition: 0.2s;
}
.collapse-button.active:after {
  border-left-color: var(--Outline);
  border-top-color: var(--Outline);
  border-right-color: transparent;
  border-bottom-color: transparent;
  margin-top: 0.25rem;
}
.collapse-button.error {
  background: var(--Error, #FDD3D3);
  color: white;
}
.collapse-button.error:before {
  content: "";
  display: inline-flex;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
  background-size: 1rem;
  width: 1rem;
  height: 1rem;
}
.sub-menu .table-refresh {
  gap: 0.25rem;
}
.sub-menu .table-refresh .timer-refresh {
  position: relative;
  left: initial;
}
.contrast-hover {
  transition: 0.2s;
}
.contrast-hover:hover {
  filter: contrast(0.8);
}
.list-group-item .icon-mask {
  background-color: var(--bs-list-group-color);
}
.list-group-item .icon-mask.drag-handle {
  margin-left: -0.5rem;
  margin-right: 0.5rem;
}
.list-group-item:hover .icon-mask,
.list-group-item:focus .icon-mask {
  background-color: var(--bs-list-group-action-hover-color);
}
.list-group-item.active .icon-mask {
  background-color: var(--bs-list-group-active-color);
}
:root {
  --Primary: #86468B;
  --Primary-container: #FFD5FE;
  --Secondary: #6C586B;
  --Secondary-container: #F5DBF1;
  --Tertiary: #825249;
  --Tertiary-container: #FFDAD2;
  --Surface: #FCFCFC;
  --Surface-variant: #E7E0EC;
  --Background: #FCFCFC;
  --Error: #BA1B1B;
  --Error-container: #FFDAD4;
  --On-primary: #FFFFFF;
  --On-primary-container: #36003F;
  --On-secondary: #FFFFFF;
  --On-secondary-container: #251626;
  --On-tertiary: #FFFFFF;
  --On-tertiary-container: #33110B;
  --On-surface: #1E1B1D;
  --On-surface-variant: #4D444C;
  --On-error: #FFFFFF;
  --On-error-container: #410001;
  --On-background: #1E1B1D;
  --Outline: #7F747D;
  --Shadow: #000000;
  --Surface-tint: #6750A4;
  --Inverse-surface: #313033;
  --Inverse-on-surface: #F4EFF4;
  --Inverse-primary: #D0BCFF;
  --On-primary-08: rgba(255, 255, 255, 0.08);
  --On-primary-12: rgba(255, 255, 255, 0.12);
  --Primary-08: rgba(134, 70, 139, 0.08);
  --Primary-12: rgba(134, 70, 139, 0.12);
  --On-surface-08: rgba(30, 27, 29, 0.08);
  --On-surface-12: rgba(30, 27, 29, 0.12);
  --On-surface-variant-08: rgba(77, 68, 76, 0.08);
  --On-surface-variant-12: rgba(77, 68, 76, 0.12);
  --Surface2: linear-gradient(0deg, rgba(103, 80, 164, 0.08), rgba(103, 80, 164, 0.08)), #FFFBFE;
  --Android: #00de7a;
  --Apple: #005ecc;
  --Web: #2196f3;
  --Api: #3e454f;
}
.elevated-card {
  background: var(--Surface);
  border-radius: 12px;
  box-shadow: var(--elevation-2);
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3), 0px 2px 6px 2px rgba(0, 0, 0, 0.15);
}
.filled-card {
  background: var(--Surface-variant);
  border-radius: 12px;
}
.outlined-card {
  background: var(--Surface);
  border: 1px solid var(--Outline);
  border-radius: 12px;
}
.elevation-1 {
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3), 0px 1px 3px 1px rgba(0, 0, 0, 0.15);
}
.elevation-2 {
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3), 0px 2px 6px 2px rgba(0, 0, 0, 0.15);
}
.elevation-3 {
  box-shadow: 0px 4px 8px 3px rgba(0, 0, 0, 0.15), 0px 1px 3px rgba(0, 0, 0, 0.3);
}
.elevation-4 {
  box-shadow: 0px 6px 10px 4px rgba(0, 0, 0, 0.15), 0px 2px 3px rgba(0, 0, 0, 0.3);
}
.elevation-5 {
  box-shadow: 0px 8px 12px 6px rgba(0, 0, 0, 0.15), 0px 4px 4px rgba(0, 0, 0, 0.3);
}
.md-button,
.icon-button,
.fab,
.chips-btn,
a.md-button,
a.icon-button,
a.fab,
a.chips-btn,
button.md-button,
button.icon-button,
button.fab,
button.chips-btn,
div.md-button,
div.icon-button,
div.fab,
div.chips-btn,
.md-button[type="button"],
.icon-button[type="button"],
.fab[type="button"],
.chips-btn[type="button"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  text-decoration: none;
  cursor: pointer;
  background: none;
}
.md-button:after,
.icon-button:after,
.fab:after,
.chips-btn:after,
a.md-button:after,
a.icon-button:after,
a.fab:after,
a.chips-btn:after,
button.md-button:after,
button.icon-button:after,
button.fab:after,
button.chips-btn:after,
div.md-button:after,
div.icon-button:after,
div.fab:after,
div.chips-btn:after,
.md-button[type="button"]:after,
.icon-button[type="button"]:after,
.fab[type="button"]:after,
.chips-btn[type="button"]:after {
  content: "";
  pointer-events: none;
  position: absolute;
  opacity: 0;
  transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.md-button:hover:after,
.icon-button:hover:after,
.fab:hover:after,
.chips-btn:hover:after,
a.md-button:hover:after,
a.icon-button:hover:after,
a.fab:hover:after,
a.chips-btn:hover:after,
button.md-button:hover:after,
button.icon-button:hover:after,
button.fab:hover:after,
button.chips-btn:hover:after,
div.md-button:hover:after,
div.icon-button:hover:after,
div.fab:hover:after,
div.chips-btn:hover:after,
.md-button[type="button"]:hover:after,
.icon-button[type="button"]:hover:after,
.fab[type="button"]:hover:after,
.chips-btn[type="button"]:hover:after {
  opacity: 0.08;
}
.md-button:focus:after,
.icon-button:focus:after,
.fab:focus:after,
.chips-btn:focus:after,
a.md-button:focus:after,
a.icon-button:focus:after,
a.fab:focus:after,
a.chips-btn:focus:after,
button.md-button:focus:after,
button.icon-button:focus:after,
button.fab:focus:after,
button.chips-btn:focus:after,
div.md-button:focus:after,
div.icon-button:focus:after,
div.fab:focus:after,
div.chips-btn:focus:after,
.md-button[type="button"]:focus:after,
.icon-button[type="button"]:focus:after,
.fab[type="button"]:focus:after,
.chips-btn[type="button"]:focus:after {
  opacity: 0.12;
}
.md-button .icon,
.icon-button .icon,
.fab .icon,
.chips-btn .icon,
a.md-button .icon,
a.icon-button .icon,
a.fab .icon,
a.chips-btn .icon,
button.md-button .icon,
button.icon-button .icon,
button.fab .icon,
button.chips-btn .icon,
div.md-button .icon,
div.icon-button .icon,
div.fab .icon,
div.chips-btn .icon,
.md-button[type="button"] .icon,
.icon-button[type="button"] .icon,
.fab[type="button"] .icon,
.chips-btn[type="button"] .icon {
  width: 18px !important;
  height: 18px !important;
}
.md-button,
a.md-button,
button.md-button,
div.md-button,
.md-button[type="button"] {
  border: 1px solid transparent;
  border-radius: 40px;
  font-size: 14px;
  line-height: 20px;
  padding: 9px 13px;
}
.md-button:after,
a.md-button:after,
button.md-button:after,
div.md-button:after,
.md-button[type="button"]:after {
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
  border-radius: 40px;
}
.md-button.md-button--extended,
a.md-button.md-button--extended,
button.md-button.md-button--extended,
div.md-button.md-button--extended,
.md-button[type="button"].md-button--extended {
  padding: 9px 13px 9px 9px;
}
.md-button.md-button--extended .icon,
a.md-button.md-button--extended .icon,
button.md-button.md-button--extended .icon,
div.md-button.md-button--extended .icon,
.md-button[type="button"].md-button--extended .icon {
  margin-right: 8px;
}
.md-button.md-button--extended.md-button--small,
a.md-button.md-button--extended.md-button--small,
button.md-button.md-button--extended.md-button--small,
div.md-button.md-button--extended.md-button--small,
.md-button[type="button"].md-button--extended.md-button--small {
  padding: 3px 13px 3px 9px;
}
.md-button.md-button--middle,
a.md-button.md-button--middle,
button.md-button.md-button--middle,
div.md-button.md-button--middle,
.md-button[type="button"].md-button--middle {
  padding: 11px 19px;
}
.md-button.md-button--large,
a.md-button.md-button--large,
button.md-button.md-button--large,
div.md-button.md-button--large,
.md-button[type="button"].md-button--large {
  font-size: 16px;
  line-height: 24px;
  padding: 13px 24px;
}
.md-button.md-button--small,
a.md-button.md-button--small,
button.md-button.md-button--small,
div.md-button.md-button--small,
.md-button[type="button"].md-button--small {
  padding: 3px 9px;
}
.icon-button,
a.icon-button,
button.icon-button,
div.icon-button,
.icon-button[type="button"] {
  border: 1px solid transparent;
  border-radius: 50%;
  padding: 5px;
}
.icon-button:after,
a.icon-button:after,
button.icon-button:after,
div.icon-button:after,
.icon-button[type="button"]:after {
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
  border-radius: 50%;
}
.icon-button.icon-button--small,
a.icon-button.icon-button--small,
button.icon-button.icon-button--small,
div.icon-button.icon-button--small,
.icon-button[type="button"].icon-button--small {
  padding: 4px;
}
.icon-button.icon-button--small .icon,
a.icon-button.icon-button--small .icon,
button.icon-button.icon-button--small .icon,
div.icon-button.icon-button--small .icon,
.icon-button[type="button"].icon-button--small .icon {
  width: 16px !important;
  height: 16px !important;
}
.icon-button.icon-button--large,
a.icon-button.icon-button--large,
button.icon-button.icon-button--large,
div.icon-button.icon-button--large,
.icon-button[type="button"].icon-button--large {
  padding: 7px;
}
.icon-button.icon-button--large .icon,
a.icon-button.icon-button--large .icon,
button.icon-button.icon-button--large .icon,
div.icon-button.icon-button--large .icon,
.icon-button[type="button"].icon-button--large .icon {
  width: 24px !important;
  height: 24px !important;
}
.filled-button {
  color: var(--On-primary) !important;
  background-color: var(--Primary) !important;
  border-color: var(--Primary) !important;
}
.filled-button:after {
  background-color: var(--On-primary) !important;
}
.filled-button .icon {
  background-color: var(--On-primary) !important;
}
.standard-button,
.outline-button {
  color: var(--On-surface-variant) !important;
  background-color: transparent !important;
  border-color: transparent !important;
}
.standard-button:after,
.outline-button:after {
  background-color: var(--On-surface-variant) !important;
}
.standard-button .icon,
.outline-button .icon,
.standard-button .glyphicon,
.outline-button .glyphicon {
  background-color: var(--On-surface-variant) !important;
}
.outline-button {
  border-color: var(--Outline) !important;
}
.fab,
a.fab,
button.fab,
div.fab,
.fab[type="button"] {
  border: 1px solid transparent;
  border: none;
  padding: 5px;
}
.fab,
a.fab,
button.fab,
div.fab,
.fab[type="button"],
.fab:after,
a.fab:after,
button.fab:after,
div.fab:after,
.fab[type="button"]:after,
.fab:before,
a.fab:before,
button.fab:before,
div.fab:before,
.fab[type="button"]:before {
  border-radius: 8px;
}
.fab:after,
a.fab:after,
button.fab:after,
div.fab:after,
.fab[type="button"]:after {
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
}
.fab:before,
a.fab:before,
button.fab:before,
div.fab:before,
.fab[type="button"]:before {
  content: "";
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: var(--elevation-1);
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3), 0px 1px 3px 1px rgba(0, 0, 0, 0.15);
}
.fab.fab-small,
a.fab.fab-small,
button.fab.fab-small,
div.fab.fab-small,
.fab[type="button"].fab-small {
  padding: 4px;
}
.fab.fab-small .icon,
a.fab.fab-small .icon,
button.fab.fab-small .icon,
div.fab.fab-small .icon,
.fab[type="button"].fab-small .icon {
  width: 16px !important;
  height: 16px !important;
}
.fab.fab-large,
a.fab.fab-large,
button.fab.fab-large,
div.fab.fab-large,
.fab[type="button"].fab-large {
  padding: 14px;
}
.fab.fab-large,
a.fab.fab-large,
button.fab.fab-large,
div.fab.fab-large,
.fab[type="button"].fab-large,
.fab.fab-large:after,
a.fab.fab-large:after,
button.fab.fab-large:after,
div.fab.fab-large:after,
.fab[type="button"].fab-large:after,
.fab.fab-large:before,
a.fab.fab-large:before,
button.fab.fab-large:before,
div.fab.fab-large:before,
.fab[type="button"].fab-large:before {
  border-radius: 16px;
}
.fab.fab-large .icon,
a.fab.fab-large .icon,
button.fab.fab-large .icon,
div.fab.fab-large .icon,
.fab[type="button"].fab-large .icon {
  width: 24px !important;
  height: 24px !important;
}
.fab-extended,
a.fab-extended,
button.fab-extended,
div.fab-extended,
.fab-extended[type="button"] {
  font-size: 14px;
  line-height: 20px;
  padding: 8px 12px 8px 8px;
}
.fab-extended .icon,
a.fab-extended .icon,
button.fab-extended .icon,
div.fab-extended .icon,
.fab-extended[type="button"] .icon {
  margin-right: 8px;
}
.fab-extended.fab-large,
a.fab-extended.fab-large,
button.fab-extended.fab-large,
div.fab-extended.fab-large,
.fab-extended[type="button"].fab-large {
  font-weight: bold;
  padding: 14px 18px 14px 14px;
}
.primary-button {
  color: var(--On-primary-container) !important;
  background-color: var(--Primary-container) !important;
  border-color: var(--Primary-container) !important;
}
.primary-button:after {
  background-color: var(--On-primary-container) !important;
}
.primary-button .icon {
  background-color: var(--On-primary-container) !important;
}
.tertiary-button {
  background-color: var(--Tertiary-container) !important;
  border-color: var(--Tertiary-container) !important;
}
.tertiary-button:after {
  background-color: var(--On-tertiary-container) !important;
}
.tertiary-button .icon {
  background-color: var(--On-tertiary-container) !important;
}
.loading-button {
  pointer-events: none;
}
.loading-button .icon {
  -webkit-mask-image: url("/images/loading.svg") !important;
          mask-image: url("/images/loading.svg") !important;
}
.top-app-bar,
.bottom-app-bar {
  background: var(--Surface2);
}
.top-app-bar.main-column__bar,
.bottom-app-bar.main-column__bar {
  margin: -12px;
  padding: 12px;
}
.main-column__bar {
  position: sticky;
  z-index: 10;
}
.bottom-app-bar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.bottom-app-bar.main-column__bar {
  margin-top: auto;
  bottom: -12px;
}
.top-app-bar {
  box-shadow: var(--elevation-1);
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3), 0px 1px 3px 1px rgba(0, 0, 0, 0.15);
}
.top-app-bar.main-column__bar {
  top: -12px;
}
.panel {
  padding: 16px;
  border: 1px solid var(--Outline);
  border-radius: 8px;
}
.panel--small {
  padding: 4px;
}
.panel--small .panel-heading {
  margin: -5px;
  margin-bottom: 4px;
  padding: 4px;
}
.panel.changed {
  border-color: var(--Error);
  border-width: 2px;
}
.panel-heading {
  margin: -17px;
  margin-bottom: 16px;
  padding: 16px;
  background: var(--Surface);
  color: var(--On-surface);
  border-radius: 8px;
  border: 1px solid var(--Outline);
}
.chips {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  padding: 2px;
  border: 1px solid var(--Outline);
  border-radius: 6px;
  gap: 4px;
}
.chips .chips-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  padding: 2px;
  border-radius: 4px;
}
.chips .chips-btn:after {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 4px;
}
.chips .chips-btn .icon-mask {
  width: 16px !important;
  height: 16px !important;
}
.chips-large {
  padding: 4px;
  gap: 8px;
}
.chips-large .chips-title,
.chips-large .chips-value {
  font-size: 0.8rem;
}
.chips-large .chips-title {
  border-radius: 6px;
  padding: 0 8px;
}
.chips-title,
.chips-value {
  font-size: 0.857rem;
  line-height: 1.5;
}
.chips-title {
  background: var(--Primary-container);
  border-radius: 4px;
  padding: 0 4px;
}
.chips-primary {
  background-color: var(--Primary-container) !important;
}
.chips-primary:after {
  background-color: var(--On-primary-container);
}
.chips-primary .icon-mask {
  background-color: var(--On-primary-container);
}
.chips-error {
  background-color: var(--Error-container) !important;
}
.chips-error:after {
  background-color: var(--On-error-container);
}
.chips-error .icon-mask {
  background-color: var(--On-error-container);
}
.control-panel {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  grid-gap: 16px;
  margin-bottom: 20px;
}
.control-panel .panel-prop-char {
  grid-area: 2 / 1 / 2 / 4;
}
.control-panel .panel-devices {
  grid-area: 3 / 2 / 4 / 4;
}
.control-panel .panel-logs {
  grid-area: 3 / 1 / 4 / 2;
  align-self: flex-start;
}
.control-panel--item {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  padding: 16px;
}
.control-panel--item .item-header {
  margin: -16px;
  margin-bottom: 16px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 4px 4px 16px;
  background: var(--Agro-primary);
  color: var(--On-agro-primary);
  border-radius: 12px;
}
.control-panel .list-view--item {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}
.control-panel .list-view--item:not(:last-child) {
  margin-bottom: 8px;
}
.control-panel .empty-item {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  color: var(--secondary-color);
}
@media screen and (max-width: 1199px) {
  .control-panel .panel-devices {
    grid-area: 3 / 2 / 4 / 4;
  }
  .control-panel .panel-logs {
    grid-area: 3 / 1 / 4 / 2;
  }
}
@media screen and (max-width: 991px) {
  .control-panel .panel-devices {
    grid-area: 5 / 1 / 6 / 3;
  }
  .control-panel .panel-config {
    grid-area: 3 / 2 / 4 / 3;
  }
  .control-panel .panel-prop-char {
    grid-area: 4 / 1 / 4 / 3;
  }
}
@media screen and (max-width: 600px) {
  .control-panel .panel-details {
    grid-area: 1 / 1 / 2 / 3;
  }
  .control-panel .panel-config {
    grid-area: 2 / 1 / 3 / 3;
  }
  .control-panel .panel-controller-info {
    grid-area: 3 / 1 / 4 / 3;
  }
  .control-panel .panel-prop-char {
    grid-area: 4 / 1 / 4 / 3;
  }
  .control-panel .panel-devices {
    grid-area: 5 / 1 / 6 / 3;
  }
  .control-panel .panel-logs {
    grid-area: 6 / 1 / 7 / 3;
  }
}
.control-panel .image-loader {
  z-index: 100;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  min-height: 32px;
  background: url('/images/loading.svg') no-repeat center rgba(255, 255, 255, 0.5);
  background-size: 32px;
}
.control-panel .form-group > input,
.control-panel .form-group > select,
.control-panel .control-label,
.control-panel .form-control {
  font-size: 0.75rem;
  line-height: 1.25;
}
.status-block:before {
  content: "";
  margin-right: 4px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-flex;
  align-self: center;
  flex-shrink: 0;
}
.status-block.active:before,
.status-block.online:before {
  background-color: var(--success-color);
}
.status-block.inactive:before,
.status-block.offline:before {
  background-color: var(--danger-color);
}
.status-block.wait:before {
  background-color: var(--progress-color);
}
.node-config .list-group [data-key] {
  width: 100%;
}
.node-config .list-group-item {
  max-width: 320px;
}
.device-block-wrap {
  position: relative;
}
.device-block-wrap:not(:last-child) {
  padding-bottom: 8px;
  margin-bottom: 8px;
  border-bottom: 1px solid var(--border-color);
}
.device-block-wrap .device-updating {
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.device-block-wrap .device-updating svg {
  width: auto;
  height: 100%;
}
.device-block {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.device-values {
  flex-wrap: wrap;
  display: inline-flex;
  border-radius: 4px;
  border: 1px solid var(--border-color);
  overflow: hidden;
}
.device-values code {
  padding: 2px 4px;
  border-radius: 0;
  align-items: center;
  display: flex;
  background-color: var(--background-color-true);
  color: var(--danger-color);
  font-weight: bold;
}
.device-values span {
  background-color: var(--background-color-true);
  border-radius: 4px;
  margin: 4px 2px;
  font-size: 0.714rem;
  padding: 2px 4px;
}
.device-values b {
  font-size: 0.857rem;
}
.logs-list {
  padding: 0;
  margin: 0;
  margin-bottom: 16px;
  font-size: 0.857rem;
}
.logs-list li {
  padding: 0;
  border-radius: 8px;
  padding: 0 8px 4px;
  border: 1px solid var(--Outline);
  animation: textAnim 2s ease;
}
.logs-list li:not(:last-child) {
  margin-bottom: 8px;
}
.logs-list li .info-time {
  border-radius: 8px;
  border: 1px solid var(--Outline);
  border-top: 0;
  color: var(--On-surface);
  margin: 0 -9px 4px;
  padding: 2px 8px;
  width: calc(100% + 18px);
}
.logs-list li .icon-mask {
  background-position: center;
  background-size: 14px;
  width: 14px;
  height: 14px;
  background-repeat: no-repeat;
}
.logs-list li .info-os,
.logs-list li .info-api,
.logs-list li .info-tag {
  display: flex;
  margin: -3px -9px -3px 4px;
  padding: 2px;
  border: 1px solid var(--Outline);
  border-radius: 8px;
}
.logs-list li .info-os .icon-mask,
.logs-list li .info-api .icon-mask,
.logs-list li .info-tag .icon-mask {
  width: 14px;
  height: 14px;
}
.logs-list li .info-user,
.logs-list li .info-script,
.logs-list li .info-node {
  margin-right: 8px;
  min-width: 0;
  color: var(--Primary);
}
.node-config .disabled {
  opacity: 0.3;
  pointer-events: none;
}
.node-config button[type="button"] {
  border-radius: 2px;
  padding: 0px;
}
.node-config .jsoneditor {
  min-height: 200px;
}
.node-config .jsoneditor > .jsoneditor-menu {
  height: 65px;
}
.node-config .jsoneditor .jsoneditor-search {
  left: 0px;
  top: 35px;
}
.node-config .jsoneditor .jsoneditor-search button[type="button"] {
  background-color: #fff;
}
.node-config .jsoneditor a.jsoneditor-poweredBy {
  opacity: 0;
  display: none;
}
.node-config .different-element {
  background-color: #ffd4d480;
}
.node-config .same_element {
  background-color: #acee6180;
}
.help-module-block h3 {
  font-size: 1.143rem;
  line-height: 1.714rem;
  margin-bottom: 16px;
}
.help-module-block p {
  margin-bottom: 8px;
}
.help-module-block ul {
  font-size: 1rem;
  line-height: 1.429rem;
}
.help-module-block pre {
  position: relative;
}
.help-module-block .pre-copy {
  position: absolute;
  top: 8px;
  right: 8px;
}
.help-module-block .pre-paste {
  position: absolute;
  top: 8px;
  right: 44px;
}
.primary-timer {
  padding: 6px 16px 6px 8px;
  background: var(--Surface);
  border-radius: 8px;
  font-size: 14px;
  line-height: 20px;
  font-weight: normal;
  display: flex;
  margin-left: 16px;
  color: var(--On-surface);
  align-items: center;
  font-size: 1rem;
}
.primary-timer .icon-mask {
  width: 18px;
  height: 18px;
  background-color: var(--On-surface);
  margin-right: 8px;
}
.form-widget-container .form-group .cm-s-default {
  border: 1px solid var(--Outline);
  padding-top: 8px;
  border-radius: 4px;
}
.form-widget-container .widget-template {
  width: 100%;
  min-height: 300px;
  height: 600px;
  padding: 8px;
  overflow: auto;
  border-radius: 8px;
  border: 1px solid var(--Outline);
}
.form-widget-container .panel .panel-body img,
.form-widget-container .panel .panel .panel-body textarea {
  margin-bottom: 16px;
  height: 100px;
}
.form-widget-container .panel .panel-body img {
  margin-left: auto;
  margin-right: auto;
}
.form-widget-container .panel .panel-body textarea {
  resize: none;
}
.form-widget-container .panel .panel-body input {
  min-width: auto;
}
.form-widget-container .panel .glyphicon {
  cursor: pointer;
  color: darkred;
}
.form-widget-container .panel .thumbnail a {
  height: 90px;
  display: block;
  overflow: hidden;
}
.form-widget-container .form-widget-container .error {
  border-color: red;
}
.form-widget-container .widget-zoom {
  position: sticky;
  top: 0;
  left: 0;
  background: var(--Surface);
  border-radius: 8px;
  border: 1px solid var(--Outline);
  padding: 8px;
  margin-bottom: 12px;
}
.form-widget-container .widget-zoom p {
  border-bottom: 1px solid var(--Outline);
  text-align: center;
}
.form-widget-container #widget-preview {
  display: inline-flex;
}
:root {
  --check-size: 24px;
}
.md3-checkbox > label,
.md3-radio > label {
  cursor: pointer;
  align-items: center;
  display: flex;
  gap: 4px;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  padding-left: 8px;
  margin-bottom: 0;
}
.md3-checkbox {
  display: flex;
  margin: 0;
}
.md3-checkbox > label {
  padding: 0;
}
.md3-checkbox > label + input[type="checkbox"] {
  margin-left: 8px;
}
.md3-checkbox input[type="checkbox"] {
  flex-shrink: 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  position: relative;
  margin: 0;
  cursor: pointer;
  background: var(--Surface-variant);
  border: 2px solid var(--Outline);
  width: 48px;
  height: 28px;
  border-radius: 40px;
  transition: var(--transition-checkbox);
}
.md3-checkbox input[type="checkbox"]:focus {
  outline: none;
}
.md3-checkbox input[type="checkbox"]:before {
  content: "";
  position: absolute;
  left: 2px;
  top: 2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: var(--Outline);
  transition: var(--transition-checkbox);
  background-image: url("/images/close-white.svg");
  background-position: center;
  background-size: 12px;
  background-repeat: no-repeat;
}
.md3-checkbox input[type="checkbox"]:hover:before {
  background-color: var(--On-surface-variant);
  box-shadow: 0px 0px 0px 8px rgba(28, 27, 31, 0.12);
}
.md3-checkbox input[type="checkbox"]:hover:checked:before {
  box-shadow: 0px 0px 0px 8px rgba(103, 80, 164, 0.12);
}
.md3-checkbox input[type="checkbox"]:checked {
  background: var(--Primary);
  border-color: var(--Primary);
}
.md3-checkbox input[type="checkbox"]:checked:before {
  left: 22px;
  background-color: var(--Primary-container);
  background-image: url("/images/icons/check.svg");
}
.md3-checkbox input[type="checkbox"] + label {
  margin-left: 8px;
}
.md3-checkbox-label {
  font-weight: normal;
  margin: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  cursor: pointer;
}
.md3-radio {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.md3-radio > label input[type="radio"] {
  margin-right: 8px;
}
.md3-radio input[type="radio"] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  box-shadow: 0px 0px 0px calc(var(--size) / 2) inset var(--Surface);
  width: var(--check-size);
  height: var(--check-size);
  position: relative;
  margin-top: 0;
}
.md3-radio input[type="radio"]:before {
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: var(--check-size);
  height: var(--check-size);
  transition: var(--transition-primary);
  background: url("/images/icons/radiobox-blank.svg") var(--Background) no-repeat center;
}
.md3-radio input[type="radio"]:checked:before {
  background: url("/images/icons/radiobox-marked.svg") var(--Background) no-repeat center;
}
.tabs {
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  margin: 0;
}
.tabs-item {
  display: flex;
}
.tabs-link {
  background-color: var(--Surface);
  color: var(--On-surface);
  padding: 4px 16px;
  text-decoration: none;
  transition: background-color var(--transition-primary), color var(--transition-primary);
}
.tabs-link:hover {
  background-color: var(--Primary-container);
  color: var(--On-primary-container);
}
.tabs-link.changed {
  background-image: url("/images/icons/notification-important.svg");
  background-repeat: no-repeat;
  background-position: top right;
  background-size: 16px;
  background-color: var(--Error);
  color: var(--On-error);
}
.tabs-link.active {
  background-color: var(--Primary);
  color: var(--On-primary);
}
.editor-tabs {
  justify-content: center;
  border-bottom: 1px solid var(--border-color);
}
.clean-list {
  list-style: none;
}