/*
 * Site-specific overrides on top of the "modern" template. docfx links public/main.css from every
 * page, and a template listed later in docfx.json wins, so this file replaces the empty main.css
 * the built-in template ships.
 */

/*
 * Top navigation: never wrap an entry.
 *
 * The template leaves .nav-link at white-space: normal and lets the flex row shrink each item below
 * its text. The navbar itself is a fixed 59px, so a two-word entry wrapped onto a second line and
 * the bar simply cut it off - which reads as truncation, but is really a clipped second line. Any
 * entry long enough to wrap was affected, which was most of them before the menu was grouped into
 * dropdowns. flex-shrink: 0 is the other half: without it nowrap text just overflows its own <li>
 * and runs underneath the next one.
 */
header .navbar .navbar-nav > li
{
    flex-shrink: 0;
}

header .navbar .navbar-nav .nav-link
{
    white-space: nowrap;
}

/*
 * Under 1100px, drop the two action links from the bar.
 *
 * One dropdown per product is the right shape for a suite, but it means the bar grows with the
 * catalogue rather than staying at a fixed number of headings, and there is not room for the
 * products plus Discord plus Fab below roughly 1030px. Rather than let them overflow into the
 * search box, they come out of the bar - the footer carries both at every width, so nothing
 * becomes unreachable. If a product is ever added and the bar overflows again, raise this
 * breakpoint; it is cheaper than shortening a product name.
 *
 * Two rules for one job: hiding the <a> is what every browser understands, and hiding the <li>
 * with :has() also removes the row gap the empty item would otherwise still occupy. 1099.98px
 * rather than 1100px is the Bootstrap convention for keeping adjacent ranges from both matching
 * at a fractional viewport width.
 */
@media (max-width: 1099.98px)
{
    header .navbar .navbar-nav > li > a[href*="discord.gg"],
    header .navbar .navbar-nav > li > a[href*="fab.com"]
    {
        display: none;
    }

    header .navbar .navbar-nav > li:has(> a[href*="discord.gg"]),
    header .navbar .navbar-nav > li:has(> a[href*="fab.com"])
    {
        display: none;
    }
}