/* 
 * Active Menu Item Highlighting
 * Makes the current service page's menu item highlighted in the dropdown
 */

/* Base styles for the active menu item */
.dropdown-menu .dropdown-item.active,
.dropdown-menu .dropdown-item[aria-current="page"] {
    background-color: rgba(43, 57, 144, 0.08) !important;
    color: #2b3990 !important;
    border-left: 3px solid #4A90E2 !important;
    border-right: 3px solid #4A90E2 !important;
    font-weight: 600 !important;
}

/* No indicator needed - using just the hover effect */
.dropdown-menu .dropdown-item.active:before,
.dropdown-menu .dropdown-item[aria-current="page"]:before {
    content: '';
    margin: 0;
}

/* JavaScript function to set active menu item */
/* Add this to the end of each page: 
<script>
    document.addEventListener('DOMContentLoaded', function() {
        // Get the current page URL
        const currentPage = window.location.pathname.split('/').pop();
        
        // Find the corresponding dropdown item and mark it as active
        const menuItems = document.querySelectorAll('.dropdown-menu .dropdown-item');
        menuItems.forEach(item => {
            const itemHref = item.getAttribute('href');
            if (itemHref === currentPage) {
                item.classList.add('active');
                item.setAttribute('aria-current', 'page');
            }
        });
    });
</script>
*/