/* Ensure that dropdowns open correctly */
.navbar-nav > li {
    margin-right: 30px; /* Add 50px space between main menu items */
    margin-left: 10px; /* Add 50px space between main menu items */
}

    /* Remove margin for the last menu item */
    .navbar-nav > li:last-child {
        margin-right: 0;
    }
    .dropdown-menu {
    font-family: Calibri;
    font-size: 14px;
    position: absolute;
    top: 100%; /* Submenu opens below */
    left: 0;
    z-index: 1000;
}

/* Styling for submenu */
.dropdown-submenu {
    position: relative;
}

    /* Level 2: Submenu opens downwards */
    .dropdown-submenu .dropdown-menu {
        top: 100%;
        left: 0;
    }

        /* Level 3: Submenu opens to the right */
        .dropdown-submenu .dropdown-menu .dropdown-menu {
            top: 0;
            left: 100%;
        }

    /* Add space for the caret */
    .dropdown-submenu > .dropdown-toggle {
        position: relative;
        padding-right: 30px; /* Add space for caret */
    }

        /* Caret styles */
        .dropdown-submenu > .dropdown-toggle::after {
            content: '▶'; /* Default right arrow for submenus */
            font-family: Calibri;
            font-size: 14px;
            position: absolute;
            right: 10px; /* Place caret at the far right corner */
            top:2px;
            border: none;
            transform: rotate(90deg); /* Center vertically */
            color: #881A51;
            vertical-align: middle;
        }

    /* Rotate caret for third-level menus */
    .dropdown-submenu .dropdown-menu .dropdown-toggle::after {
        transform: rotate(0deg); /* Adjust for third level */
    }

    /* Highlight when shown */
    .dropdown-submenu.show > .dropdown-toggle::after {
        transform: rotate(0deg); /* Rotate caret downwards for active state */
    }