/*





 */


main {
  padding-top: 0;
}

footer {
  display: none;
}

/* Open / close menu */
#main-content {
  margin-left: 0 !important;
}

#dashboard-nav {
  left: -500px;
}

.nav-shrink {
  left: 0px !important;
}

.menu-open-wrapper-show {
  display: block !important;
  opacity: 0.4 !important;
}
/* END */

#demo {
  height: 100vh;
  background-color: #f8f7f7;
}

.sub-one {
  width: 50%;
  min-width: 1.5vw;
  max-width: 98.5vw;
  background-color: #fff;
}

.wrap-first-half {
  height: 50%;
  min-height: 1.5vh;
  max-height: 98.5vh;
  border-bottom: 1px solid var(--dark-blue-color);
}

.jsontree_child-nodes,
.jsontree_node,
.jsontree_tree,
#jsonResults {
  height: 100%;
}

.demo-header {
  top: 0;
  left: 0;
  z-index: 12;
}

pre::-webkit-scrollbar,
#results-json::-webkit-scrollbar,
#demoSearch::-webkit-scrollbar,
.demo-dropdowns-export::-webkit-scrollbar,
.demo-dropdowns-history::-webkit-scrollbar,
.demo-dropdowns-engine::-webkit-scrollbar,
.select2-results__options::-webkit-scrollbar {
  width: 5px !important;
  height: 5px;
}
/* Track */
pre::-webkit-scrollbar-track,
#results-json::-webkit-scrollbar-track,
#demoSearch::-webkit-scrollbar-track,
.demo-dropdowns-export::-webkit-scrollbar-track,
.demo-dropdowns-history::-webkit-scrollbar-track,
.demo-dropdowns-engine::-webkit-scrollbar-track,
.select2-results__options::-webkit-scrollbar-track {
  background: #d9d9d9;
}
/* Handle */
pre::-webkit-scrollbar-thumb,
#results-json::-webkit-scrollbar-thumb,
#demoSearch::-webkit-scrollbar-thumb,
.demo-dropdowns-export::-webkit-scrollbar-thumb,
.demo-dropdowns-history::-webkit-scrollbar-thumb,
.demo-dropdowns-engine::-webkit-scrollbar-thumb,
.select2-results__options::-webkit-scrollbar-thumb {
  background: #ABABAB;
}
/* Handle on hover */
pre::-webkit-scrollbar-thumb:hover,
#results-json::-webkit-scrollbar-thumb:hover,
#demoSearch::-webkit-scrollbar-thumb:hover,
.demo-dropdowns-export::-webkit-scrollbar-thumb:hover,
.demo-dropdowns-history::-webkit-scrollbar-thumb:hover,
.demo-dropdowns-engine::-webkit-scrollbar-thumb:hover,
.select2-results__options::-webkit-scrollbar-thumb:hover {
  background: #888;
}

pre,
#results-json,
#jsonResults,
#demoSearch,
.demo-dropdowns-export,
.demo-dropdowns-history,
.demo-dropdowns-engine,
.select2-results__options {
  scrollbar-width: thin;
  scrollbar-color: #888 #d9d9d9;
}

#dashboard-nav .hamburger {
  display: block !important;
}

.dropdowns-cont {
  right: 25px;
  top: 55px;
  background-color: #fff;
  box-shadow: var(--box-shadow);
  border-radius: 10px;
  z-index: 15;
}

.dropdowns-cont a:focus,
.dropdowns-cont a:active {
  text-decoration: none;
}

.demo-dropdowns-export {
  width: 650px;
}

.demo-dropdowns-export,
.demo-dropdowns-history,
.demo-dropdowns-engine {
  max-height: calc(100% - 90px);
  overflow-y: auto;
  overflow-y: overlay;
}

.dropdowns-cont .close-dropdown {
  top: 10px;
  right: 7.5px;
  height: 32px;
  width: 32px;
  display: grid;
  place-items: center;
  background-color: transparent;
  outline: 0 !important;
  color: #bdc3c7;
  cursor: pointer;
}

.dropdowns-cont .close-dropdown:hover {
  color: var(--dark-blue-color);
}

.wrap-his-exp {
  top: 0;
  padding: 13px 20px 0 65px;
}

.button-wrap,
.demo-dropdowns-options button {
  background-color: transparent;
  cursor: pointer;
  outline: 0;
}

.button-wrap i {
  font-size: 12px;
}

.button-wrap .fa-sort-down {
  position: relative;
  top: -3px;
}

.button-wrap:active,
.button-wrap:focus {
  outline: 0;
}

/* Options dropdown */
.demo-dropdowns-options button:not(.close-dropdown),
.demo-dropdowns-options .documentation-btn {
  border: 2px solid #e3e4eb;
  border-radius: 10px;
  max-width: 300px;
  top: -60px;
  font-size: 16px !important;
}

.demo-dropdowns-options button:not(.close-dropdown):hover,
.demo-dropdowns-options .documentation-btn:hover {
  border-color: var(--blue-color);
  background-color: var(--blue-color);
  color: #fff;
}
/* END*/

/* Engine dropdown */
.demo-dropdowns-engine {
  right: auto;
  left: 20px;
  min-width: 275px;
  interpolate-size: allow-keywords;
}

.demo-dropdowns-engine a {
  color: var(--dark-blue-color);
  padding: 3px 10px;
}

.demo-dropdowns-engine a:hover,
.history-search-list a:hover {
  background-color: var(--light-gray-color);
  text-decoration: none !important;
}

.demo-dropdowns-engine a:hover .img-wrap,
.engine-dropdown-header:hover {
  color: var(--blue-color);
}

.engine-dropdown-header {
  cursor: default;
}

.demo-dropdowns-engine i.fa-angle-down {
  transition: all 0.2s ease-in-out;
  margin-left: 12px;
}

.engine-children-wrap {
  display: none;
  max-height: 0px;
  opacity: 0;
  transition: all 0.2s ease-in-out;
}

.engine-expend {
  max-height: fit-content;
}

.engine-opacity {
  opacity: 1;
}

.demo-dropdowns-engine i:not(.fa-angle-down) {
  font-size: 12px;
  width: 16px;
  margin-right: 6px;
}

.active-engine-parent {
  display: block;
}

.active-engine {
  background-color: var(--light-gray-color);
  pointer-events: none;
}

.active-engine span {
  font-weight: 700;
  color: var(--blue-color);
}
/* END */

/* History dropdown */
.demo-dropdowns-history {
  max-width: 600px;
  min-width: 343px;
}

.empty-hist {
  display: flex;
  width: 275px;
}

.history-search-list a {
  white-space: nowrap;
  text-overflow: ellipsis;
}

.history-search-list .hist-icon {
  min-width: 40px;
  height: 12px;
}
/* END */

.show-dropdown {
  display: flex !important;
  flex-direction: column;
}

.active-btn-demo {
  color: var(--blue-color);
}

#demoV3-results-html,
#iframeResultsContainer,
.iframeResultsContainer-doc {
  position: initial;
}

.iframe-overlay-2 {
  right: 0;
  width: 10px;
  z-index: 2;
}

.iframe-overlay-3 {
  top: 0;
  height: 10px;
  z-index: 2;
}

/* Blue loading bar */
.loading-wrap {
  height: 3px;
  max-width: 200px;
  background-color: #ecf0f1;
}

.loading-bar {
  width: 2%;
  background-color: #4285f4;
  transition: 2.5s linear;
}
/* END */

/* Resize handles */
.handle {
  background: transparent;
  cursor: nwse-resize;
  z-index: 10;
}

.vertical-handle {
  height: 10px;
  bottom: -3px;
  cursor: ns-resize;
}

.horizontal-handle {
  width: 10px;
  right: -3px;
  cursor: ew-resize;
}

.vertical-handle:hover,
.horizontal-handle:hover {
  opacity: 1;
}
/* END */

/* Select2 Customization */
.select2-results__option.select2-results__option--highlighted {
  background-color: #f9f9f9 !important;
}

.select2-results__option.select2-results__option--highlighted .select2-result-repository__title {
  color: #000 !important;
}

.select2-results__option.select2-results__option--highlighted .select2-result-repository__watchers {
  color: #aaa !important;
}

.select2-results__option[aria-selected='true'] {
  background-color: var(--blue-color) !important;
}

.select2-results__option[aria-selected='true'] .select2-result-repository__title {
  color: #fff !important;
}

.select2-results__option[aria-selected='true'] .select2-result-repository__watchers {
  color: #c6dcef !important;
}
/* END */

/* Test parameter entry */
.playground-flex-wrapper {
  display: flex;
  gap: 0.5rem;
  justify-content: space-between;
  align-items: center;
}

.playground-flex-wrapper label {
  display: grid;
  overflow: hidden;
}

.playground-flex-wrapper .parameter-highlight {
  overflow: hidden;
  text-overflow: ellipsis;
}
/* END */

.documentation-btn {
  line-height: 1;
  color: inherit;
}

.documentation-btn:hover,
.documentation-btn:focus {
  color: inherit;
  text-decoration: none;
}

@media (min-width: 1021px) {
  .demo-dropdowns-options {
    display: none !important;
  }
}

@media (min-width: 0px) and (max-width: 1020px) {
  .play-options,
  .close-dropdown {
    display: inline-block !important;
  }

  .export-btn,
  .history-btn,
  .engine-btn,
  .documentation-btn {
    display: none;
  }

  .dropdowns-cont {
    width: 100%;
    height: 100%;
    right: 0;
    left: 0;
    top: 0;
    padding-top: 40px !important;
    border-radius: 0;
  }

  .demo-dropdowns-options button svg {
    top: 6px;
    transform: rotate(-90deg);
  }

  .demo-dropdowns-export,
  .demo-dropdowns-history,
  .demo-dropdowns-engine {
    max-height: none;
    max-width: none;
  }

  .demo-dropdowns-options .documentation-btn {
    display: flex;
    text-decoration: none;
  }
  
  .demo-dropdowns-options .documentation-btn i:last-child {
    font-size: 11px;
  }
}