/* Basic styling for the dynamic parent-child navigation */

.my-parent-child-nav {
    width: 100%;
	  
}

.my-parent-child-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex; /* For desktop horizontal */
    justify-content: right;
    flex-wrap: wrap;
    position: relative;
    z-index: 10;
}

/* Apply padding and border to ALL <li> elements */
.my-parent-child-menu li {
    padding: 0;
    position: relative;
    border: 2px solid transparent;
}

.my-parent-child-menu li a {
    display: block;
    text-decoration: none;
    white-space: normal;
    transition: color 0.3s ease;
}

.my-parent-child-menu li a:hover {
        text-decoration: underline;
    }
/* --- No Background Hover Color Changes (Global) --- */
.my-parent-child-menu li a:hover {
    background-color: transparent !important;
}
/* --- Specific Font & Color Styles --- */

/* For the Parent (Top-Level Link) with link */
.my-parent-child-menu li.menu-item-parent > a {
    font-family: gotham-bold, "gotham_boldregular", "Roboto", sans-serif;
    font-size: 18px;
    color: #fff;
    padding-right: 20px;
    line-height: 1.75em;
}
/* For the Parent (Top-Level Link) replaced no link */
.my-parent-child-menu li.menu-item-parent > span.parent-title {
    font-family: gotham-bold, "gotham_boldregular", "Roboto", sans-serif;
    font-size: 18px;
    color: #fff; 
    padding-right: 20px;
    line-height: 1.75em;
    cursor: default; /* Change cursor to not look clickable */
}
/* For all other Level 1 Links */
.my-parent-child-menu > li:not(.menu-item-parent) > a {
    font-size: 16px;
    color: #fff;
    font-family: gotham-bold, "gotham_boldregular", "Roboto", sans-serif;
    line-height: 2;
    padding: 0px 9px;
}

/* Current active page styling for Level 1 items */
.my-parent-child-menu > li.current-menu-item > a {
    color: #0073e6;
    font-weight: 400;
    border-bottom: 2px solid #0073e6;
}

.my-parent-child-menu > li.current-menu-item > a {
    color: #fff;
    font-weight: 400;
    border-bottom: 0px solid #fff;
}

/* --- Desktop Dropdown Logic & Styling (Hover-based) --- */
/* Only applies when screen width is > 1024px */
@media (min-width: 1025px) {
    /* General sub-menu container styling for desktop */
    .my-parent-child-menu .sub-menu {
        list-style: none;
        margin: 0;
        padding: 7px;
        background-color: #fff;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        min-width: 250px;
        z-index: 99;
        border-top: none;
    }

    /* --- Indented Style (Original Behavior) --- */
    .nav-style-indented .my-parent-child-menu .sub-menu {
        display: none;
    }
    .nav-style-indented .my-parent-child-menu > li:hover .sub-menu {
        display: block;
    }
    .nav-style-indented .my-parent-child-menu > li > .sub-menu {
        position: absolute;
        top: 100%;
        left: auto;
        right: 0;
        padding-left: 0px;
    }
    .nav-style-indented .my-parent-child-menu .sub-menu .sub-menu {
        position: static;
        box-shadow: none;
        border-top: none;
        background-color: #fff;
        width: 100%;
        margin-top: 0px;
        padding: 0px;
    }

    /* --- Tiered Style (New Fly-out Behavior) --- */
    .nav-style-tiered .my-parent-child-menu .sub-menu {
        display: none;
        position: absolute;
    }
    .nav-style-tiered .my-parent-child-menu > li > .sub-menu {
        top: 100%;
        left: auto;
        right: 0;
    }
    .nav-style-tiered .my-parent-child-menu .sub-menu li > .sub-menu {
        top: -7px; /* Adjust vertical position to align with parent item padding */
        left: 100%;
        right: auto;
    }
    .nav-style-tiered .my-parent-child-menu li:hover > .sub-menu {
        display: block;
    }
    
    /* --- Simple Dropdown Style (New Behavior) --- */
    .nav-style-simple .my-parent-child-menu .sub-menu {
        display: none;
        position: absolute;
    }
    .nav-style-simple .my-parent-child-menu > li > .sub-menu {
        top: 100%;
        left: auto;
        right: 0;
    }
    .nav-style-simple .my-parent-child-menu li:hover > .sub-menu {
        display: block;
    }
    /* Explicitly hide any deeper level sub-menus */
    .nav-style-simple .my-parent-child-menu .sub-menu .sub-menu {
        display: none !important;
    }

    /* Arrow styling for both modes */
    .my-parent-child-menu li.menu-item-has-children > a::after {
        content: '+';
        font-size: 1em;
        margin-left: 5px;
        vertical-align: middle;
        transition: transform 0.3s ease;
    }
    .my-parent-child-menu li.menu-item-has-children:hover > a::after {
        transform: rotate(180deg);
    }
    /* Hide arrows for indented & simple sub-menus on desktop */
    .nav-style-indented .my-parent-child-menu .sub-menu li.menu-item-has-children > a::after,
    .nav-style-simple .my-parent-child-menu .sub-menu li.menu-item-has-children > a::after {
        content: none !important;
    }
    /* Style arrows for tiered sub-menus to indicate fly-out */
    .nav-style-tiered .my-parent-child-menu .sub-menu li.menu-item-has-children > a {
        position: relative; /* Needed for absolute positioning of the arrow */
    }
    .nav-style-tiered .my-parent-child-menu .sub-menu li.menu-item-has-children > a::after {
        content: '›';
        font-size: 1.2em;
        position: absolute;
        right: 8px;
        top: 50%;
        transform: translateY(-50%);
        transition: none;
        margin-left: 0;
    }
    .nav-style-tiered .my-parent-child-menu .sub-menu li.menu-item-has-children:hover > a::after {
         transform: translateY(-50%) rotate(0deg); /* Override main item hover rotation */
    }
}

/* --- Styling for 2nd Level & Deeper Links (Applies to all screens initially) --- */
.my-parent-child-menu .sub-menu li a {
    font-size: 14px;
    line-height: 1.5;
    color: #10342f;
    font-family: gotham-bold, "gotham_boldregular", "Roboto", sans-serif;
    white-space: normal;
    padding: 0px 7px;
    border-bottom: 0px solid #eee;
    font-weight: 400;
}
.my-parent-child-menu .sub-menu .sub-menu li a {
    font-family: gotham_light, gotham-light, sans-serif;
}

/* --- Mobile & Tablet Adjustments (Click-to-Toggle) --- */
@media (max-width: 1024px) {
    .my-parent-child-menu {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        list-style: none;
    }

    .my-parent-child-menu > li {
        width: 100%;
    }

    .my-parent-child-menu li a {
        text-align: left;
        padding: 0px 9px;
    }

    .my-parent-child-menu .sub-menu {
        position: static;
        width: 100%;
        box-shadow: none;
        border-top: none;
        background-color: #f8f8f8;
        padding: 7px;
        padding-left: 10px;
        list-style: none;
        display: none;
    }

    .my-parent-child-menu li.is-open > .sub-menu {
        display: block !important;
    }

    .my-parent-child-menu .sub-menu .sub-menu {
        padding-left: 0px;
    }

    .my-parent-child-menu li.menu-item-has-children > a::after {
        content: '+';
        font-size: 1em;
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        margin-left: 0;
        transition: transform 0.3s ease;
    }

    .my-parent-child-menu li.menu-item-has-children.is-open > a::after {
        transform: translateY(-50%) rotate(180deg);
    }

    .my-parent-child-menu .sub-menu li.menu-item-has-children > a::after {
        content: none !important;
    }

    .my-parent-child-menu .sub-menu li a {
        padding: 0px 7px;
    }
}