html,
body,
#root {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

body {
  min-height: 0;
}

#root > div {
  height: 100vh;
  min-height: 0;
  overflow: hidden;
}

#root > div > div:first-child,
#root > div > nav:first-of-type {
  display: none !important;
}

#root > div > div.flex-1 {
  min-height: 0;
  overflow: hidden;
}

#root main {
  min-height: 0;
  overflow: hidden !important;
  padding: 16px !important;
}

#root main > div {
  height: 100%;
  min-height: 0;
  gap: 12px !important;
}

#root main > div > div:first-child {
  margin-bottom: 0 !important;
}

#root main > div > section.w-full:not(.flex-1) .grid {
  gap: 12px !important;
}

#root main > div > section.w-full:not(.flex-1) .grid > div {
  min-height: 0;
  padding: 12px !important;
}

#root main > div > section.w-full.flex-1 {
  min-height: 0;
  overflow: hidden;
}

#root main > div > section.w-full.flex-1 > .grid {
  height: 100%;
  min-height: 0;
  overflow: hidden;
  grid-template-rows: minmax(0, 1fr);
}

#root main > div > section.w-full.flex-1 > .grid > div {
  height: 100%;
  min-height: 0;
  gap: 10px !important;
  overflow: hidden;
}

#root main > div > section.w-full.flex-1 > .grid > div > div {
  flex: 1 1 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 12px !important;
}

#root main .overflow-auto,
#root main .overflow-y-auto {
  min-height: 0;
}
