/*

Sphinx-Gallery has compatible CSS to fix default sphinx themes

Tested for Sphinx 1.3.1 for all themes: default, alabaster, sphinxdoc,

scrolls, agogo, traditional, nature, haiku, pyramid

Tested for Read the Docs theme 0.1.7 */

/* Define light colors */

:root, html[data-theme="light"], body[data-theme="light"]{

--sg-tooltip-foreground: black;

--sg-tooltip-background: rgba(250, 250, 250, 0.9);

--sg-tooltip-border: #ccc transparent;

--sg-thumb-box-shadow-color: #6c757d40;

--sg-thumb-hover-border: #0069d9;

--sg-script-out: #888;

--sg-script-pre: #fafae2;

--sg-pytb-foreground: #000;

--sg-pytb-background: #ffe4e4;

--sg-pytb-border-color: #f66;

--sg-download-a-background-color: #ffc;

--sg-download-a-background-image: linear-gradient(to bottom, #ffc, #d5d57e);

--sg-download-a-border-color: 1px solid #c2c22d;

--sg-download-a-color: #000;

--sg-download-a-hover-background-color: #d5d57e;

--sg-download-a-hover-box-shadow-1: rgba(255, 255, 255, 0.1);

--sg-download-a-hover-box-shadow-2: rgba(0, 0, 0, 0.25);

}

@media(prefers-color-scheme: light) {

:root[data-theme="auto"], html[data-theme="auto"], body[data-theme="auto"] {

--sg-tooltip-foreground: black;

--sg-tooltip-background: rgba(250, 250, 250, 0.9);

--sg-tooltip-border: #ccc transparent;

--sg-thumb-box-shadow-color: #6c757d40;

--sg-thumb-hover-border: #0069d9;

--sg-script-out: #888;

--sg-script-pre: #fafae2;

--sg-pytb-foreground: #000;

--sg-pytb-background: #ffe4e4;

--sg-pytb-border-color: #f66;

--sg-download-a-background-color: #ffc;

--sg-download-a-background-image: linear-gradient(to bottom, #ffc, #d5d57e);

--sg-download-a-border-color: 1px solid #c2c22d;

--sg-download-a-color: #000;

--sg-download-a-hover-background-color: #d5d57e;

--sg-download-a-hover-box-shadow-1: rgba(255, 255, 255, 0.1);

--sg-download-a-hover-box-shadow-2: rgba(0, 0, 0, 0.25);

}

}

html[data-theme="dark"], body[data-theme="dark"] {

--sg-tooltip-foreground: white;

--sg-tooltip-background: rgba(10, 10, 10, 0.9);

--sg-tooltip-border: #333 transparent;

--sg-thumb-box-shadow-color: #79848d40;

--sg-thumb-hover-border: #003975;

--sg-script-out: rgb(179, 179, 179);

--sg-script-pre: #2e2e22;

--sg-pytb-foreground: #fff;

--sg-pytb-background: #1b1717;

--sg-pytb-border-color: #622;

--sg-download-a-background-color: #443;

--sg-download-a-background-image: linear-gradient(to bottom, #443, #221);

--sg-download-a-border-color: 1px solid #3a3a0d;

--sg-download-a-color: #fff;

--sg-download-a-hover-background-color: #616135;

--sg-download-a-hover-box-shadow-1: rgba(0, 0, 0, 0.1);

--sg-download-a-hover-box-shadow-2: rgba(255, 255, 255, 0.25);

}

@media(prefers-color-scheme: dark){

html[data-theme="auto"], body[data-theme="auto"] {

--sg-tooltip-foreground: white;

--sg-tooltip-background: rgba(10, 10, 10, 0.9);

--sg-tooltip-border: #333 transparent;

--sg-thumb-box-shadow-color: #79848d40;

--sg-thumb-hover-border: #003975;

--sg-script-out: rgb(179, 179, 179);

--sg-script-pre: #2e2e22;

--sg-pytb-foreground: #fff;

--sg-pytb-background: #1b1717;

--sg-pytb-border-color: #622;

--sg-download-a-background-color: #443;

--sg-download-a-background-image: linear-gradient(to bottom, #443, #221);

--sg-download-a-border-color: 1px solid #3a3a0d;

--sg-download-a-color: #fff;

--sg-download-a-hover-background-color: #616135;

--sg-download-a-hover-box-shadow-1: rgba(0, 0, 0, 0.1);

--sg-download-a-hover-box-shadow-2: rgba(255, 255, 255, 0.25);

}

}

.sphx-glr-thumbnails {

width: 100%;

margin: 0px 0px 20px 0px;

/* align thumbnails on a grid */

justify-content: space-between;

display: grid;

/* each grid column should be at least 160px (this will determine

the actual number of columns) and then take as much of the

remaining width as possible */

grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));

gap: 15px;

}

.sphx-glr-thumbnails .toctree-wrapper {

/* hide empty toctree divs added to the DOM

by sphinx even though the toctree is hidden

(they would fill grid places with empty divs) */

display: none;

}

.sphx-glr-thumbcontainer {

background: transparent;

-moz-border-radius: 5px;

-webkit-border-radius: 5px;

border-radius: 5px;

box-shadow: 0 0 10px var(--sg-thumb-box-shadow-color);

/* useful to absolutely position link in div */

position: relative;

/* thumbnail width should include padding and borders

and take all available space */

box-sizing: border-box;

width: 100%;

padding: 10px;

border: 1px solid transparent;

/* align content in thumbnail */

display: flex;

flex-direction: column;

align-items: center;

gap: 7px;

}

.sphx-glr-thumbcontainer p {

position: absolute;

top: 0;

left: 0;

}

.sphx-glr-thumbcontainer p,

.sphx-glr-thumbcontainer p a {

/* link should cover the whole thumbnail div */

width: 100%;

height: 100%;

}

.sphx-glr-thumbcontainer p a span {

/* text within link should be masked

(we are just interested in the href) */

display: none;

}

.sphx-glr-thumbcontainer:hover {

border: 1px solid;

border-color: var(--sg-thumb-hover-border);

cursor: pointer;

}

.sphx-glr-thumbcontainer a.internal {

bottom: 0;

display: block;

left: 0;

box-sizing: border-box;

padding: 150px 10px 0;

position: absolute;

right: 0;

top: 0;

}

/* Next one is to avoid Sphinx traditional theme to cover all the

thumbnail with its default link Background color */

.sphx-glr-thumbcontainer a.internal:hover {

background-color: transparent;

}

.sphx-glr-thumbcontainer p {

margin: 0 0 0.1em 0;

}

.sphx-glr-thumbcontainer .figure {

margin: 10px;

width: 160px;

}

.sphx-glr-thumbcontainer img {

display: inline;

max-height: 112px;

max-width: 160px;

}

.sphx-glr-thumbcontainer[tooltip]::before {

content: "";

position: absolute;

pointer-events: none;

top: 0;

left: 0;

width: 100%;

height: 100%;

z-index: 97;

background-color: var(--sg-tooltip-background);

backdrop-filter: blur(3px);

opacity: 0;

transition: opacity 0.3s;

}

.sphx-glr-thumbcontainer[tooltip]:hover::before {

opacity: 1;

}

.sphx-glr-thumbcontainer[tooltip]:hover::after {

-webkit-border-radius: 4px;

-moz-border-radius: 4px;

border-radius: 4px;

color: var(--sg-tooltip-foreground);

content: attr(tooltip);

padding: 10px 10px 5px;

z-index: 98;

width: 100%;

max-height: 100%;

position: absolute;

pointer-events: none;

top: 0;

box-sizing: border-box;

overflow: hidden;

display: -webkit-box;

-webkit-box-orient: vertical;

-webkit-line-clamp: 6;

}

.sphx-glr-script-out {

color: var(--sg-script-out);

display: flex;

gap: 0.5em;

}

.sphx-glr-script-out::before {

content: "Out:";

/* These numbers come from the pre style in the pydata sphinx theme. This

* turns out to match perfectly on the rtd theme, but be a bit too low for

* the pydata sphinx theme. As I could not find a dimension to use that was

* scaled the same way, I just picked one option that worked pretty close for

* both. */

line-height: 1.4;

padding-top: 10px;

}

.sphx-glr-script-out .highlight {

background-color: transparent;

/* These options make the div expand... */

flex-grow: 1;

/* ... but also keep it from overflowing its flex container. */

overflow: auto;

}

.sphx-glr-script-out .highlight pre {

background-color: var(--sg-script-pre);

border: 0;

max-height: 30em;

overflow: auto;

padding-left: 1ex;

/* This margin is necessary in the pydata sphinx theme because pre has a box

* shadow which would be clipped by the overflow:auto in the parent div

* above. */

margin: 2px;

word-break: break-word;

}

.sphx-glr-script-out + p {

margin-top: 1.8em;

}

blockquote.sphx-glr-script-out {

margin-left: 0pt;

}

.sphx-glr-script-out.highlight-pytb .highlight pre {

color: var(--sg-pytb-foreground);

background-color: var(--sg-pytb-background);

border: 1px solid var(--sg-pytb-border-color);

margin-top: 10px;

padding: 7px;

}

div.sphx-glr-footer {

text-align: center;

}

div.sphx-glr-download {

margin: 1em auto;

vertical-align: middle;

}

div.sphx-glr-download a {

background-color: var(--sg-download-a-background-color);

background-image: var(--sg-download-a-background-image);

border-radius: 4px;

border: 1px solid var(--sg-download-a-border-color);

color: var(--sg-download-a-color);

display: inline-block;

font-weight: bold;

padding: 1ex;

text-align: center;

}

div.sphx-glr-download code.download {

display: inline-block;

white-space: normal;

word-break: normal;

overflow-wrap: break-word;

/* border and background are given by the enclosing 'a' */

border: none;

background: none;

}

div.sphx-glr-download a:hover {

box-shadow: inset 0 1px 0 var(--sg-download-a-hover-box-shadow-1), 0 1px 5px var(--sg-download-a-hover-box-shadow-2);

text-decoration: none;

background-image: none;

background-color: var(--sg-download-a-hover-background-color);

}

div.sphx-glr-sidebar-item img {

max-height: 20px;

}

.sphx-glr-example-title:target::before {

display: block;

content: "";

margin-top: -50px;

height: 50px;

visibility: hidden;

}

ul.sphx-glr-horizontal {

list-style: none;

padding: 0;

}

ul.sphx-glr-horizontal li {

display: inline;

}

ul.sphx-glr-horizontal img {

height: auto !important;

}

.sphx-glr-single-img {

margin: auto;

display: block;

max-width: 100%;

}

.sphx-glr-multi-img {

max-width: 42%;

height: auto;

}

div.sphx-glr-animation {

margin: auto;

display: block;

max-width: 100%;

}

div.sphx-glr-animation .animation {

display: block;

}

p.sphx-glr-signature a.reference.external {

-moz-border-radius: 5px;

-webkit-border-radius: 5px;

border-radius: 5px;

padding: 3px;

font-size: 75%;

text-align: right;

margin-left: auto;

display: table;

}

.sphx-glr-clear {

clear: both;

}

a.sphx-glr-backref-instance {

text-decoration: none;

}

.sphx-glr-tag-list {

display: flex;

flex-wrap: wrap;

gap: 5px;

padding-bottom: 2em;

}

.sphx-glr-tag {

padding: 5px 10px;

background-color: var(--sg-tooltip-background);

border-color: transparent;

border-style: solid;

border-width: 2px;

border-radius: 3px;

cursor: pointer;

}

.sphx-glr-tag:hover {

border-style: solid;

border-color: var(--sg-thumb-hover-border);

}

.sphx-glr-tag.active {

border-style: solid;

border-color: var(--sg-thumb-hover-border);

}

.sphx-glr-tag-label {

padding: 5px 10px 5px 0px;

border-color: transparent;

border-style: solid;

border-width: 2px;

border-radius: 3px;

}

#sphx-glr-tag-clear {

cursor: pointer;

}