/*
  Notebook/code-heavy layer for Quarto tutorial pages.
  Loaded only via tutorials/_metadata.yml so it does not affect the whole site.
*/

pre,
code,
kbd,
samp,
div.sourceCode,
pre.sourceCode,
code.sourceCode {
  font-family: var(--dz-font-code);
}

div.sourceCode,
pre.sourceCode,
pre {
  border: 1px solid var(--dz-card-border);
  border-radius: 16px;
  box-sizing: border-box;
}

div.sourceCode {
  overflow-x: hidden;
  overflow-y: auto;
  background: var(--dz-card);
  width: 100%;
  max-width: 100%;
}

pre.sourceCode,
div.sourceCode pre.sourceCode,
pre code {
  line-height: 1.7;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  white-space: pre-wrap !important;
  overflow-wrap: anywhere;
  word-break: break-word;
}

pre > code.sourceCode,
pre > code.sourceCode > span,
div.sourceCode pre.sourceCode code.sourceCode,
div.sourceCode pre.sourceCode code.sourceCode > span {
  white-space: inherit !important;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.code-copy-outer-scaffold {
  position: relative;
  display: block;
  width: 100%;
}

.code-copy-outer-scaffold > .sourceCode,
.code-copy-outer-scaffold > pre,
.code-copy-outer-scaffold > .cell-output {
  min-width: 0;
}

.code-copy-outer-scaffold > .sourceCode {
  width: 100%;
}

.code-copy-button {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  border-radius: 10px;
  margin: 0;
}

.cell-output,
.cell-output-display,
.cell-output-stdout,
.cell-output-stderr {
  margin-top: 0.75rem;
  margin-bottom: 1rem;
}

.cell-output pre,
.cell-output code {
  border-radius: 12px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.cell-output-display,
.cell-output-display > div,
.colab-df-container,
.colab-df-container > div:first-child {
  max-width: 100%;
}

.cell-output-display,
.colab-df-container {
  overflow-x: auto;
}

.colab-df-container {
  display: block !important;
}

.colab-df-container > div:first-child {
  display: inline-block;
  min-width: 100%;
  vertical-align: top;
}

.colab-df-container table.dataframe,
table.dataframe,
.table.dataframe,
.cell-output table {
  display: table;
  width: max-content;
  min-width: 100%;
  max-width: none;
  margin: 0;
  table-layout: auto;
}

.cell-output table.dataframe {
  border: 1px solid var(--dz-card-border);
  background: var(--dz-card);
  border-radius: 0;
}

.cell-output table.dataframe,
.cell-output table.dataframe thead,
.cell-output table.dataframe tbody,
.cell-output table.dataframe tr,
.cell-output table.dataframe th,
.cell-output table.dataframe td {
  border-radius: 0 !important;
}

.cell-output table.dataframe + p,
.colab-df-container > div:first-child > p {
  margin-top: 0.75rem;
}

p code,
li code,
td code,
th code,
.sidebar code,
.toc-actions code,
.nav-link code {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.colab-df-buttons,
.colab-df-convert,
.colab-df-quickchart {
  display: none !important;
}

.colab-df-container {
  gap: 0;
}

html[data-theme="dark"],
[data-bs-theme="dark"] {
  --dz-code-surface: #0f172a;
  --dz-code-surface-raised: #111b31;
  --dz-code-border-strong: rgba(189, 199, 240, 0.2);
  --dz-code-text: #c0caf5;
  --dz-code-muted: #9aa5ce;
  --dz-code-keyword: #7dcfff;
  --dz-code-string: #9ece6a;
  --dz-code-number: #ff9e64;
  --dz-code-function: #7aa2f7;
  --dz-code-constant: #bb9af7;
  --dz-code-operator: #89ddff;
  --dz-code-comment: #7f8aa3;
  --dz-code-inline-text: var(--dz-inline-code-text, #8fdcff);
  --dz-code-inline-bg: var(--dz-inline-code-bg, rgba(143, 220, 255, 0.12));
  --dz-code-inline-border: var(--dz-inline-code-border, rgba(143, 220, 255, 0.18));
}

html[data-theme="dark"] div.sourceCode,
html[data-theme="dark"] pre.sourceCode,
html[data-theme="dark"] pre,
html[data-theme="dark"] .cell-output pre,
html[data-theme="dark"] .cell-output-stdout pre,
html[data-theme="dark"] .cell-output-stderr pre,
html[data-theme="dark"] .cell-output-display,
html[data-theme="dark"] .colab-df-container > div:first-child,
[data-bs-theme="dark"] div.sourceCode,
[data-bs-theme="dark"] pre.sourceCode,
[data-bs-theme="dark"] pre,
[data-bs-theme="dark"] .cell-output pre,
[data-bs-theme="dark"] .cell-output-stdout pre,
[data-bs-theme="dark"] .cell-output-stderr pre,
[data-bs-theme="dark"] .cell-output-display,
[data-bs-theme="dark"] .colab-df-container > div:first-child {
  background: var(--dz-code-surface);
  border-color: var(--dz-code-border-strong);
}

html[data-theme="dark"] div.sourceCode,
html[data-theme="dark"] .cell-output-display,
html[data-theme="dark"] .cell-output-stdout pre,
html[data-theme="dark"] .cell-output-stderr pre,
[data-bs-theme="dark"] div.sourceCode,
[data-bs-theme="dark"] .cell-output-display,
[data-bs-theme="dark"] .cell-output-stdout pre,
[data-bs-theme="dark"] .cell-output-stderr pre {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

html[data-theme="dark"] pre.sourceCode,
html[data-theme="dark"] div.sourceCode pre.sourceCode,
html[data-theme="dark"] pre code,
html[data-theme="dark"] .cell-output pre code,
html[data-theme="dark"] .cell-output pre,
[data-bs-theme="dark"] pre.sourceCode,
[data-bs-theme="dark"] div.sourceCode pre.sourceCode,
[data-bs-theme="dark"] pre code,
[data-bs-theme="dark"] .cell-output pre code,
[data-bs-theme="dark"] .cell-output pre {
  color: var(--dz-code-text) !important;
}

html[data-theme="dark"] p code,
html[data-theme="dark"] li code,
html[data-theme="dark"] td code,
html[data-theme="dark"] th code,
html[data-theme="dark"] h1 code,
html[data-theme="dark"] h2 code,
html[data-theme="dark"] h3 code,
html[data-theme="dark"] h4 code,
html[data-theme="dark"] h5 code,
html[data-theme="dark"] h6 code,
html[data-theme="dark"] blockquote code,
html[data-theme="dark"] .callout-body code,
html[data-theme="dark"] .sidebar code,
html[data-theme="dark"] .toc-actions code,
html[data-theme="dark"] .nav-link code,
[data-bs-theme="dark"] p code,
[data-bs-theme="dark"] li code,
[data-bs-theme="dark"] td code,
[data-bs-theme="dark"] th code,
[data-bs-theme="dark"] h1 code,
[data-bs-theme="dark"] h2 code,
[data-bs-theme="dark"] h3 code,
[data-bs-theme="dark"] h4 code,
[data-bs-theme="dark"] h5 code,
[data-bs-theme="dark"] h6 code,
[data-bs-theme="dark"] blockquote code,
[data-bs-theme="dark"] .callout-body code,
[data-bs-theme="dark"] .sidebar code,
[data-bs-theme="dark"] .toc-actions code,
[data-bs-theme="dark"] .nav-link code {
  color: var(--dz-code-inline-text) !important;
  background: var(--dz-code-inline-bg);
  border: 1px solid var(--dz-code-inline-border);
  box-shadow: none;
}

html[data-theme="dark"] .code-copy-button,
[data-bs-theme="dark"] .code-copy-button {
  background: var(--dz-code-surface-raised);
  border: 1px solid var(--dz-code-border-strong);
  color: var(--dz-code-text);
}

html[data-theme="dark"] .code-copy-button:hover,
[data-bs-theme="dark"] .code-copy-button:hover {
  background: color-mix(in srgb, var(--dz-code-surface-raised) 76%, white);
}

html[data-theme="dark"] .cell-output table.dataframe,
[data-bs-theme="dark"] .cell-output table.dataframe {
  background: transparent;
}

html[data-theme="dark"] .cell-output table.dataframe th,
html[data-theme="dark"] .cell-output table.dataframe td,
[data-bs-theme="dark"] .cell-output table.dataframe th,
[data-bs-theme="dark"] .cell-output table.dataframe td {
  border-color: rgba(189, 199, 240, 0.14);
}

html[data-theme="dark"] code span,
html[data-theme="dark"] pre > code.sourceCode > span,
html[data-theme="dark"] code.sourceCode > span,
[data-bs-theme="dark"] code span,
[data-bs-theme="dark"] pre > code.sourceCode > span,
[data-bs-theme="dark"] code.sourceCode > span {
  color: var(--dz-code-text);
}

html[data-theme="dark"] code span.co,
html[data-theme="dark"] code span.an,
html[data-theme="dark"] code span.cv,
html[data-theme="dark"] code span.do,
html[data-theme="dark"] code span.in,
html[data-theme="dark"] code span.wa,
[data-bs-theme="dark"] code span.co,
[data-bs-theme="dark"] code span.an,
[data-bs-theme="dark"] code span.cv,
[data-bs-theme="dark"] code span.do,
[data-bs-theme="dark"] code span.in,
[data-bs-theme="dark"] code span.wa {
  color: var(--dz-code-comment) !important;
}

html[data-theme="dark"] code span.kw,
html[data-theme="dark"] code span.cf,
html[data-theme="dark"] code span.im,
html[data-theme="dark"] code span.op,
html[data-theme="dark"] code span.ot,
[data-bs-theme="dark"] code span.kw,
[data-bs-theme="dark"] code span.cf,
[data-bs-theme="dark"] code span.im,
[data-bs-theme="dark"] code span.op,
[data-bs-theme="dark"] code span.ot {
  color: var(--dz-code-keyword) !important;
}

html[data-theme="dark"] code span.st,
html[data-theme="dark"] code span.ss,
html[data-theme="dark"] code span.ch,
html[data-theme="dark"] code span.vs,
[data-bs-theme="dark"] code span.st,
[data-bs-theme="dark"] code span.ss,
[data-bs-theme="dark"] code span.ch,
[data-bs-theme="dark"] code span.vs {
  color: var(--dz-code-string) !important;
}

html[data-theme="dark"] code span.dv,
html[data-theme="dark"] code span.fl,
html[data-theme="dark"] code span.bn,
html[data-theme="dark"] code span.sc,
[data-bs-theme="dark"] code span.dv,
[data-bs-theme="dark"] code span.fl,
[data-bs-theme="dark"] code span.bn,
[data-bs-theme="dark"] code span.sc {
  color: var(--dz-code-number) !important;
}

html[data-theme="dark"] code span.fu,
[data-bs-theme="dark"] code span.fu {
  color: var(--dz-code-function) !important;
}

html[data-theme="dark"] code span.cn,
html[data-theme="dark"] code span.at,
html[data-theme="dark"] code span.va,
[data-bs-theme="dark"] code span.cn,
[data-bs-theme="dark"] code span.at,
[data-bs-theme="dark"] code span.va {
  color: var(--dz-code-constant) !important;
}