/* Phần MENU – khớp menu_page() trong gen.py (đo 26/10 ở 1440 và 390). Nạp khi hk_v2("menu"). */
.mega-nen,.ngan-dt{font-size:15px;line-height:1.55;color:#1A1F29;text-align:left;letter-spacing:0;text-transform:none}
.mega-nen button,.ngan-dt button{font-family:inherit;text-transform:none;letter-spacing:0;margin:0;min-height:0;box-shadow:none;cursor:pointer}
.mega-nen a,.ngan-dt a{text-decoration:none}
.hk-mega-li .header-vertical-menu__fly-out{display:none!important}

/* ---------- máy tính ---------- */
@media (min-width:850px){
  #wide-nav{position:relative}
  #wide-nav>.flex-row,#wide-nav .flex-col,#wide-nav .header-bottom-nav,#wide-nav li.hk-mega-li{position:static}
  #wide-nav li.hk-co-mega>.nav-dropdown{display:none!important}
  .hk-mega-li .mega-nen{display:none;position:absolute;left:0;right:0;top:calc(100% + 1px);z-index:30;background:#FFFFFF;box-shadow:0 12px 32px rgba(25,47,90,0.12);border-bottom:1px solid var(--hk-vien)}
  .hk-mega-li.mo .mega-nen{display:block}
  .hk-mega-li .mega-nen:after{content:"";position:absolute;left:0;right:0;top:100%;margin-top:1px;height:100vh;background:rgba(15,30,56,0.35);pointer-events:none}
  .mega{max-width:1240px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:280px minmax(0,1fr) 300px;min-height:420px}
  .mega-trai{display:flex;flex-direction:column;border-right:1px solid var(--hk-vien);padding:12px 0}
  #hk-mega .mega-trai button{display:flex;justify-content:space-between;align-items:center;font-size:15px;font-weight:500!important;line-height:23.25px;text-align:left;padding:12px 16px 12px 0;border:0;background:transparent;color:var(--hk-chu);border-radius:8px 0 0 8px;width:100%}
  #hk-mega .mega-trai button.dang{color:var(--hk-navy);font-weight:600!important;background:var(--hk-xam);padding-left:12px}
  .mega-giua{padding:20px 32px}
  .mega-tab{display:none}.mega-tab.dang{display:block}
  .mega-tieu{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}
  .mega-tieu b{font-size:20px;font-weight:600;line-height:31px}
  .mega-tieu a{font-weight:500;color:var(--hk-navy)}
  .mega-con{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 24px}
  .mega-con a{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid #F0F2F6;color:var(--hk-chu);font-size:15px;line-height:23.25px}
  .mega-con a:hover span{color:var(--hk-navy)}
  .mega-con em{font-style:normal;color:#7A828E;font-size:13px;line-height:20.15px;white-space:nowrap}
  .mega-phai-khung{display:flex;flex-direction:column}
  .mega-phai{display:none;flex:1;margin:20px 0;background:var(--hk-xam);border-radius:12px;padding:16px;flex-direction:column;gap:6px;color:var(--hk-chu)}
  .mega-phai.dang{display:flex}
  .mega-phai img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:8px;display:block}
  .mega-phai .meta{font-size:13px;line-height:20.15px;color:var(--hk-chu-phu)}
  .mega-phai>b{font-weight:600;font-size:15px;line-height:23.25px}
  .mega-phai .gia{display:flex}
  .mega-phai .gia b{font-size:16px;font-weight:600;line-height:24.8px;color:var(--hk-navy)}
  .ngan-dt{display:none}
  /* menu con còn lại (Câu chuyện, Cẩm nang): cùng kiểu chữ/khung với tấm mega */
  #wide-nav .header-bottom-nav>li>.nav-dropdown{border:0;border-radius:0 0 12px 12px;box-shadow:0 12px 32px rgba(25,47,90,0.12);padding:8px 0;min-width:240px}
  #wide-nav .header-bottom-nav>li>.nav-dropdown:before,#wide-nav .header-bottom-nav>li>.nav-dropdown:after{display:none}
  #wide-nav .header-bottom-nav .nav-dropdown li>a{font-size:15px;line-height:23.25px;font-weight:400;color:var(--hk-chu);text-transform:none;letter-spacing:0;padding:10px 20px;margin:0;border:0}
  #wide-nav .header-bottom-nav .nav-dropdown li>a:hover{color:var(--hk-navy);background:var(--hk-xam)}
}

/* ---------- điện thoại + tablet: ngăn phủ dưới header ---------- */
@media (max-width:849px){
  .mfp-wrap.off-canvas-left,.off-canvas-left~.mfp-bg,.mfp-bg.off-canvas-left{top:57px!important;height:calc(100% - 57px)!important}
  .off-canvas-left .mfp-content{width:100%!important;max-width:none!important;top:57px!important;height:calc(100% - 57px)!important}
  .off-canvas .mfp-content .mfp-close,.off-canvas-left .mfp-close{display:none!important}
  #main-menu.mobile-sidebar{background:#FFFFFF;padding:0;width:100%;max-width:none}
  #main-menu .sidebar-menu{display:none}
  .ngan-dt{display:flex;flex-direction:column;background:#FFFFFF;min-height:100%}
  .ngan-dau{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid var(--hk-vien)}
  .ngan-dau b{font-size:18px;font-weight:700;line-height:27.9px}
  #main-menu .ngan-dau button{width:40px;height:40px;padding:0;border:0;background:var(--hk-xam);border-radius:50%!important;font-size:16px;line-height:40px;color:#000000;display:flex;align-items:center;justify-content:center}
  .ngan-tim{margin:12px 16px 4px;display:flex;align-items:center;border:1px solid #D5DBE4;border-radius:10px;background:var(--hk-xam);overflow:hidden;height:42px}
  .ngan-tim input[type="search"]{flex:1;min-width:0;height:40px;margin:0;border:0;box-shadow:none;background:transparent;padding:9px 12px;font-size:14px;line-height:21.7px;color:var(--hk-chu);border-radius:0}
  .ngan-tim input::placeholder{color:#757575;opacity:1}
  #main-menu .ngan-tim button{width:42px;height:40px;padding:0;border:0;background:transparent;color:var(--hk-navy);display:flex;align-items:center;justify-content:center}
  .ngan-nhom{border-bottom:1px solid var(--hk-vien)}
  #main-menu .ngan-nhom>button{width:100%;display:flex;justify-content:space-between;align-items:center;padding:16px;font-size:16px;font-weight:500!important;line-height:24.8px;border:0;border-radius:0;background:#FFFFFF;color:var(--hk-chu);text-align:left}
  .ngan-nhom>button span:last-child:before{content:"+"}
  .ngan-nhom.mo>button span:last-child:before{content:"−"}
  .ngan-con{display:none;flex-direction:column;padding:0 16px 12px 28px;background:#FAFBFC}
  .ngan-nhom.mo .ngan-con{display:flex}
  .ngan-con a{padding:10px 0;color:#3A414C;font-size:15px;line-height:23.25px}
  .ngan-con a.tat-ca{color:var(--hk-navy);font-weight:600}
  .ngan-duoi{display:flex;flex-direction:column;padding:16px;gap:12px;background:var(--hk-xam)}
  .ngan-duoi a{color:var(--hk-chu);font-weight:500;line-height:23.25px}
  .mega-nen{display:none}
}