/**
 * SECURITY FIX: Menu Display CSS Fixes (Pure CSS - No JavaScript)
 * 
 * This CSS fixes display issues after migrating from VelocityMenuDisplayer 
 * to ListMenuDisplayer (to eliminate vulnerable Velocity 1.7 dependency).
 * 
 * ListMenuDisplayer wraps output in <ul class="menuList"> which breaks 
 * Bootstrap navbar structure. These styles make the wrapper transparent
 * and fix submenu display using pure CSS hover states.
 * 
 * Status: VALIDATED & WORKING (March 24, 2026)
 * - Dropdowns correctly hidden by default
 * - Dropdowns appear on hover
 * - Professional blue color scheme
 */

/* Fix ListMenuDisplayer wrapper */
ul.menuList {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
}

/* Make menuList wrapper behave like it doesn't exist */
ul.menuList > div {
    display: block;
}

/* Ensure nav items display horizontally in navbar */
.navbar-nav > li.menubar {
    float: left;
    position: relative;
}

/* Hide actuator (toggle indicator) - not needed with CSS-only solution */
a.actuator {
    display: none;
}

/* Style base link (parent menu item with dropdown) */
a.base {
    display: inline-block;
    padding: 15px;
    color: #337ab7;
    font-weight: 500;
    text-decoration: none;
}

.navbar-nav > li.menubar > a.base:hover,
.navbar-nav > li.menubar > a.base:focus {
    color: #fff;
    background-color: #337ab7;
}

/* Standalone menu items (no dropdown) */
a.standalone {
    display: block;
    padding: 15px;
    color: #337ab7;
    font-weight: 500;
    text-decoration: none;
}

.navbar-nav > li.menubar > a.standalone:hover,
.navbar-nav > li.menubar > a.standalone:focus {
    color: #fff;
    background-color: #337ab7;
}

/* Submenu styling - Bootstrap dropdown style */
.navbar-nav li.menubar ul.menu {
    display: none !important;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    font-size: 14px;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 4px;
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}

/* PURE CSS HOVER: Show submenu when hovering over parent menu item */
.navbar-nav li.menubar:hover > ul.menu {
    display: block !important;
}

/* Keep menu open when hovering over the submenu itself */
.navbar-nav li.menubar ul.menu:hover {
    display: block !important;
}

/* Highlight parent menu item when hovering over it (with or without submenu) */
.navbar-nav > li.menubar:hover > a.base,
.navbar-nav > li.menubar:hover > a.standalone {
    color: #fff;
    background-color: #3399f3;
}

/* Style submenu items */
ul.menu > li {
    display: block;
    margin: 0;
    padding: 0;
}

ul.menu > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
    text-decoration: none;
}

ul.menu > li > a:hover,
ul.menu > li > a:focus {
    color: #262626;
    background-color: #f5f5f5;
    text-decoration: none;
}

/* Active menu item styling */
.navbar-nav > li.menubar.active > a {
    color: #555;
    background-color: #e7e7e7;
}

/* CRITICAL: Force hide all dropdown menus by default - highest specificity */
.navbar-nav > li.menubar > ul.menu,
ul.navbar-nav > li.menubar > ul.menu,
div.navbar-collapse ul.navbar-nav > li.menubar > ul.menu {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* CRITICAL: Show dropdown only on hover - highest specificity */
.navbar-nav > li.menubar:hover > ul.menu,
ul.navbar-nav > li.menubar:hover > ul.menu,
div.navbar-collapse ul.navbar-nav > li.menubar:hover > ul.menu {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
}

/* Responsive: ensure menus work in collapsed mobile view */
@media (max-width: 767px) {
    /* In mobile, show submenus below parent (no absolute positioning) */
    .navbar-nav > li.menubar > ul.menu,
    ul.navbar-nav > li.menubar > ul.menu {
        position: static !important;
        float: none !important;
        width: auto !important;
        margin-top: 0 !important;
        background-color: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
    }
    
    ul.menu > li > a {
        padding-left: 30px;
    }
    
    /* Stack menu items vertically in mobile */
    .navbar-nav > li.menubar {
        float: none;
    }
}