/* SPDX-License-Identifier: MIT */

/*
This theme was created from scratch.
Historically however, thanks to:
- Alabaster for being a good base
  - Which thanks Flask + KR theme
- Sphinx Readable Theme
  - Which also proved to be a great base
*/

/*
  note: this CSS is "mobile first"
  The desktop implementation is near the bottom
*/

* {
  box-sizing: border-box;
}

/* CSS variables would go here */
:root {
  --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  --monospace-font-family: 'Consolas', 'Menlo', 'Deja Vu Sans Mono', 'Bitstream Vera Sans Mono', monospace;

  /* palette goes here */
  --white: #ffffff;
  --grey-1: #f9f9fa;
  --grey-1-8: rgba(249, 249, 250, 0.8);
  --grey-2: #ededf0;
  --grey-3: #d7d7db;
  --grey-4: #b1b1b3;
  --grey-5: #737373;
  --grey-6: #4a4a4f;
  --grey-7: #38383d;
  --grey-8: #2a2a2e;
  --black: #0c0c0d;

  --blue-1: #3399ff;
  --blue-2: #0a84ff;
  --blue-3: #0060df;
  --blue-4: #003eaa;
  --blue-5: #002275;
  --blue-6: #000f40;

  --disnake-yellow: #ffd444;
  --disnake-blue: #376fa1;
  --disnake-light-blue: #578fc1;

  --main-background: var(--grey-1);
  --link-text: var(--blue-2);
  --link-hover-text: var(--blue-6);
  --main-text: var(--black);
  --mobile-nav-background: var(--black);
  --mobile-nav-text: var(--white);
  --mobile-nav-hover-text: var(--white);
  --mobile-nav-header-text: var(--white);
  --nav-background: var(--main-background);
  --nav-text: var(--grey-6);
  --nav-hover-text: var(--grey-6);
  --nav-header-text: var(--black);
  --nav-link-text: var(--white);
  --nav-link-hover-text: var(--blue-1);
  --sub-header-background: var(--grey-8);
  --search-border: var(--grey-5);
  --search-text: var(--white);
  --search-focus: var(--blue-1);
  --search-button: var(--grey-1);
  --search-button-hover: var(--grey-1-8);
  --footer-text: var(--grey-5);
  --footer-link: var(--grey-6);
  --hr-border: var(--grey-2);
  --main-big-headers-text: var(--black);
  --main-big-headers-border: var(--grey-4);
  --main-h5-header-text: var(--black);
  --main-h6-header-text: var(--grey-4);
  --main-h4-header-border: var(--grey-4);
  --header-link: var(--grey-6);
  --header-link-hover-text: var(--white);
  --admonition-background: var(--grey-2);
  --note-background: var(--blue-1);
  --note-text: var(--white);
  --warning-background: #ffe900;
  --warning-text: var(--black);
  --error-background: #d70022;
  --error-text: var(--white);
  --helpful-background: #00c8d7;
  --helpful-text: var(--black);
  --codeblock-background: var(--grey-2);
  --codeblock-border: var(--grey-4);
  --codeblock-text: var(--grey-6);
  --inline-code-background: var(--grey-3);
  --xref-code-background: transparent;
  --api-entry-background: var(--grey-2);
  --table-header-background: var(--grey-3);
  --table-text: var(--black);
  --table-border: var(--grey-4);
  --mobile-active-toc: var(--grey-7);
  --active-toc: var(--grey-3);
  --scrollbar: rgba(0,0,0,0.2);
  --scrollbar-hover: rgba(0,0,0,0.4);
  --rtd-ad-border: var(--grey-3);
  --rtd-ad-background: var(--grey-2);
  --rtd-ad-main-text: var(--grey-6);
  --rtd-ad-small-text: var(--grey-4);
  --rtd-version-background: #272725;
  --rtd-version-main-text: #fcfcfc;
  --attribute-table-title: var(--grey-6);
  --attribute-table-list-border: var(--grey-3);
  --attribute-table-list-text: var(--grey-5);
  --attribute-table-list-hover-border: var(--blue-2);
  --attribute-table-list-hover-background: var(--grey-2);
  --attribute-table-list-hover-text: var(--blue-2);
  --attribute-table-badge: var(--grey-7);
  --highlighted-text: rgb(252, 233, 103);
  --tooltip-background: #f8f8f8;
}


img[src$="/snake_dark.svg"]  {
  display: none;
}

@media screen and (prefers-color-scheme: dark) {
  :root {
    --main-background: var(--grey-7);
    --link-text: var(--blue-1);
    --link-hover-text: var(--blue-2);
    --main-text: var(--white);
    --sub-header-background: var(--grey-8);
    --search-border: var(--grey-6);
    --nav-background: var(--main-background);
    --nav-text: var(--grey-1);
    --nav-hover-text: var(--grey-2);
    --nav-header-text: var(--white);
    --footer-text: var(--grey-2);
    --footer-link: var(--grey-1);
    --hr-border: var(--grey-1);
    --main-big-headers-text: var(--grey-1);
    --main-big-headers-border: var(--grey-1);
    --main-h5-header-text: var(--grey-4);
    --main-h6-header-text: var(--grey-5);
    --main-h4-header-border: var(--grey-2);
    --header-link: var(--grey-2);
    --header-link-hover-text: var(--grey-6);
    --admonition-background: var(--grey-8);
    --note-background: var(--blue-3);
    --note-text: var(--white);
    --warning-background: #d7b600;
    --warning-text: var(--black);
    --error-background: #d70022;
    --error-text: var(--white);
    --helpful-background: #008ea4;
    --helpful-text: var(--white);
    --codeblock-background: var(--grey-6);
    --codeblock-border: var(--black);
    --codeblock-text: var(--grey-1);
    --inline-code-background: var(--grey-8);
    --xref-code-background: transparent;
    --api-entry-background: var(--grey-6);
    --table-header-background: var(--grey-6);
    --table-text: var(--grey-1);
    --table-border: var(--grey-4);
    --active-toc: var(--grey-6);
    --scrollbar: rgba(0, 0, 0, 0.5);
    --scrollbar-hover: rgba(0, 0, 0, 0.7);
    --rtd-ad-border: var(--grey-6);
    --rtd-ad-background: var(--grey-5);
    --rtd-ad-main-text: var(--grey-2);
    --rtd-ad-small-text: var(--grey-1);
    --attribute-table-title: var(--grey-3);
    --attribute-table-list-border: var(--grey-5);
    --attribute-table-list-text: var(--grey-3);
    --attribute-table-list-hover-border: var(--blue-1);
    --attribute-table-list-hover-background: var(--grey-6);
    --attribute-table-list-hover-text: var(--blue-1);
    --attribute-table-badge: var(--grey-4);
    --highlighted-text: rgba(250, 166, 26, 0.2);
    --tooltip-background: rgba(10, 10, 10, 0.95);
  }

  img[src$="/snake.svg"] {
    display: none;
  }

  img[src$="/snake_dark.svg"] {
    display: inherit;
  }
}


body {
  font-family: var(--font-family);
  font-size: 16px;
  margin: 0;
  padding: 0;
  height: 100%;
  background-color: var(--main-background);
  color: var(--main-text);
}

/* all URLs only show underline on hover */
a {
  text-decoration: none;
  color: var(--link-text);
  transition: color 0.3s;
}

a:hover {
  text-decoration: underline;
  color: var(--link-hover-text);
  transition: color 0.05s;
}

/* headers */

header {
  color: var(--main-text);
  position: sticky;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 40;
  padding: 0;
  background-color: var(--sub-header-background);
  box-shadow: rgba(0, 0, 0, 0.2) 0 3px 6px;
}

header > nav {
  color: var(--nav-text);
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  flex-wrap: wrap;
  align-items: center;
  line-height: 1em; /* It defaults to 1.2, pushing some icons out of vertical alignment */
}

header > nav a {
  color: var(--nav-link-text);
  margin: 0 0.5em;
}

header > nav a:hover {
  color: var(--nav-link-hover-text);
  text-decoration: none;
}

header > nav.mobile-only {
  width: 100%;
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
  padding-top: 0;
  transition: top 0.5s ease-in-out;
}

header > nav.mobile-only .search {
  width: 100%;
}

header > nav.mobile-only .search-wrapper {
  background-color: var(--sub-header-background);
}

.main-heading img {
  padding-left: 6px;
  max-width: 100%;
  max-height: 24px;
}

header > nav > a:hover {
  color: var(--grey-1-8);
  text-decoration: underline;
}

/* footer stuff */
footer {
  padding: 0.8em;
  font-size: 14px;
  text-align: center;
  color: var(--footer-text);
  /* Elevate above the aside */
  position: relative;
  z-index: 5;
}

footer a {
  text-decoration: underline;
  color: var(--footer-link);
}

/* sidebar stuff */

main {
  /* aside width + 10px because of scrollbar gutter */
  margin-left: 350px;
  padding: 12px;
  z-index: 1;
}

aside {
  font-size: 14px;
  line-height: 1.75em;
  position: fixed;
  /* top: 0; Intentionally missing to give space for sticky header */
  background-color: var(--nav-background);
  color: var(--nav-text);
  left: 0;
  padding: 12px;
  /* Space for footer overlap on bottom */
  padding-bottom: calc(calc(calc(0.8em * 2) + 12px) + 1em);
  overflow: auto;
  z-index: 3;
  top: 50px; /* Space for sticky header */
  bottom: 0;
  width: 350px;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}

header .header-breakpoint {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  padding: 6px;
}

header .extension-breakpoint {
  flex-grow: 1;
  justify-content: flex-end;
}

header form.search {
  padding-right: 6px;
}

.main-heading {
  line-height: 0; /* avoid layout issue */
}

.main-heading img.small {
  display: none;
}

.extension-nav {
  text-transform: capitalize;
}

#hamburger-toggle {
  display: none;
}

.mobile {
  display: none !important;
}

.mobile-heading {
  display: none !important;
}

@media screen and (max-width: 1050px) {
  main {
    margin-left: 0;
    overflow: hidden;
  }

  .desktop {
    display: none !important;
  }

  .mobile-heading {
    display: flex !important;
    background-color: var(--sub-header-background);
    width: 100%;
    height: 50px;
    align-items: center;
    padding: 0 0.5em;
  }

  .disnake-mobile-logo {
    max-height: 24px;
    margin: 0 0.5em;
  }

  #sidebar {
    height: auto !important;
    padding: 12px;
  }

  header nav {
    justify-content: center;
    align-items: center;
  }

  header.top-header {
    position: relative;
  }

  .main-heading {
    display: block;
    flex-basis: 100%;
    text-align: center;
    width: 100%;
    background-image: linear-gradient(to right, #ffd545 0%, #ffd545 50%, #3773a5 50%, #3773a5 100%);
  }

  .disnake-main-logo {
    display: none;
  }

  .main-heading img.small {
    display: inline-block;
    max-height: 50px;
  }

  header .header-breakpoint {
    flex-basis: 100%;
  }

  .top-header .header-breakpoint {
    padding: 10px;
    padding-left: 42px;
  }

  header .search-breakpoint {
    padding-left: 42px;
  }

  header .search-breakpoint > *  {
    margin: 0 0.5em;
  }

  header .extension-nav {
    padding: 6px 10px;
    flex-basis: 50px;
    flex-grow: 1;
    text-align: center;
    text-transform: capitalize;
  }

  header form.search {
    flex-grow: 1;
    max-width: 400px;
    margin-left: auto;
    padding-right: 0;
  }

  header .search-wrapper {
    margin: auto;
  }

  #hamburger-toggle {
    position: fixed;
    top: 12px;
    left: 12px;
    display: block;
    z-index: 60;
    color: white;
    transition: left 0.3s, right 0.3s, color 0.3s;
    cursor: pointer;
    background-color: var(--sub-header-background);
    border-radius: 50%;
    line-height: 0;
  }

  /* a nice clickbox for the X */
  #hamburger-toggle::before {
    position: absolute;
    content: " ";
    display: block;
    background: transparent;
    z-index: -1;
    top: -12px;
    left: -36px;
    width: 72px;
    height: 48px;
  }

  #hamburger-toggle.opened {
    left: calc(100vw - 44px);
    color: white;
  }

  aside {
    position: fixed;
    top: 0;
    bottom: 0;
    left: -100vw;
    width: 100vw;
    transition: left 0.3s, visibility 0.3s;
    max-width: 100%;
    max-height: unset;
    padding: 0;
    visibility: hidden;
    overflow: auto;
    z-index: 50;
  }

  .small-toc aside {
    bottom: auto;
  }

  aside.sidebar-toggle {
    visibility: visible;
    left: 0;
  }

  .sidebar-extension-list {
    background: var(--sub-header-background);
    display: flex !important;
    justify-content: space-around;
    height: auto;
  }

  #sidebar > h3:first-child {
    margin-top: 0;
  }

  .search-wrapper > input[type=search] {
    width: 130px; /* Minimum width, low for small screens */
  }
}


@media screen and (min-width: 1500px) {
  main {
    margin-left: 0;
    padding-left: 0;
    padding-right: 0;
  }

  main > * {
    margin-left: calc(calc(calc(calc(100vw - 1500px) / 2) + 350px) + 12px) !important;
    max-width: calc(1500px - 350px);
    padding-right: 12px;
  }

  main > .admonition {
    max-width: calc(calc(1500px - 350px) - 12px);
  }

  aside {
    left: calc(calc(100vw - 1500px) / 2);
  }

  header > nav {
    margin-left: calc(calc(100vw - 1500px) / 2);
    margin-right: auto;
    max-width: 1500px;
  }

  footer {
    margin-left: calc(calc(100vw - 1500px) / 2);
    max-width: 1500px;
  }
}

/* Shrink inter-icon padding to fit stuff on very small screens */
@media screen and (max-width: 425px) {
  header .search-breakpoint > * {
    margin: 0 0.15em;
  }

  #hamburger-toggle {
    left: 8px;
  }
}

@media screen and (max-width: 365px) {
  #dark-mode-switch {
    display: none;
  }
}

#scrollbar {
  height: auto !important;
  overflow: scroll;
}

aside h3 {
  color: var(--mobile-nav-header-text);
  font-size: 24px;
  font-weight: normal;
}

.sidebar-extension-list a {
  margin: 0.25em 0.5em;
  padding: 0.5em;
  color: var(--nav-link-text);
  font-size: 16px;
}

.sidebar-extension-list a:hover {
  color: var(--nav-link-hover-text);
}

.collapsible-arrow {
  font-size: 1.5em!important;
  left: -1.166em;
  top: 0.25em;
  user-select: none;
  position: relative;
  line-height: 0.5em;
  transition: transform 0.4s;
  transform: rotate(-90deg);
}

.expanded {
  transition: transform 0.4s;
  transform: rotate(0deg);
}

.ref-internal-padding {
  position: relative;
  left: -20px;
}

aside .material-icons {
  cursor: pointer;
  font-size: 2em;
}

.material-icons {
  max-width: 24px;
}

.sidebar-toggle {
  display: unset !important;
}

#sidebar a {
  color: var(--nav-text);
}

#sidebar a:hover {
  color: var(--nav-hover-text);
}

#sidebar h3 {
  font-size: 24px;
  margin: 1em 1em 0 0;
}

#sidebar ul {
  list-style: none;
  padding: 0;
}

#sidebar > ul {
  margin-left: 2px;
}

#sidebar ul ul {
  list-style: square;
  margin: 0em;
  margin-left: 1.5em;
}

#sidebar li.no-list-style {
  list-style: none;
}

#sidebar form {
  margin: 1em 0;
  display: flex;
  align-items: baseline;
}

/* sidebar search box stuff */

.sidebar-search-wrapper {
  display: flex;
  border: 2px solid var(--search-border);
  border-radius: 8px;
  overflow: hidden;
}

/* Make toc search bar take up entire screen width only on smaller screens */
@media screen and (min-width: 425px) {
  .sidebar-search-wrapper {
    width: 200px;
  }
}

.sidebar-search-wrapper:focus-within {
  border-color: var(--search-focus);
}

#sidebar-search-box {
  background-color: var(--sub-header-background);
  border: none;
  color: var(--search-text);
  padding: 0.4em 1em;
  flex: 10;
}


aside::-webkit-scrollbar {
  width: 0.5em;
  overflow-y: overlay;
}

aside::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar);
  border-radius: 0.25em;
}

aside::-webkit-scrollbar-thumb:hover {
  background-color: var(--scrollbar-hover);
}

/* search button stuff */

.search-wrapper {
  display: flex;
  align-items: stretch;
}

.search-wrapper > input[type=search] {
  font-family: "Roboto", Corbel, Avenir, "Lucida Grande", "Lucida Sans", sans-serif;
  outline: none;
  appearance: none;
  font-size: 1em;
}

.search-wrapper > input[type=search]::-webkit-search-cancel-button {
  /* As of 2022, the search cancel button ignores all sorts of properties and looks bad by default in this theme so we hide it */
  -webkit-appearance: none;
  display: none;
}

.search-wrapper > input[type=search],
.search-wrapper > button[type=submit] {
  background-color: var(--sub-header-background);
  border: none;
  color: var(--search-text);
  padding: 0.25em 0.5em;
  flex: 9;
}

.search-wrapper > button[type=submit] {
  display: flex;
  align-items: center;
  justify-content: center;
}

.search-wrapper {
  border: 2px solid var(--search-border);
  border-radius: 8px;
  overflow: hidden;
}

.search-wrapper:focus-within {
  border-color: var(--search-focus);
}

/* .search-wrapper > input[type=search] {
  border: 1px solid var(--search-border);
  border-right: none;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.search-wrapper > input[type=search]:focus,
button[type=submit]:focus ~ input[type=search] {
  border: 1px solid var(--search-focus);
  border-right: none;
} */

.search-wrapper > button[type=submit] {
  color: var(--search-button);
  /* border: 1px solid var(--search-border); */
  /* border-left: none; */
  /* border-bottom-right-radius: 4px; */
  /* border-top-right-radius: 4px; */
  cursor: pointer;
  flex: 1;
}

/* .search-wrapper > button[type=submit]:focus,
input[type=search]:focus ~ button[type=submit] {
  border: 1px solid var(--search-focus);
  border-left: none;
} */

.search-wrapper > button[type=submit]:hover {
  background-color: var(--search-border);
  color: var(--search-button-hover);
}

p {
  margin-bottom: 8px;
}

dt.sig {
  overflow: auto;
  max-width: 100%;
}

section h3 {
  max-width: 100%;
  overflow: auto;
}

/* jumplinks and sticky header */
:target {
  overflow: initial; /* chrome bug */
  scroll-margin-top: 60px;
}

.sig[id] {
  overflow: initial;
  scroll-margin-top: 60px;
}

/* scroll to top button */
#to-top {
  position: fixed;
  bottom: 50px;
  right: 20px;

  cursor: pointer;
}

#to-top.is-rtd {
  bottom: 100px;
}

#to-top > span {
  display: block;

  width: auto;
  height: 30px;
  padding: 0 6px;

  background-color: var(--rtd-version-background);
  color: var(--rtd-version-main-text);
}

#to-top span {
  line-height: 30px;
  font-size: 90%;
  text-align: center;
}

/* copy button */

.relative-copy {
  position: relative;
}

.copy {
  cursor: pointer;
  position: absolute;
  top: 0px;
  right: 0px;
  border: 1px solid var(--codeblock-border);
  font-size: 0.875em;
  padding: 0.2em 0.5em;
  border-bottom-left-radius: 4px;
  display: flex;
  opacity: 0.65;
  transition: opacity 0.5s;
}

.copy:hover {
  opacity: 1;
  transition: opacity 0.2s;
}

/* -- body styles --------------------------------------------------------- */

hr {
  border: 1px solid var(--hr-border);
}

main h1,
main h2,
main h3,
main h4,
main h5,
main h6 { font-weight: normal; }

main h1,
main h2,
main h3,
main h4 { color: var(--main-big-headers-text); }
main h5 { color: var(--main-h5-header-text); }
main h6 { color: var(--main-h6-header-text); }

main h1 { margin: 0 0 10px 0; }
main h2,
main h3 { margin: 10px 0px 10px 0px; }
main h4,
main h5,
main h6 { margin: 20px 0px 10px 0px; }

main h1 { padding: 0 0 10px 0; }
main h2,
main h3 { padding: 10px 0 10px 0; }
main h4 { padding: 10px 0 10px 0; }
main h5,
main h6 { padding: 10px 0 0 0; }

main h1,
main h2,
main h3 { border-bottom: 1px solid var(--main-big-headers-border); }
main h4 { border-bottom: 1px solid var(--main-h4-header-border); }

main h1 { font-size: 2.3em; }
main h2 { font-size: 1.8em; }
main h3 { font-size: 1.3em; }
main h4 { font-size: 1.1em; }
main h5 { font-size: 1.05em; }
main h6 { font-size: 1em; }

a.headerlink {
  color: var(--header-link);
  font-size: 0.8em;
  padding: 0 4px 0 4px;
  text-decoration: none;
  visibility: hidden;
}

a.headerlink:hover {
  background-color: var(--header-link);
  color: var(--header-link-hover-text);
}

h1:hover > a.headerlink,
h2:hover > a.headerlink,
h3:hover > a.headerlink,
h4:hover > a.headerlink,
h5:hover > a.headerlink,
h6:hover > a.headerlink,
dt:hover > a.headerlink,
caption:hover > a.headerlink,
p.caption:hover > a.headerlink,
div.code-block-caption:hover > a.headerlink {
    visibility: visible;
}

.versionmodified {
  font-style: italic;
}

main ul {
  list-style: disc;
  margin: 1em 0;
  padding-left: 1.3em;
}

main ul ul, main ol ul {
  margin: .2em 0;
  padding-left: 1.2em;
}

main ul li {
  padding: 2px 0;
}

main ul.search li {
  padding: 5px 0 5px 20px;
}

main ol {
  counter-reset: li;
  margin-left: 0;
  padding-left: 0;
}

main ol ol {
  margin: .2em 0;
}

main ol > li {
  list-style: none;
  margin: 0 0 0 1.9em;
  padding: 2px 1px;
  position: relative;
}

main ol > li::before {
  content: counter(li) ".";
  counter-increment: li;
  top: -2px;
  left: -1.1em;
  width: 1.1em;
  padding: 4px 0;
  position: absolute;
  text-align: left;
}

main p,
main dd,
main li {
  line-height: 1.4;
}

main img {
  width: 100%;
  max-width: 500px;
}

/* weird margins */
li > p {
  margin: 2px;
}

li > blockquote {
  margin: 10px;
}

/* admonitions */
div.admonition {
  padding: 0 0.8em 0.8em 0.8em !important;
  margin: 0.8em 0;
  border-radius: 2.5px;
  border-left-width: 3px;
  border-left-style: solid;
  background-color: var(--admonition-background);
}

p.admonition-title {
  font-weight: bold;
  margin: 0 -0.8rem !important;
  padding: 0.4rem 0.6rem 0.4rem 2.5rem;
  position: relative;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

p.admonition-title::before {
  font: normal normal normal 24px/1 'Material Icons';
  display: inline-block;
  width: 24px;
  height: 24px;
  position: absolute;
  left: 9.6px;
}

div.important, div.note, div.hint, div.tip {
  border-left-color: var(--note-background);
}

div.important > p.admonition-title,
div.note > p.admonition-title,
div.hint > p.admonition-title,
div.tip > p.admonition-title {
  background-color: var(--note-background);
  color: var(--note-text);
}

div.important > p.admonition-title::before,
div.note > p.admonition-title::before,
div.hint > p.admonition-title::before,
div.tip > p.admonition-title::before {
  content: '\0e88e';
}

div.attention, div.warning, div.caution {
  border-left-color: var(--warning-background);
}

div.attention > p.admonition-title,
div.warning > p.admonition-title,
div.caution > p.admonition-title {
  background-color: var(--warning-background);
  color: var(--warning-text);
}

div.attention > p.admonition-title::before,
div.warning > p.admonition-title::before,
div.caution > p.admonition-title::before {
  content: '\0e002';
}

div.danger, div.error {
  border-left-color: var(--error-background);
}

div.danger > p.admonition-title,
div.error > p.admonition-title {
  background-color: var(--error-background);
  color: var(--error-text);
}

div.danger > p.admonition-title::before,
div.error > p.admonition-title::before {
  content: '\0e000';
}

/* helpful admonitions */
div.helpful {
  border-left-color: var(--helpful-background);
}

div.helpful > p.admonition-title {
  background-color: var(--helpful-background);
  color: var(--helpful-text);
}

div.helpful > p.admonition-title::before {
  content: '\0e873';
}

dl.field-list > dd {
  margin-top: 3px;
  margin-bottom: 10px;
  margin-left: 20px;
}

/* no disgusting background in the FAQ */
div.topic {
  background-color: transparent;
  border: none;
}

/* don't link-ify the FAQ page */
a.toc-backref {
  text-decoration: none;
  color: var(--main-text);
}

/* bold and fix the Parameter, Raises, etc. */
dl.field-list > dt {
  font-weight: bold;
}

/* remove flex from field lists */
dl.field-list {
  display: block;
}

/* cross-references are forced to bold for some reason */
a.reference > strong {
  font-weight: unset;
  font-family: var(--monospace-font-family);
}
a.reference.pep > strong,
a.reference.rfc > strong {
  font-family: inherit;
}

/* exception hierarchy */

.exception-hierarchy-content dd,
.exception-hierarchy-content dl {
  margin: 0px 2px;
}

.exception-hierarchy-content {
  margin-left: 0.5em;
}

.exception-hierarchy-content ul {
  list-style: '»' !important;
}

/* attribute tables */
.py-attribute-table {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  margin: 0 2em;
  padding-top: 16px;
}

.py-attribute-table-column {
  flex: 1 1 auto;
}

.py-attribute-table-column > span {
  font-weight: bold;
  color: var(--attribute-table-title);
}

main .py-attribute-table-column > ul {
  list-style: none;
  margin: 4px 0px;
  padding-left: 0;
  font-size: 0.95em;
}

.py-attribute-table-list > li {
  margin: 0;
  padding: 0;
  padding-left: 0.5em;
  border-left: 2px solid var(--attribute-table-list-border);
  display: flex;
  line-height: 1.2em;
}

.py-attribute-table-list > li > span:first-child {
  padding-top: 2px;
  padding-bottom: 2px;
}

.py-attribute-table-list > li > a {
  padding-left: 0.2em;
  padding-top: 2px;
  padding-bottom: 2px;
  color: var(--attribute-table-list-text);
  flex-grow: 1;
}

.py-attribute-table-list > li > a:hover {
  color: var(--attribute-table-list-hover-text);
  text-decoration: none;
}

.py-attribute-table-list > li:hover {
  background-color: var(--attribute-table-list-hover-background);
  border-left: 2px solid var(--attribute-table-list-hover-border);
  text-decoration: none;
}

.py-attribute-table-list :where(.badge-coroutine, .badge-method, .badge-decorator, .badge-classmethod) {
  flex-basis: 3em;
  text-align: right;
  font-size: 0.9em;
  color: var(--attribute-table-badge);
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

pre {
  background-color: var(--codeblock-background);
  border: 1px solid var(--codeblock-border);
  color: var(--codeblock-text);
  font-size: 0.75em;
  line-height: 1.5em;
  margin: 1.5em 0 1.5em 0;
  padding: 10px;
  overflow-x: auto;
}

pre, code {
  font-family: var(--monospace-font-family);
  font-size: 0.9em;
  overflow-wrap: break-word;
}

code {
  background-color: var(--inline-code-background);
  padding: .15em;
  border-radius: 3px;
}

code.descname {
  background-color: transparent;
  font-weight: bold;
  font-size: 0.95em;
}

code.descclassname {
  background-color: transparent;
  padding-right: 0;
}

code.descclassname + code.descname {
  padding-left: 0;
}

code.xref, a code {
  font-weight: normal;
  background-color: var(--xref-code-background);
}

span.pre {
  padding: 0 2px;
}

dl.class {
  margin-bottom: 50px;
}

dl.data > dt,
dl.describe > dt,
dl.function > dt,
dl.attribute > dt,
dl.classmethod > dt,
dl.method > dt,
dl.property > dt,
dl.class > dt,
dl.exception > dt {
  background-color: var(--api-entry-background);
  padding: 1px 10px;
}

/* bug in sphinx: https://github.com/sphinx-doc/sphinx/issues/9384 */
dl.property > dt > span.descname + em.property {
  display: none;
}

dd {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  margin-left: 1.5em;
}

dt:target, span.highlighted {
    background-color: var(--highlighted-text);
}

rect.highlighted {
    fill: var(--highlighted-text);
}

details.operations {
  padding: 10px;
  border: 1px solid var(--codeblock-border);
  margin-bottom: 20px;
}

details.operations dl {
  margin-top: 15px;
  margin-bottom: 15px;
}

details.operations > summary::after {
  content: 'Supported Operations';
  color: var(--main-big-headers-text);
}

.table-wrapper {
  overflow-x: auto;
}

table.docutils {
  width: 100%;
  border-collapse: collapse;
}

table.docutils.footnote {
  width: auto;
}

table.docutils thead,
table.docutils tfoot {
  background: var(--table-header-background);
}

table.docutils thead tr th {
  color: var(--table-text);
  font-weight: normal;
  padding: 7px 5px;
  vertical-align: middle;
}

table.docutils tbody tr th,
table.docutils tbody tr td {
  border-bottom: 0;
  padding: 7px 5px;
  vertical-align: top;
}

table.docutils tbody tr:not(:first-child) {
  border-top: solid 1px var(--table-border);
}

table.docutils tbody tr:last-child th,
table.docutils tbody tr:last-child td {
  border-bottom: solid 1px var(--table-border);
}

table.docutils thead tr td p,
table.docutils tfoot tr td p,
table.docutils tbody tr td p,
table.docutils thead tr td ul,
table.docutils tfoot tr td ul,
table.docutils tbody tr td ul,
table.docutils thead tr td ol,
table.docutils tfoot tr td ol,
table.docutils tbody tr td ol {
  margin: 0 0 .5em;
}
table.docutils thead tr td p.last,
table.docutils tfoot tr td p.last,
table.docutils tbody tr td p.last,
table.docutils thead tr td ul.last,
table.docutils tfoot tr td ul.last,
table.docutils tbody tr td ul.last,
table.docutils thead tr td ol.last,
table.docutils tfoot tr td ol.last,
table.docutils tbody tr td ol.last {
  margin-bottom: 0;
}

.align-default {
  text-align: left !important;
}

/* hide the welcome text */
section#welcome-to-disnake-py > h1 {
  display: none;
}

/* make the RTD ad look a little less jarring */

.ethical-fixedfooter {
  background-color: var(--rtd-ad-background) !important;
  border-top: 1px solid var(--rtd-ad-border) !important;
}

.ethical-fixedfooter a {
  color: var(--rtd-ad-main-text) !important;
}

.ethical-callout > small > em > a {
  color: var(--rtd-ad-small-text) !important;
}

.active {
  background-color: var(--active-toc);
  position: relative;
  font-weight: bold;
}

.active::before {
  content:"";
  display:inline-block;
  background-color:var(--active-toc);
  position:absolute;
  top:0;
  bottom:0;
  right:0;
  width:calc(100% + 0.5em);
  border-radius:4px;
  z-index:-1
}

/* Only mark the label if it's a tree */
li.active {
  font-weight: normal;
}

li.active > a {
  font-weight: bold;
}

div.code-block-caption {
  font-size: medium;
  font-weight: bold;
}

.viewcode-link {
  font-size: small;
  margin-top: 2px;
}


/* hoverxref stuff */
/* (this is mostly just a merge of the 'shadow' and 'borderless' themes) */

.tooltipster-sidetip.tooltipster-custom .tooltipster-content {
  color: inherit;
}

.tooltipster-sidetip.tooltipster-custom .tooltipster-box {
	border: none;
	background: var(--tooltip-background);
}

:root[data-theme="light"] .tooltipster-sidetip.tooltipster-custom .tooltipster-box {
  box-shadow: 0px 0px 10px 6px rgba(0,0,0,0.1);
}

.tooltipster-sidetip.tooltipster-custom.tooltipster-bottom .tooltipster-box {
	margin-top: 8px;
}

.tooltipster-sidetip.tooltipster-custom.tooltipster-left .tooltipster-box {
	margin-right: 8px;
}

.tooltipster-sidetip.tooltipster-custom.tooltipster-right .tooltipster-box {
	margin-left: 8px;
}

.tooltipster-sidetip.tooltipster-custom.tooltipster-top .tooltipster-box {
	margin-bottom: 8px;
}

.tooltipster-sidetip.tooltipster-custom .tooltipster-arrow {
	height: 8px;
	margin-left: -8px;
	width: 16px;
}

.tooltipster-sidetip.tooltipster-custom.tooltipster-left .tooltipster-arrow,
.tooltipster-sidetip.tooltipster-custom.tooltipster-right .tooltipster-arrow {
	height: 16px;
	margin-left: 0;
	margin-top: -8px;
	width: 8px;
}

.tooltipster-sidetip.tooltipster-custom .tooltipster-arrow-background {
	display: none;
}

.tooltipster-sidetip.tooltipster-custom .tooltipster-arrow-border {
	border: 8px solid transparent;
}

.tooltipster-sidetip.tooltipster-custom.tooltipster-bottom .tooltipster-arrow-border {
	border-bottom-color: var(--tooltip-background);
}

.tooltipster-sidetip.tooltipster-custom.tooltipster-left .tooltipster-arrow-border {
	border-left-color: var(--tooltip-background);
}

.tooltipster-sidetip.tooltipster-custom.tooltipster-right .tooltipster-arrow-border {
	border-right-color: var(--tooltip-background);
}

.tooltipster-sidetip.tooltipster-custom.tooltipster-top .tooltipster-arrow-border {
	border-top-color: var(--tooltip-background);
}

.tooltipster-sidetip.tooltipster-custom.tooltipster-bottom .tooltipster-arrow-uncropped {
	top: -8px;
}

.tooltipster-sidetip.tooltipster-custom.tooltipster-right .tooltipster-arrow-uncropped {
	left: -8px;
}


/* hoverxref stuff (hoverxref custom additions) */

.hxr-hoverxref {
  border-bottom: 1px dotted;
  border-color: gray;
}

.tooltipster-box {
  max-height: 600px;
}

.tooltipster-sidetip.tooltipster-custom .tooltipster-content {
  font-size: 80%;
  padding: 18px;
}

.tooltipster-sidetip.tooltipster-custom .tooltipster-content p {
  font-size: 100% !important;
}

.tooltipster-sidetip.tooltipster-custom .tooltipster-content .headerlink {
  visibility: hidden;
}


/* Dark mode toggle */

#dark-mode-switch {
  position: relative;
  height: 1.5em;
  width: 3em;
  cursor: pointer;
  user-select: none;
}

#dark-mode-switch .switch-outer {
  position: absolute;
  height: 100%;
  width: 100%;
  border-radius: 2em;
  transition: background-color 0.1s ease-out;
}

#dark-mode-switch.dark .switch-outer {
  background-color: var(--black);
}

#dark-mode-switch.light .switch-outer {
  background-color: var(--black);
}

#dark-mode-switch .switch-inner {
  display: absolute;
  height: 90%;
  width: 95%;
  top: 50%;
  transform: translate(2.5%, 5%);
  border-radius: 2em;
  transition: background-color 0.1s ease-out;
}
#dark-mode-switch.light .switch-inner {
  background-color: var(--grey-5);
}
#dark-mode-switch.dark .switch-inner {
  background-color: var(--black);
}

#dark-mode-switch .knob {
  display: absolute;
  height: 75%;
  width: 37.5%;
  top: 50%;
  transform: translate(0%, -120%);
  border-radius: 10em;
  transition: all 0.15s ease-out;
}

#dark-mode-switch .knob.dark {
  background-color: var(--grey-5);
  margin: 6% auto auto 8%;
}

#dark-mode-switch .knob.light {
  background-color: var(--grey-4);
  margin: 6% auto auto 56%;
}

#dark-mode-switch .theme-icon {
  position: absolute !important;
  opacity: 100%;
  transition: opacity 0.1s ease-out;
  top: 18%;
  bottom: auto;
  font-size: 1em;
}

#dark-mode-switch .theme-icon.light {
  left: 11%;
  color: var(--disnake-yellow);
}

#dark-mode-switch .theme-icon.dark {
  right: 11%;
  top: 18%;
  color: var(--disnake-light-blue);
}

#dark-mode-switch.dark .theme-icon.light {
  opacity: 0%;
}

#dark-mode-switch.light .theme-icon.dark {
  opacity: 0%;
}