html,
body {
  /* Set a light beige background*/
  background-color: #f9f6ee;
  margin: 5px 0px 5px 2px;
  padding: 5px 0px 5px 2px;
  overflow: hidden;
}

section {
  /*flex container*/
  display: flex;
  flex-flow: column;
  height: calc(100vh - 20px);
}

.tab-content {
  /*scrolls vertically if overflowing, */
  flex: 1;
  overflow-y: scroll;
}

tr {
  cursor: default;
  /* Prevents pointer cursor*/
}

.myBtn {
  /* Fixed width for buttons with this class*/
  width: 70px;
}

/*  Preloader  logic */
body.preloading {
  overflow: hidden;
}

#preloader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: white;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  transition: opacity 0.3s ease;
}

#preloader.fade-out {
  opacity: 0;
  pointer-events: none;
}

#preloader .spinner {
  /*creates a spinner*/
  width: 60px;
  height: 60px;
  border: 4px solid lightgray;
  border-top-color: blue;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

/*spinner spins 360 degrees every one second*/

/*handles the filter button being disabled outside of the personnel tab*/
.btn-disabled {
  opacity: 0.65;
  pointer-events: none;
  cursor: not-allowed;
}