@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap');

html {
    --font-family: Inter, sans-serif;
    --font-family-monospace: JetBrains Mono, monospace;

    --top-height: 100px;

    /* Make sure sidebar is wide enough to contain the page title (logo + title + version) */
    --side-nav-fixed-width: 400px;
}

#projectbrief {
    font-size: var(--title-font-size);
    font-weight: 600;
    margin-top: 15px;
}

#projectnumber {
    font-size: 100%;
}

#MSearchResultsWindow {
    width: calc(var(--side-nav-fixed-width) - calc(2 * var(--spacing-medium)));
    height: calc(1.5 * var(--side-nav-fixed-width));
}

doxygen-awesome-dark-mode-toggle:hover {
    background-color: rgba(0, 0, 0, 0);
}

html.dark-mode doxygen-awesome-dark-mode-toggle:hover {
    background-color: rgba(0, 0, 0, 0);
}

doxygen-awesome-dark-mode-toggle {
    margin: 0;
    padding: 0;
    width: auto;
    height: auto;
}

/* Responsive adjustments */
@media screen and (max-width: 767px) {
    #docsearch {
        position: relative !important;
        right: auto !important;
        top: auto !important;
        transform: none !important;
        margin-top: 10px;
    }

    #native-search-wrapper {
        margin-top: 10px;
    }

    #header-controls {
        margin-left: 10px;
        margin-bottom: 10px;
    }
}

/* Layout for title area and button */
#top {
    display: flex;
    flex-direction: column;
    position: relative;
}

/* Left-align the title area (logo + Title + version) with padding */
#titlearea {
    align-self: flex-start;
    padding-left: 15px;
}

#nav-tree {
    border-right: 0px;
}

/* Position the Ask Kanzi widget search trigger (the bootstrap injects
 * the magnifier-only icon into this host div) next to the project name. */
#docsearch {
    position: absolute;
    right: 20px;
    top: 15px;
    z-index: 100;
}

/* Native search wrapper (for generateApi builds) - appears below title */
#native-search-wrapper {
    margin-left: -5px;
    margin-top: 15px;
    margin-bottom: 15px;
    margin-right: 100px;
}

#MSearchField {
    width: 300px;
}

/* doxygen-awesome-sidebar-only.css constrains #top to sidebar geometry
 * (height: var(--top-height), max-width: var(--side-nav-fixed-width),
 * overflow: hidden) so the title area lines up with the side-nav.  In
 * offline builds (SEARCHENGINE=YES + FULL_SIDEBAR=NO) doxygen renders
 * the native MSearchBox inside #titlearea, which sits inside #top —
 * the constraints then clip the search input both vertically and
 * horizontally.  Detect the offline rendering via the presence of
 * #native-search-wrapper and lift the constraint on #top so the
 * search input renders fully.  Online builds don't have this child,
 * so the original sidebar geometry stays in effect. */
@media screen and (min-width: 768px) {
    #top:has(#native-search-wrapper) {
        max-width: none;
        height: auto;
        margin-bottom: 0;
        overflow: visible;
    }
}

/* Footer theme toggle styling */
#footer-theme-toggle-placeholder {
    float: right;
    margin-left: 10px;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
}

#footer-theme-toggle-placeholder doxygen-awesome-dark-mode-toggle {
    margin: 0;
    padding: 0;
    width: auto;
    height: auto;
    background: none;
    border: none;
    display: inline-block;
    vertical-align: middle;
}

.footer, address.footer {
    overflow: hidden;
}

#nav-path.navpath ul li.footer {
    position: relative;
}
