.docExplorerWrap {
  height: unset !important;
  min-width: unset !important;
  width: unset !important;
}

.doc-explorer-title {
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-medium);
}

.doc-explorer-rhs {
  display: none;
}

.doc-explorer-contents {
  border-top: none !important;
}

.graphiql-code-exporter {
  padding: var(--px-16) 0;
  position: relative;
  min-width: unset !important;
}

.graphiql-code-exporter > div {
  font-family: var(--font-family) !important;
  font-size: var(--font-size-body) !important;
  padding: 0 !important;
}

.graphiql-code-exporter > div:first-of-type {
  gap: var(--px-16);
  flex-direction: column;
  display: flex;
}

.graphiql-code-exporter > div:first-of-type > div {
  padding: 0 !important;
}

.graphiql-code-exporter > div:first-of-type > div:first-of-type {
  gap: var(--px-16);
  flex-direction: row;
  display: flex;
}

.graphiql-code-exporter > div:first-of-type > div:last-of-type > div:first-of-type {
  margin-bottom: var(--px-12);
  color: hsla(var(--color-neutral), var(--alpha-secondary)) !important;
  font-variant: unset !important;
  text-transform: unset !important;
  font-weight: unset !important;
}

.graphiql-code-exporter button.toolbar-button {
  cursor: pointer;
  top: var(--px-16);
  justify-content: center;
  align-items: center;
  display: inline-flex;
  right: 0;
  height: var(--toolbar-width) !important;
  width: var(--toolbar-width) !important;
  border-radius: var(--border-radius-4) !important;
  font-size: unset !important;
  left: unset !important;
  margin-top: unset !important;
  background-color: unset !important;
}

.graphiql-code-exporter button.toolbar-button svg {
  fill: hsla(var(--color-neutral), var(--alpha-tertiary));
}

.graphiql-code-exporter > div:last-of-type {
  flex: 1;
  display: flex;
  margin-top: var(--px-24) !important;
  border-top: none !important;
}

.graphiql-code-exporter > div:last-of-type > div {
  width: 100%;
  min-height: 600px;
  position: relative;
}

.graphiql-code-exporter .toolbar-menu.toolbar-button {
  cursor: pointer;
  padding: var(--px-8) var(--px-12);
  text-decoration: none;
  position: relative;
  color: hsl(var(--color-neutral)) !important;
  border-radius: var(--border-radius-4) !important;
}

.graphiql-code-exporter .toolbar-menu.toolbar-button:hover {
  background-color: hsla(var(--color-neutral), var(--alpha-background-light)) !important;
}

.graphiql-code-exporter .toolbar-menu-items {
  border: var(--popover-border);
  border-radius: var(--border-radius-8);
  padding: var(--px-4);
  max-width: 250px;
  font-size: inherit;
  white-space: nowrap;
  z-index: 100;
  margin-top: var(--px-8);
  visibility: hidden;
  outline: none;
  display: block;
  position: absolute;
  left: 0;
  background-color: hsl(var(--color-base)) !important;
  box-shadow: var(--popover-box-shadow) !important;
}

.graphiql-code-exporter .toolbar-menu-items.open {
  visibility: visible;
}

.graphiql-code-exporter .toolbar-menu-items > li {
  cursor: pointer;
  color: inherit;
  font: inherit;
  -webkit-text-decoration: initial;
  text-decoration: initial;
  border-radius: var(--border-radius-4);
  margin: var(--px-4);
  padding: var(--px-6) var(--px-8);
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  overflow: hidden;
}

.graphiql-code-exporter .toolbar-menu-items > li:hover {
  color: inherit;
  background-color: hsla(var(--color-neutral), var(--alpha-background-light));
}

.graphiql-code-exporter .CodeMirror {
  box-shadow: var(--popover-box-shadow);
  border-radius: var(--border-radius-12);
  padding: var(--px-16);
}
