html {
  height: 100%;
  font-size: 14px;
}

body {
  height: 100%;
  overflow: hidden;
}

#app {
  height: 100%;
  display: grid;
  grid-template-areas: "header header" "menu content" "footer footer";
  grid-template-rows: auto 1fr auto;
  grid-template-columns: auto 1fr;
}
#app .main-layout-header {
  grid-area: header;
}
#app .main-layout-menu {
  grid-area: menu;
  box-shadow: 1px 0px 4px rgba(0, 0, 0, 0.15);
}
#app .main-layout-content {
  grid-area: content;
  overflow-y: auto;
  padding: 20px;
  display: flex;
  flex-direction: column;
}
#app .main-layout-content > hr {
  flex-shrink: 0;
}
#app .main-layout-footer {
  grid-area: footer;
}

.window-overlay {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  overflow: auto;
  z-index: 10000;
  display: grid;
  place-items: center;
  background-color: rgba(42, 42, 99, 0.1);
}

.card.stretch-card {
  flex-grow: 1;
  min-height: 0px;
}
.card.stretch-card .card-body {
  display: flex;
  flex-direction: column;
  min-height: 0px;
}
.card.stretch-card .k-grid {
  flex-grow: 1;
  min-height: 0px;
}

.history-grid {
  max-height: 600px;
  min-height: 200px;
  height: fit-content !important;
}

.loader {
  user-select: none;
  text-align: center;
}
.loader .message {
  margin-bottom: 16px;
}
.loader .ball {
  width: 16px;
  height: 16px;
  background-color: #AFCA0B;
  border-radius: 100%;
  display: inline-block;
  animation: bounce-animation 1.4s infinite ease-in-out both;
}
.loader .ball:nth-of-type(1) {
  animation-delay: -0.32s;
}
.loader .ball:nth-of-type(2) {
  animation-delay: -0.16s;
}
@keyframes bounce-animation {
  0%, 80%, 100% {
    transform: scale(0);
  }
  40% {
    transform: scale(1);
  }
}

.side-menu .side-menu-item-container {
  overflow-x: hidden;
}
.side-menu .side-menu-item-container:hover {
  background: #e9ecef;
}
.side-menu .side-menu-item-container.active {
  background: #dee2e6;
  box-shadow: inset 4px 0px #AFCA0B;
}
.side-menu .side-menu-item-container.active .side-menu-item {
  font-weight: bold;
}
.side-menu .side-menu-item-container .side-menu-item {
  height: 50px;
  margin: 0px;
  padding: 0px;
  display: flex;
  align-items: center;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
.side-menu .side-menu-item-container .side-menu-item .side-menu-item-icon-container {
  align-self: stretch;
  width: 50px;
  font-size: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.side-menu .side-menu-item-container .side-menu-item-text {
  width: 0px;
  transition-property: width;
  transition-duration: 0.15s;
  transition-timing-function: ease-out;
  white-space: nowrap;
  text-align: left;
}
.side-menu .side-menu-item-container .side-menu-item-child-link > a {
  display: block;
  text-decoration: none;
}
.side-menu .side-menu-item-container .side-menu-item-child-link > a.active {
  font-weight: bold;
}
.side-menu .side-menu-item-container .side-menu-item-expandable-content {
  width: 0px;
  height: 0px;
  overflow: hidden;
  transition-property: width, height;
  transition-duration: 0.15s;
  transition-timing-function: ease-out;
  margin-left: 50px;
}
.side-menu.expanded .side-menu-item-text,
.side-menu.expanded .side-menu-item-expandable-content {
  width: 150px;
}

.preserve-line-breaks {
  white-space: pre-wrap;
}

#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;
}

.validation-message {
  color: #dc3545;
}