@scalar/api-client 0.1.1

package/dist/style.css

@@ -0,0 +1,1622 @@
+
+/** Basics */
+.scalar-api-client__codemirror__wrapper {
+  width: 100%;
+  display: flex;
+  align-items: stretch;
+}
+.scalar-api-client__codemirror {
+  flex-grow: 1;
+  max-width: 100%;
+}
+.scalar-api-client__codemirror.ͼw {
+  background-color: var(--scalar-api-client-background-input);
+}
+.scalar-api-client__codemirror--read-only.ͼw {
+  background-color: var(--scalar-api-client-background-secondary);
+}
+
+/** URL input */
+.scalar-api-client__url-input {
+  font-weight: var(--scalar-api-client-font-semibold);
+}
+.scalar-api-client__url-input .cm-scroller {
+  padding-left: 6px;
+}
+.scalar-api-client__url-input .ͼ1 .cm-scroller {
+  align-items: center !important;
+}
+.scalar-api-client__variable {
+  color: var(--scalar-api-client-color);
+}
+
+.modal-layout[data-v-fc617f92] {
+  position: fixed;
+  width: 100vw;
+  height: 100vh;
+  top: 0;
+  left: 0;
+  z-index: 1001;
+  background: rgba(0, 0, 0, 0.44);
+  padding: 20px;
+  opacity: 0;
+  animation: modal-fade-fc617f92 0.2s forwards;
+}
+.modal-body[data-v-fc617f92] {
+  padding: 18px;
+  max-height: calc(100vh - 240px);
+  background: var(--scalar-api-client-background-primary);
+  border-radius: var(--scalar-api-client-rounded);
+  font-family: var(--scalar-api-client-font-sans);
+}
+.modal[data-v-fc617f92] {
+  margin: 80px auto 0;
+  position: relative;
+  background: var(--theme-background-2);
+  border-radius: var(--theme-radius);
+  color: var(--theme-color-1);
+  width: 100%;
+  text-align: left;
+  line-height: 1.4;
+  opacity: 0;
+  transform: scale(0.98);
+  animation: modal-pop-fc617f92 0.15s 0.15s forwards;
+  display: flex;
+  flex-direction: column;
+}
+.modal-content-large[data-v-fc617f92] {
+  max-width: 800px;
+}
+.modal-content-normal[data-v-fc617f92] {
+  max-width: 640px;
+}
+.modal-content-small[data-v-fc617f92] {
+  max-width: 480px;
+}
+@keyframes modal-fade-fc617f92 {
+from {
+    opacity: 0;
+}
+to {
+    opacity: 1;
+}
+}
+@keyframes modal-pop-fc617f92 {
+0% {
+    opacity: 0;
+}
+100% {
+    opacity: 1;
+    transform: scale(1);
+}
+}
+.modal-header[data-v-fc617f92] {
+  padding: 12px 24px;
+  color: var(--theme-color-1);
+  font-size: var(--theme-font-size-4);
+  text-align: left;
+  font-weight: 600;
+  border-radius: var(--theme-radius) var(--theme-radius) 0 0;
+}
+
+.navtable-mock {
+  background-repeat: repeat;
+  width: 100%;
+  background-image: linear-gradient(
+    0deg,
+    var(--scalar-api-client-border-color) 1px,
+    --scalar-api-client-background-primary 1px
+  );
+  background-size: 31px 31px;
+  background-position: center 1px;
+  flex: 1;
+  position: relative;
+}
+.navtable-mock .navtable-item {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  left: 0;
+  top: 0;
+  background: transparent;
+  border-top: none;
+}
+.radio {
+  height: 16px;
+  width: 16px;
+  background: transparent;
+  border: var(--border);
+  flex-shrink: 0;
+  margin-right: 6px;
+  margin-left: 4px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  outline: none;
+}
+.radio:before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  cursor: pointer;
+}
+.navtable-item__active .radio:after {
+  content: '';
+  width: 5px;
+  height: 8px;
+  border: solid white;
+  border-width: 0 1.5px 1.5px 0;
+  transform: rotate(45deg) translate3d(-0.5px, -1px, 0);
+}
+.radio.post {
+  background: var(--scalar-api-client-post-color);
+}
+.radio.delete {
+  background: var(--scalar-api-client-delete-color);
+}
+.radio.patch {
+  background: var(--scalar-api-client-patch-color);
+}
+.radio.get {
+  background: var(--scalar-api-client-get-color);
+}
+.radio.put {
+  background: var(--scalar-api-client-put-color);
+}
+
+.scalar-api-client__address-bar {
+  width: 100%;
+  padding: 12px 12px 10px 12px;
+  display: flex;
+  align-items: center;
+  position: relative;
+  background: var(--scalar-api-client-background-primary);
+}
+.scalar-api-client__url-form {
+  display: flex;
+  width: 100%;
+  align-items: stretch;
+  border-radius: var(--scalar-api-client-rounded);
+}
+.scalar-api-client__field {
+  border: var(--scalar-api-client-border);
+  border-right: 0;
+  border-radius: var(--scalar-api-client-rounded) 0 0
+    var(--scalar-api-client-rounded);
+  display: flex;
+  align-items: stretch;
+  width: 100%;
+}
+.scalar-api-client__address-bar-data {
+  width: 100%;
+}
+.scalar-api-client__address-bar-data-meta {
+  display: flex;
+  margin-top: 5px;
+}
+.scalar-api-client__request-type {
+  display: flex;
+  align-items: center;
+  background: var(--scalar-api-client-background-secondary);
+  color: var(--scalar-api-client-color-3);
+  appearance: none;
+  -webkit-appearance: none;
+  padding: 0 12px;
+  border-right: var(--scalar-api-client-border);
+  border-radius: var(--scalar-api-client-rounded) 0 0
+    var(--scalar-api-client-rounded);
+  position: relative;
+}
+.scalar-api-client__request-type span {
+  font-family: var(--scalar-api-client-font-mono);
+  font-size: 500;
+  font-size: 12px;
+  text-transform: uppercase;
+}
+.scalar-api-client__request-type svg {
+  margin-left: 6px;
+  width: 8px;
+}
+.scalar-api-client__request-type i {
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  margin-right: 6px;
+  text-align: center;
+  line-height: 18px;
+  font-style: normal;
+  flex-shrink: 0;
+  display: inline-block;
+  color: var(--scalar-api-client-color-3);
+  background: var(--scalar-api-client-color);
+}
+.meta-request-break {
+  margin: 0 5px;
+}
+.scalar-api-client__history {
+  appearance: none;
+  -webkit-appearance: none;
+  background: transparent;
+  color: var(--scalar-api-client-theme-color-2);
+  display: flex;
+  align-items: center;
+  border-radius: var(--scalar-api-client-rounded);
+  height: 100%;
+}
+.scalar-api-client__url-submit {
+  font-size: var(--scalar-api-client-text-xs);
+  letter-spacing: 0.25px;
+  line-height: 30px;
+  font-weight: var(--scalar-api-client-font-semibold);
+  color: white;
+  border: none;
+  white-space: nowrap;
+  padding: 0 10px;
+  text-transform: uppercase;
+  cursor: pointer;
+  outline: none;
+  border-radius: 0 var(--scalar-api-client-rounded)
+    var(--scalar-api-client-rounded) 0;
+  background: var(--scalar-api-client-color);
+  /**  #087f5b */
+  border: 1px solid
+    color-mix(in srgb, black 15%, var(--scalar-api-client-color));
+  display: flex;
+  align-items: center;
+}
+.scalar-api-client__url-submit svg {
+  width: 12px;
+  height: 12px;
+  margin-right: 6px;
+}
+.scalar-api-client__url-submit--loading {
+  font-size: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 127px;
+}
+.scalar-api-client__url-submit--loading svg {
+  display: none;
+}
+.scalar-api-client__url-submit--loading:before {
+  content: '';
+  border: 1px solid rgba(0, 0, 0, 0.1);
+  border-top: 1px solid white;
+  animation: urlloader 0.45s linear infinite;
+  background: transparent;
+  width: 14px;
+  height: 14px;
+  margin-left: 0;
+  margin-right: 9px;
+  border-radius: 50%;
+}
+.scalar-api-client__url-submit--loading:after {
+  content: 'Loading';
+  font-size: 12px;
+}
+@keyframes urlloader {
+0% {
+    transform: rotate(0deg);
+}
+to {
+    transform: rotate(1turn);
+}
+}
+.scalar-api-client__history-toggle {
+  padding: 0 9px;
+  line-height: 30px;
+  color: var(--scalar-api-client-color-3);
+  font-size: var(--scalar-api-client-text-xs);
+  letter-spacing: 0.125px;
+  font-weight: var(--scalar-api-client-font-semibold);
+  text-transform: uppercase;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  white-space: nowrap;
+  border: var(--scalar-api-client-border);
+  margin-left: 12px;
+  border-radius: var(--scalar-api-client-rounded);
+}
+.scalar-api-client__history-toggle:hover {
+  background: var(--scalar-api-client-background-secondary);
+}
+.scalar-api-client__history-toggle svg {
+  height: 13px;
+  width: 13px;
+  margin-right: 6px;
+  color: var(--scalar-api-client-color-3);
+}
+.scalar-api-client__address-bar-close {
+  fill: var(--scalar-api-client-color-3);
+  margin-left: 12px;
+  height: 24px;
+}
+.scalar-api-client__address-bar-close:hover {
+  cursor: pointer;
+  fill: var(--scalar-api-client-theme-color-1);
+}
+.scalar-api-client__address-bar-content {
+  width: 640px;
+  height: 100%;
+  background: --scalar-api-client-background-primary;
+  box-shadow: var(--scalar-api-client-theme-shadow-2);
+  position: fixed;
+  top: 0;
+  right: 0;
+  z-index: 1000;
+  transform: translate3d(640px, 0, 0);
+  opacity: 0;
+  transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1),
+    opacity 0.01s ease-in-out 0.5s;
+  pointer-events: none;
+}
+.scalar-api-client__address-bar-content-item {
+  height: 100vh;
+  max-height: 100vh;
+  overflow: auto;
+}
+.scalar-api-client__address-bar__on {
+  z-index: 100000;
+}
+.scalar-api-client__address-bar__on .scalar-api-client__address-bar__content {
+  transform: translate3d(0, 0, 0);
+  opacity: 1;
+  pointer-events: all;
+  transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);
+}
+.scalar-api-client__address-bar__on .scalar-api-client__address-bar__close {
+  opacity: 1;
+  pointer-events: all;
+  cursor: pointer;
+}
+.scalar-api-client__address-bar .navtable-item__active {
+  background: var(--scalar-api-client-background-secondary);
+  cursor: default;
+}
+.scalar-api-client__address-bar .navtable-item__active .radio:before {
+  display: none;
+}
+.navigation-back {
+  stroke: var(--scalar-api-client-theme-color-2);
+  cursor: pointer;
+}
+.navigation-back:hover {
+  stroke: var(--scalar-api-client-theme-color-1);
+}
+.scalar-api-client__address-bar__close {
+  width: 100%;
+  height: 100%;
+  position: fixed;
+  top: 0;
+  left: 0;
+  /* background: rgba(0,0,0,.55);
+	 */
+  pointer-events: none;
+  opacity: 0;
+  transition: all 0.1s ease-in-out;
+  z-index: 1000;
+}
+.navtable-item-request span {
+  padding: 8px 9px 8px 0;
+  border: none;
+  outline: none;
+  font-size: 12px;
+  color: var(--scalar-api-client-theme-color-1);
+  width: 100%;
+  display: block;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+.navtable-item-request span em {
+  text-transform: uppercase;
+  font-style: normal;
+  font-family: var(--scalar-api-client-font-mono);
+  font-size: 11px;
+  margin-right: 6px;
+  font-weight: var(--scalar-api-client-font-bold);
+  color: var(--scalar-api-client-color-3);
+}
+.navtable-item-time {
+  font-size: 12px;
+  color: var(--scalar-api-client-theme-color-1);
+  text-transform: capitalize;
+  padding: 0 9px;
+}
+@media screen and (max-width: 720px) {
+.scalar-api-client__history-toggle span,
+  .scalar-api-client__url-submit span {
+    display: none;
+}
+.scalar-api-client__history-toggle svg,
+  .scalar-api-client__url-submit svg {
+    margin-right: 0;
+}
+.scalar-api-client__history-toggle,
+  .scalar-api-client__url-submit {
+    height: 31.5px;
+    width: 31.5px;
+}
+}
+
+.scalar-api-client__item {
+  border-radius: var(--scalar-api-client-rounded);
+  margin-bottom: 6px;
+  background: var(--scalar-api-client-background-secondary);
+  box-shadow: var(--shadow1);
+  position: relative;
+}
+.scalar-api-client__item button {
+  background-color: transparent;
+}
+.scalar-api-client__item:hover {
+  cursor: pointer;
+}
+.scalar-api-client__item--open {
+  background: var(--scalar-api-client-background-secondary);
+}
+.scalar-api-client__item--open:focus-within {
+  box-shadow: var(--shadow1);
+}
+.scalar-api-client__item--open .scalar-api-client__item__content {
+  display: flex;
+}
+.scalar-api-client__item--open:hover {
+  cursor: default;
+}
+.scalar-api-client__item--open .scalar-api-client__toggle__icon {
+  transform: rotate(90deg);
+}
+.scalar-api-client__toggle {
+  padding: 6px 12px;
+  min-height: 37px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  position: relative;
+  width: 100%;
+}
+.scalar-api-client__item .scalar-api-client__item__title {
+  color: var(--scalar-api-client-theme-color-1);
+  font-size: var(--scalar-api-client-text-sm);
+  font-weight: var(--scalar-api-client-font-bold);
+  user-select: none;
+  flex: 1;
+}
+.scalar-api-client__item .scalar-api-client__item__title:after {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  display: block;
+}
+.scalar-api-client__item .scalar-api-client__toggle__icon {
+  width: 10px;
+  margin-right: 6px;
+  color: var(--scalar-api-client-theme-color-1);
+}
+.scalar-api-client__item__options {
+  position: relative;
+}
+.scalar-api-client__item__options span {
+  background: var(--scalar-api-client-background-3);
+  padding: 2px 6px;
+  border-radius: 3px;
+  font-size: 12px;
+  pointer-events: none;
+  color: var(--scalar-api-client-theme-color-2);
+  border: var(--scalar-api-client-border);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.scalar-api-client__item__options span svg {
+  width: 9px;
+  height: 9px;
+  margin-left: 3px;
+}
+.scalar-api-client__item__options select {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  opacity: 0;
+  cursor: pointer;
+}
+
+.table {
+  border: var(--scalar-api-client-border);
+  background: transparent;
+  border-radius: var(--scalar-api-client-rounded);
+  width: 100%;
+}
+.table-row {
+  border-bottom: var(--scalar-api-client-border);
+  display: flex;
+  position: relative;
+}
+.table-row__add {
+  border-radius: 0 0 var(--scalar-api-client-rounded)
+    var(--scalar-api-client-rounded);
+  border-bottom: none;
+}
+.table-row.required-parameter .table-row-item:nth-of-type(2):after {
+  content: 'Required';
+  position: absolute;
+  top: 4px;
+  right: 0;
+  padding: 5px 9px 5px 6px;
+  font-weight: var(--scalar-api-client-font-semibold);
+  font-size: 12px;
+  background: var(--scalar-api-client-background-secondary);
+  box-shadow: -2px 0 4px var(--scalar-api-client-background-secondary);
+}
+.table-row.required-parameter
+  .table-row-item:nth-of-type(2):focus-within:after {
+  display: none;
+}
+.table-row:last-of-type {
+  border-bottom: none;
+}
+.table-row__active {
+  border-radius: 0 0 var(--scalar-api-client-rounded)
+    var(--scalar-api-client-rounded);
+}
+.table-row-drag {
+  width: 20px;
+  flex-shrink: 0;
+  border-right: var(--scalar-api-client-border);
+  align-items: center;
+  justify-content: center;
+  display: none;
+}
+.table-row-drag svg {
+  width: 6px;
+  fill: var(--scalar-api-client-color-3);
+}
+.table-row-drag .table-row-drag-add {
+  width: 8px;
+}
+.table-row-item {
+  width: 100%;
+  border-right: var(--scalar-api-client-border);
+  position: relative;
+}
+.table-row-item-menu {
+  position: absolute;
+  right: 12px;
+  background: var(--scalar-api-client-background-3);
+  border: var(--scalar-api-client-border);
+  width: 24px;
+  height: 24px;
+  top: 50%;
+  transform: translate3d(0, -50%, 0);
+  border-radius: var(--scalar-api-client-rounded);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 0;
+  cursor: pointer;
+}
+.table-row-item input:focus + .table-row-item-menu,
+.table-row-item:hover .table-row-item-menu {
+  opacity: 1;
+}
+.table-row-item-menu svg {
+  height: 12px;
+  width: initial;
+  fill: var(--scalar-api-client-color-3);
+}
+.table-row-item input {
+  border: none;
+  appearance: none;
+  outline: none;
+  padding: 9px;
+  width: 100%;
+  background: var(--scalar-api-client-background-input);
+  color: var(--scalar-api-client-theme-color-1);
+  font-size: 12px;
+}
+.table-row-item input[disabled] {
+  background: transparent;
+  font-family: var(--scalar-api-client-font-mono);
+}
+.table-row-item input:focus {
+  background: var(--scalar-api-client-background-secondary);
+}
+.table-row-item label {
+  background: transparent;
+  text-transform: uppercase;
+  display: block;
+  padding: 9px;
+  font-weight: var(--scalar-api-client-font-bold);
+  color: var(--scalar-api-client-color-3);
+  font-size: 12px;
+}
+.table-row-meta {
+  overflow: hidden;
+  flex-shrink: 0;
+  transition: all 0.15s ease-in-out;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  user-select: none;
+}
+.table-row-meta-check {
+  width: 18px;
+  height: 18px;
+  border-radius: var(--scalar-api-client-rounded);
+  background: rgba(47, 177, 228, 0.1);
+}
+.table-row-meta svg {
+  width: 13px;
+  height: 13px;
+  margin: 0 1px;
+  color: var(--scalar-api-client-color-3);
+  cursor: pointer;
+}
+.table-row-meta svg:hover {
+  color: var(--scalar-api-client-theme-color-2);
+}
+.meta-check {
+  display: flex;
+  position: relative;
+  cursor: pointer;
+  align-items: center;
+  font-size: 12px;
+  border-radius: var(--scalar-api-client-rounded);
+  user-select: none;
+  margin: 0 1px;
+  transition: all 0.15s ease-in-out;
+}
+.meta-check input {
+  position: absolute;
+  opacity: 0;
+  cursor: pointer;
+  height: 0;
+  width: 0;
+}
+.meta-checkmark {
+  height: 15px;
+  width: 15px;
+  background: var(--scalar-api-client-background-input);
+  border-radius: 3px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+}
+.meta-check .meta-checkmark:after {
+  content: '';
+  display: none;
+  width: 5px;
+  height: 8px;
+  border: solid var(--scalar-api-client-theme-color-1);
+  border-width: 0 1.5px 1.5px 0;
+  transform: rotate(45deg) translate3d(0, -1px, 0);
+}
+.meta-check input:checked ~ .meta-checkmark:after {
+  display: block;
+}
+
+.navtable {
+  width: 100%;
+}
+.navtable-follow {
+  background-color: black;
+  color: white;
+  font-size: 9px;
+  padding: 6px;
+  display: -webkit-box;
+  max-width: 250px;
+  -webkit-line-clamp: 12;
+  border-radius: 3px;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  line-height: 1.24;
+  transform: translate3d(10px, 0, 0);
+}
+.navtable-follow:after {
+  content: '';
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  height: 6px;
+  background-color: black;
+}
+.navtable-follow * {
+  font-family: var(--scalar-api-client-font-mono) !important;
+}
+.navtable-table {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  min-height: 381px;
+}
+.navtable-item {
+  display: flex;
+  position: relative;
+  color: var(--scalar-api-client-theme-color-1);
+  border-top: var(--scalar-api-client-border);
+  font-weight: var(--scalar-api-client-font-semibold);
+}
+.navtable-item > div {
+  word-wrap: break-word;
+}
+.navtable-item > div:not(:first-child) {
+  border-left: var(--scalar-api-client-border);
+}
+.navtable-item-action {
+  color: var(--scalar-api-client-theme-color-2);
+  font-size: 12px;
+  font-weight: var(--scalar-api-client-font-bold);
+  background: var(--scalar-api-client-bg3);
+  border: none;
+  border-radius: 30px;
+  appearance: none;
+  max-height: 25px;
+  margin-left: 12px;
+  margin-right: 6px;
+  padding: 4px 8px;
+  outline: none;
+  cursor: pointer;
+  opacity: 0;
+  transition: opacity 0.15s ease-in-out;
+  white-space: nowrap;
+  position: relative;
+}
+.navtable-item-action:hover {
+  color: var(--scalar-api-client-theme-color-1);
+  background: var(--scalar-api-client-gradient);
+  box-shadow: 0 0 0 1px var(--scalar-api-client-border-color);
+}
+.navtable-item-action:focus {
+  background: var(--scalar-api-client-background-secondary);
+}
+.navtable-item:hover,
+.navtable-item:focus-within .navtable-item-action {
+  opacity: 1;
+}
+.navtable-item-add {
+  display: flex;
+  align-items: center;
+  padding: 9px;
+  font-weight: var(--scalar-api-client-font-bold);
+  outline: none;
+  border: none;
+  appearance: none;
+  background: transparent;
+  color: var(--scalar-api-client-theme-color-1);
+}
+.navtable-item-add:hover {
+  background: var(--scalar-api-client-background-secondary);
+  cursor: pointer;
+}
+.navtable-item-25 {
+  width: 25%;
+  font-size: 12px;
+  display: flex;
+  align-items: center;
+}
+.navtable-item-33 {
+  width: 33.33333%;
+  display: flex;
+  font-size: 12px;
+  align-items: center;
+}
+.navtable-item-66 {
+  width: 66.6666%;
+  display: flex;
+  font-size: 12px;
+  align-items: center;
+}
+.navtable-item-75 {
+  width: 75%;
+  display: flex;
+  align-items: center;
+}
+.navtable-item-75:focus-within {
+  background: var(--scalar-api-client-background-secondary);
+}
+.navtable-item-40 {
+  width: 40%;
+  display: flex;
+  align-items: center;
+}
+.navtable-item-20 {
+  width: 20%;
+  display: flex;
+  align-items: center;
+}
+.navtable-item-50 {
+  width: 50%;
+  display: flex;
+  align-items: center;
+}
+.navtable-item-50:focus-within {
+  background: var(--scalar-api-client-background-secondary);
+}
+.navtable-item p {
+  padding: 9px;
+}
+.navtable-item input {
+  padding: 12px 6px;
+  border: none;
+  outline: none;
+  appearance: none;
+  font-size: 12px;
+  color: var(--scalar-api-client-theme-color-1);
+  background: transparent;
+  width: 100%;
+}
+.navtable-item input:focus {
+  background: var(--scalar-api-client-background-secondary);
+}
+.navtable-item-select {
+  position: relative;
+}
+.navtable-item-select select {
+  background: transparent;
+  outline: none;
+  border: none;
+  font-size: 12px;
+  appearance: none;
+  width: 100%;
+  padding: 12px 6px;
+  top: 0;
+  position: relative;
+  cursor: pointer;
+  color: var(--scalar-api-client-theme-color-2);
+}
+.navtable-item-select svg {
+  position: absolute;
+  right: 6px;
+  color: var(--scalar-api-client-fill);
+  width: 6px;
+  top: 12px;
+  pointer-events: none;
+}
+.navtable-item .option {
+  padding: 12px 6px;
+  font-size: 12px;
+  color: var(--scalar-api-client-theme-color-1);
+  width: 100%;
+}
+.navtable-item label {
+  color: var(--scalar-api-client-color-3);
+  font-size: 12px;
+  font-weight: var(--scalar-api-client-font-bold);
+  text-transform: uppercase;
+  padding: 9px;
+  display: block;
+  width: 100%;
+}
+.navtable-item-response {
+  padding: 0 9px;
+}
+.navtable-item-response span {
+  font-size: 12px;
+  display: flex;
+  align-items: center;
+  margin-right: 6px;
+  min-width: 50px;
+}
+.scalar-api-client__status--1xx:before,
+.scalar-api-client__status--2xx:before,
+.scalar-api-client__status--3xx:before,
+.scalar-api-client__status--4xx:before,
+.scalar-api-client__status--5xx:before,
+.scalar-api-client__status--6xx:before {
+  content: '';
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+  margin-right: 4px;
+  background: var(--scalar-api-client-background-secondary);
+}
+.scalar-api-client__status--2xx:before {
+  background: green;
+}
+.scalar-api-client__status--3xx:before {
+  background: orange;
+}
+.scalar-api-client__status--4xx:before {
+  background: red;
+}
+.navtable-item-response span:empty {
+  display: none;
+}
+.simpletable.navtable {
+  padding: 0;
+}
+.simpletable.navtable .navtable-item-66,
+.simpletable.navtable .navtable-item-33 {
+  display: block;
+}
+.simpletable.navtable .navtable-table {
+  height: fit-content;
+}
+
+.scalar-api-client__main__left {
+  width: 50%;
+  border-right: var(--scalar-api-client-border);
+  padding: 0 12px 12px 12px;
+}
+@media screen and (max-width: 820px) {
+.scalar-api-client__main__left {
+    width: 100%;
+    border-right: none;
+}
+}
+.scalar-api-client__item__content {
+  flex-flow: wrap;
+  padding: 0 12px 12px;
+  border-radius: 3px;
+  color: var(--scalar-api-client-color-3);
+  font-size: 12px;
+  margin-top: -3px;
+  justify-content: space-between;
+.cm-s-default {
+    border: var(--scalar-api-client-border);
+    border-radius: var(--scalar-api-client-rounded);
+}
+}
+.scalar-api-client__item__content .scalar-api-client__item__content--code {
+  width: 100%;
+  max-height: calc(100vh - 200px);
+  overflow: auto;
+}
+.scalar-api-client__item__content .cm-scroller {
+  border: var(--scalar-api-client-border);
+  border-radius: 3px;
+}
+.scalar-api-client__item__content .cm-editor {
+  outline: none !important;
+}
+.scalar-api-client__item__content .cm-editor .cm-gutters {
+  background: transparent;
+}
+.scalar-api-client__item__content .cm-scroll {
+  background: transparent;
+}
+.scalar-api-client__item__content .cm-editor * {
+  font-size: 11px;
+}
+.scalar-api-client__item__content .cm-editor .cm-line {
+  color: var(--scalar-api-client-theme-color-1);
+}
+.scalar-api-client__item__content-button {
+  width: 100%;
+  appearance: none;
+  border: none;
+  outline: none;
+  font-size: 12px;
+  background: var(--scalar-api-client-color);
+  font-weight: var(--scalar-api-client-font-bold);
+  padding: 12px;
+  text-transform: uppercase;
+  border-radius: var(--scalar-api-client-rounded);
+  color: white;
+  cursor: pointer;
+}
+.scalar-api-client__item__content__split {
+  justify-content: space-between;
+}
+.scalar-collapsible-section-flex {
+  width: 100%;
+}
+.scalar-collapsible-section-option {
+  font-size: var(--scalar-api-client-text-sm);
+  font-weight: var(--scalar-api-client-font-bold);
+  color: var(--scalar-api-client-color2);
+  background: var(--scalar-api-client-bg3);
+  border-radius: 30px;
+  display: inline-block;
+  padding: 8px 12px;
+  cursor: pointer;
+  margin: 0 4px 8px;
+  user-select: none;
+&:hover {
+    box-shadow: 0 0 0 1px var(--scalar-api-client-border-color);
+    background: var(--scalar-api-client-gradient);
+    color: var(--scalar-api-client-theme-color-1);
+}
+}
+.input {
+  background: var(--scalar-api-client-background-secondary);
+  border: var(--scalar-api-client-border);
+  border-radius: 3px;
+  position: relative;
+  width: 100%;
+  text-align: left;
+  margin-bottom: 6px;
+}
+.input__half {
+  width: calc(50% - 3px);
+}
+.input:focus-within {
+  background: var(--scalar-api-client-background-3);
+}
+.input label,
+.input input {
+  padding: 12px;
+  border: 0;
+  outline: none;
+  font-size: 12px;
+  color: var(--scalar-api-client-theme-color-1);
+  width: 100%;
+  background: transparent;
+  appearance: none;
+  -webkit-appearance: none;
+  left: 0;
+}
+.input label {
+  position: absolute;
+  color: var(--scalar-api-client-theme-color-2);
+}
+.input input {
+  opacity: 0;
+  position: relative;
+  z-index: 99;
+  padding: 18px 12px 6px 12px;
+}
+.input input:not(:placeholder-shown),
+.input:focus-within input {
+  opacity: 1;
+}
+.input input:not(:placeholder-shown) + label,
+.input:focus-within label {
+  font-size: 10px;
+  top: -6px;
+  color: var(--scalar-api-client-theme-color-1);
+}
+.input input:not(:placeholder-shown) + label {
+  color: var(--scalar-api-client-theme-color-2);
+}
+.select {
+  background: --scalar-api-client-background-primary;
+  border-radius: var(--scalar-api-client-rounded);
+  font-size: 12px;
+  border: var(--scalar-api-client-border);
+  width: 100%;
+  position: relative;
+  margin-bottom: 6px;
+}
+.select:focus-within {
+  background: var(--scalar-api-client-background-3);
+}
+.select:hover {
+  background: var(--scalar-api-client-background-3);
+}
+.select svg {
+  position: absolute;
+  right: 12px;
+  pointer-events: none;
+  color: var(--scalar-api-client-theme-color-2);
+  width: 6px;
+  top: 10px;
+}
+.select label {
+  display: block;
+  font-size: 10px;
+  color: var(--scalar-api-client-theme-color-2);
+  position: absolute;
+  left: 12px;
+  top: 6px;
+}
+.select select {
+  background: transparent;
+  outline: none;
+  border: none;
+  -webkit-appearance: none;
+  font-size: 12px;
+  color: var(--scalar-api-client-theme-color-1);
+  appearance: none;
+  width: 100%;
+  padding: 18px 12px 6px 12px;
+  top: 0;
+  position: relative;
+  cursor: pointer;
+}
+.check {
+  display: flex;
+  position: relative;
+  cursor: pointer;
+  align-items: center;
+  font-size: 12px;
+  border: var(--scalar-api-client-border);
+  border-radius: 3px;
+  padding: 10px 12px;
+  user-select: none;
+  width: 100%;
+}
+.check p {
+  color: var(--scalar-api-client-theme-color-2);
+}
+.check input {
+  position: absolute;
+  opacity: 0;
+  cursor: pointer;
+  height: 0;
+  width: 0;
+}
+.checkmark {
+  height: 15px;
+  width: 15px;
+  background: var(--scalar-api-client-background-3);
+  margin-right: 10px;
+  border-radius: 3px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+}
+.check input:checked ~ p {
+  color: var(--scalar-api-client-theme-color-1);
+}
+.check .checkmark:after {
+  content: '';
+  display: none;
+  width: 5px;
+  height: 8px;
+  border: solid var(--scalar-api-client-color-3);
+  border-width: 0 2px 2px 0;
+  transform: rotate(45deg) translate3d(0, -1px, 0);
+}
+.check input:checked ~ .checkmark:after {
+  display: block;
+}
+.scalar-api-client__main__scroll-container {
+  height: calc(100vh - 320px);
+}
+.scalar-api-client__request-name {
+  outline: none;
+  border: none;
+  appearance: none;
+  -webkit-appearance: none;
+  color: var(--scalar-api-client-color-3);
+  border-radius: var(--scalar-api-client-rounded);
+  font-size: var(--scalar-api-client-text-xs);
+  font-weight: var(--scalar-api-client-font-bold);
+  width: 100%;
+  background: transparent;
+}
+
+a[data-v-84d41168] {
+  text-decoration: underline;
+  text-decoration-color: var(--scalar-api-client-border-color);
+  text-underline-offset: 2px;
+  cursor: help;
+}
+
+.simple-cell {
+  border-right: var(--scalar-api-client-border);
+  position: relative;
+  padding: 0.75em;
+  color: var(--scalar-api-client-theme-color-1);
+  white-space: nowrap;
+}
+.simple-cell:last-of-type {
+  border-right: none;
+}
+.simple-cell.wrap {
+  white-space: normal;
+}
+.simple-cell.strong {
+  font-weight: var(--scalar-api-client-font-semibold);
+}
+
+.simple-header {
+  color: var(--scalar-api-client-color-3);
+  font-weight: var(--scalar-api-client-font-bold);
+  text-transform: uppercase;
+}
+
+.simple-row {
+  border-top: var(--scalar-api-client-border);
+}
+.simple-row:last-of-type {
+  border-bottom: var(--scalar-api-client-border);
+}
+
+.simple-table {
+  display: table;
+  width: 100%;
+  margin: 1em 0;
+}
+
+.scalar-api-client__main__right {
+  width: 50%;
+  padding: 0 12px 12px 12px;
+}
+@media screen and (max-width: 820px) {
+.scalar-api-client__main__right {
+    width: 100%;
+    border-right: none;
+}
+}
+.scalar-api-client__main__right :deep(.scalar-copilot__header-button) {
+  position: absolute;
+  top: 6px;
+  right: 12px;
+}
+/***
+    The new CSS reset - version 1.8.4 (last updated 14.2.2023)
+    GitHub page: https://github.com/elad2412/the-new-css-reset
+***/
+
+/*
+    Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property
+    - The "symbol *" part is to solve Firefox SVG sprite bug
+    - The editor uses some browser defaults so it needs to be excluded from the reset (DOC-466)
+ */
+*:where(
+    :not(html, iframe, canvas, img, svg, video, audio):not(
+        svg *,
+        symbol *,
+        .editor *,
+        .reference *
+      )
+  ) {
+  all: unset;
+  display: revert;
+}
+
+/* Optional future support for reverting on >Chrome 90 */
+/* @supports (-webkit-user-modify: revert-layer) {
+  * {
+    -moz-user-modify: revert-layer;
+    -webkit-user-modify: revert-layer;
+    overflow-wrap: revert-layer;
+    -webkit-line-break: revert-layer;
+    -webkit-user-select: revert-layer;
+  }
+} */
+
+/* Preferred box-sizing value */
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+/* Strip the padding from editor elements */
+.editor *,
+.reference * {
+  padding: 0;
+  margin: 0;
+}
+
+/* Reapply the pointer cursor for anchor tags */
+a,
+button {
+  cursor: revert;
+}
+
+/* Reapply outlines on keyboard focus */
+a[href]:focus-visible,
+button:focus-visible,
+[tabindex]:focus-visible {
+  outline: 1px dashed var(--theme-color-2);
+  outline-offset: 2px;
+}
+
+/* Revert the font-size for selects
+  Ideally we would remove this once we style our selects better (DOC-466) */
+select {
+  font-size: revert;
+}
+
+/* Revert the line-height for buttons and inputs
+  Ideally we would remove this once we style our inputs and buttons better (DOC-466) */
+input,
+button {
+  line-height: revert;
+}
+
+/* Remove list styles (bullets/numbers) */
+/* It would be good to include this again (DOC-466) */
+/* ol,
+ul,
+menu {
+  list-style: none;
+} */
+
+/* For images to not be able to exceed their container */
+img {
+  max-inline-size: 100%;
+  max-block-size: 100%;
+}
+
+/* removes spacing between cells in tables */
+table {
+  border-collapse: collapse;
+}
+
+/* Safari - solving issue when using user-select:none on the <body> text input doesn't working */
+/* Align our input text to the left */
+input,
+textarea {
+  -webkit-user-select: auto;
+  text-align: left;
+  font-weight: initial;
+}
+
+/* revert the 'white-space' property for textarea elements on Safari */
+textarea {
+  white-space: revert;
+}
+
+/* minimum style to allow to style meter element */
+meter {
+  -webkit-appearance: revert;
+  appearance: revert;
+}
+
+/* preformatted text - use only for this feature */
+/* :where(pre) {
+  all: revert;
+} */
+
+/* reset default text opacity of input placeholder */
+::placeholder {
+  color: revert;
+}
+
+/* remove default dot (•) sign */
+::marker {
+  content: initial;
+}
+
+/* fix the feature of 'hidden' attribute.
+display:revert; revert to element instead of attribute */
+:where([hidden]) {
+  display: none;
+}
+
+/* revert for bug in Chromium browsers
+ - fix for the content editable attribute will work properly.
+ - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/
+:where([contenteditable]:not([contenteditable='false'])) {
+  -moz-user-modify: revert-layer, read-write;
+  -webkit-user-modify: revert-layer, read-write;
+  overflow-wrap: revert-layer, break-word;
+  -webkit-line-break: revert-layer, after-white-space;
+  -webkit-user-select: revert-layer, auto;
+}
+
+/* apply back the draggable feature - exist only in Chromium and Safari */
+:where([draggable='true']) {
+  -webkit-user-drag: element;
+}
+
+/* Revert Modal native behavior */
+:where(dialog:modal) {
+  all: revert;
+}
+.scalar-api-client,
+#headlessui-portal-root {
+  /** Font sizes */
+  --scalar-api-client-text-xs: 12px;
+  --scalar-api-client-text-sm: 14px;
+  --scalar-api-client-text-base: 16px;
+  --scalar-api-client-text-lg: 18px;
+
+  /** Colors */
+  --scalar-api-client-background-primary: #fff;
+  --scalar-api-client-background-secondary: #f1f3f5;
+  --scalar-api-client-background-input: #fff;
+  --scalar-api-client-border-color: #dee2e6;
+
+  /** Borders */
+  --scalar-api-client-border: 1px solid var(--scalar-api-client-border-color);
+  --scalar-api-client-rounded: 4px;
+
+  /** Fonts */
+  --scalar-api-client-font-sans: system-ui, 'Segoe UI', Roboto, Helvetica, Arial,
+    sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
+  --scalar-api-client-font-mono: ui-monospace, Menlo, Monaco, 'Cascadia Mono',
+    'Segoe UI Mono', 'Roboto Mono', 'Oxygen Mono', 'Ubuntu Monospace',
+    'Source Code Pro', 'Fira Mono', 'Droid Sans Mono', 'Courier New', monospace;
+
+  /** Font weights */
+  --scalar-api-client-font-semibold: 600;
+  --scalar-api-client-font-bold: 700;
+
+  /** TODO: Go through the following variables and check what they do */
+  --scalar-api-client-post-color: white;
+  --scalar-api-client-post-background: black;
+  --scalar-api-client-delete-color: white;
+  --scalar-api-client-delete-background: black;
+  --scalar-api-client-patch-color: white;
+  --scalar-api-client-patch-background: black;
+  --scalar-api-client-get-color: #0ca678;
+  --scalar-api-client-get-background: white;
+  --scalar-api-client-put-color: white;
+  --scalar-api-client-put-background: black;
+  --scalar-api-client-color-3: #868e96;
+  /* Font color */
+  --scalar-api-client-theme-color-1: #343a40;
+  /* Select font color */
+  --scalar-api-client-theme-color-2: #868e96;
+  --scalar-api-client-theme-shadow-2: 0 0 0 1px white;
+  --scalar-api-client-fill: black;
+  --scalar-api-client-color2: white;
+  --scalar-api-client-bg3: black;
+  --scalar-api-client-gradient: linear-gradient(180deg, black 0%, black 100%);
+  /** Select background */
+  --scalar-api-client-background-3: #f8f9fa;
+}
+
+.scalar-api-client {
+  background: var(--scalar-api-client-background-primary);
+  position: relative;
+  height: 100%;
+  overflow: hidden !important;
+  display: flex;
+  flex-direction: column;
+  font-family: var(--scalar-api-client-font-sans);
+}
+@media screen and (max-width: 1000px) {
+.scalar-api-client {
+    width: 100%;
+}
+}
+.scalar-api-client pre {
+  font-family: var(--scalar-api-client-font-mono);
+}
+.scalar-api-client--post {
+  --scalar-api-client-color: var(--scalar-api-client-post-color);
+  --scalar-api-client-background: var(--scalar-api-client-post-background);
+}
+.scalar-api-client--delete {
+  --scalar-api-client-color: var(--scalar-api-client-delete-color);
+  --scalar-api-client-background: var(--scalar-api-client-delete-background);
+}
+.scalar-api-client--patch {
+  --scalar-api-client-color: var(--scalar-api-client-patch-color);
+  --scalar-api-client-background: var(--scalar-api-client-patch-background);
+}
+.scalar-api-client--get {
+  --scalar-api-client-color: var(--scalar-api-client-get-color);
+  --scalar-api-client-background: var(--scalar-api-client-get-background);
+}
+.scalar-api-client--put {
+  --scalar-api-client-color: var(--scalar-api-client-put-color);
+  --scalar-api-client-background: var(--scalar-api-client-put-background);
+}
+.scalar-api-client__mobile-navigation {
+  padding: 12px 12px 0 12px;
+  display: flex;
+  font-size: var(--scalar-api-client-text-sm);
+  color: var(--scalar-api-client-theme-color-2);
+  font-weight: var(--scalar-api-client-font-bold);
+}
+.scalar-api-client__mobile-navigation__toggle {
+  appearance: none;
+  margin-right: 9px;
+  cursor: pointer;
+}
+.scalar-api-client__mobile-navigation--active {
+  color: var(--scalar-api-client-theme-color-1);
+}
+.scalar-api-client__mobile-navigation--active:hover {
+  cursor: pointer;
+}
+.scalar-api-client__main {
+  display: flex;
+  height: 100%;
+  min-height: 0;
+  background: var(--scalar-api-client-background-primary);
+  border-top: var(--scalar-api-client-border);
+}
+@media screen and (max-width: 820px) {
+.scalar-api-client__main {
+    display: block;
+}
+}
+
+/** TODO: Consider to make a Column component */
+.scalar-api-client__main__content {
+  padding: 12px;
+  background: var(--scalar-api-client-background-primary);
+  top: 0;
+  position: sticky;
+  z-index: 100;
+}
+.scalar-api-client__main__content label {
+  font-size: var(--scalar-api-client-text-sm);
+  color: var(--scalar-api-client-theme-color-1);
+  font-weight: var(--scalar-api-client-font-bold);
+  display: flex;
+  align-items: center;
+}
+@media screen and (max-width: 820px) {
+.scalar-api-client__main__content {
+    padding: 0 0 12px 0;
+}
+.scalar-api-client__main__content label {
+    display: none;
+}
+}
+.meta {
+  display: flex;
+  font-size: var(--scalar-api-client-text-base);
+  font-weight: var(--scalar-api-client-text-base);
+  color: var(--scalar-api-client-color2);
+}
+.meta-item svg {
+  fill: var(--scalar-api-client-fill);
+  height: 14px;
+  width: 14px;
+  margin-right: 6px;
+}
+.meta-item {
+  display: flex;
+  align-items: center;
+  margin-right: 12px;
+  white-space: nowrap;
+  font-weight: var(--scalar-api-client-font-bold);
+  font-size: 12px;
+  color: var(--scalar-api-client-color-3);
+  padding: 3px 0;
+}
+.meta-item__input {
+  padding: 3px 0;
+  background: transparent;
+  width: 100%;
+  margin-right: 0;
+}
+.types {
+  margin: auto;
+  width: 580px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-flow: wrap;
+}
+.types-heading {
+  width: 100%;
+  text-align: center;
+}
+.types-heading b {
+  font-size: 42px;
+}
+.types-heading p {
+  margin-bottom: 20px;
+  margin-top: 12px;
+  font-size: 24px;
+}
+.types-item {
+  font-weight: var(--scalar-api-client-font-bold);
+  font-size: var(--scalar-api-client-text-lg);
+  color: var(--scalar-api-client-color2);
+  background: var(--scalar-api-client-bg3);
+  padding: 9px 18px;
+  margin: 6px;
+  border-radius: 30px;
+}
+.types-item:hover {
+  box-shadow: 0 0 0 1px var(--scalar-api-client-border-color);
+  background: var(--scalar-api-client-gradient);
+  color: var(--scalar-api-client-theme-color-1);
+  cursor: pointer;
+}
+.scalar-api-client__empty-state {
+  border: 1px dashed var(--scalar-api-client-border-color);
+  width: 100%;
+  text-align: center;
+  font-size: var(--scalar-api-client-text-sm);
+  padding: 20px;
+}