body {
  overflow-y: scroll;
}
#app {
  background-color: black;
  color: whitesmoke;
  font-size: 1.1rem;
  /* Fixed Top Header (like iPhone status bar + nav) */
  /* Main content area - scrolls between header and footer */
  /* Fixed Bottom Footer (like mobile tab bar) */
}
#app .container {
  min-height: 100vh;
}
#app .header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  /* Includes safe area on notched iPhones */
  padding: 0.5rem;
  /* env(safe-area-inset-top) approximation for notch */
  background-color: black;
  border-bottom: 1px solid #dee2e6;
  z-index: 1030;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
#app .mainContent {
  flex: 1;
  overflow-y: auto;
  padding-top: 90px;
  /* Height of header */
  padding-bottom: 80px;
  /* Height of footer + extra spacing */
  -webkit-overflow-scrolling: touch;
  /* Smooth scrolling on iOS */
  min-height: 100vh;
}
#app .footer {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 60px;
  /* Includes safe area at bottom */
  padding-bottom: env(safe-area-inset-bottom);
  /* Handles iPhone home indicator */
  background-color: black;
  border-top: 1px solid #dee2e6;
  z-index: 1030;
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
}
#app input[type=text],
#app input[type=password],
#app textarea,
#app .alert-danger {
  width: 20rem !important;
  border-radius: var(--bs-border-radius);
}
#app input[type=date],
#app input[type=time] {
  width: 9rem;
  padding: 0.4rem;
  border-radius: var(--bs-border-radius);
}
#app content,
#app .control-group {
  margin: 1rem;
}
#app button {
  margin-right: 1rem;
}
#app footer {
  margin-top: 2rem;
}
#app .formButton {
  margin-top: 1rem;
}
#app .invalid-feedback {
  display: block;
  margin-top: 0rem;
}
#app label {
  font-weight: bold;
  margin-top: 0.5rem;
}
#app .form-check-input {
  margin-top: 0.75rem;
}
#app .table > :not(caption) > * > * {
  padding: 0.1rem;
  text-align: center;
}
#app .table > :not(caption) > * > * input[type=checkbox] {
  padding: 0.1rem;
  margin: 0.1rem;
}
#app .smallButtonText {
  font-size: 0.5rem;
}
#app .searchFound {
  background-color: darkorange !important;
}
#app .linksTable {
  max-width: 768px;
}
@media screen and (max-width: 480px) {
  #app {
    background-color: darkgray;
  }
  #app .nomobile {
    display: none;
  }
}
