/* Apply border-box globally to all menu and navigation elements to prevent padding from expanding width */
/* Own base rules: no GeneratePress navigation stylesheet or plugin modal required. */
#bhld-navigation{font-family:Arial,Helvetica,sans-serif;font-size:14px;font-weight:500}
#bhld-navigation a{text-decoration:none;text-transform:uppercase}
#bhld-navigation .main-nav>ul>li>a{white-space:nowrap}
@media(min-width:769px) and (max-width:1400px){#bhld-navigation .main-nav>ul>li>a{padding-left:12px;padding-right:12px;margin:0 2px}#bhld-navigation .main-nav>ul>li.menu-item-has-children>a{padding-right:24px}#bhld-navigation .main-nav>ul>li>a i{margin-right:6px}#bhld-navigation .main-nav ul li.bgdp-menu-search-wrapper a.bgdp-search-toggle{padding:8px 12px;margin:0 4px}}
#bhld-navigation ul{list-style:none;margin:0;padding:0}
#bhld-navigation li{position:relative}
#bhld-navigation .inside-navigation{max-width:1400px;margin:auto}
#bhld-navigation .main-nav ul ul{position:absolute;top:100%;left:0;min-width:220px;z-index:100;list-style:none}
#bhld-navigation .main-nav ul ul ul{top:0;left:100%}
#bhld-navigation .main-nav li:focus-within>ul{opacity:1;visibility:visible;transform:none}
#bhld-navigation .main-nav li.bgdp-submenu-open>ul{opacity:1;visibility:visible;transform:none}
#bhld-navigation .bhld-submenu-toggle{background:transparent;border:0;color:rgba(255,255,255,.9);padding:4px;cursor:pointer;position:absolute;right:0;top:12px;line-height:1;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;font-size:12px}
#bhld-navigation .bhld-submenu-toggle i{margin:0;line-height:1;transition:transform .2s}
#bhld-navigation .main-nav ul ul .bhld-submenu-toggle{color:#006633}
/* Mũi tên và liên kết cùng dùng trạng thái hover của mục li. */
#bhld-navigation .bhld-submenu-toggle i{color:inherit}
@media(min-width:769px){
#bhld-navigation .main-nav>ul>li:is(:hover,:focus-within)>.bhld-submenu-toggle{color:#fff}
#bhld-navigation .main-nav ul ul li:is(:hover,:focus-within)>.bhld-submenu-toggle{color:#fff}
}
#bhld-navigation .bhld-submenu-toggle[aria-expanded="true"] i{transform:rotate(180deg)}
@media(min-width:769px){#bhld-navigation .bhld-submenu-toggle{top:50%;transform:translateY(-50%)}}
#bhld-navigation li.menu-item-has-children>a{padding-right:28px}
#bhld-navigation a:focus-visible,#bhld-navigation button:focus-visible,[data-bhld-header] button:focus-visible,.bhld-search :focus-visible{outline:2px solid #f59e0b;outline-offset:3px}
body.bhld-nav-locked{overflow:hidden!important}
.bhld-search[hidden]{display:none!important}
.bhld-search{position:fixed;inset:0;z-index:1000011;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:20px;font-family:Arial,Helvetica,sans-serif}
.bhld-search-panel{position:relative;max-width:600px;width:100%;background:#fff;border-radius:24px;box-shadow:0 25px 50px -12px #0004;overflow:auto;max-height:100%;color:#0f172a}
#bhld-search .bhld-search-close,#bhld-search .bhld-search-close:is(:hover,:focus,:active){position:absolute;right:12px;top:10px;border:0;border-radius:0;background:transparent;color:#000;width:32px;height:32px;font-size:28px;line-height:1;padding:0;box-shadow:none;cursor:pointer;display:grid;place-items:center}
.bhld-search-heading{padding:35px 25px 0;text-align:center}
.bhld-search-heading h3{font-size:24px;font-weight:600;margin:0}
.bhld-search-heading p{margin:10px 0 0;color:#333333;font-size:17px}
.bhld-search-body{padding:40px 30px}
.bhld-search form{position:relative;display:flex;align-items:center}
.bhld-search input{width:100%;padding:18px 100px 18px 25px!important;border-radius:50px!important;border:2px solid #f1f5f9;background:#f8fafc;font-size:18px;color:#1e293b;box-sizing:border-box}
.bhld-search input:focus{outline:none;border-color:#006633;background:white;box-shadow:0 0 0 4px #00663319}
.bhld-search form button[type="submit"]{position:absolute;right:8px;background:#006633;color:#fff;border:0;width:48px;height:48px;border-radius:50%;cursor:pointer;padding:0}
.bhld-search-suggestions{margin-top:25px;display:flex;gap:10px;flex-wrap:wrap;justify-content:center;font-size:13px;color:#64748b}
.bhld-search-suggestions a{color:#64748b;text-decoration:none;border-bottom:1px dashed #cbd5e1}
@media(max-width:768px){
#bhld-navigation .main-nav ul ul,#bhld-navigation .main-nav ul ul ul{position:static;min-width:0;left:auto}
#bhld-navigation .bhld-submenu-toggle{right:10px;top:5px;color:#006633;font-size:14px;padding:10px;width:40px;height:40px}
#bhld-navigation li.menu-item-has-children>a{padding-right:65px}
#bhld-navigation .main-nav li.bgdp-submenu-open>ul{max-height:none;visibility:visible;opacity:1;pointer-events:auto}
.bhld-search{padding:0;align-items:stretch}.bhld-search-panel{max-width:none;min-height:100%;border-radius:0}.bhld-search-body{padding:30px 16px}
}
@media(prefers-reduced-motion:reduce){#bhld-navigation *,[data-bhld-header] *{animation:none!important;transition:none!important}}

.main-navigation,
.main-navigation *,
.main-nav,
.main-nav *,
.inside-navigation,
.inside-navigation *,
.navigation-clone,
.navigation-clone *,
.sticky-navigation,
.sticky-navigation *,
.sf-menu,
.sf-menu *,
.menu-item,
.menu-item *,
.sub-menu,
.sub-menu *,
#bgdp-custom-mobile-header,
#bgdp-custom-mobile-header * {
    box-sizing: border-box;
}

/* Hide all mobile header and mobile menu elements on desktop by default */
#bgdp-custom-mobile-header {
    display: none !important;
}

@media (min-width: 769px) {
    #bgdp-custom-mobile-header,
    #mobile-header,
    .mobile-header-navigation,
    .menu-toggle,
    .mobile-menu-control-wrapper,
    .mobile-bar-items {
        display: none !important;
    }
}

/* Main Navigation Background */
.main-navigation {
    background: linear-gradient(90deg, #004d26 0%, #006633 50%, #005229 100%);
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

@media (min-width: 769px) {
    .main-navigation {
        height: 65px; /* Tăng nhẹ chiều cao để trông thoáng đãng hơn */
        display: flex;
        align-items: center;
        position: sticky;
        top: 0;
        z-index: 9998;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    }

    .main-navigation .inside-navigation {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .main-navigation .main-nav {
        display: flex;
        align-items: center;
        flex: 0 1 auto;
        justify-content: center;
    }

    /* Center menu items vertically and prevent stretching */
    .main-navigation .main-nav>ul {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0;
        flex-wrap: nowrap;
    }

    .main-navigation .main-nav>ul>li {
        display: flex;
        align-items: center;
    }

    /* Top-level Menu Items (Fixed Height via Padding) */
    .main-navigation .main-nav > ul > li > a {
        position: relative;
        letter-spacing: 0.2px;
        transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
        line-height: normal;
        padding: 10px 18px;
        margin: 0 3px;
        border-radius: 8px;
        color: rgba(255, 255, 255, 0.9);
        display: inline-flex;
        align-items: center;
    }

    /* Top-level Menu Items Icon Spacing */
    .main-navigation .main-nav > ul > li > a i {
        margin-right: 8px;
        font-size: 1.1em;
        display: inline-block;
    }

    /* Top-level Menu Item Underline Hover Effect */
    .main-navigation .main-nav > ul > li > a::after {
        content: '';
        position: absolute;
        bottom: 4px;
        left: 50%;
        width: 0;
        height: 3px;
        background-color: #ffffff;
        border-radius: 4px;
        transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
        opacity: 0;
    }

    /* Hover State for Top-level Items */
    .main-navigation .main-nav > ul > li:hover > a {
        background-color: #336699;
        color: #ffffff;
        transform: translateY(-1px);
    }

    .main-navigation .main-nav > ul > li:hover > a::after {
        width: 60%;
        left: 20%;
        opacity: 1;
        box-shadow: 0 0 10px rgba(255, 255, 255, 0.7);
    }

    /* Active State Indicator */
    .main-navigation .main-nav > ul > li.current-menu-item > a,
    .main-navigation .main-nav > ul > li.current-menu-ancestor > a {
        background-color: rgba(255, 255, 255, 0.08);
        color: #ffffff;
    }

    .main-navigation .main-nav > ul > li.current-menu-item > a::after,
    .main-navigation .main-nav > ul > li.current-menu-ancestor > a::after {
        width: 60%;
        left: 20%;
        opacity: 1;
    }

    /* =========================================================
       SEARCH MENU ITEM REWRITE (Desktop)
       ========================================================= */

    /* Main Toggle Button Sync */
    .main-navigation .main-nav ul li.bgdp-menu-search-wrapper a.bgdp-search-toggle {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 8px 16px;
        margin: 0 8px;
        border-radius: 50px; /* Dạng viên thuốc */
        line-height: normal;
        text-decoration: none;
        background: rgba(255, 255, 255, 0.12);
        color: #ffffff;
        border: 1px solid rgba(255, 255, 255, 0.15);
        transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    }

    /* Hover Effect for Search Item */
    .main-navigation .main-nav ul li.bgdp-menu-search-wrapper:hover a.bgdp-search-toggle {
        background-color: #ffffff;
        color: #006633;
        border-color: #ffffff;
        box-shadow: 0 4px 15px rgba(255, 255, 255, 0.25);
        transform: translateY(-1px);
        animation: bgdpSearchWigglePremium 0.4s ease-in-out;
    }

    /* Icon & Text Sync
       Markup thuc te dung <span class="bgdp_icon fa-solid ..."> chu KHONG phai .dashicons,
       nen truoc day khoi nay khong ap vao dau -> icon khong duoc dat chieu rong.
       Font Awesome tai tu CDN ve tre, glyph chua ve thi o icon rong 0 roi bung ra ~20px,
       lam nut search (nam cuoi menu) giut mot cai khi hien thi.
       Dat width + min-width + line-height co dinh de giu cho san, het giut. */
    .main-navigation .main-nav ul li.bgdp-menu-search-wrapper .bgdp_icon {
        font-size: 16px;
        width: 16px;
        min-width: 16px;
        height: 16px;
        line-height: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: transform 0.3s ease;
    }

    .main-navigation .main-nav ul li.bgdp-menu-search-wrapper:hover .bgdp_icon {
        transform: scale(1.1);
    }

    .main-navigation .main-nav ul li.bgdp-menu-search-wrapper .bgdp-search-text {
        font-size: inherit;
        font-weight: inherit;
        text-transform: inherit;
    }
}

@keyframes bgdpSearchWigglePremium {
    0%, 100% { transform: translateY(-1px) rotate(0deg); }
    20% { transform: translateY(-1px) rotate(-6deg); }
    40% { transform: translateY(-1px) rotate(5deg); }
    60% { transform: translateY(-1px) rotate(-3deg); }
    80% { transform: translateY(-1px) rotate(2deg); }
}

@media (min-width: 769px) {
    /* Sub-menu (Dropdown) Container */
    .main-navigation ul ul {
        background: rgba(255, 255, 255, 0.96);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        border-radius: 12px;
        border: 1px solid rgba(0, 0, 0, 0.06);
        box-shadow: 0 15px 35px rgba(0, 0, 0, 0.12);
        padding: 10px 0;
        display: block;
        
        /* Hoạt ảnh mượt mà */
        opacity: 0;
        visibility: hidden;
        transform: translateY(12px);
        transition: opacity 0.25s cubic-bezier(0.25, 0.8, 0.25, 1), 
                    transform 0.25s cubic-bezier(0.25, 0.8, 0.25, 1), 
                    visibility 0.25s;
    }

    /* Show Dropdown on Hover */
    .main-navigation .main-nav ul li:hover > ul {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    /* Sub-menu Item links */
    .main-navigation .main-nav ul ul li a {
        color: #334155;
        padding: 11px 20px;
        border-left: 3px solid transparent;
        transition: all 0.25s ease;
        border-radius: 0;
        margin: 0;
        line-height: 1.4;
        display: flex;
        align-items: center;
    }

    /* Sub-menu Item Icon Spacing */
    .main-navigation .main-nav ul ul li a i {
        margin-right: 8px;
        font-size: 1.1em;
        display: inline-block;
    }

    /* Sub-menu Item Hover state */
    .main-navigation .main-nav ul ul li:hover > a {
        background-color: #f0fdf4;
        color: #006633;
        border-left-color: #006633;
        padding-left: 23px; /* Dịch nhẹ chữ sang phải khi hover */
    }
}

/* Responsive adjustment to prevent desktop menu items from wrapping on medium screens (laptops/tablets) */
@media (min-width: 769px) and (max-width: 1100px) {
    .main-navigation .main-nav > ul > li > a {
        padding: 10px 10px;
        font-size: 14px;
        margin: 0 1px;
    }
    
    .main-navigation .main-nav ul li.bgdp-menu-search-wrapper a.bgdp-search-toggle {
        padding: 8px 10px;
        margin: 0 4px;
    }
}

.main-navigation .bgdp-mobile-menu-popup-close {
    display: none;
}

/* =========================================================
   GENERATEPRESS MOBILE HEADER
   ========================================================= */

@media (max-width: 768px) {
    /* 1. Prevent body overflow */
    html, body {
        overflow-x: hidden;
        max-width: 100vw;
    }

    body.bgdp-menu-open {
        overflow: hidden !important;
    }

    /* 2. Display Custom Mobile Header */
    #bgdp-custom-mobile-header {
        display: block !important;
        background: #006633;
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
        position: relative;
        z-index: 999999;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    }

    #bgdp-custom-mobile-header .bgdp-mobile-header-inside {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        padding: 8px 12px;
        min-height: 64px;
        box-sizing: border-box;
    }

    /* Logo Styling */
    #bgdp-custom-mobile-header .mobile-logo-wrap {
        display: flex;
        align-items: center;
        flex: 0 1 32%;
        min-width: 0;
        order: 1;
    }

    #bgdp-custom-mobile-header .mobile-logo-wrap a {
        display: flex;
        align-items: center;
        min-width: 0;
    }

    #bgdp-custom-mobile-header .mobile-logo-wrap img {
        height: auto;
        width: auto;
        display: block;
        max-width: min(132px, 100%);
        max-height: 46px;
    }

    /* Actions Styling */
    #bgdp-custom-mobile-header .mobile-actions-wrap {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        flex: 1 1 0;
        min-width: 0;
        margin-left: 0;
        order: 2;
    }

    #bgdp-custom-mobile-header .mobile-search-btn {
        width: 34px;
        height: 34px;
        flex: 0 0 34px;
        order: 2;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.15);
        border: 1px solid rgba(255, 255, 255, 0.25);
        color: #ffffff;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        padding: 0;
        transition: background 0.3s;
    }

    #bgdp-custom-mobile-header .mobile-search-btn:hover {
        background: rgba(255, 255, 255, 0.25);
    }

    #bgdp-custom-mobile-header .mobile-search-btn .dashicons {
        font-size: 18px;
        width: 18px;
        height: 18px;
        line-height: 18px;
    }

    #bgdp-custom-mobile-header .mobile-hotline-btn {
        background: #ffffff;
        color: #006633;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        font-weight: 700;
        font-size: 16px;
        line-height: 1;
        min-height: 40px;
        padding: 10px 16px;
        border-radius: 30px;
        text-decoration: none;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12);
        transition: transform 0.2s, box-shadow 0.2s;
        white-space: nowrap;
        flex: 1 1 auto;
        min-width: 0;
        order: 1;
    }

    #bgdp-custom-mobile-header .mobile-hotline-btn .dashicons {
        font-size: 20px;
        width: 20px;
        height: 20px;
        line-height: 20px;
        flex: 0 0 20px;
    }

    #bgdp-custom-mobile-header .mobile-hotline-text {
        overflow: hidden;
        text-overflow: ellipsis;
    }

    #bgdp-custom-mobile-header .mobile-hotline-btn:active {
        transform: scale(0.95);
    }

    /* Menu Toggle Button & Hamburger */
    #bgdp-custom-mobile-header .mobile-menu-wrap {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex: 0 0 38px;
        order: 3;
        margin-left: 0;
    }

    body.bgdp-shop-page #bgdp-custom-mobile-header,
    body.bgdp-shop-page .site-header,
    body.bgdp-shop-page #mobile-header,
    body.bgdp-shop-page .mobile-header-navigation,
    body.bgdp-shop-page .main-navigation {
        display: none !important;
    }

    #bgdp-custom-mobile-header .bgdp-custom-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        background: transparent;
        border: none;
        box-shadow: none;
        cursor: pointer;
        padding: 0;
        outline: none;
    }

    @media (max-width: 420px) {
        #bgdp-custom-mobile-header .bgdp-mobile-header-inside {
            gap: 6px;
            padding-right: 10px;
            padding-left: 10px;
        }

        #bgdp-custom-mobile-header .mobile-logo-wrap {
            flex-basis: 28%;
        }

        #bgdp-custom-mobile-header .mobile-logo-wrap img {
            max-width: 108px;
            max-height: 42px;
        }

        #bgdp-custom-mobile-header .mobile-actions-wrap {
            gap: 6px;
        }

        #bgdp-custom-mobile-header .mobile-search-btn {
            width: 32px;
            height: 32px;
            flex-basis: 32px;
        }

        #bgdp-custom-mobile-header .mobile-hotline-btn {
            gap: 6px;
            font-size: 14px;
            min-height: 38px;
            padding: 9px 12px;
        }

        #bgdp-custom-mobile-header .mobile-hotline-btn .dashicons {
            font-size: 18px;
            width: 18px;
            height: 18px;
            line-height: 18px;
            flex-basis: 18px;
        }
    }

    @media (max-width: 360px) {
        #bgdp-custom-mobile-header .mobile-logo-wrap img {
            max-width: 88px;
        }

        #bgdp-custom-mobile-header .mobile-hotline-btn {
            font-size: 13px;
            padding-right: 8px;
            padding-left: 8px;
        }
    }

    #bgdp-custom-mobile-header .bgdp-hamburger {
        display: block;
        position: relative;
        width: 24px;
        height: 18px;
    }

    #bgdp-custom-mobile-header .bgdp-hamburger span {
        display: block;
        position: absolute;
        height: 2.5px;
        width: 100%;
        background-color: #ffffff;
        border-radius: 4px;
        opacity: 1;
        left: 0;
        transform: rotate(0deg);
        transition: all 0.25s cubic-bezier(0.25, 0.8, 0.25, 1);
    }

    #bgdp-custom-mobile-header .bgdp-hamburger span:nth-child(1) {
        top: 0px;
    }

    #bgdp-custom-mobile-header .bgdp-hamburger span:nth-child(2) {
        top: 8px;
    }

    #bgdp-custom-mobile-header .bgdp-hamburger span:nth-child(3) {
        top: 16px;
    }

    /* Animated Close Icon */
    body.bgdp-menu-open #bgdp-custom-mobile-header .bgdp-hamburger span:nth-child(1) {
        top: 8px;
        transform: rotate(135deg);
    }

    body.bgdp-menu-open #bgdp-custom-mobile-header .bgdp-hamburger span:nth-child(2) {
        opacity: 0;
        left: -60px;
    }

    body.bgdp-menu-open #bgdp-custom-mobile-header .bgdp-hamburger span:nth-child(3) {
        top: 8px;
        transform: rotate(-135deg);
    }

    /* 3. Hide Default GP Theme Header elements on Mobile */
    #mobile-header,
    .mobile-header-navigation,
    .main-navigation .menu-toggle,
    .main-navigation .mobile-bar-items,
    .site-header .main-navigation .menu-toggle,
    .site-header .mobile-bar-items,
    .sidebar-nav-mobile:not(#sticky-placeholder),
    .mobile-menu-control-wrapper {
        display: none !important;
    }

    .site-header {
        display: block !important;
        visibility: visible !important;
        height: auto !important;
        overflow: visible !important;
    }

    /* 4. Mobile Main Navigation styling */
    .main-navigation {
        display: none !important;
        align-items: stretch;
        justify-content: stretch;
        background: rgba(0, 0, 0, 0.6);
        position: fixed;
        inset: 0;
        z-index: 1000010;
        width: 100vw;
        height: 100vh;
        height: 100dvh;
        max-width: 100vw;
        padding: 0;
        overflow: hidden;
        box-sizing: border-box;
        border: 0;
        -webkit-backdrop-filter: blur(4px);
        backdrop-filter: blur(4px);
    }

    body.bgdp-menu-open .main-navigation,
    .main-navigation.toggled {
        display: flex !important;
        max-height: none;
        overflow: hidden;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        animation: bgdpMenuPopupFade 0.25s ease;
        box-shadow: none;
    }

    @keyframes bgdpMenuPopupFade {
        from { opacity: 0; }
        to { opacity: 1; }
    }

    .main-navigation .inside-navigation {
        display: block;
        position: relative;
        min-height: 100%;
        height: 100%;
        padding: 52px 0 0;
        width: 100%;
        max-width: none;
        background: #ffffff;
        border-radius: 0;
        overflow-x: hidden;
        overflow-y: auto;
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.4);
        transform: scale(0.9);
        transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
        -webkit-overflow-scrolling: touch;
        box-sizing: border-box;
    }

    body.bgdp-menu-open .main-navigation .inside-navigation,
    .main-navigation.toggled .inside-navigation {
        transform: scale(1);
        animation: bgdpMenuPopupPop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    }

    /* Pop container tin cay (transition khong chay khi mo tu display:none) - dong bo voi search modal */
    @keyframes bgdpMenuPopupPop {
        from { transform: scale(0.9); }
        to { transform: scale(1); }
    }

    .main-navigation .bgdp-mobile-menu-popup-close {
        position: absolute;
        top: 10px;
        right: 10px;
        width: 32px;
        height: 32px;
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.9);
        color: #64748b;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        line-height: 1;
        cursor: pointer;
        z-index: 20;
        transition: all 0.2s ease;
    }

    .main-navigation .bgdp-mobile-menu-popup-close:hover,
    .main-navigation .bgdp-mobile-menu-popup-close:focus {
        background: #ffffff;
        color: #ef4444;
        transform: rotate(90deg);
    }

    .main-navigation .main-nav {
        width: 100%;
        max-width: 100vw;
        margin: 0;
        background: #ffffff;
        padding-bottom: calc(16px + env(safe-area-inset-bottom));
        overflow-x: hidden;
        box-sizing: border-box;
    }

    .main-navigation .main-nav > ul {
        display: block;
        width: 100%;
        max-width: 100vw;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .main-navigation .main-nav ul li {
        display: block;
        width: 100%;
        position: relative;
        margin: 0;
        box-sizing: border-box;
    }

    /* 5. Menu Links Level 1 */
    .main-navigation .main-nav > ul > li > a {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
        min-height: 46px;
        padding: 12px 16px;
        font-size: 14px;
        font-weight: 500;
        line-height: 1.25;
        color: #0f172a;
        background: #ffffff;
        border-bottom: 1px solid #e5e7eb;
        transition: background 0.2s, color 0.2s;
        box-sizing: border-box;
    }

    .main-navigation .main-nav ul li > a > i,
    .main-navigation .main-nav ul li > a > .dashicons,
    .main-navigation .main-nav ul li > a > .fa,
    .main-navigation .main-nav ul li > a > .fas,
    .main-navigation .main-nav ul li > a > .far,
    .main-navigation .main-nav ul li > a > .fab,
    .main-navigation .main-nav ul li > a > .gp-icon,
    .main-navigation .main-nav ul li > a > svg,
    .main-navigation .main-nav ul li > a > .menu-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 18px;
        min-width: 18px;
        margin-right: 8px;
        line-height: 1;
        text-align: center;
    }

    .main-navigation .main-nav ul li > a > .dropdown-menu-toggle,
    .main-navigation .main-nav ul li > a > .dropdown-menu-toggle .gp-icon {
        margin-right: 0;
    }

    .main-navigation .main-nav > ul > li > a:hover,
    .main-navigation .main-nav > ul > li.current-menu-item > a,
    .main-navigation .main-nav > ul > li.current-menu-ancestor > a {
        background: #f0fdf4;
        color: #006633;
    }

    /* 6. Accordion Submenu Panel */
    body.bgdp-menu-open .main-navigation .main-nav ul ul,
    .main-navigation.toggled .main-nav ul ul {
        display: block; /* Keep display block to support transitions */
        position: static;
        width: 100%;
        max-height: 0;
        overflow: hidden;
        visibility: hidden;
        opacity: 0;
        pointer-events: none;
        background: #f8fafc;
        border: 0;
        margin: 0;
        padding: 0;
        box-shadow: none;
        box-sizing: border-box;
        left: auto;
        right: auto;
        top: auto;
        height: auto;
        transform: none;
        transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1), 
                    opacity 0.25s ease, 
                    visibility 0.25s;
    }

    /* Opened Submenu state */
    body.bgdp-menu-open .main-navigation .main-nav li.bgdp-submenu-open > ul,
    body.bgdp-menu-open .main-navigation .main-nav li.sfHover > ul,
    body.bgdp-menu-open .main-navigation .main-nav ul ul.toggled-on,
    .main-navigation.toggled .main-nav ul ul.toggled-on {
        max-height: 800px; /* Large height limit for nested submenus */
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
        border-bottom: 1px solid #e5e7eb;
    }

    /* Submenu Links Level 2 */
    .main-navigation .main-nav ul ul li a {
        display: flex;
        align-items: center;
        width: 100%;
        min-height: 42px;
        padding: 10px 16px 10px 32px; /* Indent Level 2 */
        font-size: 13px;
        font-weight: 400;
        line-height: 1.25;
        color: #334155;
        background: #f8fafc;
        border-bottom: 1px solid #f1f5f9;
        border-left: 4px solid transparent;
        transition: all 0.2s ease;
        box-sizing: border-box;
    }

    /* Submenu Links Level 3 */
    .main-navigation .main-nav ul ul ul li a {
        padding-left: 48px; /* Indent Level 3 */
        background: #f1f5f9;
        font-size: 13px;
    }

    /* Submenu Link Hover & Active state */
    .main-navigation .main-nav ul ul li a:hover,
    .main-navigation .main-nav ul ul li.current-menu-item > a {
        background: #ecfdf5;
        color: #006633;
        border-left-color: #006633;
    }

    /* 7. Dropdown Toggle Arrow Button */
    .main-navigation .main-nav ul li.menu-item-has-children > a {
        padding-right: 52px; /* Leave space for toggle button */
        position: relative;
    }

    .main-navigation .dropdown-menu-toggle {
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        width: 48px;
        height: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        touch-action: manipulation;
        background: transparent;
        border-left: 1px solid #f1f5f9;
        color: #64748b;
        z-index: 10;
        transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), color 0.3s ease;
        box-sizing: border-box;
    }

    .main-navigation .dropdown-menu-toggle::before {
        text-align: center;
        width: auto;
        margin: 0;
        display: inline-block;
    }

    /* Rotation on Open */
    .main-navigation .main-nav ul li.bgdp-submenu-open > a > .dropdown-menu-toggle,
    .main-navigation .main-nav ul li.bgdp-submenu-open > .dropdown-menu-toggle,
    .main-navigation .main-nav ul li.sfHover > a > .dropdown-menu-toggle,
    .main-navigation .main-nav ul li.sfHover > .dropdown-menu-toggle {
        transform: rotate(180deg);
        color: #006633;
        border-left-color: transparent;
    }

    /* 8. Utility classes hiding */
    .main-navigation .main-nav ul li.bgdp-menu-search-wrapper,
    .main-navigation .main-nav ul li.current-menu-item>a::after,
    .main-navigation .main-nav ul li.current-menu-ancestor>a::after {
        display: none !important;
    }
}

/* Override parent theme dropdown toggle spacing */
.menu-item-has-children ul .dropdown-menu-toggle {
    margin-top: 0 !important;
}


/* Desktop: menu cấp đầu mở xuống, menu lồng bên trong mở sang phải.
   Giữ hướng sang phải cả khi nút được bấm; mobile vẫn xoay lên/xuống. */
@media (min-width: 769px) {
    #bhld-navigation .main-nav ul ul .bhld-submenu-toggle i {
        transform: rotate(-90deg);
    }
    #bhld-navigation .main-nav ul ul li.menu-item-has-children > a {
        padding-right: 36px;
    }
    #bhld-navigation .main-nav ul ul .bhld-submenu-toggle {
        right: 8px;
    }
}

/* Trạng thái chung của hàng menu con desktop: nền xanh, icon/chữ trắng.
   Nút mũi tên vẫn trong suốt, không tạo mảng nền riêng khi hover. */
@media (min-width: 769px) {
    #bhld-navigation .main-nav ul ul li:is(:hover, :focus-within) > a {
        background: #006633;
        color: #fff;
        border-left-color: #006633;
    }
    #bhld-navigation .main-nav ul ul li:is(:hover, :focus-within) > a i {
        color: inherit;
    }
    #bhld-navigation .main-nav ul ul li:is(:hover, :focus-within) > .bhld-submenu-toggle,
    #bhld-navigation .main-nav ul ul li:is(:hover, :focus-within) > .bhld-submenu-toggle i {
        color: #fff;
    }
    #bhld-navigation .main-nav .bhld-submenu-toggle:is(:hover, :focus-visible) {
        background: transparent;
    }
}

/* Màu mặc định mũi tên menu con desktop đồng bộ với liên kết. */
@media (min-width: 769px) {
    #bhld-navigation .main-nav ul ul li:not(:hover):not(:focus-within) > .bhld-submenu-toggle {
        color: #334155;
    }
}

/* Nút xóa đơn sắc, độc lập với kiểu button của theme gốc. */
#bhld-search input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
#bhld-search .bhld-search-clear,#bhld-search .bhld-search-clear:is(:hover,:focus,:active){position:absolute;right:64px;width:28px;height:32px;padding:0;border:0;border-radius:0;background:transparent;color:#000;box-shadow:none;font-size:26px;line-height:1;cursor:pointer;display:grid;place-items:center}
#bhld-search .bhld-search-clear[hidden]{display:none!important}
#bhld-search .bhld-search-clear span{color:inherit}