#header, #header .header-top, #header .header-nav, #header .header-bottom, #header .header-nav-full-width {
    overflow: visible !important;
}

/* --- THIẾT LẬP CHUNG --- */
.hibo-menu {
    flex: 1; display: flex; align-items: center; 
    background: transparent; border: none; position: relative; z-index: 99999;
    padding-left: 15px; 
}
.hibo-menu-root, .hibo-menu-root ul { margin: 0; padding: 0; list-style: none; }

/* --- DESKTOP --- */
@media (min-width: 768px) {
    .hibo-menu-toggle, .hibo-menu-header-mobile { display: none !important; }
    .hibo-menu-overlay { display: flex; width: 100%; align-items: center; height: 100%; }
    
    .hibo-menu-root {
        display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap;
    }
    
    .hibo-menu-item { position: relative; }
    /* CHỈ Cấp 1 mới dùng flex ngang để nằm trên thanh header */
    .hibo-menu-root > .hibo-menu-item { display: flex; align-items: center; height: 100%; } 
    /* Cấp 2 và 3 phải dùng block để rớt dòng thành danh sách dọc */
    .hibo-submenu .hibo-menu-item { display: block; } 
    
    .hibo-menu-item.is-mega-menu { position: static; } 
    
    .hibo-menu-link-wrap { display: block; }
    .hibo-menu-link-wrap > a {
        display: block; padding: 14px 18px; color: #232323; text-decoration: none; 
       font-weight: 900; font-size: 16px; line-height: 20px; white-space: nowrap; transition: color 0.2s ease;
    }
    .hibo-menu-link-wrap > a:hover { color: #2fb5d2; }
    .hibo-sub-toggle { display: none !important; }
    
    /* Bảng menu con - Thêm độ trễ khi rút chuột */
    .hibo-mega-panel {
        display: block; visibility: hidden; opacity: 0; pointer-events: none; position: absolute; 
        top: 100%; left: 0; transform: translateY(15px);
        background: #ffffff; border: 1px solid #eeeeee; box-shadow: 0 8px 24px rgba(0,0,0,0.12); z-index: 99999;
        /* Delay giữ menu mở thêm khoảng 0.2s khi chuột rời đi */
        transition: opacity 0.2s ease 0.15s, transform 0.2s ease 0.15s, visibility 0s linear 0.35s;
    }
    
    /* Tạo "cây cầu vô hình" lấp khoảng trống phía trên bảng menu con */
    .hibo-mega-panel::before {
        content: ""; 
        position: absolute; 
        top: -25px; /* Vươn lên trên 25px để đón chuột */
        left: 0; 
        width: 100%; 
        height: 25px; 
        background: transparent;
    }
    
    /* Trạng thái Hover - Hiện ra ngay lập tức không trễ */
    .hibo-menu-item:hover > .hibo-mega-panel { 
        visibility: visible; opacity: 1; pointer-events: auto; transform: translateY(0); 
        /* Khi rê chuột vào thì override delay về 0s */
        transition: opacity 0.2s ease 0s, transform 0.2s ease 0s, visibility 0s linear 0s;
    }
    .hibo-mega-container { padding: 18px 20px; }
    
    /* MEGA MENU (Dành cho loại 3 cấp) */
    .is-mega-menu > .hibo-mega-panel { width: 100%; left: 0; right: 0; }
    .is-mega-menu .hibo-submenu {
        display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px 30px; align-items: start;
    }
    .is-mega-menu .level-2 > .hibo-menu-link-wrap > a {
        font-weight: 700; font-size: 14px; text-transform: uppercase; color: #333;
        border-bottom: 2px solid #f0f0f0; margin-bottom: 8px; padding: 0 0 8px 0; display: block;
    }
    .is-mega-menu .level-2 > .hibo-menu-link-wrap > a:hover { color: #d0112b; }
    
    /* SIMPLE MENU (Dành cho loại 2 cấp) */
    .is-simple-menu > .hibo-mega-panel { width: 240px; }
    .is-simple-menu .hibo-submenu { display: block; }
    .is-simple-menu .level-2 > .hibo-menu-link-wrap > a {
        padding: 8px 0; font-size: 14px; color: #232323; display: block; border-bottom: 1px solid #f9f9f9;
    }
    .is-simple-menu .level-2 > .hibo-menu-link-wrap > a:hover { color: #2fb5d2; padding-left: 5px; }
    
    /* Danh sách Cấp 3 */
    .hibo-level-3-menu { list-style: none; padding: 0; margin: 0; display: block; }
    .hibo-level-3-menu .level-3 > .hibo-menu-link-wrap > a {
        padding: 6px 0; font-size: 14px; color: #666; display: block; white-space: normal;
    }
    .hibo-level-3-menu .level-3 > .hibo-menu-link-wrap > a:hover { color: #2fb5d2; }
}

/* --- MOBILE --- */
@media (max-width: 767px) {
    #_mobile_logo, #header .logo { margin-left: 50px !important; }
    .hibo-menu { position: static; padding: 0; }
    
    /* Icon 3 gạch */
    .hibo-menu-toggle {
        display: flex !important; align-items: center; justify-content: center; 
        width: 45px; height: 45px; margin: 0; padding: 0; background: transparent !important; border: none !important; cursor: pointer;
        position: absolute; 
        left: 10px; 
        top: 0px; /* Dùng số dương để nút nằm ngay vị trí thanh header thay vì bị văng lên trên */
        z-index: 99999;
    }
    .hibo-menu-toggle .hamburger-lines { display: flex; flex-direction: column; gap: 5px; }
    .hibo-menu-toggle .hamburger-lines span { display: block; width: 24px; height: 2px; background: #232323; }
    .hibo-menu-toggle .menu-txt { display: none; }
    
    /* Menu Overlay Mobile */
    .hibo-menu-overlay {
        position: fixed; top: 0; left: -100%; width: 100vw; height: 100vh; 
        background: #ffffff; z-index: 999999; display: flex; flex-direction: column;
        transition: left 0.3s ease; overflow-y: auto;
    }
    .hibo-menu.is-open .hibo-menu-overlay { left: 0; }
    
    .hibo-menu-header-mobile {
        display: flex; justify-content: space-between; align-items: center;
        padding: 15px 20px; border-bottom: 1px solid #eeeeee; background: #f8f9fa;
    }
    .hibo-menu-header-mobile span { font-weight: bold; font-size: 16px; text-transform: uppercase; color: #333; }
    .hibo-menu-close { background: none; border: none; font-size: 32px; line-height: 1; cursor: pointer; color: #555; padding: 0; }
    
    .hibo-menu-root { display: block !important; width: 100%; flex: 1; }
    .hibo-menu-item { display: block; width: 100%; }
    .hibo-menu-link-wrap { display: flex !important; align-items: center; justify-content: space-between; border-bottom: 1px solid #eeeeee; width: 100%; }
    .hibo-menu-link-wrap > a { flex: 1; display: block; padding: 15px 20px; color: #232323; text-decoration: none; font-size: 15px; }
    
    .hibo-sub-toggle {
        display: flex !important; align-items: center; justify-content: center; width: 50px; height: 50px; border: 0 !important; border-left: 1px solid #eeeeee !important;
        background: transparent !important; color: #232323 !important; font-size: 22px; cursor: pointer; padding: 0; margin: 0;
    }
    
    .hibo-mega-panel { display: none !important; background: #fafafa; width: 100%; }
    .level-1.is-open > .hibo-mega-panel { display: block !important; }
    
    .hibo-level-3-menu { display: none; background: #f0f0f0; }
    .level-2.is-open > .hibo-level-3-menu { display: block; }
    
    .hibo-submenu .level-2 > .hibo-menu-link-wrap > a { padding-left: 30px; font-size: 15px; font-weight: 500; }
    .hibo-level-3-menu .level-3 > .hibo-menu-link-wrap > a { padding-left: 45px; font-size: 14px; color: #666; }
}