/* -------------------------------------------- */

/* Sphinx theme overrides */

/* -------------------------------------------- */

#ak-tm > h1, #ak-tm-clients > h1 {
display: none;
}

/* Glossary term tooltips. The glossarytooltip extension emits
   span.glossary-tooltip with the definition; click-to-copy.js shows the bubble
   on hover/focus. (Replaces the old Bootstrap tooltip dropped in the reskin.) */
.glossary-tooltip {
  /* Themed interactive color (purple in both modes) — a glossary term is a
     link-like affordance; --cf-link-primary flips correctly per theme. */
  text-decoration: underline dashed var(--cf-link-primary);
  text-underline-offset: 2px;
  cursor: pointer;
}

.glossary-tooltip-bubble {
  position: absolute;
  z-index: 2000;
  max-width: 320px;
  padding: 8px 10px;
  font-size: 13px;
  line-height: 1.4;
  text-align: left;
  color: var(--cf-text-on-color);
  background: var(--color-neutral-90, #23222b);
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.12s ease;
}

.glossary-tooltip-bubble.visible {
  opacity: 1;
}

html {
  height: 100%;
  overflow-x: initial;
}

body {
  font-family: var(--cf-font-family) !important;
  color: var(--cf-text-primary) !important;
  background-color: var(--cf-surface-01) !important;
  font-variant-ligatures: none;
}

img {
  max-width: 100%;
  height: auto;
  border: 0;
}

.rst-content h1,
.rst-content h2,
.rst-content h3,
.rst-content h4,
.rst-content h5,
.rst-content h6 {
  font-family: var(--cf-font-family-heading) !important;
  padding-bottom: var(--cf-space-24);
}

.container {
  max-width: 1600px;
  width: 100% !important;
}
.container.no-padding {
  padding: 0;
}

.sticky-menu-column .rightside-bar-wrapper {
  border-left: 1px solid var(--cf-border-subtle);
  background-color: var(--cf-surface-01);
}

.wy-nav-content {
  padding: 32px;
  max-width: none; /* IE Fix - change 'initial' to 'none' */
  background: var(--cf-surface-01);
}
.wy-nav-content-wrap {
  margin-left: 0;
}

.rst-content {
  min-width: 0;
  display: flex;
}
@media screen and (max-width: 1000px) {
  .wy-nav-content {
    width: 100% !important;
  }
}

.rst-inner {
  max-width: 960px;
  min-width: 430px;
  padding-top: 32px;
}

body:not(.third-column) .rst-inner {
  max-width: 100%;
}

section h2,
section h3,
section h4,
section h5,
section h6,
section h7 {
  margin-top: 2rem;
}

.rating-section {
  margin-top: 2rem;
  margin-bottom: 6rem;
  overflow: hidden;
}

.rating-section::before {
  display: none;
}

/* div[itemprop="articleBody"] > section > section:not(:last-child) {
    padding-bottom: 4rem;
    margin-bottom: 2rem;
    border-bottom: 0.1rem solid #a7a7a8;
} */

a {
  color: var(--cf-link-primary);
}

.rst-content section ul {
  line-height: 1.8;
}
.wy-breadcrumbs {
  margin-bottom: 0;
}

.wy-breadcrumbs li a {
  padding: 0;
}

.wy-breadcrumbs,
.wy-breadcrumbs a {
  line-height: 1;
  color: var(--cf-text-secondary);
}

.wy-breadcrumbs li:first-of-type a {
  font-size: 0;
}

.wy-breadcrumbs + hr {
  display: none;
}

.wy-breadcrumbs li {
  margin-right: 0.4rem;
}

.wy-breadcrumbs li:nth-last-child(2),
.wy-breadcrumbs li.wy-breadcrumbs-aside {
  display: none;
}

.rst-content p.caption {
  font-size: 1.5rem;
  font-style: italic;
}

.wy-side-nav-search {
  background-color: transparent;
  text-align: left;
}

.wy-side-nav-search input[type='text'] {
  border-color: var(--cf-border-strong);
  box-shadow: none;
  padding: 1rem 0 1rem 10%;
  font-size: 1.5rem;
  border-radius: 0.4rem;
  line-height: 1.5rem;
  width: calc(90% - 2rem);
}

.wy-body-for-nav {
  overflow: visible;
}

.wy-body-for-nav,
.wy-nav-container-wrap {
  background-color: var(--cf-background) !important;
  background-image: none;
}

.wy-nav-container {
  max-width: none;
  padding: 0;
}

@media (max-width: 768px) {
  .wy-nav-container {
    padding: 0;
  }
}

.wy-nav-content h1,
.wy-nav-content h1 a {
  font-size: 36px;
  font-weight: 600;
  font-family: var(--cf-font-family-heading);
  line-height: 120%;
}

.wy-nav-content h2,
.wy-nav-content h2 a {
  font-size: 24px;
  font-weight: 600;
  font-family: var(--cf-font-family-heading);
}

.wy-nav-content h3,
.wy-nav-content h3 a {
  font-size: 20px;
  line-height: 28px;
  font-weight: 600;
  font-family: var(--cf-font-family-heading);
}

.wy-nav-content h4,
.wy-nav-content h4 a {
  font-size: 18px;
  line-height: 24px;
}

.wy-nav-content h5,
.wy-nav-content h5 a {
  font-size: 14px;
  line-height: 22px;
}

.wy-nav-content h6,
.wy-nav-content h6 a {
  font-size: 14px;
  line-height: 22px;
}

.wy-nav-content p,
.wy-nav-content a,
.wy-nav-content ul li {
  font-size: 16px;
}

.wy-nav-container ul li {
  margin: 0;
  padding: 0;
}

/* 3-column flex layout: sidebar | content | right-toc */
html,
body {
  height: 100%;
  overflow: hidden;
}

html.page-overview,
html.page-overview body {
  height: auto;
  overflow: visible;
}

:root {
  --cf-header-height: 135px; /* 60px top bar + 54px subnav */
}

@media (max-width: 1092px) {
  :root {
    --cf-header-height: 60px;
  } /* subnav hidden */
}

@media (max-width: 832px) {
  :root {
    --cf-header-height: 56px;
  } /* mobile top bar */
}

.wy-grid-for-nav {
  display: flex;
  position: relative; /* override theme.css position: absolute */
  height: calc(100vh - var(--cf-header-height));
  overflow: hidden;
}

.wy-grid-for-nav.wy-grid-for-nav--fullpage,
.wy-grid-for-nav.wy-grid-for-nav--fullpage > .wy-nav-content {
  height: auto;
  overflow: visible;
}

/* Left column */
.wy-grid-for-nav > nav.wy-nav-side {
  flex-shrink: 0;
  overflow-y: auto;
  height: 100%;
}

/* Middle column */
.wy-grid-for-nav > div.wy-nav-content {
  flex: 1;
  overflow-y: auto;
  height: 100%;
  min-width: 0;
}

/* Right column */
.wy-grid-for-nav > aside.sticky-menu-column {
  flex-shrink: 0;
  width: 357px;
  overflow-y: auto;
  background-color: var(--cf-surface-01);
  height: 100%;
}

.wy-grid-for-nav > aside.sticky-menu-column .rightside-bar-wrapper {
  padding: 32px 32px 24px 46px;
  height: 100%;
  box-sizing: border-box;
  opacity: 1;
  visibility: visible;
  transition:
    opacity 0.3s ease,
    visibility 0.3s ease;
}

/* Collapse the right TOC in lockstep with the left sidebar toggle */
body.sidebar-collapsed .wy-grid-for-nav > aside.sticky-menu-column .rightside-bar-wrapper {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* Side nav styles */

.wy-menu-vertical {
  /* 10px top margin is important for offsetting dropshadow on container. Don't remove */
  margin: 10px 0 0 0;
  width: 100%;
}

.toctree-wrapper p.caption {
  display: none;
}

.wy-menu-vertical ul {
  margin-bottom: 20px;
}

/* CLEAR ALL BACKGROUND COLORS AND BORDERS*/

.wy-menu-vertical ul,
.wy-menu-vertical li,
.wy-menu-vertical a {
  background: transparent !important;
  border-bottom: 0 !important;
  border-right: 0 !important;
  border-top: 0 !important;
}

.wy-menu-vertical a {
  -webkit-font-smoothing: auto;
  color: var(--cf-text-primary);
  display: block;
  font-size: 14px;
  font-weight: 400;
  padding: 10px 15px 10px 25px !important;
}

.wy-menu-vertical a:hover {
  color: var(--cf-link-primary-hover);
}

.wy-menu-vertical li ul li a {
  color: var(--cf-text-secondary);
}

.wy-menu-vertical ul.current li.current ul a:hover {
  color: var(--cf-text-primary);
}

.wy-menu-vertical ul ul a {
  color: var(--cf-text-helper);
}

/* Override default sphinx theme styling in theme.css */
.wy-menu-vertical li:not(.expand) > ul {
  display: none !important;
}

.toctree-expand {
  display: none !important;
}

/* Sticky Menu */
@media screen and (max-width: 1000px) {
  .sticky-menu-column {
    display: none !important;
  }
}
/* Give feedback link above the right TOC */
.sticky-menu-feedback {
  display: inline-flex;
  align-items: center;
  gap: var(--cf-space-08);
  font-family: var(--cf-font-family);
  /* design system body/small (.cf-body-small) */
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: 0.25px;
  color: var(--cf-text-primary);
  text-decoration: none;
  margin-bottom: var(--cf-space-32);
  width: 100%;
}

.sticky-menu-feedback:hover {
  color: var(--cf-text-primary);
  text-decoration: none;
}

.sticky-menu-feedback svg {
  flex-shrink: 0;
  color: var(--cf-text-helper);
}

/* sticky-menu is rendered conditionally in template when page_headings exist - always show */
.sticky-menu {
  display: block;
}

.sticky-nav-title {
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--cf-text-primary);
  margin-bottom: 16px;
}

.sticky-menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}

/* Single sliding/stretching highlight that spans the run of active links.
   JS sets its transform (offset) and height; CSS animates the change. */
.sticky-menu-pill {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 0;
  border-left: 3px solid var(--color-purple-60);
  /* Themed raised-surface tint: light gray in light mode, a slightly-lighter
     gray in dark mode — matches the selected nav item in the design. */
  background: var(--cf-surface-01-hover);
  border-radius: 0 6px 6px 0;
  opacity: 0;
  pointer-events: none;
  transition:
    transform 0.2s ease,
    height 0.2s ease,
    opacity 0.15s ease;
}

/* The pill stays fully hidden (opacity:0) until nav-scroll.js has applied its
   first placement and added .visible on the next frame. This keeps the initial
   slide-from-the-top position change from ever being visible; the pill just
   fades in already at its resting spot. */
.sticky-menu-pill.visible {
  opacity: 1;
}

.sticky-menu li {
  margin: 0;
  padding: 0;
}

.sticky-menu a {
  display: block;
  font-size: 14px;
  font-weight: 400;
  color: var(--cf-text-secondary);
  text-decoration: none;
  line-height: 20px;
  padding: 5px 8px;
  border-left: 3px solid transparent;
  transition:
    color 0.15s,
    background 0.15s,
    border-color 0.15s;
  position: relative;
}

.sticky-menu a:hover {
  color: var(--cf-text-primary);
  text-decoration: none;
}

/* Active/current item: purple text. The highlight background + border are
   drawn by the single .sticky-menu-pill element (which animates its height),
   so the link itself only needs to sit above the pill and recolor its text. */
.sticky-menu a.active-link {
  font-weight: 600;
  /* Theme-aware: near-black in light mode, white in dark mode. */
  color: var(--cf-text-primary);
  z-index: 1;
}

/* Indentation levels */
.sticky-menu a.indent-h1 {
  display: none;
}

.sticky-menu a.indent-h2 {
  margin-left: 0;
}

.sticky-menu a.indent-h3 {
  padding-left: 24px;
  margin-left: 0;
}

.sticky-menu a.indent-h4 {
  padding-left: 40px;
  margin-left: 0;
}

.sticky-menu a.indent-h5,
.sticky-menu a.indent-h6 {
  padding-left: 56px;
  margin-left: 0;
}

div[class^='highlight'] {
  position: relative;
  border: none;
}

.copy-code-button {
  display: inline-block;
  position: absolute;
  right: 10px;
  top: 4px;
  width: 17px;
  transition: width 0.1s ease-in-out;
}

.copy-code-button:hover {
  cursor: pointer;
  width: 49px;
}

.copy-code-button:hover span {
  color: var(--cf-text-on-color);
  max-width: 100%;
}

/* The code block is dark in BOTH themes, so the icon must be an on-dark color
   regardless of page theme. --cf-text-secondary follows the page theme and goes
   dark in light mode → invisible on the dark code block. */
.copy-code-button svg {
  position: relative;
  z-index: 1;
  width: 16px;
  height: 16px;
  fill: currentColor;
  color: var(--cf-text-on-color);
  opacity: 0.7;
}

.copy-code-button:hover svg {
  opacity: 1;
}

.copy-code-button span {
  color: var(--cf-text-on-color);
  position: absolute;
  right: 0;
  top: 0;
  display: block;
  font-size: 13px;
  transition: all 0.25s ease-in-out;
  overflow: hidden;
  max-width: 0;
}

/* Search results */

#search-results h2 {
  margin-bottom: 0;
}

#search-results .search li a {
  font-size: 1.5rem;
  margin: 1rem 0;
}

#search-results .search li,
#search-results .search li:first-child {
  padding: 0;
  margin: 0;
}

/* Table of contents */

.contents.local.topic {
  padding-bottom: 4rem;
  margin-bottom: 2rem;
  border-bottom: 0.1rem solid var(--cf-border-subtle);
}

.toctree-wrapper.compound ul li a:hover,
.contents.local.topic ul li a:hover {
  color: var(--cf-link-primary-hover);
}

.toctree-wrapper.compound > ul > li,
.contents.local.topic > ul > li {
  list-style: none;
  margin: 1rem 0 0;
}

.toctree-wrapper.compound > ul > li > a::before,
.contents.local.topic > ul > li > a::before {
  content: '\00BB';
  margin-right: 0.5rem;
}

.contents.local.topic > ul > li > a {
  color: var(--cf-link-primary);
}

.toctree-wrapper.compound > ul > li > a {
  color: var(--cf-link-primary);
}

.toctree-wrapper.compound > ul > li > ul > li,
.contents.local.topic > ul > li > ul > li {
  list-style: disc;
  margin-left: 3rem;
}

.toctree-wrapper.compound > ul > li > ul > li > ul > li,
.contents.local.topic > ul > li > ul > li > ul > li {
  list-style: circle;
}

.wy-table-responsive table td,
.wy-table-responsive table th {
  white-space: normal !important;
}

.cp__grid {
  margin: 0;
  padding-bottom: 20px;
}

.cp__grid ul {
  list-style: disc;
  padding: 10px 6px 20px 70px;
  margin: 0;
  font-size: 16px;
  line-height: 26px;
  display: block;
  text-align: left;
}

.cps__grid * {
  box-sizing: border-box;
}

.cp__item {
  border-radius: 10px;
  overflow: hidden;
  padding: 0px;
  margin: 0 auto;
  width: 300px;
}

.cp__item h3 {
  color: var(--cf-text-primary);
  font-weight: 600;
  font-size: 20px;
  text-align: center;
}

.cps__grid * {
  box-sizing: border-box;
}

.cp_button {
  display: inline-block;
  margin-left: 80px;
}

.cps__grid {
  margin-top: 50px;
}

wy-plain-list-decimal li,
.rst-content section ol li,
.rst-content ol.arabic li,
article ol li {
  list-style: decimal;
  margin-left: 24px;
  font-weight: 400;
  line-height: 1.78;
  color: var(--cf-text-primary);
  font-size: 16px;
}

/* -------------------------------------------- */

/* Custom markup */

/* -------------------------------------------- */

.c-top {
  background-color: #111820;
  position: fixed;
  height: 8rem;
  width: 100%;
  z-index: 1;
  top: 0;
}

.c-top__inner {
  max-width: 120rem;
  display: flex;
  flex-direction: row;
  padding: 0 2rem;
  margin: 0 auto;
}

.c-top__left {
  min-width: 20rem;
  flex-basis: 20rem;
  display: flex;
  align-items: center;
}

.c-top__nav {
  display: flex;
  flex-grow: 1;
  justify-content: flex-end;
}

.c-top__nav li {
  margin-left: 4rem;
}

.c-top__nav a {
  font-size: 1.8rem;
  color: var(--cf-text-helper);
  line-height: 8rem;
}

.c-top__nav a:hover {
  color: var(--cf-text-on-color);
}

.c-top__nav .c-button {
  color: var(--cf-text-on-color);
}

.c-button {
  color: var(--cf-text-on-color);
  background-color: var(--cf-button-primary);
  border-radius: 0.2rem;
  padding: 1rem 2.5rem;
}

.c-button:hover {
  background-color: var(--cf-button-primary-hover);
}

.c-top__logo {
  width: 17rem;
}

/* main element c-body ======================= */
.c-body {
  z-index: 0;
  transition: padding-left 0.3s ease-in-out;
}

.one-column .c-body {
  padding-left: 0px;
}

.c-body__inner {
  max-width: 120rem;
  margin: 0 auto;
}

.c-breadcrumbs,
.c-breadcrumbs div[role='navigation'] {
  display: inline-block;
  margin-top: 15px;
}

.c-breadcrumbs a {
  color: var(--cf-text-secondary);
}

.rst-content dl dd {
  font-weight: 400;
  line-height: 1.78;
  color: var(--cf-text-primary);
  font-size: 16px;
}

.rst-content dl dt {
  font-weight: bold;
  line-height: 1.78;
  color: var(--cf-text-primary);
  font-size: 16px;
  margin-bottom: unset;
}

.wy-plain-list-disc li,
.rst-content section ul li,
article ul li {
  list-style: disc;
  margin-left: 24px;
  font-weight: 400;
  line-height: 22px;
  color: var(--cf-text-primary);
  font-size: 16px;
}

.wy-plain-list-disc li,
.rst-content .toctree-wrapper ul li {
  list-style: none;
  margin-left: 24px;
  font-weight: 400;
  line-height: 1.78;
  color: var(--cf-text-primary);
  font-size: 16px;
}

@-moz-document url-prefix() {
  span[id]::before {
    height: 17rem;
  }
}

header[id]::before,
header [id]::before {
  content: '';
  display: block;
  height: 8rem;
  margin-top: -8rem;
}

ul [id]::before,
ol [id]::before,
.c-versions::before,
.c-versions__inner::before {
  display: none;
}

/* -------------------------------------------- */

/* Global table styles
/* -------------------------------------------- */

/* OVERRIDES FOR THEME.CSS */
.rst-content table.docutils:not(.field-list) tr:nth-child(2n-1) td {
  background-color: transparent;
}

.wy-table td,
.rst-content table.docutils td,
.rst-content table.field-list td {
  vertical-align: top;
}

.wy-table thead th,
.rst-content table.docutils thead th,
.rst-content table.field-list thead th {
  vertical-align: top;
}
/* OVERRIDES FOR THEME.CSS */

.wy-table-responsive {
  position: relative;
}

.wy-table-bordered-all,
.rst-content table.docutils {
  border: 1px solid var(--cf-border-subtle);
  border-bottom: 0;
}

/* Prevents tables from "overflowing" to the right, ending up with a horizontal scroll bar */
.wy-table-responsive .non-scrolling-table th,
.wy-table-responsive .non-scrolling-table td {
  white-space: normal;
}

table tbody > tr:last-child {
  border-bottom: 1px solid var(--cf-border-subtle);
}

table tbody > tr:last-child td {
  border-bottom: 0 !important;
}

.rst-content .wy-table-responsive .non-scrolling-table td {
  vertical-align: top;
}

.wy-table-responsive .width-100-percent {
  width: 100%;
}

.data-table {
  display: block;
  border: none;
  border-collapse: collapse;
  width: 100%;
  overflow-x: scroll;
  margin: 2rem 0;
}

.data-table tbody {
  border-style: solid;
  border-color: var(--cf-border-subtle);
  border-width: 0 0.5rem;
}

.data-table td,
.data-table th {
  border: 0.1rem solid var(--cf-border-subtle);
  padding: 0.5rem 1rem;
  min-width: 14rem;
}

.data-table th {
  text-align: left;
  background-color: var(--cf-surface-02);
  border: 0.1rem solid var(--cf-border-subtle);
  color: var(--cf-text-primary);
  font-weight: 400;
  padding: 1rem;
  text-transform: uppercase;
  overflow: hidden;
}

.data-table td {
  /* These are technically the same, but use both */
  overflow-wrap: break-word;
  word-wrap: break-word;
  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: break-all;
  /* Instead use this non-standard one: */
  word-break: break-word;
  /* Adds a hyphen where the word breaks, if supported (No Blink) */
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
}

.data-table tr td:first-of-type {
  -ms-hyphens: none;
  -moz-hyphens: none;
  -webkit-hyphens: none;
  hyphens: none;
}

/* -------------------------------------------- */

/* Mobile styles
/* -------------------------------------------- */

@media screen and (max-width: 950px) {
  /* Top nav link spacing*/
  .c-top__nav li {
    margin-left: 2rem;
  }
}

@media screen and (max-width: 768px) {
  /* Side nav */
  .wy-nav-content-wrap,
  .wy-nav-container-wrap {
    -webkit-transition: right 0.2s ease-in-out;
    -moz-transition: right 0.2s ease-in-out;
    -o-transition: right 0.2s ease-in-out;
    transition:
      right 0.2s ease-in-out,
      left 0.5s;
  }
  .wy-nav-container-wrap {
    right: 0;
    position: relative;
  }
  .wy-side-nav-search {
    width: 100%;
    padding: 1rem 2rem 0;
  }
  .wy-side-nav-search input[type='text'] {
    width: calc(98% - 2rem);
  }
  .wy-menu.wy-menu-vertical {
    width: 100%;
  }
  .wy-nav-container-wrap.shift {
    right: 28rem;
    left: auto;
  }
  .c-top {
    display: none;
  }
  /* Content */
  .wy-nav-container-wrap .wy-nav-container {
    padding: 1rem;
  }
  [id]::before {
    height: 6rem;
    margin-top: -6rem;
  }
  ul [id]::before,
  ol [id]::before {
    display: none;
  }
}

@media screen and (max-width: 480px) {
  /* Text */
  body,
  p {
    font-size: 1.4rem;
  }
  p {
    line-height: 1.8rem;
  }
  h1 {
    font-size: 3rem;
  }
  h2 {
    font-size: 2.1rem;
  }
  h3 {
    font-size: 1.8rem;
  }
  h4 {
    font-size: 1.4rem;
  }
  h5,
  h6,
  h7 {
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 878px) {
  #nav-toggle {
    margin: 0;
    display: none !important;
    padding: 10px 10px;
  }
}

@media only screen and (max-width: 1198px) {
  .cps__grid {
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    max-width: 92rem;
  }
}

/* cc sign up header banner  */

@media screen and (max-width: 768px) {
  .wy-nav-content-wrap.shift {
    right: 28rem;
    left: auto;
  }
  .toggle-columns {
    display: none !important;
  }
  .rst-inner {
    min-width: 0;
  }
}

.docs-banner-link {
  color: #00f8ff !important;
}

/* rebrand for march 5 2020 */

.container nav.navigation > ul > li.download-button a {
  background: #38cced !important;
  border-radius: 6px !important;
  color: green;
}

.container nav.navigation > ul > li.download-button a:hover {
  font-weight: 400 !important;
}

/* rebrand for may 1 2020 */

.brand_logo {
  display: block;
  padding: 5px 0 0 20px;
  height: 29px;
}

.brand_logo img {
  width: 187px;
  height: 30px;
}

.content-header {
  width: 100%;
  border-bottom: 1px solid var(--cf-border-subtle);
  padding: 5px 0 4px 280px;
  background: var(--cf-surface-01);
  position: fixed;
  top: 85px;
  left: 0;
  z-index: 1;
  transition: padding-left 0.5s;
}

nav.navigation {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

@media screen and (max-width: 830px) {
  .one-column nav.navigation {
    margin-right: 0%;
  }
}

@media screen and (max-width: 910px) {
  nav.navigation {
    margin-right: 0%;
  }
}

@media screen and (max-width: 1180px) {
  .second-column nav.navigation {
    margin-right: 0%;
  }
}

/* Collapse button */

.toggle-columns {
  position: fixed;
  top: calc(50% + 5px);
  left: 260px;
  z-index: 1;
  transition: left 0.5s;
}

.toggle-columns:hover {
  text-decoration: none;
}

/* circle */

.toggle-columns::after {
  content: '.';
  color: transparent;
  display: block;
  background: #f8f8fa;
  box-shadow: 1px 1px 5px rgba(25, 25, 36, 0.32);
  width: 25px;
  height: 25px;
  border-radius: 30px;
  font-size: 50px;
  line-height: 50px;
  text-align: center;
  z-index: 1;
  cursor: pointer;
}

/* arrow */

.toggle-columns::before {
  content: '.';
  color: transparent;
  display: block;
  border-left: 2px solid var(--cf-border-strong);
  border-bottom: 2px solid var(--cf-border-strong);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  width: 8px;
  height: 8px;
  position: absolute;
  top: 8px;
  left: 10px;
  z-index: 2;
  cursor: pointer;
}

.version-select-arrow-wrapper {
  position: relative;
}

.arrow-down {
  border: solid black;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
  position: absolute;
  right: 13px;
  top: 17px;
  transform: rotate(45deg);
  visibility: hidden;
}

/* hide previous level menu items */

.wy-side-scroll .wy-menu-vertical li.toctree-l5 li a {
  padding-left: 5%;
}

/*
Collapse the content
*/

.one-column .toggle-columns::before {
  -webkit-transform: rotate(225deg);
  -moz-transform: rotate(225deg);
  -ms-transform: rotate(225deg);
  -o-transform: rotate(225deg);
  transform: rotate(225deg);
  left: 7px;
}

.one-column .toggle-columns {
  left: 0px;
}

.one-column .content-header {
  padding-left: 30px;
}

.wy-menu-vertical > p.caption {
  color: var(--cf-text-secondary) !important;
  margin-bottom: 10px !important;
  padding-left: 10px !important;
  padding-right: 0 !important;
  background-color: transparent !important;
  cursor: default;
  text-transform: uppercase;
  margin-left: 10px;
  display: block;
  font-size: 12px;
  height: initial;
  line-height: initial;
  max-width: 195px;
  padding-top: 20px;
  height: auto; /* IE Fix */
}

.wy-menu-vertical > .caption::after {
  content: '.';
  display: block;
  width: 245px;
  height: 3px;
  background: var(--cf-background-highlight);
  border-left: 3px solid var(--cf-border-interactive);
  color: transparent;
  margin-left: -10px;
  margin-top: 13px;
}

/* Hide the first toctree caption heading in the left nav (and its divider). */
.wy-menu-vertical > p.caption:first-of-type,
.wy-menu-vertical > p.caption:first-of-type::after {
  display: none !important;
}

.wy-menu.wy-menu-vertical > .caption {
  display: none;
}

/* children arrow */

.wy-side-scroll .wy-menu-vertical .has-children > a {
  display: flex !important;
  justify-content: space-between;
  align-items: center;
}

.wy-side-scroll .wy-menu-vertical .has-children > a::after {
  content: '.';
  color: transparent;
  border-left: 2px solid var(--cf-text-secondary);
  border-bottom: 2px solid var(--cf-text-secondary);
  -webkit-transform: rotate(225deg);
  -moz-transform: rotate(225deg);
  -ms-transform: rotate(225deg);
  -o-transform: rotate(225deg);
  transform: rotate(225deg);
  cursor: pointer;
  width: 7px;
  height: 7px;
  display: block;
  flex-shrink: 0;
}

.wy-side-scroll .wy-menu-vertical .has-children.expand > a::after {
  -webkit-transform: rotate(315deg);
  -moz-transform: rotate(315deg);
  -ms-transform: rotate(315deg);
  -o-transform: rotate(315deg);
  transform: rotate(315deg);
}

.wy-side-scroll .wy-menu-vertical .has-children.expand > ul {
  display: block !important;
}

/* this is shown in confluent.js once classes are added */

.wy-menu-vertical {
  /* display: none; */
}

.wy-menu-vertical .toctree-l2 > a {
  margin-left: 15px;
}

.wy-menu-vertical .toctree-l3 > a {
  margin-left: 30px;
}

.wy-menu-vertical .toctree-l4 > a {
  margin-left: 45px;
}

.wy-menu-vertical .toctree-l5 > a {
  margin-left: 60px;
}

.wy-menu-vertical .toctree-l6 > a {
  margin-left: 75px;
}

.wy-menu-vertical .toctree-l7 > a {
  margin-left: 90px;
}

.download-confluent,
.download-confluent:hover {
  border: 1px solid var(--cf-border-interactive);
  border-radius: 4px;
  padding: 4px 12px !important;
  color: var(--cf-link-primary) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  line-height: 21px !important;
}

@media (max-width: 768px) {
  .download-confluent {
    display: none;
  }

  .wy-menu-vertical > p.caption {
    font-size: 1.6rem;
  }
}

/* -------------------------------------- */
/* Right Nav Signup CTA Styles */
/* -------------------------------------- */

.right-nav-signup-cta-container {
  width: auto;
  max-width: 380px;
  margin: 20px 20px;
  background: #fff;
  border-radius: 8px;
  box-shadow:
    0 1px 3px rgba(0, 0, 0, 0.08),
    0 4px 8px rgba(0, 0, 0, 0.06);
  text-align: center;
  padding: 16px;
  font-family: var(--cf-font-family);
}

.right-nav-signup-cta-heading {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--cf-text-primary);
  margin-bottom: 16px;
}

.right-nav-signup-cta-description {
  font-size: 1.2rem;
  color: var(--cf-text-secondary);
  font-weight: 400;
  margin-bottom: 8px;
}

.right-nav-signup-cta-logos {
  display: flex;
  gap: 12px;
  justify-content: center;
  margin-bottom: 8px;
  padding: 0 5px;
}

.right-nav-signup-cta-button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: rgb(51, 51, 51);
  background: rgb(250, 250, 250);
  border-radius: 6px;
  padding: 8px;
  width: 60px;
  transition:
    background 0.2s,
    transform 0.2s;
  cursor: pointer;
}

.right-nav-signup-cta-button:hover {
  background: #f0f0f0;
  transform: translateY(-2px);
}

.right-nav-signup-cta-logo {
  height: 24px;
  margin-bottom: 4px;
}

.right-nav-signup-cta-button-text {
  font-size: 0.8rem;
  font-weight: 600;
}

.right-nav-signup-cta-credits {
  font-size: 1.2rem;
  color: var(--cf-text-secondary);
  font-weight: 400;
}

/* .sd-tab-set, .sd-tab-label, .sd-tab-input, .sd-tab-content {
    padding: 0;
} */

:root {
  --sd-color-tabs-label-active: var(--cf-text-primary);
  --sd-color-tabs-label-hover: var(--cf-text-primary);
  --sd-color-tabs-label-inactive: var(--cf-text-secondary);
  --sd-color-tabs-underline-active: var(--cf-border-interactive);
}

.sd-tab-set > input {
  display: none;
}

.sd-tab-set > label {
  position: relative;
  padding: var(--cf-space-08) 12px;
  font-size: 14px;
  font-weight: 600;
  font-family: var(--cf-font-family);
  color: var(--cf-text-secondary);
  border: none;
  border-bottom: 2px solid var(--cf-border-subtle);
  border-radius: 4px 4px 0 0;
  background: var(--cf-surface-02);
  margin-bottom: -1px;
  margin-left: 2px;
  margin-right: 2px;
  transition:
    color 0.2s,
    background-color 0.2s,
    border-color 0.2s;
}

.sd-tab-set > label:hover {
  color: var(--cf-text-primary);
}

.sd-tab-set > input:checked + label {
  color: var(--cf-interactive-input);
  font-weight: 600;
  background: transparent;
  border-bottom: 3px solid var(--cf-interactive-input);
  border-radius: 0;
  border-top: none;
  border-left: none;
  border-right: none;
}

.sd-tab-set > input:checked + label + .sd-tab-content {
  border: 2px solid var(--cf-border-subtle);
  border-radius: 0 4px 4px 4px;
  margin-top: 0;
  box-shadow: none;
  padding: 0.75rem;
}

.rst-content .toctree-wrapper > p.caption,
.rst-content h1,
.rst-content h2,
.rst-content h3,
.rst-content h4,
.rst-content h5,
.rst-content h6 {
  margin-bottom: unset;
}

.rst-content .toctree-wrapper > p.caption,
.rst-content h1,
.rst-content h2,
.rst-content h3,
.rst-content h4,
.rst-content h5,
.rst-content h6 {
  margin-bottom: unset;
}

.rst-content .toctree-wrapper > p.caption,
.rst-content h1,
.rst-content h2,
.rst-content h3,
.rst-content h4,
.rst-content h5,
.rst-content h6 {
  margin-bottom: unset;
}

/* HTTP directive field-list styling: Target dl/dt/dd structure */
.http.get dl.field-list,
dl.field-list {
  width: 100%;
  margin: 1em 0;
  display: flex;
  flex-wrap: wrap;
  border: 1px solid var(--cf-border-subtle);
}

/* field-odd: Flex with 30-70 ratio */
.http.get dl.field-list > dt.field-odd,
dl.field-list > dt.field-odd {
  flex: 0.3;
  padding: 8px 12px;
  font-weight: 600;
  font-size: 14px;
  line-height: 22px;
  box-sizing: border-box;
}

.http.get dl.field-list > dd.field-odd,
dl.field-list > dd.field-odd {
  flex: 0.7;
  padding: 8px 12px;
  font-size: 14px;
  line-height: 22px;
  box-sizing: border-box;
  margin: 0px;
}

/* field-even: Flex with full width (forces wrap) */
.http.get dl.field-list > dt.field-even,
dl.field-list > dt.field-even {
  flex: 1 1 100%;
  padding: 0px 12px;
  font-weight: 600;
  font-size: 14px;
  line-height: 22px;
  box-sizing: border-box;
}

.http.get dl.field-list > dd.field-even,
dl.field-list > dd.field-even {
  flex: 1 1 100%;
  padding: 8px 12px;
  padding-left: 30%;
  font-size: 14px;
  line-height: 22px;
  box-sizing: border-box;
}
.http.get dl.field-list > dd ul li,
dl.field-list > dd ul li {
  margin: 0px;
}

/* Font size for paragraphs inside dd > ul > li > p */
.http.get dl.field-list > dd ul li p,
dl.field-list > dd ul li p {
  font-size: 14px;
}

/* HTTP signature object styling */
.sig.sig-object.http {
  display: table;
  margin: 6px 0;
  font-size: 90%;
  line-height: normal;
  background: var(--cf-surface-02);
  font-weight: bold;
  color: var(--cf-text-primary);
  border-top: solid 3px var(--cf-border-interactive);
  padding: 6px;
  position: relative;
  font-family:
    Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter',
    'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco,
    'Courier New', Courier, monospace;
}

/* Font color for all elements inside sig-object.http except descname and its children */
.sig-object.http *:not(.descname):not(.descname *):not(.headerlink) {
  color: var(--cf-link-primary);
  font-weight: bold;
  font-family:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    'Helvetica Neue',
    'Lucida Grande',
    'Segoe UI' !important;
}

/* Padding for sig-object property elements */
.sig.sig-object.http .property {
  padding-right: 4px;
}

.sig.sig-object.http > .headerlink {
  display: none;
}

.sig.sig-object.http:hover > .headerlink {
  display: inline-block;
}

/* Force line breaks after each dd to create new rows */
.http.get dl.field-list > dd.field-odd::after,
.http.get dl.field-list > dd.field-even::after,
dl.field-list > dd.field-odd::after,
dl.field-list > dd.field-even::after {
  content: '';
  display: block;
  clear: both;
  width: 100%;
  height: 0;
}

/* Style the nested content in dd */
.http.get dl.field-list > dd ul.simple,
dl.field-list > dd ul.simple {
  margin: 0;
  padding: 0;
  list-style: none;
}

.http.get dl.field-list > dd ul.simple li,
dl.field-list > dd ul.simple li {
  margin: 0;
}

.rst-content div[class^='highlight'] pre {
  white-space: break-spaces;
}

/* Remove default dd styling for immediate dd inside section > dl.http.get */
section > dl.http.get > dd {
  margin-left: 0 !important;
  padding-left: 8px !important;
}

/* Make all table headers bold */
table thead th,
table thead td,
th.head,
th.head p {
  font-weight: bold !important;
}

.rst-content table.docutils thead th,
.rst-content table.field-list thead th,
.wy-table thead th {
  border: 1px solid var(--cf-border-subtle);
} /* ============================================================================
   NEW HEADER STYLES
   Uses Confluent Design System tokens from confluent-design-system.css
   ============================================================================ */

/* Header Container */
.cf-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--color-neutral-10);
  border-bottom: 1px solid var(--cf-border-subtle);
}

/* ============================================================================
   TOP HEADER BAR
   ============================================================================ */

.cf-header-top {
  /* border-bottom: 1px solid var(--cf-border-subtle); */
}

.cf-header-top-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--cf-space-16);
  gap: var(--cf-space-24);
}

/* ============================================================================
   LOGO SECTION
   ============================================================================ */

.cf-header-logo {
  display: flex;
  align-items: center;
  gap: var(--cf-space-16);
  flex-shrink: 0;
}

.cf-logo-link {
  display: flex;
  align-items: center;
  color: var(--cf-text-primary);
  text-decoration: none;
}

.cf-logo-link:hover {
  color: var(--cf-text-primary);
}

.cf-logo-img {
  width: 200px;
  height: auto;
  display: block;
  transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -webkit-transform: scale(1.2);
}

/* Theme-swapped logo (CSS show/hide, no JS). The header background is
   --cf-surface-01: white in light mode, dark in dark mode. So the light-ink
   logo shows in light mode and the original shows in dark mode.
   Default (no explicit data-theme) follows light; the prefers-color-scheme
   block below covers system-dark when the user hasn't chosen a theme. */
.cf-logo-img--dark {
  display: none;
}
.cf-logo-img--light {
  display: block;
}

[data-theme='dark'] .cf-logo-img--light {
  display: none;
}
[data-theme='dark'] .cf-logo-img--dark {
  display: block;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) .cf-logo-img--light {
    display: none;
  }
  :root:not([data-theme='light']) .cf-logo-img--dark {
    display: block;
  }
}

.cf-docs-link {
  font-size: 16px;
  font-weight: 500;
  color: var(--cf-text-primary);
  text-decoration: none;
  padding-left: var(--cf-space-16);
  border-left: 1px solid var(--cf-border-subtle);
}

.cf-docs-link:hover {
  color: var(--cf-link-primary-hover);
}

/* ============================================================================
   SEARCH SECTION
   ============================================================================ */

.cf-header-search {
  flex: 1;
  max-width: 480px;
  margin: 0 var(--cf-space-24);
}

.cf-header-search .cf-search-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  padding: var(--cf-space-08) var(--cf-space-40) var(--cf-space-08) var(--cf-space-40);
  border: 1px solid var(--cf-border-subtle);
  border-radius: var(--cf-radius-sm);
  background: var(--color-white);
  font-family: var(--cf-font-family);
  font-size: 16px;
  line-height: 20px;
  cursor: text;
  color: var(--color-neutral-60);
  text-align: left;
  transition:
    border-color 0.2s,
    box-shadow 0.2s;
}

[data-theme='dark'] .cf-header-search .cf-search-wrapper {
  background: var(--color-neutral-80);
  color: var(--color-neutral-40);
}

.cf-header-search .cf-search-wrapper:hover {
}

.cf-header-search .cf-search-icon {
  position: absolute;
  left: var(--cf-space-16);
  color: var(--cf-text-helper);
  pointer-events: none;
}

.cf-header-search .cf-search-placeholder-text {
  flex: 1;
  color: var(--color-neutral-60);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[data-theme='dark'] .cf-header-search .cf-search-placeholder-text {
  color: var(--color-neutral-40);
}

.cf-header-search .cf-search-shortcut {
  position: absolute;
  right: var(--cf-space-16);
  padding: 2px 6px;
  font-size: 12px;
  font-family: var(--cf-font-family-mono);
  color: var(--cf-text-helper);
  background: var(--cf-surface-02);
  border: 1px solid var(--cf-border-subtle);
  border-radius: var(--cf-radius-sm);
}

/* ============================================================================
   ACTIONS SECTION (Right side)
   ============================================================================ */

.cf-header-actions {
  display: flex;
  align-items: center;
  gap: var(--cf-space-16);
  flex-shrink: 0;
}

.cf-header-action-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: none;
  border-radius: var(--cf-radius-sm);
  background: transparent;
  color: var(--cf-text-secondary);
  cursor: pointer;
  transition: all 0.2s;
}

/* AI button: inner sparkle adapts to theme via currentColor */
.cf-ai-btn,
.cf-ai-btn:hover {
  color: #131316;
}

[data-theme='dark'] .cf-ai-btn,
[data-theme='dark'] .cf-ai-btn:hover {
  color: #ffffff;
}

.cf-header-link {
  font-size: 14px;
  font-weight: 400;
  color: var(--cf-text-secondary);
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.2s;
}

.cf-header-link:hover {
  color: var(--cf-link-primary);
}

.cf-header-cta {
  padding: var(--cf-space-08) var(--cf-space-16);
  font-size: 14px;
  white-space: nowrap;
}

/* ============================================================================
   THEME TOGGLE
   ============================================================================ */

.cf-theme-toggle {
  position: relative;
  color: var(--cf-link-primary);
}

/* Light mode - show sun icon */
.cf-theme-icon-light {
  display: block;
  color: var(--color-purple-60);
}

.cf-theme-icon-dark {
  display: none;
  color: var(--color-neutral-10);
}

/* Dark mode - show moon icon */
[data-theme='dark'] .cf-theme-icon-light {
  display: none;
}

[data-theme='dark'] .cf-theme-icon-dark {
  display: block;
}

/* ============================================================================
   MOBILE MENU TOGGLE
   ============================================================================ */

.cf-mobile-menu-toggle,
.cf-mobile-menu-toggle--left {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
  gap: 4px;
}

.cf-hamburger-icon {
  width: 13px;
  height: 9px;
}

/* Light mode - show dark-ink icon */
.cf-hamburger-icon--light {
  display: block;
}

.cf-hamburger-icon--dark {
  display: none;
}

/* Dark mode - show light-ink icon */
[data-theme='dark'] .cf-hamburger-icon--light {
  display: none;
}

[data-theme='dark'] .cf-hamburger-icon--dark {
  display: block;
}

/* ============================================================================
   SUB NAVIGATION
   ============================================================================ */

.cf-header-subnav {
  background-color: var(--color-neutral-10);
}

.cf-header-subnav-inner {
  padding: 0 var(--cf-space-24);
}

.cf-subnav-tabs {
  display: flex;
  align-items: center;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  border-bottom: 1px solid var(--cf-border-subtle);
}

.cf-subnav-tabs::-webkit-scrollbar {
  display: none;
}

.cf-subnav-tab {
  position: relative;
  padding: var(--cf-space-08) 12px;
  font-size: 14px;
  font-weight: 400;
  color: var(--cf-text-secondary);
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.2s;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}

.cf-subnav-tab:hover {
  color: var(--cf-text-primary);
}

.cf-subnav-tab.active {
  color: var(--cf-interactive-input);
  font-weight: 600;
  border-bottom: 2px solid var(--cf-interactive-input);
}

.cf-subnav-tab.active::after {
  background-color: var(--cf-interactive-input);
}

/* ============================================================================
   BREADCRUMB BAR
   ============================================================================ */

.cf-breadcrumb-bar {
}

.cf-breadcrumb-bar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
}

.cf-breadcrumb-left {
  display: flex;
  align-items: center;
  overflow: hidden;
  flex: 1;
  min-width: 0;
}

.cf-breadcrumb-right {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  margin-left: var(--cf-space-16);
}

/* Breadcrumb list */
.cf-breadcrumb-left .breadcrumbs {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  row-gap: var(--cf-space-04) !important;
}

.cf-breadcrumb-left .breadcrumbs .crumb {
  display: inline-flex !important;
  align-items: center !important;
}

.cf-breadcrumb-left .breadcrumbs .crumb > a {
  font-size: 13px !important;
  font-weight: 400 !important;
  color: var(--cf-text-secondary) !important;
  text-decoration: none !important;
  transition: color 0.15s !important;
  line-height: 1.4 !important;
}

.cf-breadcrumb-left .breadcrumbs .crumb > a:hover {
  color: var(--cf-link-primary) !important;
}

/* Last crumb (current page) - slightly darker */
.cf-breadcrumb-left .breadcrumbs .crumb:last-child > a {
  color: var(--cf-text-primary) !important;
}

/* Separator chevron between crumbs */
.cf-breadcrumb-left .breadcrumbs .crumb::after {
  content: '' !important;
  display: inline-block !important;
  width: 5px !important;
  height: 5px !important;
  border-right: 1.5px solid var(--cf-text-helper) !important;
  border-top: 1.5px solid var(--cf-text-helper) !important;
  transform: rotate(45deg) !important;
  margin: 0 var(--cf-space-08) !important;
  flex-shrink: 0 !important;
  font-size: unset !important;
}

.cf-breadcrumb-left .breadcrumbs .crumb:last-child::after {
  display: none !important;
}

/* ============================================================================
   RESPONSIVE STYLES
   ============================================================================ */

/* Tablet (≤1092px) */
@media (max-width: 1092px) {
  .cf-header-top-inner {
    padding: var(--cf-space-16);
    gap: 0;
  }

  /* Center box: hide search */
  .cf-header-search {
    display: none;
  }

  /* Right box: hide links, keep CTA, show hamburger */
  .cf-header-link,
  .cf-ai-btn {
    display: none;
  }

  .cf-mobile-menu-toggle--left {
    display: flex;
  }

  .cf-header-subnav-inner {
    padding: 0 var(--cf-space-16);
  }
}

/* Mobile (≤832px) */
@media (max-width: 832px) {
  /* 1. Breadcrumb bar: stack breadcrumb + ask button vertically */
  .cf-breadcrumb-bar {
    padding: 0 var(--cf-space-32);
  }

  .cf-breadcrumb-bar-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--cf-space-16);
    padding: var(--cf-space-08) 0;
  }

  .cf-breadcrumb-right {
    margin-left: 0;
  }

  /* 2. Allow breadcrumb to wrap */
  .cf-breadcrumb-left .breadcrumbs {
    white-space: normal !important;
    flex-wrap: wrap !important;
  }

  .cf-breadcrumb-left .breadcrumbs .crumb > a {
    white-space: normal !important;
  }

  .cf-header-top-inner {
    height: 56px;
  }

  /* Left box: hide logo + "Documentation" link, show page title with ellipsis */
  .cf-header-logo {
    flex: 1;
    min-width: 0;
  }

  .cf-header-logo .cf-logo-link,
  .cf-docs-link {
    display: none;
  }

  .cf-mobile-page-title {
    display: inline-block;
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 500;
    color: var(--cf-text-primary);
  }

  .sticky-menu-column {
    display: none !important;
  }

  .cf-sidebar-collapse-btn {
    display: none !important;
  }

  .wy-nav-content {
    width: 100%;
    min-width: 0;
  }
}

.cf-mobile-page-title {
  display: none;
}

/* Small mobile */
@media (max-width: 480px) {
  .cf-header-top-inner {
    padding: 0 var(--cf-space-08);
  }

  .cf-header-subnav-inner {
    padding: 0 var(--cf-space-08);
  }

  .cf-subnav-tab {
    padding: var(--cf-space-12) var(--cf-space-08);
    font-size: 13px;
  }
}

/* ============================================================================
   MOBILE DRAWER
   ============================================================================ */

.cf-drawer-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 200;
}

.cf-drawer-overlay--open {
  display: block;
}

.cf-drawer {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: 320px;
  max-width: 90vw;
  background: var(--cf-surface-01);
  z-index: 1001;
  display: flex;
  flex-direction: column;
  transform: translateX(-100%);
  transition: transform 0.25s ease;
  overflow-y: auto;
}

.cf-drawer--open {
  transform: translateX(0);
}

.cf-drawer-body-lock {
  overflow: hidden;
}

.cf-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--cf-space-16) var(--cf-space-24);
  border-bottom: 1px solid var(--cf-border-subtle);
  min-height: 60px;
  flex-shrink: 0;
}

.cf-drawer-header-left {
  display: flex;
  align-items: center;
  gap: var(--cf-space-16);
  min-width: 0;
}

.cf-drawer-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--cf-text-primary);
  border-radius: var(--cf-radius-sm);
}

.cf-drawer-close:hover {
  background: var(--cf-surface-02);
}

.cf-drawer-page-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--cf-text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cf-drawer-cta {
  flex-shrink: 0;
  font-size: 14px;
  padding: var(--cf-space-08) var(--cf-space-16);
}

.cf-drawer-version {
  display: none;
  padding: var(--cf-space-16) var(--cf-space-16) 0;
  flex-shrink: 0;
}

.cf-drawer-version.populated {
  display: block;
}

.cf-drawer-search {
  padding: var(--cf-space-16);
  flex-shrink: 0;
}

.cf-drawer-search-btn {
  display: flex;
  align-items: center;
  gap: var(--cf-space-08);
  width: 100%;
  height: 40px;
  padding: 0 var(--cf-space-16);
  background: var(--cf-surface-01);
  border: 1px solid var(--cf-border-strong);
  border-radius: var(--cf-radius-md);
  color: var(--cf-text-placeholder, var(--cf-text-secondary));
  font-size: 14px;
  cursor: pointer;
  text-align: left;
}

.cf-drawer-nav {
  display: flex;
  flex-direction: column;
  padding: var(--cf-space-08) var(--cf-space-08);
  flex: 1;
}

.cf-drawer-nav-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 40px;
  padding: 0 var(--cf-space-16);
  border-radius: var(--cf-radius-sm);
  font-size: 16px;
  color: var(--cf-text-secondary);
  text-decoration: none;
  background: none;
  border: none;
  cursor: pointer;
  width: 100%;
  text-align: left;
  font-family: var(--cf-font-family);
}

.cf-drawer-nav-item:hover {
  background: var(--cf-surface-02);
  color: var(--cf-text-primary);
}

.cf-drawer-nav-item.active {
  color: var(--cf-text-primary);
  font-weight: 600;
  background: var(--cf-surface-01-hover);
  border-left: 3px solid var(--cf-border-interactive);
}

/* ============================================================================
   DARK MODE OVERRIDES
   ============================================================================ */

[data-theme='dark'] .cf-header {
  background: var(--color-neutral-100);
}

[data-theme='dark'] .cf-header-subnav {
  background-color: var(--color-neutral-100);
}

/* ============================================================================
   NEW SIDEBAR STYLES
   Uses Confluent Design System tokens from confluent-design-system.css
   ============================================================================ */

/* ============================================================================
   SIDEBAR CONTAINER
   ============================================================================ */

/* Collapsed state - 5px width with icon */
.cf-sidebar.collapsed {
  width: 5px;
}

.cf-sidebar.collapsed .cf-sidebar-content,
.cf-sidebar.collapsed .cf-sidebar-header,
.cf-sidebar.collapsed .cf-sidebar-version {
  opacity: 0;
  pointer-events: none;
}

.cf-sidebar.collapsed .cf-sidebar-toggle {
  right: -32px;
}

/* ============================================================================
   SIDEBAR HEADER (with collapse toggle)
   ============================================================================ */

.cf-sidebar-header {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: var(--cf-space-16);
  border-bottom: 1px solid var(--cf-border-subtle);
  flex-shrink: 0;
}

.cf-sidebar-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 1px solid var(--cf-border-subtle);
  border-radius: var(--cf-radius-sm);
  background: var(--cf-surface-01);
  color: var(--cf-text-secondary);
  cursor: pointer;
  transition: all 0.2s;
}

.cf-sidebar-toggle:hover {
  border-color: var(--cf-border-interactive);
  color: var(--cf-link-primary);
  background: var(--cf-background-hover);
}

.cf-sidebar-toggle svg {
  width: 16px;
  height: 16px;
  transition: transform 0.2s;
}

.cf-sidebar.collapsed .cf-sidebar-toggle svg {
  transform: rotate(180deg);
}

/* ============================================================================
   SIDEBAR CONTENT (scrollable nav area)
   ============================================================================ */

.cf-sidebar-content {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding: var(--cf-space-08) 0;
  transition: opacity 0.2s;
}

/* Custom scrollbar */
.cf-sidebar-content::-webkit-scrollbar {
  width: 6px;
}

.cf-sidebar-content::-webkit-scrollbar-track {
  background: transparent;
}

.cf-sidebar-content::-webkit-scrollbar-thumb {
  background: var(--cf-border-subtle);
  border-radius: 3px;
}

.cf-sidebar-content::-webkit-scrollbar-thumb:hover {
  background: var(--cf-border-strong);
}

/* ============================================================================
   NAVIGATION MENU
   ============================================================================ */

.cf-sidebar-nav {
  list-style: none;
  margin: 0;
  padding: 0;
}

.cf-sidebar-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* ============================================================================
   NAV ITEMS - Base styles
   ============================================================================ */

.cf-sidebar-nav a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--cf-space-08) var(--cf-space-16);
  font-size: 14px;
  font-weight: 400;
  color: var(--cf-text-secondary);
  text-decoration: none;
  border-left: 3px solid transparent;
  transition: all 0.15s ease;
  line-height: 20px;
}

.cf-sidebar-nav a:hover {
  color: var(--cf-text-primary);
  background-color: var(--cf-surface-01-hover);
}

/* ============================================================================
   ACTIVE / CURRENT PAGE
   Purple left border + neutral highlight background (matches the right-hand
   "on this page" sticky menu highlight, see .sticky-menu-pill)
   ============================================================================ */

.cf-sidebar-nav a.current,
.cf-sidebar-nav a[aria-current='page'],
.cf-sidebar-nav .current > a {
  color: var(--cf-text-primary);
  font-weight: 500;
  background-color: var(--cf-surface-01-hover);
  border-left-color: var(--cf-border-interactive);
}

/* ============================================================================
   EXPANDABLE ITEMS (with children)
   ============================================================================ */

.cf-sidebar-nav .has-children > a {
  cursor: pointer;
}

/* Chevron icon for expandable items */
.cf-sidebar-nav .has-children > a::after {
  content: '';
  width: 6px;
  height: 6px;
  border-right: 2px solid var(--cf-text-helper);
  border-bottom: 2px solid var(--cf-text-helper);
  transform: rotate(-45deg);
  flex-shrink: 0;
  margin-left: var(--cf-space-08);
  transition: transform 0.2s;
}

/* Rotate chevron when expanded */
.cf-sidebar-nav .has-children.expand > a::after {
  transform: rotate(45deg);
}

/* Hide children by default */
.cf-sidebar-nav .has-children > ul {
  display: none;
}

/* Show children when expanded */
.cf-sidebar-nav .has-children.expand > ul {
  display: block;
}

/* ============================================================================
   NESTED LEVELS - Indentation
   ============================================================================ */

.cf-sidebar-nav .toctree-l2 > a {
  padding-left: calc(var(--cf-space-16) + 12px);
}

.cf-sidebar-nav .toctree-l3 > a {
  padding-left: calc(var(--cf-space-16) + 24px);
}

.cf-sidebar-nav .toctree-l4 > a {
  padding-left: calc(var(--cf-space-16) + 36px);
}

.cf-sidebar-nav .toctree-l5 > a {
  padding-left: calc(var(--cf-space-16) + 48px);
}

.cf-sidebar-nav .toctree-l6 > a {
  padding-left: calc(var(--cf-space-16) + 60px);
}

.cf-sidebar-nav .toctree-l7 > a {
  padding-left: calc(var(--cf-space-16) + 72px);
}

/* ============================================================================
   SECTION CAPTIONS / HEADERS
   ============================================================================ */

.cf-sidebar-nav > .caption,
.cf-sidebar-nav > p.caption {
  display: block;
  padding: var(--cf-space-16) var(--cf-space-16) var(--cf-space-08);
  font-size: 12px;
  font-weight: 600;
  color: var(--cf-text-helper);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* ============================================================================
   VERSION SELECTOR (preserved from original)
   ============================================================================ */

.cf-sidebar-version {
  padding: var(--cf-space-16);
  border-top: 1px solid var(--cf-border-subtle);
  flex-shrink: 0;
  transition: opacity 0.2s;
}

.cf-sidebar-version label {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: var(--cf-text-helper);
  margin-bottom: var(--cf-space-04);
}

.cf-sidebar-version select {
  width: 100%;
  padding: var(--cf-space-08) var(--cf-space-16);
  border: 1px solid var(--cf-border-subtle);
  border-radius: var(--cf-radius-sm);
  background: var(--cf-field-on-surface-01);
  color: var(--cf-text-primary);
  font-family: var(--cf-font-family);
  font-size: 14px;
  cursor: pointer;
  outline: none;
  transition: border-color 0.2s;
}

.cf-sidebar-version select:hover {
  border-color: var(--cf-border-strong);
}

.cf-sidebar-version select:focus {
  border-color: var(--cf-border-interactive);
}

/* ============================================================================
   MAIN CONTENT OFFSET
   Adjust main content to account for fixed sidebar
   ============================================================================ */

.cf-main-with-sidebar {
  margin-left: 288px;
}

.cf-sidebar.collapsed ~ .cf-main-with-sidebar,
body.sidebar-collapsed .cf-main-with-sidebar {
  margin-left: 0;
}

/* ============================================================================
   RESPONSIVE STYLES
   ============================================================================ */

/* Tablet */
@media (max-width: 992px) {
  .cf-sidebar {
    /* TODO: Mobile sidebar behavior */
  }
}

/* Mobile */
@media (max-width: 768px) {
  .cf-sidebar {
    /* TODO: Mobile sidebar - drawer style */
  }

  .cf-main-with-sidebar {
    margin-left: 0;
  }
}

/* ============================================================================
   LEGACY COMPATIBILITY
   Map old classes to new styles (for existing toctree output)
   ============================================================================ */

/* Apply new styles to existing wy-nav-side */
.wy-nav-side {
  position: relative;
  width: 288px;
  background-color: var(--cf-surface-01);
  background: var(--cf-surface-01);
}

/* Collapsed state - overflow visible so button peeks out */
.wy-nav-side.collapsed {
  overflow: visible !important;
}
.wy-nav-side.collapsed .leftside-bar-wrapper {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.wy-nav-side .leftside-bar-wrapper {
  border-right: 1px solid var(--cf-border-subtle);
  display: flex;
  flex-direction: column;
  z-index: 100;
  height: 100%;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
  background-color: var(--cf-surface-01);
  background: var(--cf-surface-01);
  opacity: 1;
  visibility: visible;
  transition:
    opacity 0.3s ease,
    visibility 0.3s ease;
}

.wy-nav-side.collapsed .wy-side-scroll,
.wy-nav-side.collapsed .selector-container {
  display: none;
}

.wy-side-scroll {
  flex: 1 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  height: auto !important;
  background: var(--cf-surface-01) !important;
  overscroll-behavior: contain;
}

/* Custom scrollbar for wy-side-scroll */
.wy-side-scroll::-webkit-scrollbar {
  width: 6px;
}

.wy-side-scroll::-webkit-scrollbar-track {
  background: transparent;
}

.wy-side-scroll::-webkit-scrollbar-thumb {
  background: var(--cf-border-subtle);
  border-radius: 3px;
}

.wy-side-scroll::-webkit-scrollbar-thumb:hover {
  background: var(--cf-border-strong);
}

/* Nav items */
.wy-menu-vertical a {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: var(--cf-space-08) var(--cf-space-16) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: var(--cf-text-secondary) !important;
  text-decoration: none !important;
  border-left: 3px solid transparent !important;
  transition: all 0.15s ease !important;
  line-height: 20px !important;
  background: transparent !important;
  margin: 0 !important;
}

.wy-menu-vertical a:hover {
  color: var(--cf-text-primary) !important;
  background-color: var(--cf-surface-01-hover) !important;
}

/* Parent items in current path - bold only, no highlight */
.wy-menu-vertical li.current > a {
  color: var(--cf-text-primary) !important;
  font-weight: 600 !important;
  background-color: transparent !important;
  border-left-color: transparent !important;
}

/* Current page only (leaf) - highlight + border
   (matches the right-hand "on this page" sticky menu highlight, see
   .sticky-menu-pill) */
.wy-menu-vertical li.current:not(:has(li.current)) > a {
  background-color: var(--cf-surface-01-hover) !important;
  border-left-color: var(--cf-border-interactive) !important;
}

/* ============================================================================
   DARK MODE - RST CONTENT
   ============================================================================ */

[data-theme='dark'] .rst-content,
[data-theme='dark'] .rst-content p,
[data-theme='dark'] .rst-content li,
[data-theme='dark'] .rst-content td,
[data-theme='dark'] .rst-content th,
[data-theme='dark'] .rst-content dt,
[data-theme='dark'] .rst-content dd {
  color: var(--cf-text-primary) !important;
}

[data-theme='dark'] .rst-content h1,
[data-theme='dark'] .rst-content h2,
[data-theme='dark'] .rst-content h3,
[data-theme='dark'] .rst-content h4,
[data-theme='dark'] .rst-content h5,
[data-theme='dark'] .rst-content h6 {
  color: var(--cf-text-primary) !important;
}

[data-theme='dark'] .rst-content a {
  color: var(--cf-link-primary) !important;
}

[data-theme='dark'] .rst-content a:hover {
  color: var(--cf-link-primary-hover) !important;
}

/* Code blocks */
[data-theme='dark'] .rst-content code,
[data-theme='dark'] .rst-content tt {
  color: var(--cf-text-primary) !important;
  background-color: var(--cf-surface-02) !important;
}

/* Light mode: give codeblocks a dark background for better readability
   (Pygments monokai palette is built for dark surfaces).
   Dark mode is left alone — handled by theme.css base rules. */
:root:not([data-theme='dark']) .rst-content pre,
:root:not([data-theme='dark']) .rst-content .highlight {
  background-color: var(--color-neutral-100) !important;
  border-color: var(--color-neutral-80) !important;
}

:root:not([data-theme='dark']) .rst-content .highlight pre {
  color: var(--color-white) !important;
  background-color: transparent !important;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) .rst-content pre,
  :root:not([data-theme='light']) .rst-content .highlight {
    background-color: var(--cf-surface-02) !important;
    border-color: var(--cf-border-subtle) !important;
  }
  :root:not([data-theme='light']) .rst-content .highlight pre {
    color: var(--cf-text-primary) !important;
  }
}

/* Tables */
[data-theme='dark'] .rst-content table.docutils,
[data-theme='dark'] .rst-content table {
  border-color: var(--cf-border-subtle) !important;
}

[data-theme='dark'] .rst-content table.docutils td,
[data-theme='dark'] .rst-content table.docutils th,
[data-theme='dark'] .rst-content table td,
[data-theme='dark'] .rst-content table th {
  border-color: var(--cf-border-subtle) !important;
  background-color: transparent !important;
}

[data-theme='dark'] .rst-content table.docutils thead th,
[data-theme='dark'] .rst-content table thead th {
  background-color: var(--cf-surface-02) !important;
  color: var(--cf-text-primary) !important;
}

/* ============================================================================
   ADMONITIONS
   ============================================================================ */

/* Base */
.rst-content .admonition,
.rst-content .note,
.rst-content .tip,
.rst-content .confluenttip,
.rst-content .important,
.rst-content .seealso,
.rst-content .warning,
.rst-content .caution,
.rst-content .danger {
  border-radius: 8px !important;
  border: 1px solid !important;
  padding: 14px 16px 14px 44px !important;
  margin: 24px 0 !important;
  position: relative !important;
}

/* Hide the title text, show as icon via ::before on the admonition */
.rst-content .admonition-title {
  display: none !important;
}

/* Icon via pseudo-element on the admonition box (shared blue icon, incl. generic admonition) */
.rst-content div.admonition::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  left: 14px !important;
  top: 20px !important;
  width: 18px !important;
  height: 18px !important;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2C2.89543 2 2 2.89543 2 4V12C2 13.1046 2.89543 14 4 14H12C13.1046 14 14 13.1046 14 12V4C14 2.89543 13.1046 2 12 2C12 2 5.10457 2 4 2Z' fill='%23176EE8'/%3E%3Cpath d='M9.25 4.375C9.25 4.85825 8.85825 5.25 8.375 5.25C7.89175 5.25 7.5 4.85825 7.5 4.375C7.5 3.89175 7.89175 3.5 8.375 3.5C8.85825 3.5 9.25 3.89175 9.25 4.375Z' fill='white'/%3E%3Cpath d='M6 6.5C5.72386 6.5 5.5 6.72386 5.5 7C5.5 7.27614 5.72386 7.5 6 7.5H8V11.375C8 11.7202 8.27982 12 8.625 12C8.97018 12 9.25 11.7202 9.25 11.375V7.5C9.25 6.94772 8.80228 6.5 8.25 6.5H6Z' fill='white'/%3E%3C/svg%3E") !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-color: transparent !important;
}

.rst-content .admonition p:last-child,
.rst-content .note p:last-child,
.rst-content .tip p:last-child,
.rst-content .warning p:last-child,
.rst-content .caution p:last-child,
.rst-content .danger p:last-child,
.rst-content .important p:last-child {
  margin-bottom: 0 !important;
}

/* note / tip / confluenttip / seealso / generic admonition — blue */
.rst-content .note,
.rst-content .tip,
.rst-content .confluenttip,
.rst-content .seealso,
.rst-content .admonition:not(.important):not(.warning):not(.caution):not(.danger) {
  background-color: var(--color-blue-10) !important;
  border-color: var(--color-blue-20) !important;
}

.rst-content div.admonition.warning::before,
.rst-content div.admonition.caution::before {
  /* warning triangle — yellow */
  background-image: none !important;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='13' viewBox='0 0 15 13' fill='none'%3E%3Cpath d='M6.43593 0.333519C6.69248 -0.111173 7.33429 -0.111173 7.59084 0.333518L13.9366 11.3328C14.193 11.7772 13.8722 12.3326 13.3591 12.3326H0.667661C0.154555 12.3326 -0.166207 11.7772 0.0902035 11.3328L6.43593 0.333519Z' fill='black'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='13' viewBox='0 0 15 13' fill='none'%3E%3Cpath d='M6.43593 0.333519C6.69248 -0.111173 7.33429 -0.111173 7.59084 0.333518L13.9366 11.3328C14.193 11.7772 13.8722 12.3326 13.3591 12.3326H0.667661C0.154555 12.3326 -0.166207 11.7772 0.0902035 11.3328L6.43593 0.333519Z' fill='black'/%3E%3C/svg%3E") !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  background-color: var(--color-yellow-50) !important;
}

.rst-content div.admonition.danger::before {
  /* danger diamond — red */
  background-image: none !important;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.67216 0.278417C7.30094 -0.0928056 6.69906 -0.0928058 6.32784 0.278417L0.278417 6.32784C-0.0928056 6.69906 -0.0928058 7.30094 0.278417 7.67216L6.32784 13.7216C6.69906 14.0928 7.30094 14.0928 7.67216 13.7216L13.7216 7.67216C14.0928 7.30094 14.0928 6.69906 13.7216 6.32784L7.67216 0.278417Z' fill='black'/%3E%3C/svg%3E") !important;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.67216 0.278417C7.30094 -0.0928056 6.69906 -0.0928058 6.32784 0.278417L0.278417 6.32784C-0.0928056 6.69906 -0.0928058 7.30094 0.278417 7.67216L6.32784 13.7216C6.69906 14.0928 7.30094 14.0928 7.67216 13.7216L13.7216 7.67216C14.0928 7.30094 14.0928 6.69906 13.7216 6.32784L7.67216 0.278417Z' fill='black'/%3E%3C/svg%3E") !important;
  -webkit-mask-size: contain !important;
  mask-size: contain !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
  -webkit-mask-position: center !important;
  mask-position: center !important;
  background-color: var(--color-red-60) !important;
}

/* important — purple */
.rst-content .important {
  background-color: var(--color-purple-10) !important;
  border-color: var(--color-purple-20) !important;
}

.rst-content div.admonition.important::before {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2C2.89543 2 2 2.89543 2 4V12C2 13.1046 2.89543 14 4 14H12C13.1046 14 14 13.1046 14 12V4C14 2.89543 13.1046 2 12 2C12 2 5.10457 2 4 2Z' fill='%236047FF'/%3E%3Cpath d='M9.25 4.375C9.25 4.85825 8.85825 5.25 8.375 5.25C7.89175 5.25 7.5 4.85825 7.5 4.375C7.5 3.89175 7.89175 3.5 8.375 3.5C8.85825 3.5 9.25 3.89175 9.25 4.375Z' fill='white'/%3E%3Cpath d='M6 6.5C5.72386 6.5 5.5 6.72386 5.5 7C5.5 7.27614 5.72386 7.5 6 7.5H8V11.375C8 11.7202 8.27982 12 8.625 12C8.97018 12 9.25 11.7202 9.25 11.375V7.5C9.25 6.94772 8.80228 6.5 8.25 6.5H6Z' fill='white'/%3E%3C/svg%3E") !important;
}

/* warning / caution — yellow */
.rst-content .warning,
.rst-content .caution {
  background-color: var(--color-yellow-10) !important;
  border-color: var(--color-yellow-20) !important;
}

/* danger — red */
.rst-content .danger {
  background-color: var(--color-red-10) !important;
  border-color: var(--color-red-20) !important;
}

/* Dark mode */
[data-theme='dark'] .rst-content .note,
[data-theme='dark'] .rst-content .tip,
[data-theme='dark'] .rst-content .confluenttip,
[data-theme='dark'] .rst-content .seealso,
[data-theme='dark']
  .rst-content
  .admonition:not(.important):not(.warning):not(.caution):not(.danger) {
  background-color: var(--color-blue-100) !important;
  border-color: var(--color-blue-90) !important;
}

[data-theme='dark'] .rst-content div.admonition.note::before,
[data-theme='dark'] .rst-content div.admonition.tip::before,
[data-theme='dark'] .rst-content div.admonition.confluenttip::before,
[data-theme='dark'] .rst-content div.admonition.seealso::before,
[data-theme='dark']
  .rst-content
  div.admonition:not(.note):not(.tip):not(.confluenttip):not(.seealso):not(.important):not(
    .warning
  ):not(.caution):not(.danger)::before {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 2C2.89543 2 2 2.89543 2 4V12C2 13.1046 2.89543 14 4 14H12C13.1046 14 14 13.1046 14 12V4C14 2.89543 13.1046 2 12 2C12 2 5.10457 2 4 2Z' fill='%2371A8F4'/%3E%3Cpath d='M9.25 4.375C9.25 4.85825 8.85825 5.25 8.375 5.25C7.89175 5.25 7.5 4.85825 7.5 4.375C7.5 3.89175 7.89175 3.5 8.375 3.5C8.85825 3.5 9.25 3.89175 9.25 4.375Z' fill='black'/%3E%3Cpath d='M6 6.5C5.72386 6.5 5.5 6.72386 5.5 7C5.5 7.27614 5.72386 7.5 6 7.5H8V11.375C8 11.7202 8.27982 12 8.625 12C8.97018 12 9.25 11.7202 9.25 11.375V7.5C9.25 6.94772 8.80228 6.5 8.25 6.5H6Z' fill='black'/%3E%3C/svg%3E") !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

[data-theme='dark'] .rst-content .important {
  background-color: var(--color-purple-100) !important;
  border-color: var(--color-purple-90) !important;
}

[data-theme='dark'] .rst-content .warning,
[data-theme='dark'] .rst-content .caution {
  background-color: var(--color-yellow-100) !important;
  border-color: var(--color-yellow-90) !important;
}

[data-theme='dark'] .rst-content div.admonition.warning::before,
[data-theme='dark'] .rst-content div.admonition.caution::before {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.42226 2.001C7.67881 1.55631 8.32062 1.55631 8.57717 2.001L14.9229 13.0003C15.1793 13.4447 14.8585 14.0001 14.3454 14.0001H1.65399C1.14088 14.0001 0.820121 13.4447 1.07653 13.0003L7.42226 2.001Z' fill='%23E6A800'/%3E%3Cpath d='M8 4.5C7.59269 4.5 7.26901 4.84216 7.2916 5.24884L7.47226 8.50077C7.48783 8.78086 7.71948 9 8 9C8.28052 9 8.51217 8.78086 8.52773 8.50077L8.7084 5.24885C8.73099 4.84216 8.40731 4.5 8 4.5Z' fill='black'/%3E%3Cpath d='M8 12.5C8.55228 12.5 9 12.0523 9 11.5C9 10.9477 8.55228 10.5 8 10.5C7.44772 10.5 7 10.9477 7 11.5C7 12.0523 7.44772 12.5 8 12.5Z' fill='black'/%3E%3C/svg%3E") !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

[data-theme='dark'] .rst-content .danger {
  background-color: var(--color-red-100) !important;
  border-color: var(--color-red-90) !important;
}

[data-theme='dark'] .rst-content div.admonition.danger::before {
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.67216 1.27842C8.30094 0.907194 7.69906 0.907194 7.32784 1.27842L1.27842 7.32784C0.907194 7.69906 0.907194 8.30094 1.27842 8.67216L7.32784 14.7216C7.69906 15.0928 8.30094 15.0928 8.67216 14.7216L14.7216 8.67216C15.0928 8.30094 15.0928 7.69906 14.7216 7.32784L8.67216 1.27842Z' fill='%23F07A80'/%3E%3Cpath d='M7.2916 4.74884C7.26901 4.34216 7.59269 4 8 4C8.40731 4 8.73099 4.34216 8.7084 4.74885L8.52773 8.00077C8.51217 8.28086 8.28052 8.5 8 8.5C7.71948 8.5 7.48783 8.28086 7.47226 8.00077L7.2916 4.74884Z' fill='black'/%3E%3Cpath d='M9 11C9 11.5523 8.55228 12 8 12C7.44772 12 7 11.5523 7 11C7 10.4477 7.44772 10 8 10C8.55228 10 9 10.4477 9 11Z' fill='black'/%3E%3C/svg%3E") !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

[data-theme='dark'] .rst-content .admonition p,
[data-theme='dark'] .rst-content .admonition li {
  color: var(--cf-text-primary) !important;
}

/* Breadcrumbs */
[data-theme='dark'] .wy-breadcrumbs a,
[data-theme='dark'] .c-breadcrumbs a {
  color: var(--cf-text-secondary) !important;
}

[data-theme='dark'] .wy-breadcrumbs li.wy-breadcrumbs-aside a {
  color: var(--color-purple-60) !important;
}

/* Left nav text */
[data-theme='dark'] .wy-menu-vertical a {
  color: var(--cf-text-secondary) !important;
}

[data-theme='dark'] .wy-menu-vertical a:hover {
  color: var(--cf-text-primary) !important;
}

/* Expandable items chevron */
.wy-menu-vertical .has-children > a::after {
  content: '' !important;
  width: 6px !important;
  height: 6px !important;
  border-right: 2px solid var(--cf-text-helper) !important;
  border-bottom: 2px solid var(--cf-text-helper) !important;
  border-left: none !important;
  transform: rotate(-45deg) !important;
  flex-shrink: 0 !important;
  margin-left: var(--cf-space-08) !important;
  transition: transform 0.2s !important;
  color: transparent !important;
}

.wy-menu-vertical .has-children.expand > a::after {
  transform: rotate(45deg) !important;
}

/* Nested levels */
.wy-menu-vertical .toctree-l2 > a {
  padding-left: calc(var(--cf-space-16) + 12px) !important;
}

.wy-menu-vertical .toctree-l3 > a {
  padding-left: calc(var(--cf-space-16) + 24px) !important;
}

.wy-menu-vertical .toctree-l4 > a {
  padding-left: calc(var(--cf-space-16) + 36px) !important;
}

.wy-menu-vertical .toctree-l5 > a {
  padding-left: calc(var(--cf-space-16) + 48px) !important;
}

.wy-menu-vertical .toctree-l6 > a {
  padding-left: calc(var(--cf-space-16) + 60px) !important;
}

.wy-menu-vertical .toctree-l7 > a {
  padding-left: calc(var(--cf-space-16) + 72px) !important;
}

/* Section captions */
.wy-menu-vertical > p.caption {
  display: block !important;
  padding: var(--cf-space-16) var(--cf-space-16) var(--cf-space-08) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--cf-text-helper) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  margin: 0 !important;
  background: transparent !important;
  height: auto !important;
  line-height: normal !important;
}

.wy-menu-vertical > p.caption::after {
  display: none !important;
}

/* Version selector container — hidden until version-select.js populates it */
.selector-container {
  display: none;
  padding: var(--cf-space-16);
  border-bottom: 1px solid var(--cf-border-subtle);
  position: relative;
  z-index: 10;
}

.selector-container.populated {
  display: block;
}

/* ── Custom version dropdown ─────────────────────────────────────── */
.cf-version-dropdown {
  position: relative;
  width: 100%;
}

.cf-version-dropdown__trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 10px var(--cf-space-16);
  background: var(--cf-surface-01);
  border: 1.5px solid var(--cf-border-subtle);
  border-radius: var(--cf-radius-sm);
  color: var(--cf-text-primary);
  font-family: var(--cf-font-family);
  font-size: 14px;
  cursor: pointer;
  text-align: left;
  transition: border-color 0.15s;
}

.cf-version-dropdown__trigger:hover,
.cf-version-dropdown--open .cf-version-dropdown__trigger {
  border-color: var(--cf-border-interactive);
}

.cf-version-dropdown--open .cf-version-dropdown__trigger {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-color: var(--cf-border-subtle);
}

.cf-version-dropdown__icon {
  flex-shrink: 0;
  margin-right: var(--cf-space-08);
  color: var(--cf-text-secondary);
}

.cf-version-dropdown__label {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cf-version-dropdown__chevron {
  flex-shrink: 0;
  transition: transform 0.2s;
  color: var(--cf-text-secondary);
}

.cf-version-dropdown--open .cf-version-dropdown__chevron {
  transform: rotate(180deg);
}

.cf-version-dropdown__menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: var(--cf-surface-01);
  border: 1.5px solid var(--cf-border-interactive);
  border-top: none;
  border-bottom-left-radius: var(--cf-radius-sm);
  border-bottom-right-radius: var(--cf-radius-sm);
  list-style: none;
  margin: 0;
  padding: 0;
  z-index: 200;
  max-height: 280px;
  overflow-y: auto;
}

.cf-version-dropdown--open .cf-version-dropdown__menu {
  display: block;
}

.cf-version-dropdown__item {
  padding: 10px var(--cf-space-16);
  font-size: 14px;
  color: var(--cf-text-primary);
  cursor: pointer;
  transition: background 0.1s;
  border-bottom: 1px solid var(--cf-border-subtle);
}

.cf-version-dropdown__item:last-child {
  border-bottom: none;
}

.cf-version-dropdown__item:hover {
  background: var(--cf-surface-01-hover);
}

.cf-version-dropdown__item--selected {
  font-weight: 600;
  /* Match the right-side TOC's active-item scheme: theme-aware surface tint
     + purple accent border, instead of the fixed light-purple tint that
     doesn't adapt for dark mode. */
  color: var(--cf-text-primary);
  background: var(--cf-surface-01-hover);
  border-left: 3px solid var(--color-purple-60);
  padding-left: calc(var(--cf-space-16) - 3px);
}

.cf-version-dropdown__item--selected:hover {
  background: var(--cf-surface-01-hover);
  color: var(--cf-text-primary);
}

.cf-version-dropdown__item--disabled {
  color: var(--cf-text-disabled);
  cursor: default;
  pointer-events: none;
}

/* wy-nav-content-wrap is grid column 2 - no margin-left needed */
.wy-nav-content-wrap {
  margin-left: 0 !important;
}

/* ============================================================================
   SIDEBAR COLLAPSE TOGGLE BUTTON (positioned at top-right of sidebar)
   ============================================================================ */

.cf-sidebar-toc-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--cf-space-16);
  flex-shrink: 0;
}

.cf-sidebar-toc-title {
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  color: var(--cf-text-secondary);
}

.cf-sidebar-collapse-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: none;
  border-radius: var(--cf-radius-sm);
  background: transparent;
  color: var(--cf-text-secondary);
  cursor: pointer;
  top: 12px;
  left: 255px;
  position: absolute;
}

.cf-sidebar-collapse-btn svg {
  transition: transform 0.2s;
}

.cf-sidebar-collapse-btn:hover {
  color: var(--cf-link-primary);
  background: var(--illustration_gradient_background_01);
}

/* When collapsed: pop the button out as a fixed reopen handle */
.wy-nav-side.collapsed .cf-sidebar-toc-header {
  position: absolute;
  top: var(--cf-space-16);
  left: var(--cf-space-16);
  padding: 0;
  z-index: 200;
}

.wy-nav-side.collapsed .cf-sidebar-toc-title {
  display: none;
}

.wy-nav-side.collapsed .cf-sidebar-collapse-btn {
  left: 12px;
}

.wy-nav-side.collapsed .cf-sidebar-collapse-btn svg {
  transform: rotate(180deg);
}

/* ============================================================================
   FOOTER
   ============================================================================ */

.cf-footer {
  background-color: var(--cf-surface-01);
  position: relative;
}

/* Support links above footer */
.cf-footer-support {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  gap: var(--cf-space-08) var(--cf-space-24);
  padding: var(--cf-space-24) 0;
  border-top: 1px solid var(--cf-border-subtle);
}

.cf-footer-support-link {
  display: inline-flex;
  align-items: center;
  gap: var(--cf-space-08);
  font-size: 14px;
  font-family: var(--cf-font-family);
  color: var(--cf-text-secondary);
  text-decoration: none;
  white-space: nowrap;
}

.cf-footer-support-link:hover {
  color: var(--cf-text-primary);
}

.cf-footer-support-link svg {
  flex-shrink: 0;
  color: var(--cf-text-helper);
}

/* Main footer inner */
.cf-footer-inner {
  padding: 32px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}

/* Social icons row */
.cf-footer-social {
  display: flex;
  align-items: center;
  gap: 20px;
}

.cf-footer-social a {
  color: var(--cf-text-helper);
  display: flex;
  align-items: center;
  transition: color 0.15s;
}

.cf-footer-social a:hover {
  color: var(--cf-text-primary);
}

/* Legal links row */
.cf-footer-legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.cf-footer-legal a {
  font-size: 13px;
  color: var(--cf-text-primary);
  text-decoration: none;
  padding: 0 4px;
  transition: color 0.15s;
}

.cf-footer-legal a:hover {
  color: var(--cf-text-primary);
}

.cf-footer-sep {
  font-size: 13px;
  color: var(--cf-text-helper);
}

/* Copyright text */
p.cf-footer-copyright {
  font-size: 13px;
  color: var(--cf-text-helper);
  line-height: 1.6;
  margin: 0;
  max-width: 640px;
}

/* ── Mobile: force-hide sidebars (must be last to beat !important rules above) ── */
@media (max-width: 832px) {
  .wy-nav-side {
    display: none !important;
  }
}

/* ── Mobile: main content padding ── */
@media (max-width: 832px) {
  .rst-inner {
    padding: var(--cf-space-32);
    min-width: 0;
  }
}

/* ── Tablet + mobile: hide subnav tabs ── */
@media (max-width: 1092px) {
  .cf-header-subnav {
    display: none !important;
  }
}

/* ── Tablet: reduce wy-nav-content horizontal padding ── */
@media (max-width: 1092px) {
  .wy-nav-content {
    padding-left: var(--cf-space-32) !important;
    padding-right: var(--cf-space-32) !important;
  }

  .wy-grid-for-nav > aside.sticky-menu-column {
    width: 307px;
  }
}

/* ── Mobile: remove wy-nav-content horizontal padding ── */
@media (max-width: 832px) {
  .wy-nav-content {
    padding: 0 !important;
  }
}

/* ── Tablet + mobile: custom HTML overview pages — pad .document instead of wy-nav-content ── */
@media (max-width: 1092px) {
  .page-overview .wy-nav-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .page-overview .document {
  }
}

/* ── Mobile: full-screen drawer ── */
@media (max-width: 832px) {
  .cf-drawer {
    width: 100%;
    max-width: 100%;
  }

  .cf-drawer-overlay {
    display: none !important;
  }
}
