/* Megamenu Styles for Top Navigation Bar */

/* Navbar logo sizing */
div.ccm-page div.ccm-block-top-navigation-bar .navbar-brand .logo,
div.ccm-page div.ccm-block-top-navigation-bar .navbar-brand .logo-transparent {
    width: 200px;
    height: auto;
}

div.ccm-page div.ccm-block-top-navigation-bar .navbar-brand .logo {
    display: inline-block;
    max-height: 48px;
    margin-top: 5px;
    margin-left: 5px;
}

/* Desktop sticky navbar - only applies on desktop, not mobile, and not in admin mode */
@media (min-width: 992px) {
    html:not(.ccm-toolbar-visible) div.ccm-page div.ccm-block-top-navigation-bar .navbar.desktop-sticky {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1000;
    }

    /* Offset page content so it doesn't hide behind the fixed navbar */
    html:not(.ccm-toolbar-visible) div.ccm-page {
        padding-top: var(--navbar-height, 85px);
    }
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu {
    min-width: 500px;
    max-width: 1100px;
    padding: 1.5rem;
    border: 0;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    animation: none !important;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    row-gap: 0;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-column {
    flex: 0 0 auto;
    width: auto;
    margin: 0 2rem 1.5rem 0;
    padding-left: .4rem;
}

/* Masonry layout overrides - desktop only */
@media (min-width: 992px) {
    div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-row.masonry-layout {
        display: block;
        margin: 0 auto;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-row.masonry-layout .megamenu-column {
        width: 250px;
        margin-right: 0;
        transition: none !important;
    }
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-scroll {
    max-height: calc(100vh - 120px);
    overflow-y: auto;
    overflow-x: hidden;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .dropdown-header,
div.ccm-page div.ccm-block-top-navigation-bar .megamenu .dropdown-header.active,
div.ccm-page div.ccm-block-top-navigation-bar .megamenu .dropdown-header.nav-path-selected {
    color: #2a3a78 !important;
    cursor: pointer;
    display: block;
    font-size: 1rem !important;
    font-weight: 700;
    line-height: 1.375rem;
    padding: 0 0 0.8rem 0;
    word-wrap: break-word;
    overflow-wrap: break-word;
    white-space: normal;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .dropdown-header:hover {
    color: #c73c32 !important;
    cursor: pointer;
    display: block;
    font-size: 1rem !important;
    font-weight: 700;
    line-height: 1.375rem;
    padding: 0 0 0.8rem 0;
    text-decoration: underline;
    text-underline-offset: 5px;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems {
    padding-left: 0;
    margin-bottom: 0;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems .dropdown-item,
div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems .dropdown-item.active,
div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems .dropdown-item.nav-path-selected {
    background: none;
    border: none;
    border-radius: .125rem;
    color: #2a3a78;
    font-size: 1rem;
    line-height: 1.375rem;
    padding: 0 0 0.8rem 0;
    word-wrap: break-word;
    overflow-wrap: break-word;
    white-space: normal;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems .dropdown-item:hover {
    background: none;
    border: none;
    border-radius: .125rem;
    color: #c73c32;
    font-size: 1rem;
    line-height: 1.375rem;
    padding: 0 0 0.8rem 0;
    text-decoration: underline;
    text-underline-offset: 5px;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems-deep {
    padding-left: 0;
    margin-top: 0;
    margin-bottom: 0;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems-deep .megamenu-subitems-level-3 .dropdown-item {
    padding-left: 0;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems-deep .megamenu-subitems-level-4 {
    padding-left: 1rem;
    margin-top: 0;
    margin-bottom: 0;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems-deep .megamenu-subitems-level-4 .dropdown-item {
    padding-left: 0;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems-deep .megamenu-subitems-level-5 {
    padding-left: 1rem;
    margin-top: 0;
    margin-bottom: 0;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems-deep .megamenu-subitems-level-5 .dropdown-item {
    padding-left: 0;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems-deep .megamenu-subitems-level-6 {
    padding-left: 1rem;
    margin-top: 0;
    margin-bottom: 0;
}

div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems-deep .megamenu-subitems-level-6 .dropdown-item {
    padding-left: 0;
}

/* All megamenu text uses the IC blue, including deeper nested levels */
div.ccm-page div.ccm-block-top-navigation-bar .megamenu .dropdown-item,
div.ccm-page div.ccm-block-top-navigation-bar .megamenu .dropdown-item.active,
div.ccm-page div.ccm-block-top-navigation-bar .megamenu .dropdown-item.nav-path-selected,
div.ccm-page div.ccm-block-top-navigation-bar .megamenu .dropdown-item:hover,
div.ccm-page div.ccm-block-top-navigation-bar .megamenu .dropdown-item:focus {
    color: #c73c32;
}

/* 1st menu items - top-level nav links */
div.ccm-page div.ccm-block-top-navigation-bar .navbar .dropdown-toggle::after {
    display: none;
}

div.ccm-page div.ccm-block-top-navigation-bar .navbar .nav-link {
    color: #202020 !important;
}

div.ccm-page div.ccm-block-top-navigation-bar .navbar .nav-link:hover {
    color: #000000 !important;
    text-decoration: underline;
    text-underline-offset: 5px;
}

div.ccm-page div.ccm-block-top-navigation-bar .navbar .nav-link.active,
div.ccm-page div.ccm-block-top-navigation-bar .navbar .nav-link.nav-path-selected {
    color: #202020 !important;
    text-decoration: underline;
    text-underline-offset: 5px;
}

/* Desktop megamenu fade */
@media (min-width: 992px) {
    div.ccm-page div.ccm-block-top-navigation-bar .navbar .nav-link {
        font-size: clamp(0.8125rem, 0.5vw + 0.6rem, 1rem);
        padding-left: clamp(0.5rem, 0.8vw, 0.75rem);
        padding-right: clamp(0.5rem, 0.8vw, 0.75rem);
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu-nav-item {
        position: static !important;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .dropdown-menu.megamenu {
        display: block;
        position: absolute;
        left: 0;
        right: 0;
        width: 100%;
        min-width: auto;
        max-width: none;
        margin-top: 15px;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 0.3s ease 0.15s, visibility 0.3s ease 0.15s;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .dropdown-toggle.show ~ .dropdown-menu.megamenu {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transition: opacity 0.15s ease 0s, visibility 0.15s ease 0s;
    }

    /* Invisible bridge so hover doesn't break across the 15px gap */
    div.ccm-page div.ccm-block-top-navigation-bar .dropdown-menu.megamenu::before {
        content: '';
        display: block;
        height: 15px;
        position: absolute;
        top: -15px;
        left: 0;
        right: 0;
    }
}

/* Mobile megamenu */
@media (max-width: 991.98px) {
    div.ccm-page div.ccm-block-top-navigation-bar .megamenu {
        min-width: auto;
        max-width: none;
        padding: 0.75rem;
        box-shadow: none;
        margin-left: 0;
        margin-right: 0;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-column {
        width: 100%;
        flex: 0 0 100%;
        margin: 0 0rem;
        padding-left: 0;
        text-align: left;
        position: static !important;
        left: auto !important;
        top: auto !important;
        transform: none !important;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu .dropdown-header {
        padding: 0 0 0.8rem 0;
        text-align: left;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems {
        margin-bottom: 0;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems .dropdown-item {
        padding: 0 0 0.8rem 0;
        text-align: left;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-subitems-deep .dropdown-item {
        padding: 0 0 0.8rem 0;
        text-align: left;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .navbar .nav-link {
        text-align: left;
        padding-left: 1rem;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .nav-item:not(.megamenu-nav-item) {
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    }

    div.ccm-page div.ccm-block-top-navigation-bar .navbar-nav .nav-item:last-child {
        border-bottom: none;
    }
}

/* Mobile accordion megamenu */
@media (max-width: 991.98px) {
    div.ccm-page div.ccm-block-top-navigation-bar .megamenu-nav-item .desktop-dropdown-toggle {
        display: none !important;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu-nav-item .mobile-nav-item-wrapper {
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu-nav-item .mobile-nav-item-wrapper .mobile-nav-link {
        flex: 1;
        padding: 1rem 0;
        padding-left: 1rem;
        text-align: left;
        text-decoration: none;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu-nav-item .mobile-nav-item-wrapper .mobile-nav-link.active,
    div.ccm-page div.ccm-block-top-navigation-bar .megamenu-nav-item .mobile-nav-item-wrapper .mobile-nav-link.nav-path-selected {
        color: #202020 !important;
        text-decoration: underline;
        text-underline-offset: 5px;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu-nav-item .mobile-nav-item-wrapper .mobile-dropdown-toggle {
        background: none;
        border: none;
        padding: 1rem;
        cursor: pointer;
        margin-left: auto;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu-nav-item .mobile-nav-item-wrapper .mobile-dropdown-toggle i {
        font-size: 0.875rem;
        color: #202020;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu-nav-item .desktop-dropdown-toggle.show ~ .dropdown-menu {
        display: none;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu-nav-item .dropdown-menu.megamenu {
        display: block;
        position: static !important;
        transform: none !important;
        inset: auto !important;
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        padding: 0 0.75rem;
        transition: max-height 0.3s ease, opacity 0.3s ease, padding 0.3s ease;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu-nav-item .dropdown-menu.megamenu.mobile-expanded {
        display: block !important;
        max-height: 2000px;
        opacity: 1;
        padding: 0.75rem;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu .megamenu-scroll {
        max-height: none;
        overflow-y: visible;
        overflow-x: visible;
    }

    div.ccm-page div.ccm-block-top-navigation-bar .megamenu .container {
        margin-left: 10px;
        margin-right: 10px;
        max-width: none;
    }
}

@media (min-width: 992px) {
    div.ccm-page div.ccm-block-top-navigation-bar .megamenu-nav-item .mobile-nav-item-wrapper {
        display: none !important;
    }
}