@import url('./design.css');

:root, :root.dark, :root[data-theme] {
  --myst-color-bg: var(--color-canvas);
  --myst-color-bg-secondary: var(--color-panel);
  --myst-color-surface: var(--color-panel);
  --myst-color-surface-hover: var(--color-selected);
  --myst-color-text: var(--color-ink);
  --myst-color-text-secondary: var(--color-text);
  --myst-color-text-tertiary: var(--color-muted);
  --myst-color-prose-body: var(--color-text);
  --myst-color-border: var(--color-border);
  --myst-color-border-strong: var(--color-control-border);
  --myst-color-link: var(--color-link);
  --myst-color-link-hover: var(--color-link-hover);
  --myst-color-link-underline: var(--color-link);
  --myst-color-active: var(--color-link);
  --myst-color-active-bg: var(--color-selected);
  --myst-color-active-surface: var(--color-selected);
  --myst-color-primary: var(--color-action);
  --myst-color-primary-hover: var(--color-action-hover);
  --myst-color-focus-ring: var(--color-link);
  --myst-color-focus-outline: var(--color-link);
  --myst-color-code: var(--color-ink);
  --pst-font-family-base: var(--font-sans);
  --pst-font-family-heading: var(--font-sans);
  --pst-font-family-monospace: var(--font-code);
  --pst-font-size-base: 1rem;
  --pst-font-weight-heading: 350;
  --pst-color-background: var(--color-canvas);
  --pst-color-on-background: var(--color-panel);
  --pst-color-surface: var(--color-panel);
  --pst-color-on-surface: var(--color-selected);
  --pst-color-text-base: var(--color-text);
  --pst-color-text-muted: var(--color-muted);
  --pst-color-heading: var(--color-ink);
  --pst-color-border: var(--color-border);
  --pst-color-link: var(--color-link);
  --pst-color-link-hover: var(--color-link-hover);
  --pst-color-primary: var(--color-link);
  --pst-color-secondary: var(--color-link);
  --pst-color-inline-code: var(--color-ink);
  --pst-color-target: var(--color-selected);
}

body {
  font-family: var(--font-sans);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.65;
  color: var(--color-text);
  background: var(--color-canvas);
}

button, input, select, textarea { font-family: inherit; }

.article, .bd-article {
  font-family: var(--font-sans);
  font-size: .9375rem;
  line-height: 1.65;
  color: var(--color-text);
}

:is(.article, .bd-article) h1 {
  font-size: clamp(2rem, 3.3vw, 3rem);
  font-weight: 350;
  line-height: 1.12;
  letter-spacing: -.02em;
  color: var(--color-ink);
}

:is(.article, .bd-article) h2 {
  font-size: clamp(1.5625rem, 2vw, 1.75rem);
  font-weight: 350;
  line-height: 1.3;
  letter-spacing: normal;
  color: var(--color-ink);
}

:is(.article, .bd-article) :is(h3, h4, h5, h6) {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: normal;
  color: var(--color-ink);
}

:is(.article, .bd-article) :is(strong, b) { font-weight: 500; }
:is(.article, .bd-article) p { max-width: 66ch; }
:is(.article, .bd-article) a { text-underline-offset: .2em; }
:is(.article, .bd-article) :is(pre, code, kbd, samp) { font-family: var(--font-code); }
:is(.article, .bd-article) pre { font-size: .8125rem; line-height: 1.7; }
:is(.article, .bd-article) :not(pre) > code { font-size: .86em; letter-spacing: normal; }
:is(.article, .bd-article) table { font-size: .875rem; line-height: 1.65; }
:is(.article, .bd-article) :is(th, dt) { font-weight: 500; }
:is(.article, .bd-article) th { background: var(--color-panel); }
:is(.article, .bd-article) :is(th, td) { border-color: var(--color-border); }
:is(.article, .bd-article) figcaption {
  font-size: .875rem;
  line-height: 1.65;
  letter-spacing: var(--tracking-small);
  color: var(--color-muted);
}

.myst-code, .myst-tab-item-body, .bd-article div.admonition, .bd-article div.highlight {
  box-shadow: none;
  border: 1px solid var(--color-border);
  border-radius: 5px;
  background: var(--color-panel);
}

.myst-code:hover, :root.dark .myst-code { box-shadow: none; }
.myst-code .myst-code-body { background: transparent; }
.myst-code-body, .bd-article div.highlight pre { padding: 16px; }
.myst-tab-item-header, .bd-article .sd-tab-label { font-size: .875rem; font-weight: 400; }
.myst-tab-item-header-active, .bd-article .sd-tab-input:checked + .sd-tab-label { font-weight: 500; }
.myst-admonition-title, .bd-article .admonition-title { font-weight: 500; }

.myst-top-nav, .bd-header {
  background-color: var(--color-canvas);
  background-image:
    radial-gradient(ellipse at left top, color-mix(in srgb, var(--color-cyan) 30%, transparent), transparent 65%),
    radial-gradient(ellipse at right top, color-mix(in srgb, var(--color-lavender) 34%, transparent), transparent 65%);
}

.myst-primary-sidebar-pointer, .bd-sidebar-primary { background: var(--color-canvas); }
.myst-primary-sidebar { bottom: 0; }
.myst-primary-sidebar-pointer { max-height: 100%; }

:is(:root.dark, :root[data-theme="dark"]) :is(.myst-top-nav, .bd-header) {
  background-image:
    radial-gradient(ellipse at left top, color-mix(in srgb, var(--color-cyan) 10%, transparent), transparent 65%),
    radial-gradient(ellipse at right top, color-mix(in srgb, var(--color-lavender) 12%, transparent), transparent 65%);
}

.myst-top-nav-bar { max-width: 1680px; }
.myst-home-link { gap: 10px; }
.myst-home-link img { width: 57px; height: 57px; object-fit: contain; }
.myst-home-link span { font-size: 1.125rem; font-weight: 400; letter-spacing: normal; }
.myst-navbar-end { display: flex; flex-shrink: 0; }
.myst-primary-sidebar-navbar-end { display: none; }
.docs-home-link {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 40px;
  height: 40px;
  border-radius: 5px;
}
.docs-home-link:hover { background: var(--color-selected); }
.docs-home-link:focus-visible { outline: 2px solid var(--color-link); outline-offset: 2px; }
.docs-home-link .link-icon { display: none; }
.myst-search-bar { font-size: .8125rem; border-color: var(--color-border); border-radius: 5px; }
.myst-search-shortcut { font-size: .6875rem; }

.myst-primary-sidebar-nav { padding-block: 24px; }
.myst-primary-sidebar-toc { margin-right: 20px; }
.myst-toc, .myst-outline, .bd-sidebar-primary, .bd-sidebar-secondary {
  font-size: .8125rem;
  line-height: 1.5;
  letter-spacing: var(--tracking-small);
}

.myst-toc .myst-toc-item { margin-block: 2px; border-radius: 5px; }
.myst-toc a.myst-toc-item, .myst-toc-item > [title] { padding-block: 6px; font-weight: 400; }
.myst-toc a.myst-toc-item.font-bold, .myst-toc a.myst-toc-item-exact,
.myst-toc [aria-current="page"] { font-weight: 500; color: var(--color-link); }
.myst-toc-item > button svg { width: 16px; height: 16px; }
.myst-outline .myst-outline-header { text-transform: none; font-size: .875rem; font-weight: 400; margin-bottom: 12px; }
.myst-outline .myst-outline-list { font-size: .8125rem; line-height: 1.5; }
.myst-outline a { padding-block: 5px; }
.myst-outline[data-scroll-sync] .myst-outline-item { background: transparent; border-left-color: var(--color-border); }
.myst-outline[data-scroll-sync] .myst-outline-item > a { color: var(--color-text); font-weight: 400; }
.myst-outline[data-scroll-sync] .myst-outline-item:has(> a[aria-current="location"]) { background: var(--color-selected); border-left-color: var(--color-link); }
.myst-outline[data-scroll-sync] .myst-outline-item > a[aria-current="location"] { color: var(--color-link); font-weight: 500; }
.myst-primary-sidebar-footer { font-size: .8125rem; }

.bd-container { max-width: 1680px; }
.bd-main .bd-content .bd-article-container { max-width: 100%; }
.bd-article-container .bd-article { padding-inline: 32px; }
.bd-sidebar-primary { width: 248px; flex-basis: 248px; padding-inline: 24px; }
.bd-sidebar-secondary { width: 208px; flex-basis: 208px; }
.bd-sidebar-primary .sidebar-primary-items__start { gap: 24px; }
.navbar-brand.logo { display: flex; flex-direction: row; align-items: center; gap: 10px; padding-block: 12px; }
.navbar-brand.logo img.logo__image { width: 48px; height: 48px; object-fit: contain; }
.navbar-brand.logo .logo__title { font-size: 1.125rem; font-weight: 400; line-height: 1.5; }
.bd-sidebar :is(.caption, .caption-text, .nav-link) { font-size: .8125rem; font-weight: 400; letter-spacing: var(--tracking-small); text-transform: none; }
.bd-sidebar-primary .nav li a { padding-block: 6px; font-size: .8125rem; }
.bd-sidebar-primary .nav li.current > a { font-weight: 500; background: var(--color-selected); }
.myst-primary-sidebar-toc .myst-toc > a.myst-toc-item,
.myst-toc > [data-state] > .myst-toc-item > [title],
.bd-sidebar-primary .caption-text,
.bd-sidebar-primary .bd-sidenav > li.toctree-l1 > a { font-weight: 600; }
.bd-sidebar-secondary .toc-h2, .bd-sidebar-secondary .toc-h3 { font-size: .8125rem; }
.bd-article dl.py > dt { padding: 12px; background: var(--color-panel); border-top-color: var(--color-border); overflow-wrap: anywhere; }
.bd-article .sig, .bd-article .sig-name { font-size: .875rem; font-weight: 500; }
.bd-article code.literal .pre { white-space: normal; overflow-wrap: anywhere; }

@media (min-width: 1280px) {
  .article-grid, .myst-primary-sidebar {
    grid-template-columns:
      [screen-start screen-inset-start] minmax(24px, 1fr)
      [page-start page-inset-start] 224px
      [body-outset-start] 32px
      [body-start gutter-left-start body-inset-start] minmax(0, 180px)
      [middle-start] minmax(0, 180px)
      [gutter-left-end] minmax(0, 180px) minmax(0, 180px)
      [gutter-right-start] minmax(0, 180px)
      [middle-end] minmax(0, 180px)
      [body-inset-end body-end gutter-right-end] 32px
      [body-outset-end] 176px
      [page-inset-end page-end] minmax(24px, 1fr)
      [screen-inset-end screen-end];
  }
}

@media (max-width: 767px) {
  .article-grid { padding-inline: 12px; }
  .article-grid .article-grid { padding-inline: 0; }
  .bd-article-container .bd-article { padding-inline: 16px; }
  .myst-home-link img { width: 47px; height: 47px; }
  .myst-home-link { margin-left: 0; gap: 8px; }
  .myst-home-link-logo { margin-right: 0; }
}

@media (max-width: 359px) {
  .myst-top-nav-menu-button { width: 32px; }
  .myst-theme-button, .myst-navbar-end { margin-left: 4px; }
}
