body
{
    /* DEV NOTE, CORRELATION #PCR1001: bootstrap-5.2.0.min.css overrides font-family in style_pre.css, must move to style_post.css */
    font-family: sans-serif;
}

/* https://bootstrap-menu.com/detail-basic-hover.html */
/* https://codingyaar.com/responsive-bootstrap-navbar-dropdown-on-hover */
/* Navigation Bar Dropdown Menus, Desktop View */
@media all and (min-width: 992px) {
    /* dropdown menus are expanded by hover in desktop view, to allow menu buttons to still have their own clickable links */
    .navbar .nav-item .dropdown-menu{ display: none; }
    .navbar .nav-item:hover .nav-link{   }
    .navbar .nav-item:hover .dropdown-menu{ display: block; }
    .navbar .nav-item .dropdown-menu{ margin-top:0; }

    /* invert arrow when dropdown menu is expanded */
    .dropdown:hover .dropdown-toggle::after { border-bottom: 0.3em solid; border-top: 0; }

    .dropdown-menu { 
        /* dropdown menu background color, light grey with slight transparency */
        background-color: rgba(220,220,220,0.97); 

        /* dropdown menu width, fit to content */
        width: max-content; 
    };
}

/* Navigation Bar Dropdown Menus, Mobile View */
@media all and (max-width: 991px) {
    /* dropdown menus are always expanded in mobile view, to avoid need for either hover or click to expand */
    .navbar .nav-item .dropdown-menu{ display: block; }
    .navbar .nav-item .dropdown-menu{ margin-top:0; }

    /* arrows are hidden in mobile view, because dropdown menus are always expanded */
    .dropdown-toggle::after { display: none; }

    /* dropdown menu text is white in mobile view */
    .dropdown-menu li a { color: white; }

    .dropdown-menu {
        /* dropdown menu background color, transparent */
        background-color: rgba(0,0,0,0);

        /* dropdown menu border, transparent */
        --bs-dropdown-border-color: none;

        /* dropdown menu width, fit to content */
        width: max-content;
    };
}