#header {
  padding-bottom: 20px;
  padding-top: clamp(20px, (1250px - 100vw) / 6, 40px);
}
#header h1 {
  font-size: 40px;
  line-height: 46px;
  word-break: break-word;
  max-width: 620px;
}
#header h1:first-letter {
  text-transform: capitalize;
}
@media only screen and (min-width: 760px) {
  #header h1 {
    font-size: 46px;
    line-height: 52px;
  }
}

#breadcrumb, #filter-icon summary ul, #filter-icon #filter-summary ul {
  line-height: 1.4;
}
#breadcrumb li, #filter-icon summary ul li, #filter-icon #filter-summary ul li {
  display: inline;
  word-break: break-all;
}
#breadcrumb li:not(:last-of-type):after, #filter-icon summary ul li:not(:last-of-type):after, #filter-icon #filter-summary ul li:not(:last-of-type):after {
  content: "/";
  opacity: 0.3;
  margin: 0 5px;
}
#breadcrumb.curved li:first-of-type, #filter-icon summary ul.curved li:first-of-type, #filter-icon #filter-summary ul.curved li:first-of-type {
  display: block;
}
#breadcrumb.curved li:first-of-type:first-letter, #filter-icon summary ul.curved li:first-of-type:first-letter, #filter-icon #filter-summary ul.curved li:first-of-type:first-letter {
  text-transform: capitalize;
}
#breadcrumb.curved li:first-of-type:after, #filter-icon summary ul.curved li:first-of-type:after, #filter-icon #filter-summary ul.curved li:first-of-type:after {
  content: unset;
}
#breadcrumb a:hover, #filter-icon summary ul a:hover, #filter-icon #filter-summary ul a:hover {
  opacity: 0.6;
}
#breadcrumb .selected, #filter-icon summary ul .selected, #filter-icon #filter-summary ul .selected {
  text-decoration: line-through;
  text-decoration-color: rgba(53, 53, 53, 0.44);
  text-decoration-thickness: 2px;
  opacity: 0.6;
}

#filter a:hover, #filter-icon a:hover {
  opacity: 0.6;
}
#filter summary, #filter-icon summary, #filter #filter-summary, #filter-icon #filter-summary {
  display: flex;
  flex-flow: row wrap;
  padding-bottom: 90px;
  position: relative;
}
#filter summary a:first-letter, #filter-icon summary a:first-letter, #filter #filter-summary a:first-letter, #filter-icon #filter-summary a:first-letter {
  text-transform: capitalize;
}
@media screen and (min-width: 500px) {
  #filter summary, #filter-icon summary, #filter #filter-summary, #filter-icon #filter-summary {
    padding-right: 100px;
  }
}
#filter summary:after, #filter-icon summary:after, #filter #filter-summary:after, #filter-icon #filter-summary:after {
  position: absolute;
  content: "...";
  font-size: 30px;
  bottom: 0;
  left: 0;
  width: 24px;
  height: 49px;
  opacity: 0.4;
  line-height: 7px;
}
@media screen and (min-width: 500px) {
  #filter summary:after, #filter-icon summary:after, #filter #filter-summary:after, #filter-icon #filter-summary:after {
    right: 0;
    top: 0;
    bottom: unset;
    left: unset;
    height: 24px;
    opacity: 0.6;
    text-align: right;
  }
}
#filter summary:hover, #filter-icon summary:hover, #filter #filter-summary:hover, #filter-icon #filter-summary:hover {
  cursor: pointer;
}
#filter summary:hover:after, #filter-icon summary:hover:after, #filter #filter-summary:hover:after, #filter-icon #filter-summary:hover:after {
  opacity: 0.4;
}
#filter summary .filter-summary, #filter-icon summary .filter-summary, #filter summary #breadcrumb-summary, #filter-icon summary #breadcrumb-summary, #filter #filter-summary .filter-summary, #filter-icon #filter-summary .filter-summary, #filter #filter-summary #breadcrumb-summary, #filter-icon #filter-summary #breadcrumb-summary {
  flex: 1 1 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#filter summary .filter-summary:first-letter, #filter-icon summary .filter-summary:first-letter, #filter #filter-summary .filter-summary:first-letter, #filter-icon #filter-summary .filter-summary:first-letter {
  text-transform: uppercase;
}
#filter summary .divider, #filter-icon summary .divider, #filter #filter-summary .divider, #filter-icon #filter-summary .divider {
  opacity: 0.3;
  display: inline-block;
  margin: 0 5px;
}
#filter summary .selected, #filter-icon summary .selected, #filter #filter-summary .selected, #filter-icon #filter-summary .selected {
  text-decoration: line-through;
  text-decoration-color: rgba(53, 53, 53, 0.44);
  text-decoration-thickness: 2px;
  opacity: 0.6;
}
#filter[open] summary:after, [open]#filter-icon summary:after {
  content: "..";
}
#filter summary + *, #filter-icon summary + *, #filter #filter-summary + *, #filter-icon #filter-summary + * {
  padding: clamp(30px, 6vw, 50px) 0;
  position: relative;
  border-top: 1px solid #e7e7e7;
}
#filter summary + *:before, #filter-icon summary + *:before, #filter #filter-summary + *:before, #filter-icon #filter-summary + *:before {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  top: -1px;
  content: "";
  display: block;
  background: white;
  height: 1px;
  width: 50%;
}
#filter:not(.inflated) #filter-summary + *, #filter-icon:not(.inflated) #filter-summary + * {
  display: none;
}
#filter.inflated #filter-summary:after, .inflated#filter-icon #filter-summary:after {
  content: "..";
}

#breadcrumb, #filter-icon summary ul, #filter-icon #filter-summary ul {
  line-height: 1.4;
}
#breadcrumb li, #filter-icon summary ul li, #filter-icon #filter-summary ul li {
  display: inline;
  word-break: break-all;
}
#breadcrumb li:not(:last-of-type):after, #filter-icon summary ul li:not(:last-of-type):after, #filter-icon #filter-summary ul li:not(:last-of-type):after {
  content: "/";
  opacity: 0.3;
  margin: 0 5px;
}
#breadcrumb.curved li:first-of-type, #filter-icon summary ul.curved li:first-of-type, #filter-icon #filter-summary ul.curved li:first-of-type {
  display: block;
}
#breadcrumb.curved li:first-of-type:first-letter, #filter-icon summary ul.curved li:first-of-type:first-letter, #filter-icon #filter-summary ul.curved li:first-of-type:first-letter {
  text-transform: capitalize;
}
#breadcrumb.curved li:first-of-type:after, #filter-icon summary ul.curved li:first-of-type:after, #filter-icon #filter-summary ul.curved li:first-of-type:after {
  content: unset;
}
#breadcrumb a:hover, #filter-icon summary ul a:hover, #filter-icon #filter-summary ul a:hover {
  opacity: 0.6;
}
#breadcrumb .selected, #filter-icon summary ul .selected, #filter-icon #filter-summary ul .selected {
  text-decoration: line-through;
  text-decoration-color: rgba(53, 53, 53, 0.44);
  text-decoration-thickness: 2px;
  opacity: 0.6;
}

#filter-icon summary, #filter-icon #filter-summary {
  padding-left: 75px;
}
#filter-icon summary ul li:first-of-type, #filter-icon #filter-summary ul li:first-of-type {
  flex: 1 1 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media screen and (max-width: 499px) {
  #filter-icon summary:after, #filter-icon #filter-summary:after {
    left: 10px;
  }
}
#filter-icon .icon {
  background: #eee;
  text-transform: capitalize;
  position: absolute;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 42px;
  left: 0;
  top: 0;
  margin-top: 4px;
  border-radius: 4px;
}
#filter-icon .icon .initials {
  width: 2ch;
  overflow: hidden;
  white-space: nowrap;
}

.note {
  border-left: 3px solid #006dce;
  padding: 5px 0 5px 20px;
}
.note .note-title {
  color: #006dce;
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 8px;
}

#scroll-up, #share {
  padding: 0;
  background: none;
  border: 0;
}
#scroll-up:hover, #share:hover {
  cursor: pointer;
  opacity: 0.6;
}

@font-face {
  font-family: "Roboto Mono";
  src: url("../../../../../../fonts/roboto_mono/RobotoMono-Regular.e5ca8c0a.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}
details {
  display: block;
}
details > summary {
  padding: 2px 0;
}
details > summary:after {
  content: "+";
  display: inline-block;
  margin-left: 6px;
  opacity: 0.6;
}
details > summary:hover {
  cursor: pointer;
}
details > summary:first-letter {
  text-transform: uppercase;
}
details[open] > summary:after {
  content: "-";
  display: inline-block;
  margin-left: 6px;
  opacity: 0.6;
}

#filter-summary {
  padding-bottom: 47px !important;
  padding-left: 70px !important;
}
#filter-summary + * {
  padding: clamp(30px, 6vw, 40px) 0 !important;
}

#header {
  padding-top: 40px;
  padding-bottom: 15px;
}
#header h1 {
  line-height: 1.1;
  font-size: 38px;
}

h2 {
  font-size: 28px !important;
}

#breadcrumb, #filter-icon summary ul, #filter-icon #filter-summary ul {
  margin-bottom: clamp(30px, 6vw, 40px);
  text-transform: capitalize;
}
#breadcrumb .identifier-segment, #filter-icon summary ul .identifier-segment, #filter-icon #filter-summary ul .identifier-segment {
  text-decoration: underline;
}

#uii-theme-panel-wrapper {
  border-bottom: 1px solid #e4e4e4;
}

#sidebar-wrapper {
  border-top: 1px solid #e4e4e4;
}
#sidebar-wrapper #sidebar {
  max-width: 280px;
}
#sidebar-wrapper #sidebar > ul li {
  padding: 2px 0;
}
#sidebar-wrapper #sidebar > ul li:first-letter {
  text-transform: uppercase;
}
#sidebar-wrapper #sidebar > ul li a:hover {
  opacity: 0.6;
}
#sidebar-wrapper #sidebar > ul > li {
  padding: 20px 0;
}
#sidebar-wrapper #sidebar > ul > li + li {
  border-top: 1px solid #e4e4e4;
}
#sidebar-wrapper #sidebar > ul > li li {
  margin-left: 15px;
}
#sidebar-wrapper #sidebar > ul .selected {
  color: #006dce;
  text-decoration: underline;
}

#anchors-wrapper {
  padding: clamp(30px, 6vw, 40px) 0;
  border-top: 1px solid #e4e4e4;
}
#anchors-wrapper h2 {
  font-size: 16px !important;
  margin-bottom: 8px;
}
#anchors-wrapper li {
  padding: 2px 0;
  position: relative;
}
#anchors-wrapper a:hover {
  opacity: 0.6;
}

@media screen and (max-width: 1019px) {
  #docs-content-wrapper {
    display: flex;
    flex-flow: column;
    padding: 0 clamp(20px, 6vw, 46px);
  }
}
@media screen and (min-width: 500px) {
  #filter-summary {
    padding-bottom: 0 !important;
  }
}
@media screen and (min-width: 1020px) {
  #docs-content-wrapper {
    display: grid;
    grid-template-columns: 250px 1fr minmax(0, 680px) 1fr;
  }
  #docs-content-wrapper > * {
    grid-column: 3;
  }
  #sidebar-wrapper {
    display: block;
    border-right: 1px solid #e4e4e4;
    border-top: unset;
    width: 250px;
    position: fixed;
    left: 0;
    bottom: 0;
    top: 65px;
  }
  #sidebar-wrapper #sidebar {
    position: sticky;
    top: 65px;
    height: calc(100vh - 65px);
    overflow-y: auto;
    scrollbar-width: none;
    /* Track */
    /* Handle */
  }
  #sidebar-wrapper #sidebar::-webkit-scrollbar {
    width: 5px;
  }
  #sidebar-wrapper #sidebar::-webkit-scrollbar-track {
    background: #e7e7e7;
  }
  #sidebar-wrapper #sidebar::-webkit-scrollbar-thumb {
    background: #888;
    border: 1px solid #888;
    border-radius: 24px;
  }
  #sidebar-wrapper #sidebar:hover {
    scrollbar-width: auto;
  }
  #sidebar-wrapper #sidebar > ul > li {
    padding: 20px clamp(20px, 6vw, 46px);
  }
}
@media screen and (min-width: 1300px) {
  #docs-content-wrapper {
    grid-template-columns: 280px minmax(46px, 1fr) minmax(0, 680px) 300px minmax(46px, 1fr);
  }
  #sidebar-wrapper {
    width: 280px;
  }
  #anchors-wrapper {
    grid-column: 4;
    grid-row: 1/5;
    position: sticky;
    top: 65px;
    padding: 48px 0 60px 40px;
    box-sizing: border-box;
    border: unset;
    align-self: start;
  }
  #anchors-wrapper li {
    padding: 2px 0;
    position: relative;
  }
  #anchors-wrapper a:hover {
    opacity: 0.6;
  }
  #anchors-wrapper > div {
    border-left: 1px solid #e4e4e4;
    padding-left: 40px;
  }
}
code {
  background: #efefef;
  padding: 2px 5px;
  border-radius: 4px;
  font-family: "Roboto Mono", monospace;
  font-size: 0.875rem;
}

.code-wrapper {
  margin: 6px 0;
  position: relative;
}
.code-wrapper button {
  position: absolute;
  top: 0;
  right: 0;
  padding: 16px 19px;
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
}
.code-wrapper button img {
  height: 20px;
  width: 20px;
  background: #2c3240;
}
.code-wrapper button:not(.copied) .copied-to-clipboard {
  display: none;
}
.code-wrapper button.copied .copy-to-clipboard {
  display: none;
}
.code-wrapper pre {
  border-radius: 10px;
  background: #2c3240;
  color: #c3c7ce;
  padding: 15px 20px;
  overflow-x: auto;
  margin: 0;
  display: flex;
  box-sizing: border-box;
}
.code-wrapper pre code {
  padding: 0;
  background: unset;
  border: unset;
  margin: unset;
}
.code-wrapper pre code .hljs-comment {
  color: #949aa6;
}
.code-wrapper pre code.language-json {
  color: #c3c7ce;
}
.code-wrapper pre code.language-json .hljs-attr {
  color: #eeba78;
}
.code-wrapper pre code.language-json .hljs-string {
  color: #99ca75;
}

.avatar-generic {
  background: #eee;
  text-transform: capitalize;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 48px !important;
  height: 48px !important;
  left: 0;
  top: 0;
  border-radius: 10px !important;
  position: absolute;
}
.avatar-generic:hover {
  opacity: unset !important;
}

.avatar-custom {
  display: inline-flex;
  width: 44px;
  height: 44px;
  margin-top: 2px;
  left: 0;
  top: 0;
  border-radius: 12px;
  box-shadow: inset 0 0 0 1px rgba(168, 168, 168, 0.3294117647);
  overflow: hidden;
  position: absolute;
}
.avatar-custom:hover {
  opacity: unset !important;
}
.avatar-custom img {
  width: 100%;
}

main section, main .section {
  padding: clamp(30px, 6vw, 40px) 0;
  border-top: 1px solid #e4e4e4 !important;
}
main section h2 + ul li, main .section h2 + ul li {
  min-height: 32px;
}
main section h2 + ul li ul, main .section h2 + ul li ul {
  margin-top: 8px;
  margin-left: 26px;
}
main section.flex, main .section.flex {
  gap: 20px;
}
main section a, main .section a {
  color: #006dce;
  text-decoration: underline;
}
main section a code, main .section a code {
  color: #3c4247;
  text-decoration: underline;
  text-decoration-color: #f8f8f8;
  padding: 1px 5px;
}
main section h1 > a, main section h2 > a, main section h3 > a, main section h4 > a, main section h5 > a, main section h6 > a, main .section h1 > a, main .section h2 > a, main .section h3 > a, main .section h4 > a, main .section h5 > a, main .section h6 > a {
  color: #33373c;
  text-decoration: unset;
}
main section h2, main section h3, main section h4, main section h5, main section h6, main .section h2, main .section h3, main .section h4, main .section h5, main .section h6 {
  position: relative;
}
main section h2 a, main section h3 a, main section h4 a, main section h5 a, main section h6 a, main .section h2 a, main .section h3 a, main .section h4 a, main .section h5 a, main .section h6 a {
  display: inline-block;
}
main section h2 a:before, main section h3 a:before, main section h4 a:before, main section h5 a:before, main section h6 a:before, main .section h2 a:before, main .section h3 a:before, main .section h4 a:before, main .section h5 a:before, main .section h6 a:before {
  content: "#";
  font-weight: normal;
  color: #5493cd;
  display: none;
  position: absolute;
  left: -0.8em;
}
main section h2 a:hover:before, main section h3 a:hover:before, main section h4 a:hover:before, main section h5 a:hover:before, main section h6 a:hover:before, main .section h2 a:hover:before, main .section h3 a:hover:before, main .section h4 a:hover:before, main .section h5 a:hover:before, main .section h6 a:hover:before {
  display: inline-block;
}
main section > ul, main .section > ul {
  list-style: disc;
  padding-left: 25px;
}
main section > ul ul, main .section > ul ul {
  padding-left: 25px;
  list-style: circle;
}

details > summary {
  list-style: none;
}

details > summary::marker,
details > summary::-webkit-details-marker {
  display: none;
}