#content .section {
    margin-bottom: 0;
    &:hover {
        .headerlink {
            opacity: 1;
        }
    }
}

#content {
     // FIXME: sphinx should provide a citation-reference?
    & a:focus {
        // remove outline because padding mess it up
        outline: none;
    }
}


/* Use # as symbol for anchor headerlinks */
h1, h2, h3, h4, h5, h6 {
    &:hover a.headerlink, &:hover a:visited.headerlink {
        &::after {
            visibility: visible;
            content: "#";
        }
    }
}

a.headerlink, a:visited.headerlink {
    font-size: 0.85em;
    visibility: hidden;
    &:hover {
        text-decoration: none;
    }
}

ul.page-nav {
    list-style: none;
    & li {
        display: inline-block;
    }
}

.action-bar {
    display: flex;
    & ul.page-nav {
        flex-grow: 1;
        list-style: none;
        list-style-position: inside;
        text-align: right;
        margin-right: 2em;
        & li + li:before {
            content: "|";
            padding: 0 1em;
        }
    }
}

ul.breadcrumbs {
    list-style: none;
    & li {
        display: inline-block;
    }
}



/** index page **/
.toctree-wrapper .caption {
    // same as h2
    font-weight: 600;
    line-height: 1.25em;
    font-size: 1.65rem;
    padding-bottom: .3rem;
    border-bottom: 0.1em solid var(--BClr);
}



/** footer **/
.footer {
    clear: both;
    min-height: 2rem;
    padding-top: 1rem;
    color: var(--FoTClr);
    font-size: small;
    line-height: 1.5rem;
}


/** pygments style **/
#content .highlight {
    border-radius: 0.5em;
}

// force background color from pygments
#content .highlight pre {
    background-color: inherit;
}

#content .highlighted {
    background-color: var(--AClr); //#fbe54e;
    font-weight: bold;
    padding: 0 4px;
}

/*** admonitions based on custom-blocks.styl */
.admonition {
    padding: .1rem 1.5rem;
    border-left-width: .5rem;
    border-left-style: solid;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    height: min-content;
    margin: 1rem 0;
    // default color
    background-color: var(--AaBgClr);
    border-color: var(--AaBClr);
    color: var(--AaTClr);
    a, a:visited {
        color: var(--AaLClr);
        &:hover {
            color: var(--AaLHClr);
        }
    }

    .admonition-title {
        font-weight: 600;
        margin-bottom: -0.4rem;
    }
    &.success {
        background-color: var(--AsBgClr);
        border-color: var(--AsBClr);
        color: var(--AsTClr);
        a, a:visited {
            color: var(--AsLClr);
            &:hover {
                color: var(--AsLHClr);
            }
        }
    }
    &.hint {
        background-color: var(--AhBgClr);
        border-color: var(--AhBClr);
        color: var(--AhTClr);
        a, a:visited {
            color: var(--AhLClr);
            &:hover {
                color: var(--AhLHClr);
            }
        }
    }
    &.tip {
        background-color: var(--AtBgClr);
        border-color: var(--AtBClr);
        color: var(--AtTClr);
        a, a:visited {
            color: var(--AtLClr);
            &:hover {
                color: var(--AtLHClr);
            }
        }
    }
    &.important {
        background-color: var(--AiBgClr);
        border-color: var(--AiBClr);
        color: var(--AiTClr);
        a, a:visited {
            color: var(--AiLClr);
            &:hover {
                color: var(--AiLHClr);
            }
        }
    }
    &.note {
        background-color: var(--AnBgClr);
        border-color: var(--AnBClr);
        color: var(--AnTClr);
        a, a:visited {
            color: var(--AnLClr);
            &:hover {
                color: var(--AnLHClr);
            }
        }
    }
    &.warning {
        background-color: var(--AwBgClr);
        border-color: var(--AwBClr);
        color: var(--AwTClr);
        a, a:visited {
            color: var(--AwLClr);
            &:hover {
                color: var(--AwLHClr);
            }
        }
    }
    &.danger {
        background-color: var(--AdBgClr);
        border-color: var(--AdBClr);
        color: var(--AdTClr);
        a, a:visited {
            color: var(--AdLClr);
            &:hover {
                color: var(--AdLHClr);
            }
        }
    }
    &.caution {
        background-color: var(--AcBgClr);
        border-color: var(--AcBClr);
        color: var(--AcTClr);
        a, a:visited {
            color: var(--AcLClr);
            &:hover {
                color: var(--AcLHClr);
            }
        }
    }
    &.danger {
        background-color: var(--AdBgClr);
        border-color: var(--AdBClr);
        color: var(--AdTClr);
        a, a:visited {
            color: var(--AdLClr);
            &:hover {
                color: var(--AdLHClr);
            }
        }
    }
}

blockquote {
    background-color: var(--BqBgClr);
    border-color: var(--BqBClr);
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    margin-left: -0.4rem;
    color: var(--BqTClr);
    a, a:visited {
        color: var(--BqLClr);
        &:hover {
            color: var(--BqLHClr);
        }
    }
}
