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

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

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

#app {
  height: 100%;
  display: grid;
  grid-template-areas: "header header" "menu content";
  grid-template-rows: auto 1fr;
  grid-template-columns: auto 1fr;
}
#app .main-layout-header {
  grid-area: header;
}
#app .main-layout-menu {
  grid-area: menu;
  background-color: #f8f9fa;
  border-right: 2px solid #dee2e6;
  overflow-y: auto;
}
#app .main-layout-content {
  grid-area: content;
  background-color: #f8f9fa;
  overflow-y: auto;
  padding: 20px;
  display: flex;
  flex-direction: column;
}

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

.loader {
  user-select: none;
  text-align: center;
}
.loader .message {
  margin-bottom: 16px;
}
.loader .ball {
  width: 16px;
  height: 16px;
  background-color: #282878;
  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 #11a63c;
}
.side-menu .side-menu-item-container.active .side-menu-item {
  font-weight: bold;
}
.side-menu .side-menu-item-container .side-menu-item {
  height: 45px;
  margin: 0px;
  padding: 0px;
  display: flex;
  align-items: center;
  color: #282878;
  text-decoration: none;
  cursor: pointer;
}
.side-menu .side-menu-item-container .side-menu-item .side-menu-item-icon-container {
  align-self: stretch;
  width: 45px;
  font-size: 16px;
  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: 45px;
}
.side-menu.expanded .side-menu-item-text,
.side-menu.expanded .side-menu-item-expandable-content {
  width: 120px;
}

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

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

.bg-light-red {
  background-color: #fae3e5 !important;
}
.bg-light-red:hover {
  background-color: #f8d6d9 !important;
}

.side-panel-dialog {
  height: 100%;
  top: 0 !important;
  right: 0 !important;
  transform: unset !important;
  border-radius: 0 !important;
  left: unset !important;
}
.side-panel-dialog .k-window-titlebar {
  border: none !important;
}