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

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

a {
  text-decoration: none;
}

#app {
  height: 100%;
  display: grid;
  grid-template-areas: "header header header" "menu content sidebar" "footer footer footer";
  grid-template-rows: auto 1fr auto;
  grid-template-columns: auto 1fr auto;
}
#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;
  display: flex;
  flex-direction: column;
}
#app .main-layout-content > hr {
  flex-shrink: 0;
}
#app .main-layout-sidebar {
  grid-area: sidebar;
  overflow-y: auto;
}
#app .main-layout-footer {
  grid-area: footer;
}

.form-layout {
  height: 100%;
  display: grid;
  grid-template-areas: "content";
  grid-template-columns: 1fr;
}
.form-layout .form-layout-content {
  grid-area: content;
  overflow-y: auto;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  padding: 20px;
  height: 100%;
}
.form-layout .form-layout-content .scrollable-content {
  flex: 1;
  overflow-x: clip;
  overflow-y: auto;
  padding-right: 20px;
}
.form-layout .form-layout-content .form-layout-tab-content {
  overflow-y: auto;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
}

.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(95, 6, 20, 0.1);
}

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

.w-100-md {
  width: 100px !important;
}
@media (max-width: 768px) {
  .w-100-md {
    width: 100% !important;
  }
}

.w-200-md {
  width: 200px !important;
}
@media (max-width: 768px) {
  .w-200-md {
    width: 100% !important;
  }
}

.w-300-md {
  width: 300px !important;
}
@media (max-width: 768px) {
  .w-300-md {
    width: 100% !important;
  }
}

.w-400-md {
  width: 400px !important;
}
@media (max-width: 768px) {
  .w-400-md {
    width: 100% !important;
  }
}

.w-500-xl {
  width: 500px !important;
}
@media (max-width: 1200px) {
  .w-500-xl {
    width: 100% !important;
  }
}

.w-600-xl {
  width: 600px !important;
}
@media (max-width: 1200px) {
  .w-600-xl {
    width: 100% !important;
  }
}

/* This overrides the css of a message dialog box so that it will have a higher z-index that the grid loading indicator */
.message-dialog {
  z-index: 25000 !important;
}

.k-dialog-wrapper:has(.message-dialog) {
  z-index: 25000 !important;
}

hr {
  min-height: 1px;
}

.t2-drawer-item {
  color: #A32035;
  margin: 0 12px;
  outline: 0;
  font-size: 1rem;
  line-height: 2;
  display: flex;
  flex-flow: row nowrap;
  cursor: pointer;
}
.t2-drawer-item:hover {
  background-color: #fefefe;
  font-weight: 600;
}
.t2-drawer-item.selected {
  background-color: #FFEFF2;
  color: #A32035;
  border-radius: 5px;
  font-weight: 600;
}
.t2-drawer-item .item-text {
  flex: 1;
}
.t2-drawer-item .item-text.no-anchor {
  cursor: default;
  background-color: white;
  font-weight: 400;
}

.t2-drawer-item.k-level-1 {
  padding: 0;
  font-size: 0.9rem;
  line-height: 1.5;
}

.k-level-0 > .side-menu-icon,
.k-level-0 > a {
  padding: 0.5rem 0rem 0.5rem 1rem;
}

.k-level-0 > a > .side-menu-icon {
  padding: 0;
}

.k-level-0 > .item-text {
  padding: 0.5rem 1rem 0.5rem 1rem;
}

.k-level-0 > a.item-text-anchor {
  width: 100%;
  padding: 0.5rem 1rem 0.5rem 1rem;
}

.k-level-1 > a,
.k-level-1 > span {
  padding: 0.5rem 1rem 0.5rem 3.375rem;
  width: 100%;
}

.k-drawer-wrapper {
  padding-top: 10px;
}

.k-drawer-content {
  display: none;
}

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

@keyframes swing {
  0%, 30%, 50%, 70%, 100% {
    transform: rotate(0deg);
  }
  10% {
    transform: rotate(10deg);
  }
  40% {
    transform: rotate(-10deg);
  }
  60% {
    transform: rotate(5deg);
  }
  80% {
    transform: rotate(-5deg);
  }
}
.bg-toolbox-light-green {
  background-color: #d7eed7 !important;
}

.bg-toolbox-yellow {
  background-color: #ffffe1 !important;
}

.at-report-green-status {
  background-color: #32d583 !important;
  color: white !important;
}

.at-report-red-status {
  background-color: #f97066 !important;
  color: white !important;
}

.at-report-status-clear-disable {
  opacity: 1 !important;
  filter: grayscale(0) !important;
}

.telerik-chip-disable-fix {
  opacity: 1 !important;
  filter: grayscale(0) !important;
}

.at-action-verified-green {
  background-color: #cdf3cb !important;
}

.at-action-accepted-red {
  background-color: #fae1e1 !important;
}

.at-action-closed-yellow {
  background-color: #fcfad7 !important;
}

.at-action-open-grey {
  background-color: #d6d2d2 !important;
}

.at-action-rejected-black {
  background-color: #1D1D1B !important;
  color: white !important;
}

.at-action-removed-gray {
  background-color: #e9ecef !important;
}

.at-action-verified-green {
  background-color: #cdf3cb !important;
}

td:has(.at-stats-actioneesactions-alert),
.at-action-accepted-red {
  background-color: #fae1e1 !important;
}

.at-action-closed-yellow {
  background-color: #fcfad7 !important;
}

.at-action-open-grey {
  background-color: #d6d2d2 !important;
}

.at-action-rejected-grey, .at-action-removed-grey {
  background-color: #e9ecef !important;
}

.at-schedule-planned {
  background-color: #C43333 !important;
}

.at-schedule-complete {
  background-color: #F7DE5F !important;
}

.at-schedule-closed {
  background-color: #6DC433 !important;
}

.wms-revision-request-new {
  background-color: #3D7CC9 !important;
  color: white !important;
}

.wms-revision-request-onhold {
  background-color: #939598 !important;
  color: white !important;
}

.wms-revision-request-actioned {
  background-color: #006B6B !important;
  color: white !important;
}

.wms-revision-request-approved {
  background-color: #F4B223 !important;
}

.wms-revision-request-rejected {
  background-color: #EA0029 !important;
  color: white !important;
}

.wms-item-live {
  background-color: #006B6B !important;
  color: white !important;
}

.wms-item-reservation {
  background-color: #F4B223 !important;
  color: white !important;
}

.wms-item-deprecated {
  background-color: #EA0029 !important;
  color: white !important;
}

.tabstrip {
  border-bottom: 1px solid #e5e7eb;
  position: relative;
  display: flex;
  flex-shrink: 0;
  margin-bottom: 15px;
}

.tabstrip-items {
  margin: 0;
  padding: 0;
  width: 100%;
  list-style: none;
  position: relative;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: wrap;
  flex: 0 0 auto;
  align-items: stretch;
  column-gap: 20px;
}

.tabstrip-item {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  cursor: pointer;
  position: relative;
}
.tabstrip-item::after {
  content: "";
  background: #5F0614;
  height: 3px;
  position: absolute;
  width: 100%;
  left: 0;
  bottom: -3px;
  transition: all 250ms ease-in 0ms;
  transform: scale(0);
}
.tabstrip-item:hover .tabstrip-link {
  color: #5F0614;
}
.tabstrip-item.active .tabstrip-link {
  color: #5F0614;
  font-weight: 600;
}
.tabstrip-item.active:after {
  transform: scale(1);
}

.tabstrip-link {
  display: flex;
  padding: 6px 2px;
  font-weight: 500;
  text-decoration: none;
}

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

.fa-info-circle {
  color: #4d5761;
}

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

/* Webkit based browsers */
meter[value="1"].passwordstrength::-webkit-meter-optimum-value {
  background: red;
}

meter[value="2"].passwordstrength::-webkit-meter-optimum-value {
  background: yellow;
}

meter[value="3"].passwordstrength::-webkit-meter-optimum-value {
  background: orange;
}

meter[value="4"].passwordstrength::-webkit-meter-optimum-value {
  background: green;
}

/* Gecko based browsers */
meter[value="1"].passwordstrength::-moz-meter-bar {
  background: red;
}

meter[value="2"].passwordstrength::-moz-meter-bar {
  background: yellow;
}

meter[value="3"].passwordstrength::-moz-meter-bar {
  background: orange;
}

meter[value="4"].passwordstrength::-moz-meter-bar {
  background: green;
}

#search-sub-locations-grid .k-grid-toolbar .k-toolbar-item {
  width: 50%;
}
#search-sub-locations-grid .k-grid-toolbar .k-toolbar-item .k-input {
  width: 100%;
}

.k-detail-cell .k-grid {
  min-height: unset;
}

.k-grid td.k-table-td {
  white-space: nowrap;
}
.k-grid .k-table-row.row-expired,
.k-grid .k-table-row.k-selected.row-expired {
  color: #EA0029;
}
.k-grid .k-table-row.row-expired > .k-table-td,
.k-grid .k-table-row.k-selected.row-expired > .k-table-td {
  color: #EA0029;
}
.k-grid .k-table-row.wms-row-deprecated {
  background-color: #f5f5f5;
}
.k-grid .k-table-row.wms-row-reservation {
  background-color: #ffffe1;
}
.k-grid .k-table-row.wms-revision-request-open-near-date-grid {
  background-color: #ffffe1;
}
.k-grid .k-table-row.wms-revision-request-open-overdue-grid {
  background-color: #ffe4e1;
}
.k-grid .k-table-row.wms-revision-request-actioned-grid {
  background-color: #d7eed7;
}
.k-grid .k-table-row.wms-revision-request-rejected-grid {
  background-color: #f5f5f5;
}

.k-grid.wrap-col-text td.k-table-td {
  white-space: unset;
}

#hazard-dialog-hazards-grid .k-grid-toolbar .k-toolbar-item {
  width: 25%;
}
#hazard-dialog-hazards-grid .k-grid-toolbar .k-toolbar-item .k-input, #hazard-dialog-hazards-grid .k-grid-toolbar .k-toolbar-item .k-dropdownlist {
  width: 100%;
}

.minh-1r {
  min-height: 1rem !important;
}

.minh-10r {
  min-height: 10rem !important;
}

.minh-20r {
  min-height: 20rem !important;
}

.minh-30r {
  min-height: 30rem !important;
}

.minh-40r {
  min-height: 40rem !important;
}

.minh-50r {
  min-height: 50rem !important;
}

.dropdown-popup-truncate li.k-list-item span.k-list-item-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dropdown-popup-fit-content {
  /*This is the default width for telerik dropdowns*/
  min-width: auto;
  width: max-content !important;
}

.rounded-start-sm {
  border-top-left-radius: 0.25rem;
  border-bottom-left-radius: 0.25rem;
}

.rounded-end-sm {
  border-top-right-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
}

.rounded-top-sm {
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;
}

.rounded-bottom-sm {
  border-bottom-left-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
}

.rounded-start-md {
  border-top-left-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}

.rounded-end-md {
  border-top-right-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}

.rounded-top-md {
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
}

.rounded-bottom-md {
  border-bottom-left-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}

.rounded-start-lg {
  border-top-left-radius: 1rem;
  border-bottom-left-radius: 1rem;
}

.rounded-end-lg {
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
}

.rounded-top-lg {
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
}

.rounded-bottom-lg {
  border-bottom-left-radius: 1rem;
  border-bottom-right-radius: 1rem;
}

.rounded-start-xl {
  border-top-left-radius: 2rem;
  border-bottom-left-radius: 2rem;
}

.rounded-end-xl {
  border-top-right-radius: 2rem;
  border-bottom-right-radius: 2rem;
}

.rounded-top-xl {
  border-top-left-radius: 2rem;
  border-top-right-radius: 2rem;
}

.rounded-bottom-xl {
  border-bottom-left-radius: 2rem;
  border-bottom-right-radius: 2rem;
}

.rounded-start-xxl {
  border-top-left-radius: 5rem;
  border-bottom-left-radius: 5rem;
}

.rounded-end-xxl {
  border-top-right-radius: 5rem;
  border-bottom-right-radius: 5rem;
}

.rounded-top-xxl {
  border-top-left-radius: 5rem;
  border-top-right-radius: 5rem;
}

.rounded-bottom-xxl {
  border-bottom-left-radius: 5rem;
  border-bottom-right-radius: 5rem;
}

.minh-auto {
  min-height: auto !important;
}

.minh-0 {
  min-height: 0 !important;
}

.minw-auto {
  min-width: auto !important;
}

.minw-0 {
  min-width: 0 !important;
}

.flex-grow-4 {
  flex-grow: 4 !important;
}