/* Documentation stylesheet
 * Copyright 2018-2025 by Altair Engineering Inc.
 * ------------------------------------------------------------------
 *
 * Fonts.
 *
 */
 /* regular version */
 @font-face {
     font-family: "NotoSans";
     font-weight: normal;
     font-style: normal;
     src: url(../doc/fonts/NotoSans-Regular.ttf) format('truetype');
 }
 
@font-face {
    font-family: "Montserrat";
    font-weight: normal;
    font-style: normal;
    src: url(../doc/fonts/Montserrat-Regular.ttf) format('truetype');
}

/* bold version */
@font-face {
    font-family: "NotoSans";
    src: url(../doc/fonts/NotoSans-Bold.ttf) format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: "Montserrat";
    src: url(../doc/fonts/Montserrat-Bold.ttf) format('truetype');
    font-weight: bold;
    font-style: normal;
}

/* italic version */
@font-face {
    font-family: "NotoSans";
    src: url(../doc/fonts/NotoSans-Italic.ttf) format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: "Montserrat";
    src: url(../doc/fonts/Montserrat-Italic.ttf) format('truetype');
    font-weight: normal;
    font-style: italic;
}

/* bold italic version */
@font-face {
    font-family: "NotoSans";
    src: url(../doc/fonts/NotoSans-BoldItalic.ttf) format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: "Montserrat";
    src: url(../doc/fonts/Montserrat-BoldItalic.ttf) format('truetype');
    font-weight: bold;
    font-style: italic;
}

:root {
    font-family: "NotoSans", Arial, sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: normal;
    line-height: 1.3;
}

html, body {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

html {
    border: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

body {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: start;
    align-items: stretch;
    margin: 0;
    padding: 20px 0 20px 20px; /* t r b l */
    overflow: hidden;
    row-gap: 25px;
    counter-reset: figures;
}

header {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 0;
    margin: 0;
}

div.title, div.title  > a {
    font-size: 32px;
    font-weight: bold;
    font-family: "Montserrat", Arial, sans-serif;
    color: #4D4D4D !important; 
    text-decoration: none !important;
    padding-bottom: 0.5rem;
}

header > nav, header > nav > a {
    color: #878787;
    text-decoration: none;
}

header > nav .current {
    font-weight: bold;
}

div.body {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    flex-grow: 1;
    justify-content: flex-start;
    align-items: stretch;
    column-gap: 50px;
    overflow: hidden;
}

/* ============= Table of Contents ============*/
nav.toc {
    display: block;
    border: 1px solid gray;
    border-radius: 3px;
    min-width: 300px;
    max-width: 300px;
    margin: 0;
    overflow: auto;
    color: #4d4d4d;
    line-height: 1.4em;
    padding: 14px 12px 20px 12px;
    flex-grow: 1;
}

nav.toc a {
    text-decoration: none;
    color: #4d4d4d;
}
nav.toc a:hover {
    text-decoration: underline;
    cursor: pointer;
}

@media screen and (width < 1200px) and (width >= 750px) {
    nav.toc {
        min-width: 25%;
        max-width: 25%;
    }
}

@media screen and (width < 750px) {
    nav.toc {
        display: none;
    }
}

nav.toc > ul {
    padding-left: 0;
    margin-left: 0;
    list-style-type: none;
}

nav.toc > ul > li {
    font-weight: bold;
}

nav.toc > ul > li > ul > li > ul {
    font-weight: normal;
}

main {
    display: block;
    overflow: hidden auto;
    height: 100%;
    flex-grow: 1;
    padding-right: max(20px, calc(100% - 1750px));
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 0;
}

footer {
    display: block;
    clear: both;
    text-align: center;
    border-top: 1px solid #A2A0AF;
    color: #4D4D4D;
    font-size: 0.75rem;
    margin-top: 2em;
    padding-top: 2em;
}

h1 {
    font-size: 32px;
    line-height: 1.1em;
    font-weight: bold;
    font-family: 'Montserrat', Arial, sans-serif;
    color: #4D4D4D;
    padding-top: 0;
    padding-bottom: 1rem;
    margin-top: 0;
}

div.abstract {
    border-top: 2px solid #4d4d4d;
    border-bottom: 2px solid #4d4d4d;
    padding-top: 6px;
    padding-bottom: 6px;
    margin-bottom: 2rem;
    text-align: justify;
}

h2 {
    font-size: 1.7rem;
    line-height: 1.1em;
    font-weight: bold;
    font-family: 'Montserrat', Arial, sans-serif;
    color: #4D4D4D;
    padding-top: 0;
}

h3 {
    font-size: 1.5rem;
    line-height: 1.1em;
    font-weight: bold;
    font-family: 'Montserrat', Arial, sans-serif;
    color: #4D4D4D;
}

em {
    font-style: normal;
    font-weight: bold;
}

div.header {
    margin: 0;
    padding: 0;
    border-spacing: 0;
    border: none;
    width: clamp(400px, 50%, 100vw);
}

header select {
    margin-bottom: 2em;
}

figure {
    border: 1px gray solid;
    padding: 5px;
}

figure.center {
    text-align: center;
    border: none;
}

figure > figcaption {
    font-style: italic;
    font-size: small;
    text-align: center;
    counter-increment: figures;
}

figure > figcaption::before {
    content: 'Figure ' counter(figures) ': ';
    font-weight: bold;
    font-style: normal;
}

dl > dt {
    margin-bottom: 0.5rem;
}
dl > dd:not(:last-child) {
    margin-bottom: 0.75rem;
}

a[href] {
    color: #005776;
    text-decoration: underline;
}

a.external::after {
    /*
     * We must use "base64" encoding instead of "charset=UTF-8" due to IE11.
     * Use base64 [-d] -w 0 .. to convert back and forth.
     */
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii0xMCAtMTUgODAgODAiPjxnIHN0cm9rZT0iZ3JheSIgc3Ryb2tlLXdpZHRoPSI2IiBzdHJva2UtbGluZWNhcD0icm91bmQiPjxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0zNCw4SDljMCwwIC0xLjMsMCAtMi42LDEuMyAtMS4zLDEuMyAtMS4zLDIuNiAtMS4zLDIuNnY0MmMwLDAgMCwxLjMgMS4zLDIuNiAxLjMsMS4zIDIuNiwxLjMgMi42LDEuM0g1MWMwLDAgMS4zLDAgMi42LC0xLjMgMS4zLC0xLjMgMS4zLC0yLjYgMS4zLC0yLjZWMjkiLz48cGF0aCBkPSJNMjIsNDAgNTgsNyIvPjxwYXRoIGZpbGw9ImdyYXkiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMyIgZD0iTTYyLDJINDcuNGwxNC42LDE2eiIvPjwvZz48L3N2Zz4=);
    background-size: contain;
    background-repeat: no-repeat;
    width: 1em;
    height: 1em;
    content: "";
    display: inline-block;
    margin-left: 0.25em;
}

a.external:hover::after {
    filter: brightness(80%) sepia(100%) hue-rotate(-70deg) saturate(500%) drop-shadow(1px 1px 3px gray); /*not supported on IE*/
}

h3 > a[href] {
    color: #4D4D4D;
    text-decoration: none;
}

a:hover {
    cursor: pointer;
}


table.gray th {
    background-color: #f4f4f4;
    font-weight: bold;
}

td.gray{
    background-color: #f4f4f4;
}

table.gray th, table.gray td {
    padding: 3px;
    vertical-align: middle;
}

table.gray, table.gray th, table.gray td, table.gray tr {
    border: 1px solid #cfcfcf !important;
    border-collapse: collapse;
}

.api {
    background-color: #e0e0f8;
    font-family: fixed, monospace;
    padding: 1px 3px;
}

.example {
    background-color: #f0ecec;
    font-family: fixed, monospace;
    padding: 1px 3px;
}

div.multicol {
    display: grid;
    grid-template-columns: repeat( auto-fit, minmax(220px, 1fr) );
}

div.multicol > div {
    display: flex;
    flex-direction: row;
    align-items: center;
}

div.multicol.center > div {
    justify-content: center;
}

.indent {
    margin-left: 3em;
}

.wide {
    max-width: 100%;
    overflow-x: scroll;
}

.version::after {
    content: "2026"; /* EEVISION_VERSION */
    border: none;
}

/* ======= Image placement ======= */
 IMG.shrink {
    max-width:          100%;
    height:             auto;
}

IMG.rightflow, DIV.rightflow {
    max-width:          35%;
    height:             auto;
    float:              right;
    /*                  T    R    B    L  */
    margin:             0    0    5pt 20pt;
    padding:            0;
    border:             0;
}

.endflow {
    clear:              both;
    line-height:        0;
}

.big {
    font-size: larger;
}

.rightflow {
    float: right;
}

.leftflow {
    float: left;
}

@media print {
    body { 
        display: block;
        overflow: initial;
    }
    div.body { 
        display: block;
        overflow: unset;
    }
    nav.toc { display: none; }
    header { display: none; }
    main {
        display: block;
        height: fit-content;
        overflow: unset;
    }
}
