/*Doc common variables begins */
/*Doc common variables ends */
/*  doc-snippet related variables begins  */
/*  doc-snippet related variables ends  */
doc-snippet {
  --slytedoc-snippet-margin: 24px 0;
  --slytedoc-snippet-pre-bg: #F6F8F8;
  --slytedoc-snippet-pre-max-height: 400px;
  --slytedoc-snippet-pre-tab-size: 4;
  --slytedoc-snippet-pre-margin-top: 0;
  --slytedoc-snippet-filename-padding: 6px 20px;
  --slytedoc-snippet-filename-fontsize: 14px;
  --slytedoc-snippet-filename-color: #1E1E3A;
  --slytedoc-snippet-filename-bg: #F6F8F8;
  --slytedoc-snippet-filename-font-family: var(--slytedoc-medium-font);
  --slytedoc-snippet-pre-code-color: #333;
  --slytedoc-snippet-pre-lytekeyword-color: wheat;
  --slytedoc-snippet-pre-lytesubkeyword-color: red;
  --slytedoc-snippet-pre-keyword-color: #5ab6d8;
  --slytedoc-snippet-pre-comment-color: #888;
  --slytedoc-snippet-pre-string-color: #0d904f;
  --slytedoc-snippet-pre-tag-color: #3b78e7;
  --slytedoc-snippet-pre-emaillink-color: #2c7bd0;
  --slytedoc-snippet-pre-attrname-color: #9c27b0;
  --slytedoc-snippet-pre-attrvalue-color: #0d904f;
  --slytedoc-snippet-linenumber-color: #666;
}
doc-snippet .code-toolbar .toolbar .toolbar-item,
.snippetYieldDummy {
  display: none;
}
doc-snippet {
  display: block;
  margin: var(--slytedoc-snippet-margin);
  background: #F6F8F8;
  border-radius: 7px;
}
doc-snippet .docSnippetPre {
  background: var(--slytedoc-snippet-pre-bg);
  max-height: var(--slytedoc-snippet-pre-max-height);
  overflow: auto;
  box-sizing: border-box;
  -moz-tab-size: var(--slytedoc-snippet-pre-tab-size);
  tab-size: var(--slytedoc-snippet-pre-tab-size);
  margin-top: var(--slytedoc-snippet-pre-margin-top);
  border-radius: 0 0 7px 7px;
}
doc-snippet .code-toolbar {
  position: relative;
  padding: 0;
  font-size: 14px;
  color: #3b78e7;
}
doc-snippet pre {
  white-space: pre;
  word-break: break-all;
}
.docSnippetCopyBtn button {
  border: 0;
  padding: 5px;
  background-color: transparent;
}
.docSnippetCopyBtn lyte-yield {
  display: flex;
  gap: 10px;
  align-items: center;
}
.docSnippetCopyBtn button:hover {
  border: 0;
}
.docSnippetFileName {
  padding: var(--slytedoc-snippet-filename-padding);
  font-size: var(--slytedoc-snippet-filename-fontsize);
  color: var(--slytedoc-snippet-filename-color);
  background: var(--slytedoc-snippet-filename-bg);
  font-family: var(--slytedoc-snippet-filename-font-family);
  border-bottom: 1px solid #e5e5e5;
  border-radius: 7px 7px 0 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
doc-snippet a,
.docSnippetPre code,
.docSnippetPre code .punctuation {
  color: var(--slytedoc-snippet-pre-code-color);
}
.docSnippetPre code .lyteKeywordPat {
  color: var(--slytedoc-snippet-pre-lytekeyword-color);
}
.docSnippetPre code .lyteSubKeywordPat {
  color: var(--slytedoc-snippet-pre-lytesubkeyword-color);
}
.docSnippetPre code .keyword {
  color: var(--slytedoc-snippet-pre-keyword-color);
}
.docSnippetPre code .comment {
  color: var(--slytedoc-snippet-pre-comment-color);
}
.docSnippetPre code .string {
  color: var(--slytedoc-snippet-pre-string-color);
}
.docSnippetPre code .tag {
  color: var(--slytedoc-snippet-pre-tag-color);
}
.docSnippetPre .token.selector {
	color: #9c27b0;
}
.docSnippetPre .token.property {
	color: #3b78e7;
}
.docSnippetPre .token.punctuation {
	color: #333;
}
.docSnippetPre code .attr-name {
  color: var(--slytedoc-snippet-pre-attrname-color);
}
.docSnippetPre code .attr-value {
  color: var(--slytedoc-snippet-pre-attrvalue-color);
}
doc-snippet pre[class*="language-"] {
  padding: 15px;
}
doc-snippet pre[class*="language-"].line-numbers {
  padding: 15px 50px;
  margin: 0;
}
.line-numbers-rows > span:before {
  color: var(--slytedoc-snippet-linenumber-color);
}
.line-numbers .line-numbers-rows {
  border-color: transparent;
}
.doc_snippet_result {
  width: 100%;
}
.lyteDocSnippetImagePreview .docSnippetPre {
  background: #fff;
  white-space: normal;
}
.lyteDocSnippetImagePreview img {
  width: 100%;
  display: block;
}
doc-snippet-wrapper {
  display: block;
  position: relative;
  border-radius: 7px;
  overflow: hidden;
  margin: 16px 0;
}
.doc-snippet-toggle-button {
  font-family: var(--slytedoc-semibold-font);
  background: #F6F8F8;
  margin-left: auto;
  width: fit-content;
  padding: 6px 12px;
  border-radius: 8px 8px 0 0;
  color: #151516;
  font-size: 12px;
  margin:10px 10px 0 auto;
  display: flex;
  align-items: center;
  gap: 10px;
}
.slyteDocCodeWrapper {
  border: 1px solid #E3E8F2;
  border-radius: 7px;
  overflow: hidden;
  width: 700px;
  max-width: 100%;
  box-sizing: border-box;
  margin-bottom: 30px;
}
.slyteDoc_code_output_wrapper .slyteDocCodeWrapper {
  margin-bottom: 0;
}
.codeSnippetWrapper lyte-accordion-item {
  border-bottom: 0;
  margin: 0;
}
.tab-details span.active, .tab-details go-to.active, .tab-details lyte-link-to.active,
.codeSnippetWrapper .docSnippetFileName,
.codeSnippetWrapper lyte-tab-title.lyteTabActive,
.codeSnippetWrapper lyte-tab-title.lyteTabActive:hover {
  border-bottom: 2px solid #5A57FF;
  color: #1E1E3A;
  font-family: var(--slytedoc-medium-font);
}
.codeSnippetWrapper .docSnippetFileName {
  width: fit-content;
  background: #F6F8F8;
}
.codeSnippetWrapper lyte-tabs,
.codeSnippetWrapper lyte-accordion-body {
  width: 100%;
  background: #F6F8F8;
}
.codeSnippetWrapper lyte-accordion-body {
  padding: 0;
  border: 0;
}
.codeSnippetWrapper lyte-tab-body {
  border: 0;
}
.codeSnippetWrapper lyte-tab-head {
  border-width: 0 0 1px 0;
  padding: 0 20px;
  gap: 30px;
}
.codeSnippetWrapper .docSnippetPre {
  background: #F6F8F8;
}
.codeSnippetWrapper doc-snippet {
  margin: 0;
  font-size: 14px;
}
.codeSnippetWrapper lyte-tab-title {
  margin: 0;
  font-size: 14px;
  background: #F6F8F8;
  border-bottom-color: transparent;
}
.docSnippetWrapperCopyBtn {
  position: absolute;
  right: 20px;
  top: 5px;
  z-index: 1;
}
.doc-snippet-toggle .docSnippetWrapperCopyBtn {
  top: 33px;
}
.docSnippetWrapperCopyBtn lyte-yield {
  display: flex;
  gap: 10px;
  align-items: center;
}
.docSnippetCopyText {
  color: #000;
  font-size: 14px;
  font-family: var(--slytedoc-primary-font);
}
doc-snippet-wrapper .docSnippetFileName {
  display: none;
}
.docSnippetWrapperCopyBtn button:hover,
.docSnippetWrapperCopyBtn button {
  border: 0;
  padding: 5px;
  background-color: transparent;
}