#q-app {
  display: flex;
  flex-direction: column;
}

#header {
  height: var(--header-height);
  display: flex;
  justify-content: space-between;
  position: relative;
  background-color: #fff;
  color: #3f3f3f;
  padding: 10px 20px 5px 20px;
  box-shadow: 0 -3px 10px 0 rgb(162 121 88);
}

#header .oo-header-right {
  padding-left: 50px;
  display: flex;
  justify-content: right;
  align-items: center;
  gap: 10px;
}

#header .oo-header-logout {
  cursor: pointer;
  font-size: 1.2rem;
}

#header-logo {
  height: 30px;
}

#wrapper {
  display: flex;
  width: 100%;
}

.oo-vw-100 {
  width: 100vw;
}

.oo-vh-100 {
  height: 100vh;
}

.oo-layout-content {
  min-height: calc(100vh - var(--header-height));
  overflow-x: auto;
  flex-grow: 1;
  padding: 10px 30px 30px 30px;
}

.no-select {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}

.oo-flex-centered-content {
  display: flex;
  justify-content: center;
  align-items: center;
}