/* --NOPE */
:root {
    --theme-color: #6533ff;
    --theme-color-light: #d4c2ff;
    --theme-color-dark: #5201dd;

    --theme-color-secondary: #601bde;
    --theme-color-secondary-dark: #5201dd;
    --theme-color-secondary-light: #8642FA;

    --background-color: #fff;
    --background-light: #ffffff;

    --text-color-base: #363636;
    --text-color-secondary: #646473;
    --text-color-active: #6533ff;
    --text-color-header: #2c3e50;

    --border-color: #ccccccbb;

    --menu-weight: 400;

    --shadow-color: rgb(165, 165, 165);

    --sidebar-nav-pagelink-background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='11.2' viewBox='0 0 7 11.2'%3E%3Cpath d='M1.5 1.5l4 4.1 -4 4.1' stroke-width='1.5' stroke='rgb%2812, 13, 14%29' fill='none' stroke-linecap='square' stroke-linejoin='miter' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E");
    --sidebar-nav-pagelink-background-image-active: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11.2' height='7' viewBox='0 0 11.2 7'%3E%3Cpath d='M1.5 1.5l4.1 4 4.1-4' stroke-width='1.5' stroke='rgb%28246, 66, 66%29' fill='none' stroke-linecap='square' stroke-linejoin='miter' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E");

    --color-1: #5201DD;
    --color-2: #493FED;
    --color-3: #4270F9;
    --color-4: #8642FA;
    --brightness: brightness(1);
}

.is-dark {
    display: none;
}

@media (prefers-color-scheme: dark) {
    :root {
        --theme-color: #d4c2ff;
        --theme-color-light: #6533ff;
        /*--theme-color-dark: #d2c4ff;*/
        --theme-color-dark: #4270F9;

        --theme-color-secondary: #fcf9f9;
        --theme-color-secondary-dark: #f7f5f5;
        --theme-color-secondary-light: #d2c4ff;

        --background-color: #343541;
        --background-light: #484854;

        --text-color-base: #f3f2f2;
        --text-color-secondary: #d2c4ff;
        --text-color-active: #6533ff;
        --text-color-header: #fff;

        --border-color: #5e2ef6;

        --menu-weight: 400;

        --shadow-color: var(--background-color);
        --brightness: brightness(1.25);
    }


    .is-light {
        display: none !important;
    }

    .is-dark {
        display: initial;
    }
}

::selection {
    background: var(--theme-color-light);
}


body {
    color: var(--text-color-base);
    background-color: var(--background-color);
}


a {
    transition: all 0.3s linear;
}

.chart-container {
    padding: 1em 0;
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.captioned-figure {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.home-logo {
    margin-left: 20px;
}

aside.sidebar {
    border: none;
    background-color: var(--background-light);
    color: var(--text-color-base);
    width: 20%;
    border-right: 1px solid var(--border-color);
}

body.close .sidebar {
    transform: translateX(-100%);
}

.sidebar-version-select {
    font-size: 1rem;
}

.sidebar nav ul {
    margin-right: 6px;
    margin-left: 6px;
}

nav ul li a {
    background-color: var(--background-color);
    border-radius: 12px;
    padding: 7px;
    border: 1px solid !important;
    text-align: center;
}

.sidebar ul li a {
    color: var(--text-color-secondary);
    font-size: 1rem;
    font-weight: var(--menu-weight);
}

.sidebar ul li.active>a {
    border-width: 0.1rem;
}

.sidebar ul li a:hover {
    text-decoration: none;
    color: var(--theme-color-dark);
}

.sidebar .sidebar-nav ul li.active>a {
    color: var(--text-color-active);
    border-right: 0.2rem solid var(--theme-color-secondary-light);
}


/*.sidebar > h1 {*/
/*    font-size: 2rem;*/
/*}*/

.sidebar-logo {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0 15px;
    justify-content: center
}

.sidebar-logo-title {
    margin-left: 10px;
}

/* search plugin related */

.sidebar {
    display: flex;
    flex-direction: column;
}

.sidebar > h1 {
    order: 1;
    margin-top: 1.5rem;
}

.sidebar .search {
    order: 2;
    border: none;
    border-top: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
    margin: 20px 0;
    padding: 6px;
}

.sidebar .sidebar-nav {
    order: 3;
}

.sidebar .search .input-wrap {
    border: none;
    position: relative;
}


.sidebar .search .input-wrap input {
    border-radius: 16px;
    background: var(--background-color);
    color: var(--text-color-base);
}

.sidebar .search .clear-button.show {
    display: block;
    position: absolute;
    right: 4px;
    top: 8px;
}

body .sidebar-toggle {
    background: none;
    bottom: 1rem;
    left: 1rem;
    cursor: pointer;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
}

body .sidebar-toggle span {
    transition: all 0.3s linear;
    background-color: var(--text-color-active);
    height: 0.25rem;
    width: 1.5rem;
    position: absolute;
    left: 0;
    margin: 0;
    transform-origin: 0;
}

body.close .sidebar-toggle {
    width: 1.5rem;
    height: 1.5rem;
}

body.close .sidebar-toggle span {
    transform-origin: center;
    background-color: var(--theme-color-secondary);
}

body .sidebar-toggle span:nth-child(1) { top:0; }
body .sidebar-toggle span:nth-child(2) { top:0.65rem; }
body .sidebar-toggle span:nth-child(3) { top:1.25rem; }

.sidebar-toggle .sidebar-toggle-button:hover { opacity: 1; }

.sidebar-toggle:hover span:nth-child(1) { transform: rotate(45deg); width: 1.75rem; }
.sidebar-toggle:hover span:nth-child(2) { opacity: 0; }
.sidebar-toggle:hover span:nth-child(3) { transform: rotate(-45deg); width: 1.75rem; }

.close .sidebar-toggle:hover span:nth-child(1) { transform:rotate(0); width:1.5rem; top:0.65rem; }
.close .sidebar-toggle:hover span:nth-child(2) { opacity: 1; transform:rotate(90deg); }
.close .sidebar-toggle:hover span:nth-child(3) { transform:rotate(0); width:1.5rem; top:0.65rem; }

th {
    text-align: left;
}

.markdown-section blockquote {
    /*margin: 1em 0;*/
    padding-top: 6px;
    padding-bottom: 6px;
    border-radius: 0 16px 16px 0;
}

.markdown-section em,
.markdown-section blockquote {
    color: var(--text-color-secondary);
    background-color: var(--background-light);
}

.anchor {
    position: relative;
}

.anchor span {
    color: var(--text-color-header);
}

section.cover .cover-main {
    margin: 20vh 20vw;
}

.app-name-link {
    white-space: nowrap;
}

.app-sub-sidebar li:before {
    display: none;
}

.markdown-section p {
    margin-top: 0;
    margin-bottom: 0;
}

.markdown-section ul {
    margin-top: 0;
}

/*.markdown-section li {*/
/*    margin-bottom: 1rem;*/
/*}*/

.markdown-section li pre {
    padding: 1rem;
}

.markdown-section p + p {
    margin-top: 1rem;
}

.markdown-section code, .markdown-section pre {
    background-color: var(--theme-color-light);
    color: var(--text-color-active);
}

.markdown-section pre > code {
    background-color: var(--theme-color-light);
    color: var(--text-color-base);
    font-size: 1em;
    line-height: 1.5;
}

/*.markdown-section code {*/
/*    display: inline-block;*/
/*    margin: 4px 2px 4px 2px;*/
/*}*/

.markdown-section del code {
    text-decoration: line-through;
}

.markdown-section p.tip code {
    color: var(--text-color-active);
}

.markdown-section pre {
    padding: 2rem;
}

.markdown-section pre > code {
    padding: 0;
}

.markdown-section hr {
    border-bottom: 1px solid var(--text-color-base);
}


.markdown-section {
    max-width: 75rem;
    padding: 1rem 3rem;
}

/*.markdown-section ol, .markdown-section p, .markdown-section ul {*/
/*    line-height: inherit;*/
/*}*/

.markdown-section code {
    color: var(--theme-color-secondary-dark);
}

.markdown-section table {
    display: table;
}

.markdown-section table tr {
    border-width: 0.2rem 0;
    border-style: solid;
    border-color: var(--border-color);
}

.markdown-section table tr:nth-child(2n) {
    background-color: transparent;
}

.markdown-section p.tip, .markdown-section tr:nth-child(2n) {
    background-color: var(--background-light);
}

.markdown-section table td,
.markdown-section table th {
    border: none;
    padding: 1.5rem 0.5rem;
    text-align: left;
}

.markdown-section table td p {
    margin: 0;
}

.markdown-section a {
    color: var(--theme-color);
}

.markdown-section a:hover {
    border-color: var(--theme-color-light);
    color: var(--theme-color-dark);
}

.markdown-section h1, .markdown-section h2, .markdown-section h3, .markdown-section h4, .markdown-section strong {
    color: var(--text-color-header);
}

/* Badges */
.markdown-section > p:first-child > a {
    border: none;
}

.sidebar::-webkit-scrollbar {
    width:0;
}

.docsify-pagination-container {
    justify-content: center !important;
}

.pagination-item {
    max-width: 40%;
}

.pagination-item--next {
    margin-left: 1em !important;
}

.pagination-item--previous {
    margin-right: 1em;
}

@media (max-width: 768px) {

    .home-logo {
        display: none;
    }

    aside.sidebar {
        width: 300px;
    }

    body.close .sidebar {
        transform: translateX(300px);
    }

    body .sidebar-toggle span {
        background-color: var(--theme-color-secondary);
    }


    body.close .sidebar-toggle span {
        background-color: var(--text-color-active);
    }

    .sidebar-toggle:hover span:nth-child(1), .sidebar-toggle:hover span:nth-child(2), .sidebar-toggle:hover span:nth-child(3) {
        transform: none;
        width:  1.5rem;
        opacity: 1;
    }

    .close .sidebar-toggle span:nth-child(1), .close .sidebar-toggle:hover span:nth-child(1) {
        transform: rotate(45deg);
        width: 1.75rem;
        top: 0.65rem;
    }

    .close .sidebar-toggle span:nth-child(2), .close .sidebar-toggle:hover span:nth-child(2) {
        opacity: 0;
    }

    .close .sidebar-toggle span:nth-child(3), .close .sidebar-toggle:hover span:nth-child(3) {
        transform: rotate(-45deg);
        width: 1.75rem;
        top: 0.65rem;
    }

    body.close .sidebar-toggle {
        background: none;
    }

    .markdown-section pre, .markdown-section pre > code {
        font-size: 0.8em;
    }


}

@media (min-width: 1200px) {
    body {
      /*font-size: 112.5%;*/
      font-size: 100%;
    }
    .sidebar .search .input-wrap input {
        border-radius: 18px;
    }
}

@media (min-width: 1400px) {
    body {
      /*font-size: 125%;*/
      font-size: 112.5%;
    }
    .sidebar .search .input-wrap input {
        border-radius: 20px;
    }
}

.pro-badge {
    height: 1em;
    vertical-align: middle;
}


.mermaid {
    display: flex;
    justify-content: center;
    margin-bottom: 16px;
}

.mermaid > svg .messageText {
    stroke: none !important;
}

.mermaid > svg .messageText {
    font-family: 'Fira Code', monospace !important;
}

@media (prefers-color-scheme: dark) {
    .mermaid > svg .sequenceNumber {
        fill: #000 !important;
    }
}

.mermaid > svg .actor {
    font-family: 'Stem Text', Arial, serif !important;
    font-size: 18px !important;
}

.mermaid > svg .actor>tspan{
    fill: #fff !important;
}

.mermaid > svg .noteText {
    font-family: 'Stem Text', Arial, serif !important;
    font-size: 12px !important;
}

h1:has(+.pro-badge-header):after,
h2:has(+.pro-badge-header):after,
h3:has(+.pro-badge-header):after,
h4:has(+.pro-badge-header):after {
    content: "";
    display: inline-block;
    vertical-align: bottom;
    width: 64px;
    height: 27px;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='27' viewBox='0 0 64 27'%3E%3Csvg fill='none' fill-rule='evenodd' x='5'%3E%3Crect width='53' height='26' x='.5' y='.5' stroke='%23ff5e5e' rx='13'/%3E%3Cpath fill='%23ff5e5e' fill-rule='nonzero' d='M15.15 15.243V19h-2.198V8.336h4.16c.801 0 1.505.146 2.113.44.608.292 1.076.709 1.403 1.248.327.54.49 1.154.49 1.842 0 1.045-.357 1.87-1.072 2.472-.716.603-1.706.905-2.97.905h-1.927zm0-1.78h1.962c.581 0 1.024-.137 1.33-.41.305-.274.457-.664.457-1.172 0-.523-.153-.945-.461-1.267-.308-.322-.732-.489-1.274-.498h-2.015v3.347zm11.425 1.633h-1.75V19h-2.198V8.336h3.963c1.26 0 2.231.28 2.915.842.683.562 1.025 1.355 1.025 2.38 0 .728-.157 1.335-.472 1.82-.315.487-.792.873-1.432 1.162l2.307 4.357V19h-2.358l-2-3.904zm-1.75-1.78h1.772c.552 0 .98-.14 1.282-.42.303-.281.454-.668.454-1.162 0-.503-.143-.898-.428-1.186-.286-.288-.724-.432-1.315-.432h-1.765v3.2zm16.135.594c0 1.05-.186 1.97-.557 2.76-.37.792-.902 1.402-1.593 1.832-.69.43-1.483.644-2.376.644-.884 0-1.673-.212-2.366-.637-.693-.425-1.23-1.031-1.611-1.82-.381-.788-.574-1.695-.58-2.72v-.528c0-1.05.19-1.974.569-2.772.378-.799.913-1.411 1.604-1.839.69-.427 1.48-.64 2.369-.64.889 0 1.678.213 2.37.64.69.428 1.225 1.04 1.603 1.839.379.798.568 1.72.568 2.765v.476zm-2.227-.484c0-1.118-.2-1.968-.6-2.549-.4-.58-.972-.871-1.714-.871-.737 0-1.306.287-1.707.86-.4.574-.603 1.415-.608 2.524v.52c0 1.089.2 1.933.601 2.534.4.6.977.9 1.729.9.737 0 1.303-.289 1.699-.867.395-.579.596-1.422.6-2.53v-.52z'/%3E%3C/svg%3E%3C/svg%3E%0A");
}

h1:has(+.pro-badge-header):after {
    height: 30px;
}

h4:has(+.pro-badge-header):after {
    width: 64px;
    height: 27px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='23' viewBox='0 0 64 27'%3E%3Csvg fill='none' fill-rule='evenodd' x='5'%3E%3Crect width='53' height='26' x='.5' y='.5' stroke='%23ff5e5e' rx='13'/%3E%3Cpath fill='%23ff5e5e' fill-rule='nonzero' d='M15.15 15.243V19h-2.198V8.336h4.16c.801 0 1.505.146 2.113.44.608.292 1.076.709 1.403 1.248.327.54.49 1.154.49 1.842 0 1.045-.357 1.87-1.072 2.472-.716.603-1.706.905-2.97.905h-1.927zm0-1.78h1.962c.581 0 1.024-.137 1.33-.41.305-.274.457-.664.457-1.172 0-.523-.153-.945-.461-1.267-.308-.322-.732-.489-1.274-.498h-2.015v3.347zm11.425 1.633h-1.75V19h-2.198V8.336h3.963c1.26 0 2.231.28 2.915.842.683.562 1.025 1.355 1.025 2.38 0 .728-.157 1.335-.472 1.82-.315.487-.792.873-1.432 1.162l2.307 4.357V19h-2.358l-2-3.904zm-1.75-1.78h1.772c.552 0 .98-.14 1.282-.42.303-.281.454-.668.454-1.162 0-.503-.143-.898-.428-1.186-.286-.288-.724-.432-1.315-.432h-1.765v3.2zm16.135.594c0 1.05-.186 1.97-.557 2.76-.37.792-.902 1.402-1.593 1.832-.69.43-1.483.644-2.376.644-.884 0-1.673-.212-2.366-.637-.693-.425-1.23-1.031-1.611-1.82-.381-.788-.574-1.695-.58-2.72v-.528c0-1.05.19-1.974.569-2.772.378-.799.913-1.411 1.604-1.839.69-.427 1.48-.64 2.369-.64.889 0 1.678.213 2.37.64.69.428 1.225 1.04 1.603 1.839.379.798.568 1.72.568 2.765v.476zm-2.227-.484c0-1.118-.2-1.968-.6-2.549-.4-.58-.972-.871-1.714-.871-.737 0-1.306.287-1.707.86-.4.574-.603 1.415-.608 2.524v.52c0 1.089.2 1.933.601 2.534.4.6.977.9 1.729.9.737 0 1.303-.289 1.699-.867.395-.579.596-1.422.6-2.53v-.52z'/%3E%3C/svg%3E%3C/svg%3E%0A");
}

/* Collapsible styling */
.sidebar .folder>p {
    cursor: pointer;
    padding-left: 14px;
    background-image: var(--sidebar-nav-pagelink-background-image);
    background-position: left center;
    background-repeat: no-repeat;
    user-select: none;
}

.sidebar .folder.open>p {
    background-image: var(--sidebar-nav-pagelink-background-image-active);
    background-position: left center;
}

.sidebar li>p {
    font-weight: normal;
}

.sidebar li.open>p {
     color: var(--theme-color-dark);
    font-weight: 600;
}

/*IN INDEX STYLE*/
figure.thumbnails img {
    margin: 0.75em 0;
    border-radius: 3px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1), 0 4px 12px rgba(0,0,0,0.15);
}

@media (min-width: 30em) {
    figure.thumbnails:after {
        content: "";
        display: table;
        clear: both;
    }

    figure.thumbnails img {
        float: left;
        width: calc(50% - 0.75em);
    }

    figure.thumbnails img:nth-child(even) {
        margin-left: 1.5em;
    }

    @supports (display: flex) {
        figure.thumbnails {
            display: flex;
            align-items: center;
        }

        figure.thumbnails img {
            flex-grow: 1;
            width: 0;
        }

        figure.thumbnails img + img {
            margin: 0 0 0 1.5em;
        }
    }
}

.cover-main img {
    padding-left: 40px;
    padding-right: 40px;
}

.app-name img {
    width: 75%;
    filter: var(--brightness);
}

section.cover .cover-main>p:last-child a:last-child:hover {
    color: #fff;
}