/*
By default, the Material theme only defines:

.md-typeset img[align]:only-child {
    margin-top: 0;
}

But we want the paragraph beside an image to be always top-aligned
*/

img.icon {
    width: 1.3em;
    height: 1.3em;
    object-fit: contain;
    object-position: center;
    vertical-align: middle;
}

.md-typeset img[align] {
    margin-top: 0;
}

/* To properly center images in figure even when the caption is wider than the image */
.md-typeset figure img {
    display: block;
    margin: 0 auto;
}

/* To place admonitions below <img align="left"> so that they are always full-width */
/* .md-typeset .admonition {
    clear: both;
} */

/* To fit more grid columns in a single row. Default is `min(100%, 16rem)` */
.md-typeset .grid.dense {
    grid-template-columns: repeat(auto-fit,minmax(min(100%,1rem),1fr));
}

/* To place headers below <img align="left"> so that they are always full-width */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4 {
    clear: both;
}

/* .md-banner--warning is used for a warning about an outdated version of the documentation. */
.md-banner:not(.md-banner--warning) .md-banner__inner {
    margin: 0 auto; /* To make the announcement banner at the top smaller */
}
.md-banner:not(.md-banner--warning) .md-banner__inner a {
    color: var(--md-primary-bg-color);
}
.md-banner:not(.md-banner--warning) .md-banner__inner a:hover {
    color: var(--md-accent-fg-color);
}
.md-banner:not(.md-banner--warning) .md-banner__inner .md-icon {
    width:0.8em;
    vertical-align: middle;
    display: inline-flex;
}

.md-typeset .no-bullets ul {
    list-style-type: none;
}
.md-typeset .no-bullets ul li {
    margin-left: 0;
}

.badge {
    vertical-align: text-bottom;
}
h1 .badge,
h2 .badge,
h3 .badge,
h4 .badge {
    vertical-align: middle;
}