/* ===== "Study in Malaysia" menu pill: slim version + POPULAR badge on the top border — Nov 2026 =====
   Computer screens only (1081px and wider). Mobile menu is not changed.
   Only the Study in Malaysia item (.nav-hl-my) is changed; Study Abroad and all other items stay as they are. */
@media (min-width: 1081px) {
    html body .nav-hl.nav-hl-my > .drop-btn {
        padding: 3px 11px !important;          /* was 8px 16px (7px 12px on 1081-1320px screens) */
        line-height: 1.2 !important;
        gap: 5px !important;                    /* was 7px: space between text and the small arrow */
    }
    html body .nav-hl.nav-hl-my > .drop-btn::after { margin-left: 2px; }   /* small down arrow sits closer to the text */

    /* POPULAR badge: its lower edge just crosses the top gold border, so it looks joined to it */
    html body .nav-hl.nav-hl-my .nav-badge {
        top: -18px !important;                  /* was -13px: lower edge of the badge just meets the top border */
        right: 10px !important;                 /* was -4px: badge now sits on the border line, not past the corner */
    }
}
@media (min-width: 1081px) and (max-width: 1320px) {
    html body .nav-hl.nav-hl-my > .drop-btn { padding: 3px 9px !important; }
}
/* ===== end nav-compact ===== */

/* ===== Study in Malaysia mega menu: Cost Calculator, Eligibility Checker, All courses, Compare programmes
   as UNICE split pills (like Apply Now): icon + text | full-height white line | white arrow — Nov 2026
   Only inside the Study in Malaysia mega menu (.nav-hl-my); other mega menus are not changed. ===== */
html body .nav-hl-my .mega a.mega-calc,
html body .nav-hl-my .mega .mega-levels a.mega-level-all {
    display: flex !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    border-radius: 999px !important;
    overflow: hidden;
    background: linear-gradient(135deg, #00822D 0%, #004E82 100%) !important;
    border: 1.5px solid #D4AF37 !important;
    color: #FFFFFF !important;
    text-shadow: none !important;
    box-shadow: none !important;
    text-decoration: none !important;
    transition: transform .2s ease, filter .2s ease;
}
html body .nav-hl-my .mega a.mega-calc { margin-top: 10px; }
html body .nav-hl-my .mega a.mega-calc + a.mega-calc { margin-top: 8px; }
html body .nav-hl-my .mega a.mega-calc:hover,
html body .nav-hl-my .mega .mega-levels a.mega-level-all:hover {
    background: linear-gradient(135deg, #00822D 0%, #004E82 100%) !important;
    color: #FFFFFF !important;
    filter: brightness(1.12);
    transform: translateY(-1px);
    box-shadow: none !important;
}
/* left icon (Cost Calculator / Eligibility Checker): white */
html body .nav-hl-my .mega a.mega-calc svg {
    width: 18px; height: 18px; flex: 0 0 18px;
    align-self: center;
    margin-left: 14px;
    stroke: #FFFFFF !important;
}
/* text: one line, pure white; the small second line is hidden to keep the pill slim */
html body .nav-hl-my .mega a.mega-calc > span {
    display: flex; flex-direction: row; flex: 1 1 auto; align-items: center; justify-content: flex-start;
    padding: 6px 12px 6px 9px;
    line-height: 1.2;
}
html body .nav-hl-my .mega a.mega-calc strong { color: #FFFFFF !important; font-size: 14px; font-weight: 700; }
html body .nav-hl-my .mega a.mega-calc small { display: none !important; }
html body .nav-hl-my .mega .mega-levels a.mega-level-all {
    padding-left: 16px !important;
    align-items: center !important;
    font-size: 14px; font-weight: 700; line-height: 1.2;
}
html body .nav-hl-my .mega .mega-levels a.mega-level-all > span { display: none !important; }   /* old text arrow */
/* right part: full-height white line + white arrow */
html body .nav-hl-my .mega a.mega-calc::after,
html body .nav-hl-my .mega .mega-levels a.mega-level-all::after {
    content: "" !important;
    display: block !important;
    position: static !important;
    flex: 0 0 38px;
    align-self: stretch;
    min-height: 30px;
    margin-left: auto;
    border-left: 1px solid #FFFFFF;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / 15px 15px no-repeat !important;
    transform: none !important;
    transition: background-position .2s ease;
}
html body .nav-hl-my .mega a.mega-calc:hover::after,
html body .nav-hl-my .mega .mega-levels a.mega-level-all:hover::after { background-position: calc(50% + 3px) 50% !important; }
/* ===== end mega pills ===== */