/* Styling for the https://github.com/jbms/sphinx-immaterial theme */

/* doc config start */
body {
    --sn-color-need-bg: var(--md-default-bg-color);
    --sn-color-need-border: var(--md-typeset-table-color);
    --sn-color-need-row-border: var(--md-typeset-table-color);
    --sn-color-debug-btn-border: var(--md-typeset-color);
    --sn-color-datatable-label: var(--md-typeset-color);
    --sn-color-datatable-btn-border: var(--md-default-fg-color--light);
}
/* doc config end */

@import url('https://fonts.googleapis.com/css2?family=Recursive:wght@300;400&display=swap');

body,
input {
    font-family: 'Recursive', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400;
    line-height: 1.5 !important;
}

div.need_container {
    overflow-x: auto;
}

.md-typeset table.data:not(.plain) {
    display: table !important;
    width: 100% !important;
}

.md-typeset,
.md-nav,
.md-typeset table:not([class]),
.md-typeset table.data:not(.plain) {
    font-size: 16px !important;
    line-height: 1.5 !important;
}

table {
    border: 1px solid #e1e4e5 !important;
}

h1,
h2,
h3 {
    font-family: 'Recursive', sans-serif !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
}

h1:not([class="md-search-result__title"]) {
    font-size: 34px !important;
    margin-bottom: 20px !important;
}

h2 {
    font-size: 24px !important;
    margin-bottom: 10px !important;
}

h3 {
    font-size: 18px !important;
    margin-bottom: 10px !important;
}

.md-typeset :is(.admonition, details) {
    font-size: 14px;
}

[data-md-color-scheme=default] {
    --img-filter: none;
}

[data-md-color-scheme=slate] {
    --img-filter: brightness(0) invert(1);
    --sn-architecture-bg: url(../architecture_bg-dark.png);
}

svg.sn-flow-chart path.arrow {
    fill: var(--md-typeset-color);
}

img.needs-logo-big {
    filter: var(--img-filter);
}

tbody tr td {
    font-size: medium !important;
}

div.dataTables_info {
    margin-top: 0 !important;
}

table tbody tr:hover {
    background-color: rgb(147 147 147 / 10%) !important;
    box-shadow: 0 .05rem 0 var(--md-default-bg-color) inset !important;
}

button.dt-button:hover:not(.disabled),
div.dt-button:hover:not(.disabled),
a.dt-button:hover:not(.disabled) {
    color: #000;
}

.dataTables_wrapper .dataTables_filter {
    float: left !important;
    margin-left: 1% !important;
}

@media screen and (max-width: 640px) {
    .dataTables_wrapper .dataTables_filter {
        float: none !important;
        text-align: center !important;
    }

}

.border {
    border: 1px solid var(--md-typeset-color);
}

img[alt="card-img-top"] {
    padding: 1em;
}

div.needs-report-table {
    overflow-x: auto !important;
}

table.needs_style_red a,
table.needs_style_yellow a,
table.needs_style_blue a,
table.needs_style_green a {
    color: #040472;
    text-decoration: underline;
}

/*Remove READTHEDOCS version badge*/
.injected {
    display: none !important;
}

table.class_red_border {
    border: 3px solid red;
}

div.dt-button-collection button.dt-button.active:not(.disabled) {
    color: #000 !important;
    border: 1px solid #000 !important;
}

.md-typeset pre {
    overflow-x: auto;
}

.md-header__button.md-logo :is(img, png) {
    height: 2.2rem !important;
}

/* Image width fix in need-sidebars. */
tbody div.needs_side img.needs_image {
    max-width: 100px;
}

/* Immaterial's dropdowns conflict with the ones from sphinx-design 
so we have to make changes, to remove its overrides
*/
body {
    --sd-fontsize-dropdown-title: 14px;
    --sd-fontweight-dropdown-title: 600;
}
.md-typeset summary.sd-summary-title::after {
    display: none;
}
.md-typeset summary.sd-summary-title::before {
    display: none;
}
.md-typeset details.sd-dropdown {
    padding-right: 0;
}
.md-typeset summary.sd-summary-title {
    width: 100%;
    padding-right: 0.6em !important;  /* note, this line can be removed in sphinx-design v0.6.1 */
}

.needs-example {
    border: .05rem solid rgb(72,138,87);
    padding-left: .5rem;
    padding-right: .5rem;
    padding-bottom: .5rem;
}
