@import url("open-iconic/font/css/open-iconic-bootstrap.min.css");

:root {
  --blue-primary: #474748;
  --grey-primary: #6c757d;
  --info: #0eb1d2;
  /* Green: --success: #14c711; */
  --success: #5cb85c;
  /* Yellow: --warning: #f1ea28; */
  --warning: #f0ad4e;
  /* Red: --error: #c52712; */
  --error: #d9534f;
  --body-text: #ffffff;
  /* --body-background: #000000; */
  --subtle-text: #cccccc;
  --disabled-text: #aaaaaa;
  --header-text: #ffffff;
  --header-background: #212529;
  --hover-background: #343a40;
  --selected-text: #ffffff;
  --selected-background: #323232;
  --button-text: #ffffff;
  --button-background: #343a40;
  --link-text: #474748;
  --link-hover-text: #6a6a6a;
  --series-a: #ff9900;
  --series-b: #ff6699;
  --series-c: #33cccc;
  --series-d: #00cc66;
  --series-e: #9933cc;
  --series-f: #ffea00;
  --missing-item-text-color: rgba(45, 45, 45, 0.5);
  --missing-item-bg-color: rgba(200, 200, 200, 0.33);
  --element-bg-color: rgba(45, 45, 45, 0.87);
  --overlay-background: rgba(45, 45, 45, 0.87);
  --dialog-background: rgba(45, 45, 45, 1);
  --category-border: none;
  --body-background: none;
  --category-radius: 8px;
  --self-background: #d2d3d4;
  --self-text: #000000;
  --loader-container-background: #ffffff;
  --loader-container-text: #000000;
  --field-text: #dee2e6;
  --manual-override-text-color: yellow;
  --cart-floor-color: #6b7077;
  --simulation-running-color: #d9534f;
  --rangeslider-transition-duration: 0.15s;
}

html,
body {
  background-color: var(--body-background);
  font-family: "Open Sans";
}

.bg {
  /* The image used */
  background-image: url("../img/BackgroundTest002.jpg");
  /* Center and scale the image nicely */
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: cover;
  /* Full height */
  height: 100%;
  min-height: 100vh;
}

h1:focus {
  outline: none;
}

a,
a:hover,
.btn-link {
  color: var(--link-text);
}

.btn-primary {
  background-color: var(--button-background);
  border-color: var(--grey-primary);
  color: var(--button-text);
}

.page {
  background-color: var(--body-background);
  display: flex;
  flex-direction: column;
  position: relative;
  min-height: 100vh;
}

.breadcrumb-menu {
  width: 100%;
  background-color: var(--body-background);
  border-bottom: 1px solid var(--grey-primary);
  padding: 10px 15px;
  flex-shrink: 0;
}

.page-content {
  display: flex;
  flex: 1;
}

main {
  flex: 1;
}

.top-row {
  align-items: center;
  background-color: var(--header-background);
  border-bottom: 1px solid var(--grey-primary);
  display: flex;
  height: 3.5rem;
  justify-content: flex-end;
}

.top-row a,
.top-row .btn-link {
  margin-left: 1.5rem;
  text-decoration: none;
  white-space: nowrap;
}

.top-row a:hover,
.top-row .btn-link:hover {
  text-decoration: underline;
}

.top-row a:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
}

article {
  padding-left: 10px !important;
}

@media (max-width: 640.98px) {
  .top-row:not(.auth) {
    display: none;
  }

  .top-row.auth {
    justify-content: space-between;
  }

  .top-row a,
  .top-row .btn-link {
    margin-left: 0;
  }

  .page-content {
    flex-direction: column;
  }

  .sidebar {
    width: 100%;
    height: auto;
    order: 2;
  }

  main {
    order: 1;
  }
}

@media (min-width: 641px) {
  .page-content {
    flex-direction: row;
  }

  .sidebar {
    flex-shrink: 0;
    padding-right: 1em;
  }

  .top-row {
    position: sticky;
    top: 0;
    z-index: 1;
  }

  .top-row.auth a:first-child {
    flex: 1;
    text-align: right;
    width: 0;
  }

  .top-row,
  article {
    padding-left: 2rem !important;
    padding-right: 1.5rem !important;
  }
}

.content {
  padding-top: 1.1rem;
}

#emergency-halt-button {
  position: absolute;
  bottom: 8px;
  left: 10px;
  width: 82px;
  /* 100px */
  height: 92px;
  /* 112px */
  z-index: 1000;
  --webkit-user-select: auto;
  user-select: auto;
}

#emergency-halt-button-image {
  background: rgba(255, 177, 66, 1);
  width: 62px;
  /* 80px */
  height: 62px;
  /* 80px */
  margin-left: 10px;
  border-radius: 50%;
  --webkit-user-select: auto;
  user-select: auto;
}

#emergency-halt-button-image.with-pulse {
  background: rgba(255, 177, 66, 1);
  box-shadow: 0 0 0 0 rgba(255, 177, 66, 1);
  transform: scale(1);
  animation: halt-button-pulse 2s infinite;
}

@keyframes halt-button-pulse {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 177, 66, 0.7);
  }

  70% {
    transform: scale(1);
    box-shadow: 0 0 0 40px rgba(255, 177, 66, 0.1);
  }

  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 177, 66, 0);
  }
}

#emergency-halt-button-instructions {
  height: 26px;
  padding-bottom: 8px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}

.valid.modified:not([type="checkbox"]) {
  outline: 1px solid #26b050;
}

.title h1 {
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
}

.category-card,
.chamber-view,
.program-graph {
  background-color: var(--element-bg-color);
}

.category-card,
.chamber-view,
.program-graph {
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
}

.system-notifications {
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 0.8em;
  padding-right: 60px;
}

.notification {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  gap: 32px;
  color: var(--body-text);
  opacity: 1;
  transition: opacity 0.6s;
  margin-top: 15px;
  padding: 0.5em 0.5em 0.5em 0.5em;
  border-radius: var(--category-radius);
  font-size: 0.85em;
}

.notification-new-cart-detected {
  background-color: var(--element-bg-color);
}

.notification-new-cart-detected .notification-message .header {
  display: flex;
  flex-direction: row;
  justify-content: start;
  align-items: baseline;
}

.notification-new-cart-detected .notification-message .header span.identifier {
  color: var(--subtle-text);
  margin-left: 12px;
  font-size: 0.9rem;
}

.notification-new-cart-detected .notification-data {
  flex-basis: 480px;
  font-size: 0.9rem;
}

.notification-new-cart-detected .notification-data .k-input {
  color: var(--body-text);
  background-color: var(--element-bg-color);
  max-width: 400px;
}

.notification-new-cart-detected .notification-data .k-input-inner {
  color: var(--body-text);
  font-size: 0.9rem;
}

.notification-message p {
  font-size: 0.9rem;
}

.notification-new-cart-detected .notification-progress {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.notification-new-cart-detected .notification-progress p {
  margin-left: auto;
  margin-right: auto;
}

.notification-fatal-error {
  background-color: var(--error);
}

.notification-fatal-error .error-message {
  flex: 1;
  font-size: 1.1rem;
}

.notification-fatal-error button {
  width: 80px;
}

.notification-fatal-error .notification-message {
  margin: 12px;
}

.notification-transient {
  background-color: var(--success);
}

.notification-transient .notification-message {
  margin: 12px;
}

.notification-action {
  font-size: 1rem;
}

#chamber-full-view {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.chamber-first-row-elems {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 10px;
  width: 100%;
  justify-content: center;
  padding: 5px 60px 0 0;
}

.chamber-buttons {
  display: flex;
  flex: 20%;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.8em;
  /*margin-bottom: 0.8em;*/
}

.chamber-buttons .custom-button-url.button-component {
  margin: 0;
}

.chamber-view {
  border: var(--category-border);
  display: flex;
  flex: 100%;
  flex-flow: column;
  flex-wrap: nowrap;
  max-width: 1195px;
}

.chamber-view {
  height: auto;
}

.cart-overviews {
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 3.3em 1.2em;
  -o-justify-content: center;
  -webkit-justify-content: center;
  justify-content: center;
  max-width: 2400px;
  padding-right: 60px;
}

#program-graph-container {
  display: flex;
  flex-flow: column;
  height: 100%;
}

#program-graph-canvas-container {
  flex: 1 1 auto;
}

#program-graph-container .header {
  flex: 0 1 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  /* justify-content: space-between; */
}

#program-graph-container .header .title {
  margin: 0 8px 8px 36px;
  flex: 1 1 auto;
  text-align: center;
}

#program-graph-container .header .title h3,
#program-graph-container .header .title h4 {
  color: var(--body-text);
  display: inline;
  margin: 0 4px 0 4px;
}

#program-graph-container .footer {
  flex: 0 1 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
}

#program-graph-container .footer #program-graph-notice {
  color: var(--body-text);
  flex: 1 1 auto;
  margin: 0 8px 0 36px;
  text-align: center;
}

#program-graph-container .footer .settings-button {
  flex: 0 0 auto;
  margin: 0;
}

.program-graph-not-selected {
  color: var(--body-text);
  padding-top: 120px;
  text-align: center;
  width: 100%;
}

.extended-program-graph .series-selectors {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-evenly;
  padding-top: 16px;
}

.extended-program-graph .series-selector {
  display: flex;
  flex-flow: column nowrap;
  justify-content: flex-start;
}

.extended-program-graph .series {
  align-items: center;
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  margin: 10px;
}

.extended-program-graph .series .title {
  color: var(--field-text);
  margin: 0 10px 0 0;
  width: 200px;
}

.extended-program-graph .series .color {
  border-color: black;
  border-radius: 50%;
  border-width: 1px;
  height: 20px;
  margin-right: 16px;
  width: 20px;
}

.extended-program-graph .series .k-combobox {
  width: 200px;
}

.cart-card {
  margin: 16px;
  width: 20em;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  height: 21em;
}

.cart-title {
  color: var(--body-text);
  font-size: 1.4em;
  font-weight: bold;
  text-align: center;
  width: 100%;
  flex: 0 1 auto;
  background: #6a6c6e;
  padding-top: 0.8em;
  line-height: 0.1em;
  z-index: 99;
}

.no-cart-title {
  line-height: unset;
  background: var(--missing-item-bg-color);
}

.cart-container {
  -moz-border-image: url("../img/BasicStandardCart002.svg") 28 30 56 30 stretch stretch;
  -o-border-image: url("../img/BasicStandardCart002.svg") 28 30 56 30 stretch stretch;
  -webkit-border-image: url("../img/BasicStandardCart002.svg") 28 30 56 30 stretch stretch;
  background-color: var(--body-background);
  border-image: url("../img/BasicStandardCart002.svg") 28 30 56 30 stretch stretch;
  border-style: solid;
  border-width: 20px 25px 56px 25px;
  color: var(--body-text);
  padding: 0;
  flex: 1 1 auto;
}

.cart-container-empty {
  background-color: var(--missing-item-bg-color);
  padding: 0;
  margin-bottom: 20px;
  border-radius: 5px;
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.cart-container-empty p {
  margin: 16px;
  align-items: center;
  font-size: 2em;
  color: var(--missing-item-text-color);
}

.cart-overview {
  font-size: 1em;
  padding: 0;
  width: 100%;
}

.cart-container div {
  background-color: var(--element-bg-color);
  height: 100%;
  padding: 2px 12px 2px 12px;
  width: 100.2%;
}

.cart-container th,
.cart-container td {
  border: 0;
  margin: 0;
  padding: 0;
}

.cart-container th.label {
  font-size: 1.2em;
  font-weight: bold;
}

.cart-container th.value {
  color: var(--success);
  font-size: 1.5em;
  font-weight: bold;
  text-align: right;
}

.cart-container th.value-ok {
  color: var(--success);
}

.cart-container th.value-error {
  color: var(--error);
}

.cart-container th.value-warning {
  color: var(--warning);
}

.cart-container th.value .value-with-icon {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.cart-container th.value .value-with-icon img {
  margin-left: 0.2em;
}

.cart-container th.value-ok span {
  margin-right: 1em;
}

.cart-container th.error {
  color: var(--error);
}

.cart-container tr.action-row {
  padding: 0.5em;
  text-align: center;
}

.cart-container table tr td.label {
  width: 100%;
}

.cart-container td.value {
  padding-left: 0.5em;
  text-align: right;
}

.cart-container td.value:last-child {
  padding-left: 1em;
}

.cart-container td.unit {
  font-size: 0.8em;
  text-align: left;
  padding-left: 8px;
}

.cart-container td.chart-row {
  padding: 0.5em 0 0.5em 0;
}

.cart-container sub {
  font-size: 0.6em;
  vertical-align: sub;
}

.cart-details-header {
  align-items: stretch;
  display: flex;
  justify-content: space-between;
  gap: 0.5em;
}

.cart-details-header .extra-temperature-info {
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
  color: var(--body-text);
  margin-bottom: 8px;
  padding: 8px;
}

.cart-details-header .extra-temperature-info .header {
  font-size: 1.2em;
  font-weight: bold;
}

.cart-details-header .extra-temperature-info .values {
  /* display: grid; */
  /* grid-template-columns: 1fr 1fr 1fr; */
  /* grid-template-rows: 1fr 1fr 1fr; */
  /* grid-auto-flow: column; */
  /* grid-column-gap: 1em; */
  /* grid-row-gap: 0.2em; */
  /* padding-top: 4px; */
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding-top: 4px;
  gap: 0.5em;
}

.cart-details-header .extra-temperature-info .values .label {
  font-size: 0.8em;
  white-space: nowrap;
}

.cart-details-header .extra-temperature-info .values .value {
  font-size: 0.9em;
  font-weight: bold;
  padding-left: 0.5em;
  white-space: nowrap;
}

.cart-details-header .extra-temperature-info .values .temperature-info {
  flex: 0 1 auto;
}

.cart-overall-state {
  align-items: center;
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
  color: var(--body-text);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-bottom: 8px;
  padding: 0 2em 0 2em;
}

.cart-overall-state .state {
  align-items: center;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 2em 0 2em;
}

.cart-overall-state .energy-usage {
  margin-top: 8px;
  margin-bottom: 0;
  font-size: 1.1em;
}

.cart-overall-state .chamber-pressure {
  margin-top: 0;
  margin-bottom: 8px;
  font-size: 1.1em;
}

.cart-overall-state .label {
  font-size: 1.2em;
  font-weight: bold;
  margin-right: 1.8em;
}

.cart-overall-state .status {
  font-size: 2em;
  font-weight: bold;
}

.cart-overall-state .status-ok {
  color: var(--success);
}

.cart-overall-state .status-warning {
  color: var(--warning);
}

.cart-overall-state .status-error {
  color: var(--error);
}

.cart-name {
  color: var(--body-text);
  font-size: 1.5em;
  font-weight: bold;
  margin-bottom: 8px;
}

.cart-details {
  align-items: flex-start;
  display: flex;
  margin-bottom: 24px;
  gap: 0.5%;
  min-width: 0;
}

.power-loader-container .k-loader-container-inner {
  background-color: var(--loader-container-background);
  border-radius: var(--category-radius);
  color: var(--loader-container-text);
}

.program-tuning {
  align-items: flex-start;
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
  color: var(--body-text);
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  margin-bottom: 8px;
  padding: 0.5em 0.5em;
  font-size: 1.2rem;
}

.program-tuning .program-tuning-mode {
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0.5em 2em;
}

.program-tuning .program-tuning-mode button {
  padding-left: 5.5px;
  padding-right: 5.5px;
}

.program-tuning .program-tuning-details {
  margin-top: 0.6em;
  margin-right: 1em;
}

.program-tuning .program-tuning-details .accurate-value {
  display: inline;
}

.program-tuning .program-tuning-details .accurate-value .label {
  margin-right: 8px;
  font-size: 0.9em;
}

.program-tuning .program-tuning-details .accurate-value .k-button:last-child {
  margin-left: 8px;
}

.program-tuning .program-tuning-details .accurate-value .dropdown-flex-container {
  display: flex inline;
  align-items: center;
  flex-direction: row;
  white-space: nowrap;
  flex-wrap: nowrap;
}

.program-tuning .program-tuning-details .accurate-value .dropdown-flex-container .no-break {
  white-space: nowrap;
  margin-right: 5px;
}

.program-tuning .program-tuning-details .accurate-value .dropdown-flex-container .custom-dropdown {
  margin-left: 8px;
  margin-right: 8px;
  width: auto;
  height: 28px;
}

.program-tuning .program-tuning-details .accurate-value .dropdown-flex-container .custom-dropdown .k-list-container {
  max-height: 150px;
  height: auto;
  overflow-y: auto;
}

.program-tuning .program-tuning-details .accurate-value .flex-itme.is-power-item-on_True,
.program-tuning .program-tuning-details .accurate-value .flex-itme.is-temp-item-on_True {
  display: inline;
}

.program-tuning .program-tuning-details .accurate-value .flex-item.is-power-item-on_False,
.program-tuning .program-tuning-details .accurate-value .flex-item.is-temp-item-on_False,
.program-tuning .program-tuning-details .accurate-value .shortcuts.is-power-item-on_False,
.program-tuning .program-tuning-details .accurate-value .shortcuts.is-temp-item-on_False {
  display: none;
}

.program-tuning .program-tuning-details .accurate-value .shortcuts.is-power-item-on_True,
.program-tuning .program-tuning-details .accurate-value .shortcuts.is-temp-item-on_True {
  display: inline-block;
  font-size: 0.7em;
  margin-left: 1.6em;
  white-space: nowrap;
}

.program-tuning .program-tuning-details .accurate-value .k-button {
  padding-left: 5.5px;
  padding-right: 5.5px;
}

.program-tuning .k-numerictextbox .k-input-inner {
  color: var(--body-text);
}

#cart-details-full-view {
  padding-right: 60px;
  max-width: 2400px;
  margin: 0 auto;
}

.k-progressbar-horizontal {
  height: 1.3rem;
}

.cart-details>.cart-details-grid {
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
  color: var(--body-text);
  flex: 1 2 40%;
  padding: 0 10px 10px 10px;
}

.cart-details-grid .k-grid-content {
  overflow-y: auto;
}

.cart-details-grid .k-grid-content td {
  height: calc((100vh - 5.6vh - 12vh) / 36);
  padding: 0 0.25rem;
  font-size: 0.8em;
}

.cart-details-grid .k-grid-content td .shelf-not-connected {
  display: block;
  width: 100%;
  text-align: center;
}

.cart-overall-state .label {
  font-size: 1.5em;
  font-weight: bold;
  margin-right: 1.8em;
}

/*.cart-details-grid .k-grid-content td, .cart-details-grid .k-grid-header th, .cart-details > .cart-details-info td, .cart-for-grid .cart-shelf span {
    font-size: 0.9em !important;
}*/
.k-button-md {
  font-size: 1.1rem;
}

.cart-details-grid .k-grid-content td,
.cart-details-grid .k-grid-header th,
.cart-details>.cart-details-info td,
.cart-for-grid .cart-shelf span,
.cart-details>.cart-details-info th {
  font-size: 1.2rem;
}

li.k-step-current .k-step-indicator {
  background-color: var(--success) !important;
}

.calculator-input .k-input-inner {
  color: var(--body-text) !important;
}

@media (max-width: 2400px) {
  /*.cart-details-grid .k-grid-content td, .cart-details-grid .k-grid-header th, .cart-details > .cart-details-info td, .cart-for-grid .cart-shelf span {
        font-size: 0.8em !important;
    }*/

  .cart-overall-state .status {
    font-size: 1.9em;
  }

  .k-button-md {
    font-size: 0.9rem;
  }
}

@media (max-width: 2195px) {

  /*.cart-details-grid .k-grid-content td, .cart-details-grid .k-grid-header th, .cart-details > .cart-details-info td, .cart-for-grid .cart-shelf span {
        font-size: 0.75em !important;
    }*/
  .notification-fatal-error .error-message {
    font-size: 0.9rem;
  }

  .program-tuning {
    font-size: 1rem;
  }

  .cart-overall-state .energy-usage,
  .cart-overall-state .chamber-pressure {
    font-size: 1.1em;
  }

  .k-progressbar-horizontal {
    height: 1rem;
  }

  .k-progressbar *,
  .k-progressbar *::before,
  .k-progressbar *::after {
    font-size: 0.95em;
  }

  #cart-details-full-view {
    padding-right: 0;
  }

  .system-notifications {
    padding-right: 0;
  }

  .cart-overviews {
    gap: 0.3em 1.2em;
  }

  .cart-details-container {
    border-width: 22px 30px 56px 30px !important;
  }

  .cart-overall-state .status {
    font-size: 1.8em;
    font-weight: bold;
  }

  .cart-overall-state .label {
    font-size: 1.4em;
  }

  .k-button-md {
    font-size: 0.8rem;
  }

  .cart-details-grid .k-grid-content td,
  .cart-details-grid .k-grid-header th,
  .cart-details>.cart-details-info td,
  .cart-for-grid .cart-shelf span,
  .cart-details>.cart-details-info th {
    font-size: 0.95rem;
  }
}

@media (max-width: 1625px) {

  /* .cart-details-grid .k-grid-content td, .cart-details-grid .k-grid-header th, .cart-details > .cart-details-info td, .cart-for-grid .cart-shelf span {
        font-size: 0.6em !important;
    }*/
  cart-overall-state .status {
    font-size: 1.7em;
  }

  .cart-overall-state .label {
    font-size: 1.3em;
  }

  .cart-overall-state .energy-usage,
  .cart-overall-state .chamber-pressure {
    font-size: 0.8em;
  }

  .program-tuning .program-tuning-details .shortcuts {
    font-size: 0.7em;
  }

  .k-button-md {
    font-size: 0.8rem;
  }

  .program-tuning .program-tuning-details .accurate-value .label {
    font-size: 0.8em;
  }
}

.cart-details-grid .k-grid-header,
.cart-details-grid .k-grid-footer {
  --webkit-padding-end: 0;
  padding-inline-end: 0;
  padding-right: 0;
  /* version 2.26 and older requires !important here */
}

.cart-details-grid .k-grid-header-wrap,
.cart-details-grid .k-grid-footer-wrap {
  border-right-width: 0;
}

.cart-details-grid .manual-power-override {
  color: var(--manual-override-text-color);
}

.cart-details-grid .footer {
  padding: 10px 10px;
}

.cart-details-grid .footer .accurate-value {
  display: inline;
}

.cart-details-grid .footer .accurate-value .label {
  margin-right: 10px;
}

.cart-details-grid .footer .shortcuts {
  display: inline;
  margin-left: 20px;
}

.cart-details-grid .k-numerictextbox .k-input-inner {
  color: var(--body-text);
}

.cart-details>.cart-details-shelves {
  flex: 1 0 18%;
}

.cart-details>.cart-details-info {
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
  color: var(--body-text);
  flex: 1 0 25%;
  padding: 0 10px;
  margin-bottom: 8px;
  /*height: calc(100vh - 245px);*/
  min-width: 0;
}

.cart-details>.cart-details-info table {
  margin-bottom: 8px;
  width: 100%;
}

.cart-details>.cart-details-info tr {
  height: calc((100vh - 5.6vh - 12vh) / 36);
  font-size: 0.8em;
  line-height: 1;
}

.cart-details>.cart-details-info th {
  padding: 0.3rem 0.15rem;
  text-align: center;
}

.cart-details>.cart-details-info td.shelf-index {
  width: 2.5em;
}

.cart-details>.cart-details-info td.shelf-issue {
  width: auto;
  min-width: 0;
  max-width: 200px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.cart-details-container {
  -moz-border-image: url("../img/BasicStandardCart002.svg") 28 30 56 30 stretch stretch;
  -o-border-image: url("../img/BasicStandardCart002.svg") 28 30 56 30 stretch stretch;
  -webkit-border-image: url("../img/BasicStandardCart002.svg") 28 30 56 30 stretch stretch;
  background-color: var(--body-background);
  border-image: url("../img/BasicStandardCart002.svg") 28 30 56 30 stretch stretch;
  border-style: solid;
  border-width: 28px 30px 56px 30px;
  color: var(--body-text);
  padding: 0;
}

/*.cart-details-container > div { padding: 2px 0 0 0; }*/

.cart-details .k-filter-row {
  display: none;
}

.cart-for-grid .cart-shelf-container {
  color: transparent;
  height: calc((100vh - 5.6vh - 12vh) / 36);
  padding: 1px 1px 1px 1px;
  position: relative;
}

.cart-for-grid .cart-shelf-container:last-child {
  /* padding: 8px 4px 8px 4px; */
  margin-bottom: 3px;
}

.cart-for-grid .cart-shelf {
  /*-moz-border-image: url('../img/ShelfStandard001.svg') 1 1 1 1 stretch stretch;
    -o-border-image: url('../img/ShelfStandard001.svg') 1 1 1 1 stretch stretch;
    -webkit-border-image: url('../img/ShelfStandard001.svg') 1 1 1 1 stretch stretch;*/
  background-color: var(--self-background);
  /*border-image: url('../img/ShelfStandard001.svg') 1 1 1 1 stretch stretch;
    border-style: solid;*/
  border-width: 1px 2px 1px 2px;
  display: flex;
  justify-content: space-around;
  padding: 2px;
}

.cart-for-grid .cart-shelf span {
  color: var(--self-text);
  flex: 2 auto;
  margin: 0;
  text-align: center;
}

@media (max-height: 1500px) {
  .cart-for-grid .cart-shelf {
    padding: 0;
  }
}

@media (max-height: 1210px) {
  .cart-for-grid .cart-shelf {
    padding: 1px;
    line-height: 1.3;
  }
}

@media (max-height: 980px) {
  .cart-for-grid .cart-shelf span {
    line-height: 1.3em;
    padding: 0;
  }

  .cart-for-grid .cart-shelf {
    padding: 0;
  }
}

@media (max-height: 910px) {
  .cart-for-grid .cart-shelf span {
    line-height: 1.1em;
  }
}

.cart-for-grid .cart-shelf-offline-indicator,
.cart-for-grid .cart-shelf-online-indicator,
.cart-for-grid .cart-shelf-manual-indicator {
  align-items: center;
  color: var(--grey-primary);
  line-height: 24px;
  font-size: 1em;
  font-weight: bold;
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: center;
  left: 0;
  position: absolute;
  top: 4px;
  width: 100%;
  z-index: 9;
}

.cart-for-grid .cart-shelf-progress-indicator {
  align-items: center;
  color: var(--grey-primary);
  line-height: 24px;
  font-size: 1em;
  font-weight: bold;
  display: flex;
  height: calc((100vh - 12vh - 5.6vh) / 36 + 0.05em);
  justify-content: center;
  align-items: center;
  left: 40%;
  position: absolute;
  top: -0.2em;
  /*-0.001em;*/
  /* width: 100%; */
  width: 20%;
  z-index: 9;
  margin-top: 4px;
}

/* .cart-for-grid .cart-shelf-progress-indicator .k-progressbar { */
/*     margin-left: 12px; */
/*     margin-right: 12px; */
/* } */

.k-progressbar *,
.k-progressbar *::before,
.k-progressbar *::after {
  font-size: 1.1em;
}

.cart-for-grid .cart-shelf-error-indicator {
  align-items: center;
  color: yellow;
  display: flex;
  height: 100%;
  justify-content: center;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 10;
  padding-bottom: 2px;
}

.cart-for-grid .cart-shelf-error-indicator img {
  height: 26px;
  margin-top: 8px;
  width: 42px;
}

.clearfix:after {
  clear: both;
  content: "";
  display: block;
}

.invalid {
  outline: 1px solid var(--error);
}

.validation-message {
  color: var(--error);
}

#blazor-error-ui {
  background: lightyellow;
  bottom: 0;
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
  display: none;
  left: 0;
  padding: 0.6rem 1.25rem 0.7rem 1.25rem;
  position: fixed;
  width: 100%;
  z-index: 1000;
}

#blazor-error-ui .dismiss {
  cursor: pointer;
  position: absolute;
  right: 0.75rem;
  top: 0.5rem;
}

.blazor-error-boundary {
  background:
    url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem,
    #b32121;
  color: white;
  padding: 1rem 1rem 1rem 3.7rem;
}

.blazor-error-boundary::after {
  content: "An error has occurred.";
}

.login-main-view-block {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  text-align: center !important;
}

.login-main-view-block h3 {
  flex: 100% !important;
}

.login-main-view-block .alert {
  flex: 100%;
}

.auth-section {
  max-width: 450px !important;
  min-width: 300px;
  width: calc(100vw - 2 * 12em);
}

.logged-out {
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
  color: var(--body-text);
  max-width: 450px;
  width: fit-content;
  margin: 0 auto;
  padding: 2rem;
}

.set-user-password {
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
  color: var(--body-text);
  max-width: 450px;
  width: fit-content;
  margin: 0 auto;
  padding: 2rem;
}

.set-user-password .k-input-inner {
  color: var(--body-text) !important;
}

.set-user-password .k-input-inner::placeholder {
  color: var(--subtle-text) !important;
}

.manage-user-roles {
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
  color: var(--body-text);
  max-width: 600px;
  width: fit-content;
  margin: 0 auto;
  padding: 2rem;
}

.set-user-role-section {
  margin-bottom: 1.5rem;
}

.current-roles-container {
  margin-top: 0.5rem;
}

.role-badge {
  display: inline-block;
  background-color: var(--element-bg-color);
  padding: 0.25rem 0.5rem;
  margin: 0.2rem;
  border-radius: 0.25rem;
}

.role-select-container {
  text-align: center;
}

.role-select-label {
  display: block;
  margin-bottom: 0.5rem;
}

.role-select {
  width: 300px;
  max-width: 100%;
  padding: 0.5rem;
  border: 1px solid #ccc;
  border-radius: 0.25rem;
  background-color: var(--element-bg-color);
  color: var(--body-text);
}

.role-buttons-container {
  text-align: center;
}

.role-button {
  margin-right: 0.5rem;
}

.spinner-margin {
  margin-right: 0.25rem;
}

.done-button-container {
  text-align: center;
}

.access-denied {
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
  color: var(--body-text);
  max-width: 500px;
  width: fit-content;
  margin: 0 auto;
  padding: 2rem;
  text-align: center;
}

.access-denied h2 {
  color: var(--warning);
  margin-bottom: 1rem;
}

.access-denied p {
  margin-bottom: 1rem;
  line-height: 1.5;
}

.drawer-container {
  width: 100%;
  padding-top: 20px;
}

.drawer-container .k-drawer-container {
  position: relative;
  width: 100%;
}

.drawer-container .custom-toolbar {
  background-color: var(--hover-background);
  border-bottom: inset;
  border-bottom-color: var(--hover-background);
  border-bottom-width: 1px;
  border-radius: 10px;
  color: var(--header-text);
  line-height: 10px;
  margin-left: 10px;
  padding: 3px 8px;
  width: 50px;
}

.drawer-container .mail-box {
  font-size: 1em;
  font-weight: bold;
  margin-left: 20px;
}

.drawer-container .page ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.drawer-container .page li {
  background: 0 0;
  border-color: transparent;
  border-radius: 0;
  border-style: solid;
  border-width: 0 0 1px;
  font-size: 1em;
  line-height: 1.5em;
}

.drawer-container .page li:last-child {
  border: 0;
}

.drawer-container .page li h6 {
  border-bottom: none;
  padding-bottom: 8px;
}

.drawer-container .k-icon {
  border: none;
  font-size: 1em;
}

.drawer-container .k-drawer {
  border: none;
  color: var(--link-text);
  font-family: "Open Sans" !important;
}

.drawer-container .k-item-text {
  color: unset;
  font-size: 1em !important;
  text-decoration: none;
}

.drawer-container .k-drawer-item.k-selected {
  background-color: var(--selected-background) !important;
}

.drawer-container .k-drawer-item:hover,
.drawer-container .k-drawer-item.k-state-hover,
.drawer-container .k-drawer-item.k-hover {
  background-color: var(--hover-background) !important;
}

.drawer-container .k-level-1 {
  margin-left: 32px !important;
}

.k-drawer-wrapper {
  width: 250px;
  font-weight: bolder;
}

.flex-wrap {
  flex-wrap: wrap;
}

#reset-password-email,
#reset-password-pass {
  color: var(--field-text) !important;
}

#programs-view,
#sub-categories,
#categories,
.admingui-index-menu {
  max-width: 2460px;
  margin: 0 auto;
}

#programs-view a,
#sub-categories a,
#categories a,
.admingui-index-menu a {
  color: var(--body-text);
  flex: 25%;
  height: auto;
  max-width: 420px;
  text-decoration: none;
}

#programs-view .card-img-block,
.admingui-index-menu .card-img-block {
  height: 200px;
  width: inherit;
  margin: 15px;
  background: white;
  text-align: center;
}

#program-card .card-img-block {
  height: 260px;
}

#programs-view .k-card-image,
#sub-categories .k-card-image,
#categories .k-card-image,
.admingui-index-menu .k-card-image {
  background-color: white;
  flex: 80% !important;
  height: inherit;
  padding: 10px;
}

#programs-view .k-card-body,
#sub-categories .k-card-body,
#categories .k-card-body,
.admingui-index-menu .k-card-body {
  flex: 20% !important;
}

#programs-view .k-card-title,
#sub-categories .k-card-title,
#categories .k-card-title,
.admingui-index-menu .k-card-title {
  flex: 55%;
  font-weight: bold;
  font-size: 1.8rem;
}

.card-main-block {
  padding-right: 3em;
}

#programs-view .k-card-subtitle,
#sub-categories .k-card-subtitle,
#categories .k-card-subtitle,
.admingui-index-menu .k-card-subtitle {
  font-size: 1.85em !important;
}

#programs-view .k-card,
#sub-categories .k-card,
#categories .k-card,
.admingui-index-menu .k-card {
  border: var(--category-border);
  max-height: 430px !important;
  max-width: 420px !important;
  font-size: 0.55rem;
}

#programs-view .btn-back,
#sub-categories .btn-back,
#categories .btn-back {
  display: flex;
  flex-direction: row;
  width: 400px;
}

#programs-view .program-title,
#sub-categories .program-title,
#categories .program-title {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 10px;
  height: 70px;
}

#programs-view .program-variation,
#sub-categories .program-variation,
#categories .program-variation {
  width: 90px;
}

#sub-categories .program-variation img,
#categories .program-variation img {
  height: auto;
  margin-top: 5px;
  width: 100%;
}

#program-card .k-card {
  max-height: 400px;
}

#programs-view .program-variation img {
  height: 3.5em;
  width: 5.5em;
}

#programs-view .program-variation {
  display: flex;
  flex-direction: row;
  width: 100%;
}

#programs-view k-card-title {
  flex: 45%;
}

#programs-view .program-variation {
  display: flex;
  flex-direction: row;
  width: 100%;
}

#programs-view k-card-title {
  flex: 45%;
}

#programs-view .program-variation {
  gap: 13px;
  text-align: center;
  flex: 45%;
}

#programs-view .program-variation p {
  font-size: 1em;
  line-height: 1.2;
  margin-top: 5px;
}

#programs-view .program-variation p {
  font-size: 1em;
  line-height: 1.2;
  margin-top: 5px;
}

#program-details-params {
  line-height: 1.5em;
  font-size: 1.1em;
  margin-bottom: 0;
}

#program-details-params:not(.water_freezed) {
  margin-bottom: 1.5em;
}

.program-details-params-mainblock {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: column;
  flex: 100%;
}

#program-details-params .params-header {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  font-weight: bold;
}

#program-details-params .params-header .second-col {
  flex: 40%;
  margin-left: 15%;
}

#program-details-params .params-header .first-col {
  flex: 60%;
  margin-left: 15%;
}

#program-details-params .params-content {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  gap: 20px;
}

#program-details-params .params-content .in-error {
  border: 3px solid var(--bs-red);
}

#program-details-params .params-secondcolumn {
  flex: 40%;
}

#program-details-params .params-secondcolumn .first-row,
#program-details-params .params-secondcolumn .second-row,
#program-details-params .params-firstcolumn .first-row,
#program-details-params .params-firstcolumn .second-row {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
}

#program-details-params .params-secondcolumn .param-name {
  flex: 45%;
}

#program-details-params .params-secondcolumn .param-value {
  font-weight: bold;
  flex: 60% !important;
}

#program-details-params .params-secondcolumn .second-row .water_freezed {
  line-height: 75px;
}

#program-details-params .params-firstcolumn {
  flex: 60%;
}

#program-details-params .params-secondcolumn .first-row {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
}

#program-details-params .params-firstcolumn .param-name {
  flex: 28%;
}

#program-details-params .params-firstcolumn .param-value {
  font-weight: bold;
  flex: 30%;
}

#program-details-params .water-percentage-params {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: column;
}

#program-details-params .param-value input {
  width: 100px;
  height: 1.3em;
  margin: 0 5px 0 5px;
  color: var(--link-hover-text) !important;
  text-align: center;
}

.popup-content .custom-buttons-block {
  display: flex;
  flex-direction: row;
  text-align: center;
  margin-top: unset;
}

.popup-content .custom-buttons-block button {
  padding: 15px !important;
  margin-bottom: 0 !important;
  width: 150px;
  border: unset;
  background-color: inherit;
  font-size: 1em;
}

#programs-view .shadow,
#sub-categories .shadow,
#categories .shadow {
  box-shadow: unset !important;
}

#programs-view .card-main-block,
#sub-categories .card-main-block,
#categories .card-main-block,
.admingui-index-menu .card-main-block {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  justify-content: center;
  /* margin-top: 30px; */
}

#programs-view .title,
#sub-categories .title,
#categories .title,
.admingui-index-menu .title {
  display: flex;
  flex: 100%;
  flex-wrap: wrap;
  justify-content: center;
}

#programs-view .title h1,
#sub-categories .title h1,
#categories .title h1,
.admingui-index-menu .title h1 {
  border: var(--category-border);
  color: var(--header-text);
  padding: 10px;
  width: fit-content;
}

#programs-view .k-card-deck,
#sub-categories .k-card-deck,
#categories .k-card-deck,
.admingui-index-menu .k-card-deck {
  flex: unset !important;
  justify-content: center !important;
}

.custom-button-url,
.custom-button-url:hover {
  background-image: url(/img/BasicButton001.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  box-shadow: unset !important;
  color: var(--link-text);
  display: inline-block;
  filter: drop-shadow(5px 5px 5px var(--body-background));
  font-weight: bold;
  font-family:
    "Open Sans",
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    "Helvetica Neue",
    Arial,
    sans-serif;
  margin-bottom: 10px;
  text-align: center;
  text-transform: uppercase;
  vertical-align: middle;
  background-color: transparent;
  border-color: transparent;
}

.custom-button-url.program-button {
  width: 130px;
  height: 3em;
  font-size: 1em;
  margin-bottom: 0;
}

.custom-button-url.reset-calculations-button {
  height: 3.2em;
  font-size: 1em;
  margin-bottom: 0;
}

.cart-container .custom-button-url {
  width: 130px;
}

.button-component {
  padding-top: 6px;
}

.cart-overview .custom-button-url .k-button-text {
  margin: 5px;
}

.btn-nav-back {
  padding: 10px;
}

.cart-elem-rectangle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex-grow: 1;
  border: 3px solid var(--hover-background);
  color: var(--body-background);
  font-size: 28px;
  font-weight: bold;
}

.cart-elem-rectangle>a {
  text-decoration: none;
}

.cart-elem-rectangle.empty-location {
  background-color: var(--missing-item-bg-color);
  /*color: var(--missing-item-text-color);*/
  font-size: 1.5rem;
  font-weight: bold;
  opacity: 0.9;
}

.cart-elem-rectangle.ok {
  background-color: var(--success);
}

.cart-elem-rectangle.error {
  background-color: var(--error);
}

.cart-elem-rectangle.warn {
  background-color: var(--warning);
}

.temp-elem-rectangle {
  flex-grow: 1;
  background-color: var(--success);
  border: 3px solid var(--hover-background);
  color: var(--body-background);
  font-size: 1em;
  font-weight: bold;
}

#status-details {
  color: var(--body-text);
  display: flex;
  flex: 100%;
  flex-direction: row;
  flex-wrap: nowrap;
  font-size: 1.1rem;
}

#status-details tbody,
#status-details td,
#status-details tfoot,
#status-details th,
#status-details thead,
#status-details tr {
  font-size: 1rem;
}

.chamber-status-details {
  border-right: 2px solid var(--grey-primary);
  /*font-size: 2em;*/
  padding: 10px;
  flex: 60%;
}

.chamber-program-details {
  border-left: 2px solid var(--grey-primary);
  flex: 100%;
  padding: 10px 10px 0 10px;
  font-size: 1rem;
  display: flex;
  flex-direction: column;
}

/* ParameterView Card Styling */
.parameterview-card {
  background-color: #6c757d !important;
  color: white !important;
}

.parameterview-card .k-card-header {
  flex: min-content;
  overflow: auto;
  max-width: 20vw;
}

.parameterview-card .k-card-body {
  flex: min-content;
  overflow: auto;
  max-width: 60vw;
}

.parameterview-card .k-card-actions {
  flex: min-content;
  overflow: auto;
  max-width: 20vw;
}

.parameterview-card .k-card-header,
.parameterview-card .k-card-body,
.parameterview-card .k-card-actions {
  background-color: #6c757d !important;
  color: white !important;
}

.parameterview-card .k-card-title {
  color: white !important;
}

.parameterview-card label,
.parameterview-card .form-label {
  color: white !important;
}

.parameterview-card small {
  color: #e9ecef !important;
}

.parameterview-card .text-danger {
  color: #d7828a !important;
}

.parameterview-card .k-input,
.parameterview-card .k-input-inner,
.parameterview-card .k-textbox,
.parameterview-card .k-numerictextbox,
.parameterview-card .k-checkbox {
  background-color: #495057 !important;
  color: white !important;
  border-color: #adb5bd !important;
}

.parameterview-card .k-input::placeholder,
.parameterview-card .k-input-inner::placeholder {
  color: #adb5bd !important;
}

.parameterview-card .k-button {
  background-color: #495057 !important;
  border-color: #adb5bd !important;
  color: white !important;
}

.parameterview-card .k-button:hover {
  background-color: #343a40 !important;
  border-color: #6c757d !important;
}

#chamber-parts {
  border-top: 4px solid var(--grey-primary);
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 0px;
  padding-top: 1px;
  padding-bottom: 5px;
  margin-left: 16px;
  margin-right: 16px;
  text-align: center;
  flex: 20%;
}

#chamber-cart-demo {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 0px;
  text-align: center;
}

.cartdemo-carts-row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 10px;
  height: 64px;
  margin-top: 10px;
  margin-bottom: 10px;
}

.dialog-title-icon {
  margin-right: 10px;
}

.k-window-title {
  font-size: 0.85rem;
  line-height: 1.5rem;
}

.demo-window {
  background-color: var(--selected-background);
  z-index: 44444;
}

.demo-window img {
  width: 100%;
}

.demo-window ul {
  font-size: 1.5em;
  font-weight: bolder;
}

.demo-window li {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.demo-window .param-name {
  flex: 50%;
}

.demo-window .param_value {
  font-weight: bold;
}

.demo-window .popup-content {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 0.3em;
  margin: 0.7em;
}

.demo-window .dropbtn {
  background-color: var(--hover-background);
  border: none;
  border-radius: 5px;
  color: var(--body-text);
  font-size: 2em;
  height: 40px;
  padding: 6px;
  width: 250px;
}

.demo-window .dropdown {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  position: relative;
  scale: 0.85;
  line-height: 0.9em;
}

.demo-window .dropdown-content {
  background-color: var(--body-background);
  border-radius: 5px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  display: none;
  font-size: 2em;
  margin-top: 40px;
  min-width: 250px;
  position: absolute;
  z-index: 1;
}

.demo-window .dropdown-content a {
  color: var(--body-text);
  display: block;
  padding: 12px 16px;
  text-decoration: none;
}

.demo-window .dropdown-content a:hover {
  background-color: var(--hover-background);
}

/*::deep .k-window-title.k-dialog-title*/
.demo-window .k-window-title.k-dialog-title {
  font-size: 2em !important;
}

.demo-window .program-variation-container {
  flex: 50%;
  padding: 0.7em;
  height: 12em;
}

.demo-window .program-variation-container:not(.last) {
  border-right: 3px solid #495057;
}

.demo-window .program-variation-container p {
  font-size: 1.3em;
  font-weight: bolder;
  text-align: center;
  margin-bottom: 1.1em;
}

.demo-window .program-variations {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  margin: 1em;
  gap: 15px;
}

.demo-window .program-variation {
  display: flex;
  flex: 50%;
  flex-direction: column;
  padding: 10px;
}

.demo-window .program-variation img {
  margin-bottom: 0;
  height: 3.5em;
}

#dry-freezed-variation img,
#water-freezed-variation img {
  height: 2.5em;
}

.demo-window .program-variation span {
  text-align: center;
  margin-top: 0.15rem;
}

.demo-window .program-variations:not(.water_freezed) #dry-freezed-variation {
  border: 5px solid var(--success);
}

.demo-window .program-variations.water_freezed #water-freezed-variation {
  border: 5px solid var(--success);
}

.demo-window .program-variations.speed #speed-variation {
  border: 5px solid var(--success);
}

.demo-window .program-variations.quality #quality-variation {
  border: 5px solid var(--success);
}

div.disabled_variation {
  opacity: 0.4;
}

.demo-window .selected .dropdown-content {
  display: none;
}

.demo-window .description {
  font-size: 1.2em;
}

.demo-window .dropdown:not(.selected):not(.default) .dropdown-content {
  display: block;
}

.program-details-popup .k-window-content {
  padding: 0 0.7rem;
}

.params ul {
  padding-left: 0;
  margin-bottom: 0;
}

.chamber-status-details .chamber-header {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: column;
  border: none;
  margin-bottom: .5rem;
}

.chamber-status-details .param-name a {
  white-space: nowrap;
}

#chamber-status {
  display: flex;
  width: 100%;
  flex-direction: row;
}

.chamber-status-details .chamber-header .param-value {
  font-size: 1.5rem;
  font-weight: bold;
  text-transform: uppercase;
  text-align: right;
  flex: 40%;
  flex-grow: 1;
}

.chamber-status-details .chamber-header .param-name {
  font-size: 1.4rem;
  font-weight: bold;
  text-align: left;
  flex: 60%;
  padding-right: 10px;
}

.chamber-params {
  display: flex;
  flex-direction: row;
  gap: 1.2em;
  font-size: 1rem;
}

.chamber-status-details .param-value {
  flex-grow: 1;
  text-align: right;
}

.chamber-status-details .chamber-header .ok {
  color: var(--success);
}

.chamber-status-details .chamber-header .warning {
  color: var(--warning);
}

.chamber-status-details .chamber-header .error {
  color: var(--error);
}

.chamber-status-details>ul {
  font-size: 2em;
  padding-left: 0;
  list-style-type: none;
}

.chamber-status-details li {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 0.4em;
}

.chamber-status-details p {
  margin-bottom: 0;
}

.program-status-details .param-value {
  width: 50%;
  text-align: left;
}

.program-status-details .param-name {
  width: 50%;
  padding-right: 10px;
}

u.program-status-details l {
  font-size: 2em;
  padding-left: 0;
}

.program-status-details li {
  display: flex;
  flex-wrap: wrap;
}

.adminGUI-mainblock {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
}

.adminGUI-mainblock .k-grid-header th {
  vertical-align: middle !important;
  padding: 0.35em 0.35em !important;
}

.adminGUI-mainblock .k-table-md .k-table-td {
  padding: 0.35em !important;
}

.adminGUi-notification.closed {
  display: none;
}

.adminGUi-notification.success {
  background-color: var(--success);
}

.adminGUi-notification.error {
  background-color: var(--error);
}

.adminGUi-notification {
  color: var(--body-text);
  flex: 10%;
  margin-bottom: 5px;
  padding: 7px;
  min-height: 54px;
}

.notification-close {
  float: right;
}

.program-graph-and-editor-container {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}

.program-editor-graph {
  /* flex: 400px; */
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
  padding: 8px;
}

.program-editor-graph #program-graph-canvas-container {
  height: 384px;
}

.program-editor-container {
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
  margin: 10px 0 0 0;
  padding: 10px;
}

.program-editor-phase-details {
  margin: 20px 0;
}

.program-editor-rule-details {
  margin: 20px 0;
}

.program-editor-controls {
  margin: 20px 0;
}

.window-actions {
  margin-top: 30px;
}

#password-block {
  display: flex;
  flex-direction: row;
  gap: 5px;
  margin-bottom: 12px;
  margin-top: 12px;
}

.k-window,
.k-list {
  background: var(--selected-background);
  border-radius: var(--category-radius);
  opacity: 0.99;
  font-size: 0.9rem;
}

.k-window {
  max-width: 80vw;
  max-height: 96vh;
}

.adminGUI-mainblock {
  width: calc(100vw - 110px);
  padding-top: 18px;
  padding-right: 60px;
}

.adminGUI-mainblock .k-button-md {
  margin: 5px;
}

.more-actions-list {
  padding: 0;
  width: 150px;
}

.k-animation-container,
.k-calendar {
  background-color: var(--selected-background);
}

.k-nav-today {
  color: var(--body-text) !important;
}

.custom-buttons-block {
  display: flex;
  flex-direction: row;
  gap: 10px;
  justify-content: center;
}

.window-actions #ok-button {
  width: 80px;
}

.k-form-field {
  background-color: var(--field-text);
}

input::placeholder {
  color: var(--body-text) !important;
}

.k-input-solid,
.k-input-solid:focus-within {
  color: var(--body-text) !important;
}

.auth-section .k-form-buttons {
  justify-content: center;
}

.k-button-solid-primary:hover,
.k-button-solid-primary.k-hover {
  background-color: var(--blue-primary);
  border-color: var(--blue-primary);
}

.k-dialog-content input,
.k-dialog-content input::placeholder {
  color: var(--field-text) !important;
}

.k-dialog-buttongroup {
  justify-content: center;
}

.breadcrumb-menu .k-breadcrumb,
.cart-details-breadcrumb {
  line-height: 0.5;
  font-size: 1.1em;
  font-weight: bolder;
  padding-bottom: 15px;
}

.k-breadcrumb-link,
.k-breadcrumb-root-link {
  text-decoration: unset;
  color: var(--grey-primary) !important;
}

.k-breadcrumb-delimiter,
.k-breadcrumb-delimiter-icon {
  font-size: 1em;
  color: var(--hover-background);
  font-weight: bolder;
}

.k-grid .k-grid-img-td,
k-grid .k-grid-img-tooltip {
  text-align: center !important;
}

.admingui-index-menu .title h1 {
  margin-bottom: 1rem;
}

.program-details-popup-title,
.issue-window .k-window-title {
  font-size: 1.4em;
}

.popup-content .description p {
  margin-bottom: 0.2rem;
}

#programs-view .k-card-title {
  flex: 85%;
}

.template-wrapper {
  display: flex;
  flex-direction: row;
  height: auto;
  gap: 20px;
}

.template-wrapper p {
  font-size: 1.1em;
  line-height: 1.5;
  padding: 20px;
  width: 350px;
  text-align: left;
  box-sizing: border-box;
  margin: 0;
}

.narrow-tooltip .template-wrapper p {
  padding: 0;
  text-align: center;
}

.template-wrapper img {
  width: 80px;
  height: 80px;
  align-self: center;
}

.custom-tooltip-param-value {
  font-weight: bolder;
  padding-left: 15px;
}

.k-filter-menu-container .k-input-md .k-input-inner,
.k-picker-md .k-input-inner {
  padding: 0;
  margin-left: 5px;
  color: var(--body-text);
}

.is-parameter-valid_False {
  border: 4px solid var(--warning);
}

.is-parameter-valid_True {
  border: unset;
}

.param-value i.fa-warning {
  margin-left: 12px;
}

#chamber-other-params ul li {
  display: flex;
  justify-content: space-between;
}

#chamber-other-params .normal-text {
  color: var(--body-text);
  text-decoration: none;
}

#chamber-other-params .error {
  color: var(--error);
}

#chamber-other-params .error-text {
  color: var(--error);
  text-decoration: none;
}

#chamber-other-params li .param-name {
  flex: 60%;
}

#chamber-other-params li .param-value {
  flex: 40%;
  font-size: 1.15em;
}

.measure-unit_with_padding {
  padding-right: 1.6em;
  padding-left: 1em;
}

.param-value .k-numerictextbox {
  width: 100px;
}

.param-value .k-numerictextbox .k-input-inner {
  color: var(--body-text);
}

.pump-control-dialog {
  width: calc(100vw - 2 * 2em);
  max-width: 450px;
}

.pump-control-dialog .k-window-titlebar div {
  justify-content: center;
}

.pump-control-dialog .k-actions .custom-button-url.program-button {
  width: 140px !important;
  height: 2.8em;
}

.pump-control-dialog-warning {
  color: var(--error);
  margin: 1em;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
}

.pump-control-dialog-warning div {
  text-align: center;
}

.pump-control-dialog-container {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-around;
  gap: 1em;
}

.pump-control {
  width: 10em;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: space-evenly;
  gap: 1em;
}

.pump-control .pump-control-title {
  text-align: center;
}

.pump-control .pump-control-value {
  text-align: center;
}

.pump-control .pump-control-button {
  text-align: center;
}

.adminGUI-img-cell {
  width: calc(100% - 1.4em);
  height: auto;
  margin: 10px;
  background-color: white;
  text-align: center;
  max-width: 150px;
  max-height: 80px;
}

.adminGUI-img-cell img {
  max-width: 150px;
  width: 100%;
  max-height: 80px;
}

.adminGUI-icon-cell {
  width: 40px;
  height: 40px;
  margin: 10px;
  text-align: center;
}

.adminGUI-icon-cell img {
  max-width: 60px;
  max-height: 60px;
  width: 100%;
  height: 100%;
}

.graph {
  margin-top: 0.5em;
}

.program-graph-stage {
  flex: 1 1 auto;
  position: relative;
  /* flex: 50%; */
  /* height: 100%; */
  /* max-width: 1195px; */
}

.program-graph-stage canvas {
  position: absolute;
}

.program-graph {
  display: flex;
  flex: 100% 0 1;
  flex-flow: column;
  height: 100%;
  padding-top: 5px;
  padding-bottom: 10px;
  padding-left: 10px;
  padding-right: 10px;
  max-width: 1195px;
  position: relative;
  justify-content: center;
  align-items: center;
}

.chamber-program-details {
  display: flex;
  justify-content: center;
  align-items: center;
}

.program-graph .header {
  flex: 0 1 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: baseline;
}

.program-graph .header .back-button {
  color: var(--subtle-text);
}

.program-graph .header .back-button:hover {
  color: var(--body-text);
}

.program-graph .header .back-button a {
  display: block;
  padding-left: 2px;
  width: 48px;
  height: 100%;
  color: var(--subtle-text);
}

.program-graph .header .back-button a:hover {
  color: var(--body-text);
}

.program-graph .header .title {
  margin: 0 8px 8px 36px;
  flex: 1 1 auto;
  text-align: center;
}

.program-graph .header .title h3,
.program-graph .header .title h4 {
  color: var(--body-text);
  display: inline;
  margin: 0 4px 0 4px;
}

.environment-information {
  margin: 0 8px 0 8px;
  flex: 0 1 auto;
  text-align: center;
  color: var(--body-text);
}

.environment-information span.environment-information-simulation-running {
  color: var(--simulation-running-color);
  font-weight: bold;
  font-size: 1.7em;
}

.environment-information-tooltip-container .environment-information-note span {
  margin: 0.5em 0 0 0;
  padding: 0;
}

.environment-information-tooltip-container {
  padding: 0.6rem 0.3rem 0.6rem 0.3rem;
}

.environment-information-tooltip-container th {
  font-weight: normal;
  font-style: italic;
}

.program-graph .footer {
  flex: 0 1 auto;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  margin: 8px 0 0 0;
}

.program-graph .footer .notice {
  color: var(--body-text);
  flex: 1 1 auto;
  margin: 0 8px 0 36px;
  text-align: center;
}

.program-graph .footer .settings-button {
  flex: 0 0 auto;
  margin: 0;
}

.page-container {
  background-color: var(--element-bg-color);
  border-radius: var(--category-radius);
  padding: 20px;
}

.page-container .page-header {
  color: var(--body-text);
}

.page-container .page-body {
  color: var(--body-text);
}

.chart-page .page-header h3 {
  margin-left: 32px;
}

.page-container .k-selection-multiple {
  color: var(--body-text);
}

.page-container .k-input-inner {
  color: var(--body-text);
}

.chart-page .chart-header {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: center;
}

.chart-page .system-run-info {
  margin-left: 42px;
}

.chart-page .system-run-info .title {
  font-weight: bold;
  /* margin-right: 20px; */
}

.chart-page .system-run-info .title .k-button {
  margin-left: 8px;
}

.chart-page .system-run-info .title-block {
  margin-right: 20px;
}

.chart-page .system-run-info .title-block.checkbox-with-label {
  white-space: nowrap;
}

.chart-page .chart-no-data {
  width: 100%;
  height: 480px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.chart-page .chart-no-data .label {
  text-align: center;
  font-size: 180%;
}

.chart-tooltip .chart-tooltip-quantity {
  text-align: center;
}

.chart-tooltip .chart-tooltip-system-unit {
  text-align: center;
}

.chart-tooltip .chart-tooltip-value {
  text-align: center;
  font-size: 200%;
  font-weight: bold;
}

.chart-tooltip .chart-tooltip-elapsed-time {
  text-align: center;
}

.chart-tooltip .chart-tooltip-wallclock-time {
  text-align: center;
}

.chart-page .chart-params-selector-container {
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 10px 12px;
}

.chart-page .chart-params-selector-container .k-combobox {
  width: 300px;
}

.chart-page .chart-zoom-value-label-container {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
}

.chart-page .chart-zoom-phase-selector {
  margin-top: 4px;
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: center;
  gap: 0px 16px;
}

.chart-page .chart-zoom-phase-selector .k-slider {
  flex: 1 1 auto;
}

.chart-page .chart-zoom-slider-container {
  flex: 1 1 auto;
  display: flex;
  flex-flow: column nowrap;
  align-items: stretch;
}

.chart-page .chart-zoom-slider-container .k-slider {
  flex: 1 1 auto;
  width: 100%;
}

.chart-page .chart-zoom-slider-container .rangeslider-handle-labels {
  position: relative;
  width: 100%;
  height: 3em;
}

.chart-page .chart-zoom-slider-container .rangeslider-selection-lengths {
  position: relative;
  width: 100%;
  height: 3em;
}

.chart-page .chart-zoom-slider-container .rangeslider-handle-labels .rangeslider-label,
.chart-page .chart-zoom-slider-container .rangeslider-selection-lengths .rangeslider-label {
  line-height: 1em;
  font-size: 1em;
  text-align: center;
}

.chart-page .chart-zoom-slider-container .rangeslider-handle-labels .rangeslider-label.start {
  display: inline;
  position: absolute;
  left: calc(var(--rangeslider-start) * 1%);
  transition: left var(--rangeslider-transition-duration) linear;
  transform: translateX(-50%);
  width: 8em;
  padding-bottom: 1.5em;
}

.chart-page .chart-zoom-slider-container .rangeslider-handle-labels .rangeslider-label.end {
  display: inline;
  position: absolute;
  left: calc(var(--rangeslider-end) * 1%);
  transition: left var(--rangeslider-transition-duration) linear;
  transform: translateX(-50%);
  width: 8em;
  padding-bottom: 1.5em;
}

.chart-page .chart-zoom-slider-container .rangeslider-selection-lengths .rangeslider-label.before-selection {
  display: inline;
  position: absolute;
  left: calc(var(--rangeslider-start) * 0.5%);
  transition: left var(--rangeslider-transition-duration) linear;
  transform: translateX(-50%);
  padding-top: 0.5em;
  padding-bottom: 1em;
}

.chart-page .chart-zoom-slider-container .rangeslider-selection-lengths .rangeslider-label.selection {
  display: inline;
  position: absolute;
  left: calc((var(--rangeslider-start) * 1%) + ((var(--rangeslider-end) - var(--rangeslider-start)) * 0.5%));
  transition: left var(--rangeslider-transition-duration) linear;
  transform: translateX(-50%);
  padding-top: 0.5em;
  padding-bottom: 1em;
}

.chart-page .chart-zoom-slider-container .rangeslider-selection-lengths .after-selection {
  display: inline;
  position: absolute;
  left: calc((var(--rangeslider-end) * 1%) + ((100% - var(--rangeslider-end) * 1%) / 2));
  transition: left var(--rangeslider-transition-duration) linear;
  transform: translateX(-50%);
  padding-top: 0.2em;
}

.chart-page .chart-series-selector-title {
  margin: 12px 0 4px 0;
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  align-items: center;
  gap: 0px 6px;
}

.chart-series-selector-item-no-data {
  margin-left: 0.6em;
}

.chart-series-selector-no-data ul {
  list-style-type: none;
}

.chart-page .chart-time-step-selector-container {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
  gap: 10px 12px;
  margin-top: 42px;
  margin-bottom: 12px;
}

.chart-phases-duration {
  display: none;
}

.k-step-list-horizontal .k-step-link {
  -ms-flex-direction: column;
  flex-direction: column;
  margin: 0 !important;
}

.k-stepper .k-step-current .k-step-label {
  font-weight: bold;
  width: 100%;
  font-size: 1.2em;
}

.k-form,
.k-form-inline {
  font-size: 1.2rem;
}

.auth-section .k-input-md .k-input-inner {
  background-color: var(--field-text) !important;
}

.k-dropdownlist .k-input-inner {
  background-color: unset;
}

.k-form-hint,
.k-form-error {
  font-size: 1em;
  font-weight: 500;
}

.k-stepper .k-step-label .k-step-text {
  max-width: unset;
  font-size: 1.1em;
  text-overflow: unset;
}

.k-step-list-horizontal .k-step-link {
  max-width: unset;
}

.k-form,
.k-form-inline {
  color: var(--element-bg-color);
}

.k-form-field {
  background-color: transparent;
}

.k-form .k-form-label {
  font-weight: bold;
}

.rating-wrapper {
  padding-bottom: 0.8em;
}

@media (min-width: 1200px) {

  .h3,
  h3 {
    font-size: 1.5rem;
  }

  .h1,
  h1 {
    font-size: 2rem;
  }

  .h4,
  h4 {
    font-size: 1.2rem;
  }
}

.h3,
h3 {
  font-size: calc(1rem + 0.6vw);
}

.h4,
h4 {
  font-size: calc(1rem + 0.1vw);
}

@media (max-width: 1680px) {

  .chamber-params,
  #status-details tbody,
  #status-details td,
  #status-details tfoot,
  #status-details th,
  #status-details thead,
  #status-details tr {
    font-size: 0.9rem;
  }

  .h1,
  h1 {
    font-size: 1.8rem;
  }

  .chamber-status-details .chamber-header .param-name {
    font-size: 1.4rem;
  }

  .chamber-status-details .chamber-header .param-value {
    font-size: 1.6rem;
  }

  .chamber-status-details .chamber-header .param-value {
    font-size: 1.4rem;
  }

  .cart-card {
    width: 16em;
  }
}

@media (max-width: 1540px) {

  .chamber-params,
  #status-details tbody,
  #status-details td,
  #status-details tfoot,
  #status-details th,
  #status-details thead,
  #status-details tr {
    font-size: 0.8rem;
  }

  .chamber-buttons a,
  .chamber-buttons .custom-button-url,
  .cart-container .custom-button-url {
    width: 120px !important;
  }

  .h1,
  h1 {
    font-size: 1.7rem;
  }

  .chamber-status-details .chamber-header .param-name {
    font-size: 1.3rem;
  }

  .chamber-status-details .chamber-header .param-value {
    font-size: 1.5rem;
  }

  .chamber-status-details .chamber-header .param-value {
    font-size: 1.3rem;
  }

  .cart-title {
    font-size: 1.2em;
  }

  .cart-overview {
    font-size: 0.9em;
  }

  .chamber-view {
    flex: 60%;
  }
}

@media (max-width: 1300px) {

  .chamber-params,
  #status-details tbody,
  #status-details td,
  #status-details tfoot,
  #status-details th,
  #status-details thead,
  #status-details tr {
    font-size: 0.73rem;
  }
}

@media (max-width: 1200px) {

  .chamber-params,
  #status-details tbody,
  #status-details td,
  #status-details tfoot,
  #status-details th,
  #status-details thead,
  #status-details tr {
    font-size: 0.73rem;
  }
}

/*@media (max-width: 920px) {

    .chamber-params, #status-details tbody, #status-details td, #status-details tfoot, #status-details th, #status-details thead, #status-details tr {
        font-size: 1.1rem;
    }

    .h1, h1 {
        font-size: 1.8rem;
    }

    .chamber-status-details .chamber-header .param-name {
        font-size: 1.4rem;
    }

    .chamber-status-details .chamber-header .param-value {
        font-size: 1.6rem;
    }

    .chamber-status-details .chamber-header .param-value {
        font-size: 1.4rem;
    }
}*/

.program-details-popup {
  width: calc(100vw - 2rem) !important;
  height: 850px !important;
  max-width: 1000px !important;
  min-width: 120px !important;
}

.k-window-titlebar {
  padding: 0.3rem 1rem;
  background: var(--dialog-background);
}

.k-window-content {
  padding: 0.4rem 0.7rem;
  background-color: var(--dialog-background);
}

@media (max-height: 1000px) {
  .program-details-popup {
    height: calc(100vh - 7.5rem) !important;
  }
}

.accurate-value {
  display: flex;
  scale: 1;
  margin-top: 0;
  margin-left: 1.5em;
}

.k-window-actions {
  margin: 0;
  line-height: 1.7em;
}

.k-grid .k-grid-content {
  font-size: 0.9em;
}

.k-table-md {
  font-size: 0.9rem;
  line-height: 1rem;
}

.site-specifications {
  display: flex;
  flex-direction: column;
  background-image: url(/img/SpaceSize_2.svg);
  background-repeat: no-repeat;
  background-position: center;
  height: 23em;
}

.site-length-width {
  display: flex;
  flex-direction: row;
}

.site-height,
.site-length,
.site-width {
  margin: 0 auto;
}

.site-height:before {
  content: "(m)";
  position: absolute;
  z-index: 1;
  color: var(--blue-primary);
  right: 45%;
  margin-top: 0.15em;
}

.site-length:before {
  content: "(m)";
  position: absolute;
  z-index: 1;
  color: var(--blue-primary);
  left: 29.5%;
  margin-top: 0;
}

.site-width:before {
  content: "(m)";
  position: absolute;
  z-index: 1;
  color: var(--blue-primary);
  right: 21.8%;
  margin-top: 0;
}

.site-specifications input {
  text-align: center;
  margin: 0 auto;
}

.space-size-img {
  transform: scale(0.6);
  margin: -22em 0 0 0;
  z-index: -1;
}

.system-details-products .k-grid,
.system-details-products .k-table-md .k-table-th,
.system-details-products .k-table-md .k-table-td {
  font-size: 0.9em;
}

.system-details-products {
  display: flex;
  flex-direction: column;
  gap: 1.5em;
}

.system-details-products-first-row {
  display: flex;
  flex-direction: row;
  gap: 1.3em;
}

.system-details-products-second-row {
  display: flex;
  flex-direction: row;
  gap: 1.5em;
}

h4.system-products {
  margin: 1.5em 0;
}

.system-details-chamber .k-grid {
  width: 140%;
}

#setup-completed-img {
  width: 40%;
  height: auto;
  margin-left: 28%;
}

.skip-setup {
  margin-top: 10px;
  width: 130px;
  margin-left: 30px;
}

.temp-calculator,
.temp-calculator:hover {
  width: 25px;
  background-color: var(--body-text);
}

.temp-calculator img {
  width: 15px;
}

.site-overall {
  text-align: center;
  margin: 5.8em;
  font-size: 1.4em;
  font-weight: bold;
}

.cart-details-grid .k-grid tr {
  height: calc((100vh - 5.6vh - 12vh) / 36);
  font-size: 0.8em;
}

.k-table-md .k-table-th,
.k-table-md .k-table-td {
  padding: inherit;
}

.validation-error-message {
  color: var(--error);
}

.issue-window {
  max-width: 2000px;
  height: 600px;
  z-index: 10002;
  width: 95%;
}

@keyframes pulse {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgb(150, 201, 130);
  }

  70% {
    transform: scale(1);
    box-shadow: 0 0 0 7px rgba(0, 0, 0, 0);
  }

  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
  }
}

#all-carts-registered-button {
  width: 145px;
}

.extra-cart-border {
  background-color: var(--cart-floor-color);
  height: calc((100vh - 5.6vh - 12vh) / 36 - 1.55em) !important;
  margin-top: 0;
}

.disabled-stepper .k-stepper {
  pointer-events: none;
}

.cart-details-breadcrumb {
  display: none;
}

@media (max-width: 2400px) {
  .extra-cart-border {
    height: calc((100vh - 12vh - 5.6vh) / 36 - 1.4em);
    margin: 0;
  }
}

@media (max-width: 2200px) {
  .extra-cart-border {
    height: calc((100vh - 12vh - 5.6vh) / 36 - 1.3em);
    margin: 0;
  }
}

@media (max-width: 2100px) {
  .px-4 {
    padding-left: 0.6rem !important;
  }

  .drawer-container .custom-toolbar {
    padding: 3px 8px;
  }

  .content {
    padding-top: 0.1rem;
  }

  .system-notifications {
    margin-right: 0;
  }

  .chamber-first-row-elems {
    padding: 5px 0 8px 0;
    height: 382px;
  }

  .chamber-status-details {
    padding: 5px 10px 0;
  }

  .temp-elem-rectangle {
    font-size: 0.9em;
  }

  .cartdemo-carts-row {
    height: 54px;
    margin-top: 2px;
    margin-bottom: 2px;
  }

  .cart-elem-rectangle,
  .cart-elem-rectangle.empty-location {
    font-size: 1.0em;
  }

  .cart-overviews {
    padding-right: 39px;
    gap: 0.1em 1.6em;
    padding-right: 0;
  }

  .cart-card {
    margin: 1px 5px 10px 5px;
  }

  .cart-title {
    padding-top: 0.7em;
    font-size: 1.1em;
  }

  .breadcrumb-menu .k-breadcrumb,
  .cart-details-breadcrumb {
    padding-bottom: 5px;
  }

  .program-tuning {
    padding: 0 0.5em 0.5em;
  }

  .cart-container {
    border-width: 10px 20px 36px 20px;
    line-height: 1.4em;
  }

  .cart-overview {
    font-size: 0.9em;
  }

  .cart-container .custom-button-url {
    width: 120px;
  }

  .carts-two-row_False {
    padding: 5px 0 20px 0;
  }

  .extra-cart-border {
    height: calc((100vh - 5.6vh - 12vh) / 36 - 1.3em) !important;
  }
}

@media (max-width: 1736px) {
  .cart-card {
    width: 18em;
  }
}

@media(max-width: 1400px) {
  #programs-view .program-variation img {
    height: 3.5em;
    width: 4.5em;
  }

  .template-wrapper p {
    font-size: 1em;
    padding: 10px;
  }

  .cart-elem-rectangle.ok {
    padding: 0.2em;
  }

  .cart-elem-rectangle {
    font-size: 1em;
  }

  .cart-elem-rectangle.empty-location {
    font-size: 1em;
    padding: 0.2em;
  }

  h1 {
    font-size: 1.5rem;
  }

  h3 {
    font-size: 1.1em;
  }

  h4 {
    font-size: 1em;
  }

  .chamber-buttons a,
  .chamber-buttons .custom-button-url.button-component,
  .cart-container .custom-button-url,
  .custom-button-url.program-button {
    width: 90px !important;
    font-size: 0.7rem;
  }

  .button-component {
    padding-top: 11px;
  }

  .chamber-status-details .chamber-header .param-name,
  .chamber-status-details .chamber-header .param-value {
    font-size: 1.2rem;
  }

  .cart-title {
    font-size: 1em;
  }

  .cart-container th.value {
    font-size: 1.3em;
  }

  .cart-overview {
    font-size: 0.7em;
  }

  .cart-card {
    width: 15em;
    margin: 14px 5px;
  }

  #chamber-parts {
    border-top: 2px solid var(--grey-primary);
  }

  .chamber-status-details {
    border-right: 0.25px solid var(--grey-primary);
  }

  .chamber-status-details .chamber-header {
    height: 70px;
  }

  .k-icon-button.k-button-md>.k-button-icon {
    min-height: 1.1rem;
    min-width: 1.1rem;
  }

  .program-graph-not-selected {
    font-size: 0.9em;
  }

  .breadcrumb-menu {
    font-size: 0.8em;
  }

  #programs-view a,
  .admingui-index-menu a {
    min-width: 220px;
    max-width: 310px;
  }

  #programs-view .k-card,
  #sub-categories .k-card,
  #categories .k-card,
  .admingui-index-menu .k-card {
    font-size: 0.55rem;
  }

  #programs-view .card-img-block,
  .admingui-index-menu .card-img-block {
    height: 150px;
  }

  .k-card-body {
    padding: 0.9rem 0.9rem;
  }

  #programs-view .k-card {
    font-size: 0.55rem;
  }

  #programs-view .k-card-title,
  #sub-categories .k-card-title,
  #categories .k-card-title,
  .admingui-index-menu .k-card-title {
    font-size: 1.3rem;
  }

  .k-card-title {
    font-size: 1.25rem;
    line-height: 1.2;
    margin: 0 0 0.5rem;
  }

  #programs-view .k-card-subtitle,
  #sub-categories .k-card-subtitle,
  #categories .k-card-subtitle,
  .admingui-index-menu .k-card-subtitle {
    font-size: 1.6em !important;
  }

  .k-card-subtitle {
    font-size: 1rem;
    line-height: 1.2;
    margin: 0 0 0.75rem;
  }

  #programs-view .k-card-title {
    flex: 65%;
  }

  .program-details-popup {
    max-width: 700px !important;
    height: 660px !important;
  }

  .k-window,
  .k-list {
    font-size: 0.9rem;
  }

  .k-window-titlebar {
    padding: 0.3rem 1rem;
  }

  .k-window-title {
    font-size: 0.8rem;
  }

  .demo-window .program-variation img {
    height: 4.5em;
  }

  .program-details-popup-title,
  .issue-window .k-window-title {
    font-size: 1.1em;
  }

  .demo-window .program-variation-container p {
    font-size: 1.1em;
  }

  #program-details-params .params-header {
    font-size: 0.9em;
  }

  #program-details-params .params-content {
    font-size: 0.8em;
  }

  .demo-window .description {
    font-size: 0.9em;
  }

  .popup-content .custom-buttons-block button {
    font-size: 0.8em;
    width: 90px;
  }

  .temp-calculator-popup {
    max-width: 700px !important;
    height: 260px;
  }

  .system-notifications {
    margin: 0 0 0 auto;
    font-size: 0.9em;
  }

  main {
    margin-left: -0.9em;
  }

  .notification {
    margin-top: 0;
  }

  .notification-fatal-error .notification-message {
    margin: 6px;
  }

  .notification-fatal-error .error-message {
    font-size: 0.8rem;
  }

  .system-notifications p {
    margin-top: 0;
    margin-bottom: 0.5rem;
    font-size: 0.75rem;
  }

  .notification-new-cart-detected .notification-data {
    font-size: 0.75rem;
  }

  .program-tuning {
    padding: 0.75em 0.5em;
  }

  .cart-name {
    font-size: 1em;
  }

  .k-button-md {
    font-size: 0.7rem;
    padding: 0.3em 0.2em;
  }

  .program-tuning .program-tuning-details {
    margin-left: 0.5em;
  }

  .program-tuning .program-tuning-details .accurate-value .label {
    font-size: 0.7em;
  }

  .program-tuning .k-numerictextbox .k-input-inner {
    width: 60px;
    padding: 0.1em 0;
    text-align: center;
    font-size: 0.7em;
  }

  .cart-overall-state {
    padding: 0 1em 0 1em;
  }

  .cart-overall-state .state {
    padding: 0 1.5em 0 1.5em;
  }

  .cart-overall-state .label {
    font-size: 1em;
  }

  .cart-overall-state .status {
    font-size: 1.3em;
  }

  .cart-overall-state .energy-usage {
    font-size: 0.65em;
  }

  .cart-details>.cart-details-info th {
    padding: 0.35rem 0.15rem;
    font-size: 0.75em;
  }

  .k-table-md {
    font-size: 0.7rem;
  }

  .k-grid .k-grid-content {
    font-size: 0.7em;
  }

  .cart-details-grid .k-grid tr {
    height: calc((100vh - 5.6vh - 12vh) / 36 + 0.2em);
    font-size: 0.8rem;
  }

  .extra-cart-border {
    height: calc((100vh - 5.6vh - 12vh) / 36 - 1.05em) !important;
    margin: -0.1em;
  }

  .cart-details-container>div {
    padding-top: 3px;
  }

  .cart-details-container {
    border-image: url(../img/BasicStandardCart002.svg) 29 30 56 30 stretch stretch;
    padding: 0;
    /*height: calc(100vh + 30px);*/
  }

  .cart-details>.cart-details-info tr {
    height: calc((100vh - 5.6vh - 12vh) / 36 + 0.205em);
    font-size: 0.8rem;
  }

  .cart-for-grid .cart-shelf {
    border-width: 1px 2px 1px 2px;
    padding: 7px;
  }

  .cart-for-grid .cart-shelf-container {
    height: calc((100vh - 5.6vh - 12vh) / 36 + 0.155rem);
    margin: 0;
  }

  .cart-for-grid .cart-shelf span {
    font-size: 0.6em !important;
  }

  .cart-for-grid .cart-shelf-progress-indicator {
    height: calc((100vh - 12vh - 5.6vh) / 36 - 0.2em);
  }

  .k-progressbar {
    font-size: 0.75rem;
    height: 1.2em;
    margin-top: 0.4em;
  }

  .k-progressbar *,
  .k-progressbar *::before,
  .k-progressbar *::after {
    font-size: 0.5rem;
  }

  .k-input-md .k-input-inner,
  .k-picker-md .k-input-inner {
    padding: 0.1em 0.1em;
    font-size: 0.7em;
  }

  .cart-details-grid .k-grid-content td,
  .cart-details-grid .k-grid-header th,
  .cart-details>.cart-details-info td,
  .cart-for-grid .cart-shelf span,
  .cart-details>.cart-details-info th {
    font-size: 0.8em;
  }

  .k-drawer-item {
    font-size: 0.8em;
  }

  .k-drawer-wrapper {
    width: 160px;
  }

  .temp-elem-rectangle {
    font-size: 0.7em;
    padding-top: 0.3em;
  }

  .demo-window .popup-content {
    margin: 0 0.7em;
  }

  .chamber-status-details {
    font-size: inherit;
  }

  .custom-tooltip {
    font-size: 0.7em;
  }

  .k-stepper .k-step-label .k-step-text {
    font-size: 0.8em;
  }

  .system-details-products .k-grid,
  .system-details-products .k-table-md .k-table-th,
  .system-details-products .k-table-md .k-table-td {
    font-size: 0.95em;
  }

  .site-specifications {
    font-size: 0.8em;
  }

  .k-form-field-wrap {
    font-size: 0.9em;
  }

  .validation-message {
    font-size: 0.9em;
  }

  .k-popup .k-list-container .k-dropdownlist-popup {
    font-size: 0.9em;
  }

  .k-button-md {
    font-size: 0.8em;
  }

  #emergency-halt-button {
    width: 60px;
    height: 60px;
  }

  #emergency-halt-button-image {
    width: 42px;
    height: 42px;
    margin-left: 9px;
  }

  #emergency-halt-button-instructions {
    height: 24px;
    padding-bottom: 4px;
    font-size: 20px;
  }

  @media (max-height: 1140px) {
    .cart-for-grid .cart-shelf {
      padding: 3px;
    }

    .cart-details-shelves.is-clicked-True .shelf-index {
      top: 0.4em;
    }
  }
}

@media (max-width: 1280px) {
  .cart-details-container {
    border-image: url(../img/BasicStandardCart002.svg) 34 30 56 30 stretch stretch;
  }

  .cart-details-container>div {
    padding-top: 0;
    margin-top: -0.2em;
  }

  #emergency-halt-button {
    width: 60px;
    height: 60px;
  }

  #emergency-halt-button-image {
    width: 42px;
    height: 42px;
    margin-left: 9px;
  }

  #emergency-halt-button-instructions {
    height: 24px;
    padding-bottom: 4px;
    font-size: 20px;
  }
}

/*@media(min-width: 1600px) {
        .cart-details > .cart-details-info tr {
            font-size: 1.0em;
        }
    }*/

@media (max-width: 1040px) {
  .px-4 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
  }

  .notification {
    gap: 0;
  }

  .system-notifications {
    margin-bottom: 1.2em;
  }

  #chamber-full-view {
    gap: 0.7em;
  }

  .chamber-buttons {
    gap: 0.2em;
  }

  .cart-details {
    margin-bottom: 64px;
  }

  #emergency-halt-button {
    width: 60px;
    height: 60px;
  }

  #emergency-halt-button-image {
    width: 42px;
    height: 42px;
    margin-left: 9px;
  }

  #emergency-halt-button-instructions {
    height: 24px;
    padding-bottom: 4px;
    font-size: 20px;
  }

  .cart-details-breadcrumb {
    display: block;
    font-size: 0.9em;
  }

  .cart-details-breadcrumb .k-breadcrumb-link {
    display: block;
  }

  /*.cart-details-breadcrumb .k-breadcrumb-link.k-disabled {
            cursor: pointer;
            pointer-events: auto;
        }*/
  .cart-details-grid.is-clicked-False {
    display: none;
  }

  .cart-details-shelves.is-clicked-False {
    display: none;
  }

  .cart-details-info.is-clicked-False {
    display: none;
  }

  .cart-details>.cart-details-shelves {
    max-width: 26em;
    margin: 0 auto;
  }

  .cart-details-shelves.is-clicked-True .shelf-index {
    margin-left: -1.7em;
    color: white;
    font-size: 0.7rem;
    top: 0.2em;
    height: calc((100vh - 12vh - 56vh) / 36 - 0.2em);
    position: absolute;
  }

  .cart-details-breadcrumb .k-breadcrumb-last-item {
    display: none;
  }
}

@media (max-width: 1000px) {

  .params-header-small-screen {
    display: none;
  }

  @media (max-width: 860px) {
    .chamber-first-row-elems {
      flex-direction: column !important;
      padding: 0 !important;
      height: 620px;
    }

    .param-value.with-right-padding {
      padding-right: 0 !important;
    }

    #program-details-params {
      line-height: 1.4em;
    }

    #program-details-params .params-header .first-col,
    #program-details-params .params-header .second-col,
    #program-details-params .params-firstcolumn {
      flex: 50%;
    }

    #program-details-params .params-content {
      gap: 5px;
    }

    #program-details-params .params-firstcolumn .param-name {
      flex: 28%;
    }

    #program-details-params .params-firstcolumn .param-value {
      flex: 10%;
    }

    #program-details-params .param-value input {
      width: 55px;
    }

    #program-details-params .params-secondcolumn {
      flex: 40%;
    }

    #programs-view a,
    .admingui-index-menu a {
      min-width: 220px;
      width: 310px;
    }

    .param-value.with-right-padding {
      padding-right: 0 !important;
    }

    #program-details-params {
      line-height: 1.4em;
    }

    #program-details-params .params-header .first-col,
    #program-details-params .params-header .second-col,
    #program-details-params .params-firstcolumn {
      flex: 50%;
    }

    #program-details-params .params-content {
      gap: 5px;
    }

    #program-details-params .params-firstcolumn .param-name {
      flex: 28%;
    }

    #program-details-params .params-firstcolumn .param-value {
      flex: 10%;
    }

    #program-details-params .param-value input {
      width: 55px;
    }

    #program-details-params .params-secondcolumn {
      flex: 40%;
    }

    #programs-view .k-card,
    #sub-categories .k-card,
    #categories .k-card,
    .admingui-index-menu .k-card {
      height: 380px !important;
    }
  }

  .issue-grid .k-table-md .k-table-th,
  .issue-grid .k-table-md .k-table-td {
    white-space: initial;
    padding: 0.25em 0.2em;
  }

  .issue-grid .k-grid tr {
    line-height: 1.3em;
  }

  .issues-no-data {
    line-height: 3.5em;
  }

  .is-empty-True .k-grid-content {
    overflow: hidden !important;
  }

  .is-empty-False .k-grid-content {
    overflow-y: scroll;
  }

  .loading-app-container {
    height: 100vh;
    width: 100vh;
  }

  .loading-progress-text {
    position: absolute;
    text-align: center;
    font-weight: bold;
    inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
  }

  .loading-progress-text:after {
    content: "(" var(--blazor-load-percentage-text, "Loading application") ")";
  }

  @media (max-width: 650px) {
    .chart-page .system-run-info {
      margin-left: 0;
    }

    .cart-overviews {
      padding-right: 0 !important;
    }

    .notification {
      margin-bottom: 0.5em;
    }

    .card-main-block {
      padding-right: 0 !important;
    }

    .drawer-container .custom-toolbar {
      padding: 3px 4px;
      width: 40px;
    }

    #programs-view a,
    .admingui-index-menu a {
      max-width: 280px;
    }
  }

  .drawer-container .custom-toolbar {
    padding: 3px 4px;
    width: 40px;
  }
}

@media (max-width: 570px) {
  .cart-details-header {
    flex-direction: column;
  }
}

@media (max-width: 480px) {
  .pump-control-dialog-container {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: space-around;
    gap: 1em;
  }

  .pump-control {
    width: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: right;
    gap: 1em;
  }

  .pump-control .pump-control-title {
    text-align: left;
    flex: 60%;
    padding-top: 0.5em;
  }

  .pump-control .pump-control-value {
    text-align: right;
    padding-top: 0.5em;
  }

  .pump-control .pump-control-button {
    text-align: center;
    flex: 3;
  }

  .card-main-block {
    padding-left: 1.2em !important;
  }

  #programs-view .k-card-deck,
  #sub-categories .k-card-deck,
  #categories .k-card-deck,
  .admingui-index-menu .k-card-deck {
    flex-direction: column !important;
    flex: 100%;
    justify-content: center !important;
    align-items: center;
  }

  #programs-view .card-main-block,
  #sub-categories .card-main-block,
  #categories .card-main-block,
  .admingui-index-menu .card-main-block {
    flex-direction: column !important;
  }

  #programs-view .k-card-image,
  #sub-categories .k-card-image,
  #categories .k-card-image,
  .admingui-index-menu .k-card-image {
    max-height: unset;
  }

  .program-details-popup {
    height: calc(100% - 5em) !important;
  }

  .demo-window .popup-content {
    margin: 0 !important;
    flex-direction: column !important;
  }

  .demo-window .dropdown {
    flex-direction: column !important;
    line-height: 0.5em !important;
  }

  .demo-window .program-variation-container:not(.last) {
    border-bottom: 3px solid #495057 !important;
    border-right: none !important;
    margin-bottom: 0.5em !important;
  }

  .demo-window .program-variation-container {
    padding: 0 !important;
  }

  #program-details-params:not(.water_freezed) {
    margin-bottom: 1em !important;
  }

  #program-details-params {
    line-height: unset !important;
  }

  .program-details-params-mainblock {
    flex-direction: column !important;
  }

  #program-details-params .params-content {
    flex-direction: column !important;
  }

  #program-details-params .params-header {
    font-size: 1.1em !important;
  }

  #program-details-params .params-firstcolumn .param-name {
    flex: 50% !important;
  }

  #program-details-params .param-value input {
    width: 50px !important;
  }

  .program-details-params-mainblock .params-header {
    display: none !important;
  }

  .params-header-small-screen {
    display: block;
    font-weight: 800;
    font-size: 0.9rem;
  }

  .demo-window .program-variation span {
    line-height: 1em;
  }

  .graph {
    margin-top: 0.5em !important;
  }

  .admingui-index-menu a {
    width: 100% !important;
  }

  .chamber-params {
    flex-direction: column !important;
  }

  #chamber-parts {
    margin-left: 8px !important;
  }

  .custom-confirmdialog {
    width: calc(100vw - 1.8em) !important;
  }

  .k-breadcrumb-link,
  .k-breadcrumb-root-link {
    white-space: initial;
    line-height: 0.9rem;
  }

  .page-container {
    padding: 0.5em;
  }

  .chart-page .chart-header {
    flex-flow: column nowrap;
  }

  .chart-page .system-run-info {
    margin-bottom: 0.5em;
  }

  .chart-page .chart-params-selector-container {
    justify-content: unset;
  }
}

#sub-categories .k-card-image {
  max-height: 185px;

  .k-grid th.multi-row-header {
    white-space: normal;
    vertical-align: middle;
    height: auto;
  }

  .k-grid th.multi-row-header .k-column-title {
    white-space: normal;
    height: auto;
  }

  .program-finished-dialog-content {
    text-align: center;
    padding: 0.5rem 1rem 0 1rem;
  }

  .program-finished-dialog-content img {
    margin: 0;
    padding: 0;
    width: 100%;
    margin-bottom: 1rem;
    border-radius: 0.5rem;
    border: 1px solid var(--grey-primary);
  }

  .color-box {
    width: 15px;
    height: 15px;
    border-radius: 15%;
    /* Slight rounding */
    /* Additional styling as needed */
  }
}

/* Wrap cell content in Kendo Grid */
.k-grid td,
.k-grid th {
  white-space: normal !important;
  word-break: break-word;
  vertical-align: middle;
}