/*
 * NexttCareer Card Button & Menu Hover Fix
 * Loaded after the catalogue/plugin/theme CSS.
 */

/* ------------------------------------------------------------------
   1. Equal-height cards and aligned View Course buttons
   ------------------------------------------------------------------ */

.nextt-v6-course-grid,
.nextt-v4-course-grid,
.nextt-category-course-grid,
.learn-press-courses,
.lp-archive-courses .learn-press-courses,
.course-grid,
.courses-list {
    align-items: stretch !important;
}

.nextt-v6-course-card,
.nextt-v4-course-card,
.nextt-category-course-card,
.nextt-course-card,
.learn-press-courses .course-item,
.lp-archive-courses .course-item,
.course-grid .course-item,
.courses-list .course-item {
    display: flex !important;
    height: 100% !important;
    min-height: 0 !important;
    flex-direction: column !important;
    align-self: stretch !important;
}

.nextt-v6-course-card-body,
.nextt-v4-course-card-body,
.nextt-category-course-card-body,
.nextt-course-card .course-content,
.learn-press-courses .course-item .course-content,
.lp-archive-courses .course-item .course-content,
.course-grid .course-item .course-content,
.courses-list .course-item .course-content {
    display: flex !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
}

/*
 * The facts block is the first bottom-anchored item.
 * It absorbs the remaining vertical space above it, so the facts and button
 * line up even when titles and descriptions have different lengths.
 */
.nextt-v6-facts,
.nextt-v4-course-facts,
.nextt-category-course-facts,
.nextt-course-card .course-facts,
.nextt-course-card .course-meta,
.learn-press-courses .course-item .course-meta,
.lp-archive-courses .course-item .course-meta {
    margin-top: auto !important;
    flex: 0 0 auto !important;
}

.nextt-v6-view-course,
.nextt-v4-view-course,
.nextt-category-view-course,
.nextt-course-card .view-course,
.nextt-course-card .course-readmore,
.learn-press-courses .course-item .course-readmore,
.lp-archive-courses .course-item .course-readmore,
.course-grid .course-item .course-readmore,
.courses-list .course-item .course-readmore {
    display: inline-flex !important;
    width: 100% !important;
    min-height: 48px !important;
    margin-top: 18px !important;
    margin-bottom: 0 !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Prevent the heading/description from setting fixed or clipped card heights. */
.nextt-v6-course-card h2,
.nextt-v4-course-card h2,
.nextt-category-course-card h2,
.nextt-course-card h2,
.learn-press-courses .course-item .course-title,
.lp-archive-courses .course-item .course-title,
.nextt-v6-course-card p,
.nextt-v4-course-card p,
.nextt-category-course-card p {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
    line-clamp: unset !important;
}

/* ------------------------------------------------------------------
   2. Keep the course category dropdown open during hover movement
   ------------------------------------------------------------------ */

@media (min-width: 1101px) {
    /*
     * The original catalogue CSS placed the dropdown 8px below the menu item.
     * That empty gap caused :hover to be lost before the pointer reached the
     * submenu. Move it upward so it overlaps the parent by 2px.
     */
    .nextt-v6-menu-submenu,
    .nextt-v4-menu-submenu,
    .nextt-category-submenu,
    .nextt-hover-stable-submenu {
        top: calc(100% - 2px) !important;
        margin-top: 0 !important;
        pointer-events: auto !important;
    }

    .nextt-v6-menu-parent,
    .nextt-v4-menu-parent,
    .nextt-categories-parent,
    .nextt-hover-stable-parent {
        position: relative !important;
        overflow: visible !important;
    }

    /* An invisible bridge gives the pointer a continuous hover path. */
    .nextt-hover-stable-parent::after,
    .nextt-v6-menu-parent::after,
    .nextt-v4-menu-parent::after,
    .nextt-categories-parent::after {
        content: "" !important;
        position: absolute !important;
        z-index: 999998 !important;
        left: 0 !important;
        top: calc(100% - 3px) !important;
        width: max(100%, 120px) !important;
        height: 14px !important;
        background: transparent !important;
        pointer-events: auto !important;
    }

    .nextt-v6-menu-parent:hover > .nextt-v6-menu-submenu,
    .nextt-v6-menu-parent:focus-within > .nextt-v6-menu-submenu,
    .nextt-v6-menu-parent.nextt-hover-stable-open > .nextt-v6-menu-submenu,

    .nextt-v4-menu-parent:hover > .nextt-v4-menu-submenu,
    .nextt-v4-menu-parent:focus-within > .nextt-v4-menu-submenu,
    .nextt-v4-menu-parent.nextt-hover-stable-open > .nextt-v4-menu-submenu,

    .nextt-categories-parent:hover > .nextt-category-submenu,
    .nextt-categories-parent:focus-within > .nextt-category-submenu,
    .nextt-categories-parent.nextt-hover-stable-open > .nextt-category-submenu,

    .nextt-hover-stable-parent:hover > .nextt-hover-stable-submenu,
    .nextt-hover-stable-parent:focus-within > .nextt-hover-stable-submenu,
    .nextt-hover-stable-parent.nextt-hover-stable-open > .nextt-hover-stable-submenu {
        display: grid !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        transform: none !important;
    }

    /* Ensure header wrappers do not clip the submenu. */
    header,
    .site-header,
    .main-header,
    .header-wrapper,
    .navbar,
    .main-navigation,
    #site-navigation,
    .elementskit-navbar-nav,
    .elementskit-menu-container,
    .elementor-location-header,
    .elementor-widget-nav-menu,
    .elementor-nav-menu--main {
        overflow: visible !important;
    }
}
