/* Import Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

/* Main Nav Menu Styles */
.menu-top-menu-container,
.menu-top-menu-container * {
    font-family: 'Poppins', sans-serif;
}

.menu-top-menu-container {
    width: 100%;
    position: relative;
    z-index: 999;
}
.menu-top-menu-container ul.menu {
    display: flex;
    gap: 1.6rem;
    list-style: none;
    margin: 0;
    padding: 0;
    align-items: center;
}
.menu-top-menu-container ul.menu > li {
    position: relative;
}
.menu-top-menu-container ul.menu > li > a {
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
	line-height:24px;
    padding: 12px 16px;
    border-radius: 4px;
    transition: color 0.25s, background 0.2s;
    display: block;
}

.menu-top-menu-container ul.menu > li > a:hover,
.menu-top-menu-container ul.menu > li.current-menu-item > a {
    color: #ff9800;         
    background: rgba(255,152,0,0.07);
}

.menu-top-menu-container ul.menu > li.menu-item-has-children > a {
    padding-right: 20px;
}
.menu-top-menu-container ul.menu > li.menu-item-has-children:after {
    content:"▾";
    color: #ff9800;
    font-size: 1em;
    margin-left: 3px;
}

/* Dropdown */
.menu-top-menu-container ul.sub-menu {
    display: none;
    position: absolute;
    left: 0;
    top: 100%;
    min-width: 200px;
    background: #2e3040;
    border-radius: 8px;
    box-shadow: 0 8px 22px rgba(50,50,50,0.10);
    z-index: 1000;
    padding: 9px 0;
}

.menu-top-menu-container ul.menu > li:hover > ul.sub-menu,
.menu-top-menu-container ul.menu > li:focus-within > ul.sub-menu {
    display: block;
}
.menu-top-menu-container ul.sub-menu li a {
    display: block;
    padding: 12px 22px;
    font-size: 1.02em;
    color: #fff;
    background: none;
    text-decoration: none;
    border-radius: 0;
    transition: background .16s, color .20s;
    border-top: 1px solid #353569;
}
.menu-top-menu-container ul.sub-menu li:first-child a {
    border-top: none;
}
.menu-top-menu-container ul.sub-menu li a:hover {
    background: #312d55;
    color: #ff9800;
}

/* Hamburger Toggle Button Styles */
.menu-toggle {
    display: none;
    background: #24273A;
    border: none;
    color: #fff;
    font-size: 2em;
    position: absolute;
    right: 12px;
    top: 14px;
    cursor: pointer;
    z-index: 1102;
    width: 46px;
    height: 46px;
    border-radius: 8px;
    transition: background 0.2s;
    font-family: 'Poppins', sans-serif;
}
.menu-toggle.open {
    color: #ff9800;
    background: #312d55;
}
.menu-toggle .close-icon {
    display: none;
    font-size: 20px;
	font-weight:900;
}
.menu-toggle.open .menu-icon {
    display: none;
}
.menu-toggle.open .close-icon {
    display: inline;
}

/* MOBILE Responsive Styles */
@media (max-width: 900px) {
    .menu-top-menu-container ul.menu {
        flex-direction: column;
        gap: 0;
        width: 100vw;
        background: #28294a;
        border-radius: 0 0 10px 10px;
        box-shadow: 0 6px 24px rgba(44,32,77,0.08);
        position: absolute;
       	left: -285px;
        top: 67px;
        display: none;
    }
    .menu-top-menu-container ul.menu.menu-open {
        display: flex;
    }
    .menu-toggle {
        display: block;
    }
    .menu-top-menu-container ul.menu > li {
        width: 100%;
        border-bottom: 1px solid #232444;
    }
    .menu-top-menu-container ul.menu > li > a {
        font-size: 1.15em;
        width: 100%;
        padding: 18px 24px;
        color: #fff;
        font-family: 'Poppins', sans-serif;
    }
    .menu-top-menu-container ul.sub-menu {
        position: static !important;
        box-shadow: none;
        border-radius: 0;
        padding-left: 20px;
        margin: 0;
    }
}
.menu-top-menu-container ul.menu > li.menu-item-has-children {
    position: relative;
}

.menu-top-menu-container ul.menu > li.menu-item-has-children > a {
    padding-right: 30px; /* Space for arrow */
    position: relative;
}

.menu-top-menu-container ul.menu > li.menu-item-has-children::after {
    content: "\f078"; /* Font Awesome 'chevron-down', or use "▾" */
    font-family: "Font Awesome 5 Free"; /* If using Font Awesome */
    font-weight: 900;                    /* If using Font Awesome */
    font-size: 1em;
    color: #ff9800;
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

/* If not using Font Awesome, use unicode arrow ↓ or ▾ */
.menu-top-menu-container ul.menu > li.menu-item-has-children::after {
    content: "▾";
    font-size: 1.10em;
    color: #ff9800;
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

@media (max-width: 900px) {
    .menu-top-menu-container ul.menu > li.menu-item-has-children::after {
        right: 18px;
    }
}

