#main {
  width: 100vw;
  max-width: 100vw;
  overflow: hidden;
  max-height: calc(100vh - var(--navbar-height));
  height: calc(100vh - var(--navbar-height));
}

.left-side-bars {
  max-height: calc(100vh - var(--navbar-height));
  height: calc(100vh - var(--navbar-height));
}

/* Grid layout */
.layout-grid {
  display: grid;
  grid-template-columns: minmax(300px, 20vw) 1fr minmax(300px, 20vw);
  grid-template-rows: 1fr min-content;
  gap: 0px 0px;
  grid-auto-flow: row;
  justify-content: stretch;
  align-content: stretch;
  justify-items: stretch;
  align-items: stretch;
  grid-template-areas:
    "left-side-bars map-wrapper right-toolbar-wrapper"
    "left-side-bars table-wrapper table-wrapper";
}

.map-wrapper {
  grid-area: map-wrapper;
  height: 0;
  min-height: 100%;
}

#map {
  width: 100%;
  height: 100%;
}

.right-toolbar-wrapper {
  grid-area: right-toolbar-wrapper;
  height: 0;
  min-height: 100%;
}

.right-toolbar-contents {
  overflow-x: hidden;
  overflow-y: auto;
}

.left-side-bars {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: min-content 1fr;
  gap: 0px 8px;
  grid-auto-flow: row;
  grid-template-areas:
    "left-side-bars-header"
    "filters-form";
  grid-area: left-side-bars;
}

.left-side-bars-header {
  grid-area: left-side-bars-header;
}

.filters-form-wrapper {
  grid-area: filters-form;
  max-height: inherit;
}

.table-wrapper {
  grid-area: table-wrapper;
}
