:root {
  /* COLORS: */

  --color-warm-grey-9: #263238;
  --color-warm-grey-11: #11171a;

  --right-panel-bg-color: var(--color-warm-grey-9);
  --right-panel-fg-color: var(--color-warm-grey-11);
  --right-panel-text-color-primary: var(--color-warm-grey-1);
  --right-panel-text-color-secondary: var(--color-warm-grey-3);

  /* GENERAL: */

  --layout-three-panel-large-max-width: none;
}

:root.dark {
  --right-panel-bg-color: #263238;
  --right-panel-fg-color: #11171a;
  --right-panel-text-color-primary: #ededf2;
  --right-panel-text-color-secondary: #dcdde5;
}

:root .redoc-wrap {
  --layout-three-panel-large-max-width: none;
}

:root [data-section-id] {
  position: relative;
}

:root .api-content.three-panel-layout > [data-section-id]::before,
:root .api-content.three-panel-layout > *:first-child::before {
  display: none;
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  bottom: -1px;
  width: var(--panel-samples-width);
  background: var(--right-panel-bg-color);
  z-index: 0;
}

:root .api-content.three-panel-layout > [data-section-id]:not(:last-of-type):after,
:root .api-content.three-panel-layout > *:first-child:not(:last-of-type):after {
  display: none;
  border-bottom: 1px solid color-mix(in srgb, var(--color-black) 10%, transparent);
}

:root .api-content > div:not([data-section-id]):first-child > div:last-child {
  background-color: var(--right-panel-bg-color);
  margin: 0;
}

/* PANELS: */

:root .panel-container-request-samples,
:root .panel-container-response-samples {
  background-color: var(--right-panel-bg-color);
}

:root .panel-language-list,
:root .panel-overview,
:root .panel-download,
:root .panel-servers-list,
:root .panel-request-samples,
:root .panel-response-samples,
:root .panel-messages-samples,
:root .panel-callback-samples {
  --layer-color: var(--right-panel-fg-color);
  --panel-samples-heading-bg-color: var(--layer-color);
  --panel-samples-body-bg-color: var(--layer-color);
  --code-block-bg-color: var(--layer-color);
  --code-block-text-color: var(--right-panel-text-color-primary);
  --panel-samples-border: 0;
  --code-block-tokens-string-color: var(--color-green-3);
  --code-block-tokens-constant-color: var(--right-panel-text-color-primary);
  --code-block-padding: var(--spacing-xs) 10px var(--spacing-xs) 20px;
  --panel-samples-dropdown-bg-color: color-mix(
    in srgb,
    var(--right-panel-bg-color) 40%,
    transparent
  );
  --panel-samples-dropdown-color: var(--right-panel-text-color-primary);
  --panel-samples-text-color: var(--right-panel-text-color-primary);
  --panel-samples-heading-text-color: var(--right-panel-text-color-primary);
  --panel-body-text-color: var(--right-panel-text-color-primary) !important;
  --panel-border-radius: 0;
  --panel-samples-dropdown-border: transparent;
  --text-color-secondary: var(--right-panel-text-color-secondary);
  --text-color-primary: var(--right-panel-text-color-primary);

  --tag-content-padding: 3px 10px;
  --tab-bg-color-filled: var(--right-panel-bg-color);
}

:root .panel-language-list .token.property,
:root .panel-overview .token.property,
:root .panel-download .token.property,
:root .panel-servers-list .token.property,
:root .panel-request-samples .token.property,
:root .panel-response-samples .token.property,
:root .panel-messages-samples .token.property,
:root .panel-callback-samples .token.property {
  color: var(--right-panel-text-color-primary);
}

:root .panel-language-list [data-testid='panel-body'] *:not(button) > div,
:root .panel-language-list [data-testid='panel-body'] *:not(button) > span,
:root .panel-overview [data-testid='panel-body'] *:not(button) > div,
:root .panel-overview [data-testid='panel-body'] *:not(button) > span,
:root .panel-download [data-testid='panel-body'] *:not(button) > div,
:root .panel-download [data-testid='panel-body'] *:not(button) > span,
:root .panel-servers-list [data-testid='panel-body'] *:not(button) > div,
:root .panel-servers-list [data-testid='panel-body'] *:not(button) > span,
:root .panel-request-samples [data-testid='panel-body'] *:not(button) > div,
:root .panel-request-samples [data-testid='panel-body'] *:not(button) > span,
:root .panel-response-samples [data-testid='panel-body'] *:not(button) > div,
:root .panel-response-samples [data-testid='panel-body'] *:not(button) > span,
:root .panel-messages-samples [data-testid='panel-body'] *:not(button) > div,
:root .panel-messages-samples [data-testid='panel-body'] *:not(button) > span,
:root .panel-callback-samples [data-testid='panel-body'] *:not(button) > div,
:root .panel-callback-samples [data-testid='panel-body'] *:not(button) > span {
  border: none;
}

:root .panel-language-list .button,
:root .panel-language-list button,
:root .panel-overview .button,
:root .panel-overview button,
:root .panel-download .button,
:root .panel-download button,
:root .panel-servers-list .button,
:root .panel-servers-list button,
:root .panel-request-samples .button,
:root .panel-request-samples button,
:root .panel-response-samples .button,
:root .panel-response-samples button,
:root .panel-messages-samples .button,
:root .panel-messages-samples button,
:root .panel-callback-samples .button,
:root .panel-callback-samples button {
  --button-color: var(--right-panel-text-color-primary);
  --button-color-hover: var(--right-panel-text-color-primary);
  --button-color-active: var(--right-panel-text-color-primary);
  --button-bg-color-hover: var(--right-panel-bg-color);
  --button-bg-color-active: var(--right-panel-bg-color);
  --button-bg-color-disabled: transparent;
  --button-border-color: transparent;
  --button-border-color-disabled: transparent;
  --button-bg-color-danger-hover: var(--button-bg-color-secondary-danger);
  --button-bg-color-danger-pressed: var(--button-bg-color-secondary-danger-hover);
  --button-border-color-danger: transparent;
  --button-border-color-danger-hover: transparent;
  --button-border-color-danger-pressed: transparent;
  --button-border-radius: 0;
  --button-gap: var(--spacing-xs);
}

:root .panel-language-list .button > span,
:root .panel-language-list button > span,
:root .panel-overview .button > span,
:root .panel-overview button > span,
:root .panel-download .button > span,
:root .panel-download button > span,
:root .panel-servers-list .button > span,
:root .panel-servers-list button > span,
:root .panel-request-samples .button > span,
:root .panel-request-samples button > span,
:root .panel-response-samples .button > span,
:root .panel-response-samples button > span,
:root .panel-messages-samples .button > span,
:root .panel-messages-samples button > span,
:root .panel-callback-samples .button > span,
:root .panel-callback-samples button > span {
  background-color: transparent;
}

/* OPERATIONS LIST: */

:root [data-testid='operation-navigation-list'] {
  --text-color-primary: var(--right-panel-text-color-primary);
  --panel-samples-text-color: var(--right-panel-text-color-primary);
  --button-border-radius: 0;
  --tag-content-padding: var(--spacing-xxs) var(--spacing-xs);
  background-color: var(--right-panel-bg-color);
}

:root [data-testid='operation-navigation-list'] > button {
  --bg-color: var(--right-panel-fg-color);
  --button-border-width: 0;
  --button-border-color-hover: var(--right-panel-fg-color);
  --button-border-color-active: var(--right-panel-fg-color);
  --button-border-radius: 0;
  --button-color: var(--right-panel-text-color-primary);
  --button-color-hover: var(--right-panel-text-color-primary);
  --button-color-active: var(--right-panel-text-color-primary);
  --text-color-primary: var(--right-panel-text-color-primary);
}

:root [data-testid='operation-navigation-list'] > button > span {
  align-items: center;
  gap: var(--spacing-xs);
}

/* SCHEMAS: */

:root .api-content.stacked-layout {
  --grid-schema-column-gap: 4px;
  --grid-schema-property-padding-left: 200px;
}

:root .api-content.stacked-layout [data-section-id] .property:not(.token) > *:first-child {
  display: grid !important;
  grid-template-columns: 200px repeat(auto-fit, minmax(0, max-content));
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  grid-column-gap: var(--grid-schema-column-gap);
  align-items: start;
}

:root .api-content.stacked-layout [data-section-id] .property:not(.token) > *:not(div:first-child) {
  padding-left: calc(
    var(--grid-schema-property-padding-left) + var(--grid-schema-column-gap)
  ) !important;
}

/* TAGS: */

:root {
  --http-tag-padding: 0 var(--spacing-xs);
  font-family: 'Inter', sans-serif;
}

redoc {
  font-family: 'Inter', sans-serif;
}

:root .tag-post,
:root .tag-get,
:root .tag-put,
:root .tag-patch,
:root .tag-delete,
:root .tag-head,
:root .tag-options,
:root .tag-deprecated,
:root .tag-http {
  --tag-color: var(--text-color-inverse) !important;
  --http-tag-font-weight: 200;
  --tag-border-radius: 0;
  justify-content: center;
  font-weight: var(--http-tag-font-weight);
}

:root .tag-post {
  background-color: var(--tag-operation-color-post);
}

:root .tag-get {
  background-color: var(--tag-operation-color-get);
}

:root .tag-put {
  background: var(--tag-operation-color-put);
}

:root .tag-patch {
  background: var(--tag-operation-color-patch);
}

:root .tag-delete {
  background: var(--tag-operation-color-delete);
}

:root .tag-head {
  background: var(--tag-operation-color-head);
}

:root .tag-options {
  background: var(--tag-operation-color-options);
}

:root .tag-deprecated {
  background: var(--tag-operation-color-deprecated);
}

/* SIDEBAR: */

:root .menu-content {
  background: var(--color-warm-grey-1);
}

:root [data-testid='menu-item-label'] .tag-http {
  --http-tag-width: 30px;
  --http-tag-height: 15px;
  --http-tag-font-size: calc(var(--font-size-base) / 2);
  --http-tag-font-weight: var(--font-weight-regular);
  order: -1;
  margin-right: var(--spacing-xs);
  margin-top: 4px;
}

:root [data-testid='menu-item-label'] .tag-http > * {
  line-height: initial;
}

/* RESPONSIVENESS: */

@media screen and (max-width: 1279px) {
  :root .api-content.stacked-layout [data-section-id] .property:not(.token) > *:first-child {
    display: flex !important;
    align-items: center;
  }

  :root
    .api-content.stacked-layout
    [data-section-id]
    .property:not(.token)
    > *:not(div:first-child) {
    padding-left: 0 !important;
  }
}

@media screen and (min-width: 1280px) {
  :root .api-content.three-panel-layout > [data-section-id]::before,
  :root .api-content.three-panel-layout > [data-section-id]:not(:last-of-type):after,
  :root .api-content.three-panel-layout > *:first-child::before,
  :root .api-content.three-panel-layout > *:first-child:not(:last-of-type):after {
    display: block;
  }

  :root .api-content.three-panel-layout > div:not([data-section-id]):first-child > div:last-child {
    background-color: transparent;
    margin: var(--spacing-base) 0;
  }

  :root .api-content.three-panel-layout [data-section-id]:not(:first-of-type) > div > button {
    width: calc(100% - var(--panel-samples-width) - 2 * var(--button-margin-md));
    z-index: 10;
    position: relative;
  }

  :root .api-content.three-panel-layout .panel-container-request-samples,
  :root .api-content.three-panel-layout .panel-container-response-samples {
    background-color: transparent;
  }

  :root .api-content.three-panel-layout [data-testid='operation-navigation-list'] {
    background-color: transparent;
  }

  :root .api-content.stacked-layout > div:not([data-section-id]):first-child > div:last-child {
    padding-top: var(--panel-gap-vertical);
    padding-bottom: var(--panel-gap-vertical);
  }

  :root .api-content.stacked-layout .panel-container-request-samples,
  :root .api-content.stacked-layout .panel-container-response-samples {
    padding-top: var(--panel-gap-vertical);
    padding-bottom: var(--panel-gap-vertical);
  }

  :root .api-content.stacked-layout [data-testid='operation-navigation-list'] {
    padding-top: var(--panel-gap-vertical);
    padding-bottom: var(--panel-gap-vertical);
  }
}