/* CSS */

/*
 * Elak pantulan skrol / scroll anchoring.
 * Elakkan scrollbar-gutter: stable + overflow-y: scroll pada html — kombinasi itu sering mencetuskan
 * skrol mendatar (viewport vs lebar kandungan + jalur scrollbar tidak sepadan).
 */
html {
    overscroll-behavior-y: none;
    overflow-anchor: none;
    /* Halang skrol mendatar keseluruhan halaman (lebih selamat daripada overflow-x pada body untuk sticky). */
    overflow-x: clip;
}

@supports not (overflow: clip) {
    html {
        overflow-x: hidden;
    }
}

body {
    overscroll-behavior-y: none;
    overflow-anchor: none;
}

/* Lajur grid dalam header: min-width:auto (lalai) tak benarkan mengecil — nav inline-block lebar melebihi skrin. */
#sticky-header.main-header-area .row > [class*="col-"] {
    min-width: 0;
}

#sticky-header.main-header-area .main-header-toolbar-inner,
#sticky-header.main-header-area .main-menu {
    min-width: 0;
}

/*
 * Header utama: paksa sticky geografi, bukan fixed+tema translateY.
 * Fixed header (tema asal) keluarkan elemen dari aliran → doc height & scrollMax berubah → “rebound”.
 */
#sticky-header.main-header-area {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 1000;
    background-color: #fff !important;
    transform: none !important;
    -webkit-transform: none !important;
}

.header-area .main-header-area.sticky {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 0 !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    transform: none !important;
    -webkit-transform: none !important;
    transition: none !important;
    box-shadow: 0 3px 16px rgba(0, 0, 0, 0.1);
}

.badge-0to20 {
    background-color: #e1fee1; /* Light green */
    color: #000000; /* Black text */
}

.badge-21to40 {
    background-color: #b5fcb5; /* Soft green */
    color: #000000; /* Black text */
}

.badge-41to60 {
    background-color: #84fb84; /* Medium green */
    color: #000000; /* Black text */
}

.badge-61to80 {
    background-color: #35f835; /* Moderate green */
    color: #000000; /* Black text */
}

.badge-81to100 {
    background-color: #069906; /* Dark green */
    color: #FFFFFF; /* White text */
}

/* Keep desktop dropdown trigger strictly on navbar line. */
.header-area .main-header-area .main-menu ul li .submenu {
    top: 100% !important;
    transition: opacity 0.2s ease, visibility 0.2s ease !important;
    pointer-events: none;
}

.header-area .main-header-area .main-menu ul li:hover > .submenu {
    top: 100% !important;
    pointer-events: auto;
}

/* Submenu section label — non-interactive divider */
.header-area .main-header-area .main-menu ul li .submenu li.submenu-section-title {
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: #94a3b8 !important;
    padding: .55rem 1rem .2rem;
    pointer-events: none;
    cursor: default;
    border-top: 1px solid #f1f5f9;
    margin-top: .25rem;
}
.header-area .main-header-area .main-menu ul li .submenu li.submenu-section-title:hover {
    background: transparent !important;
    color: #94a3b8 !important;
}

/* Top nav — active item (header latar putih; garisan tema asal putih tidak kelihatan) */
.header-area .main-header-area .main-menu ul#navigation > li > a.active,
.header-area .main-header-area .main-menu ul#navigation > li.nav-item-has-active > a {
    color: #242459 !important;
    font-weight: 600;
}

.header-area .main-header-area .main-menu ul#navigation > li > a.active::before,
.header-area .main-header-area .main-menu ul#navigation > li.nav-item-has-active > a::before {
    background: #242459 !important;
    opacity: 1 !important;
    transform: scaleX(1) !important;
}

.header-area .main-header-area .main-menu ul li .submenu li a.active {
    color: #ffffff !important;
    background-color: #242459 !important;
}

.slicknav_menu .slicknav_nav a.active {
    color: #242459 !important;
    font-weight: 600;
    background: #f1f5f9 !important;
}