
/* V212
   Desktop: cấp 1 luôn hiển thị trực tiếp trên menu ngang.
   Nếu có cấp 2: rê chuột hoặc tab/focus vào cấp 1 sẽ mở submenu.
   Cấp 2 là link thật và có thể click để xem.
*/
@media(min-width:981px){
  body:not(.admin-layout) .v212-nav-root{
    position:relative!important;
  }

  body:not(.admin-layout) .v212-nav-root>.v117-nav-link{
    position:relative!important;
  }

  body:not(.admin-layout) .v212-nav-root>.v117-nav-link .v212-caret{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin-left:4px!important;
    font-style:normal!important;
    font-size:11px!important;
    transition:transform .18s ease!important;
  }

  body:not(.admin-layout) .v212-nav-root:hover>.v117-nav-link,
  body:not(.admin-layout) .v212-nav-root:focus-within>.v117-nav-link,
  body:not(.admin-layout) .v212-nav-root.is-open>.v117-nav-link{
    background:#fff!important;
    color:#08783e!important;
  }

  body:not(.admin-layout) .v212-nav-root:hover>.v117-nav-link .v212-caret,
  body:not(.admin-layout) .v212-nav-root:focus-within>.v117-nav-link .v212-caret,
  body:not(.admin-layout) .v212-nav-root.is-open>.v117-nav-link .v212-caret{
    transform:rotate(180deg)!important;
  }

  body:not(.admin-layout) .v212-nav-root>.v212-submenu{
    display:none!important;
    position:absolute!important;
    left:0!important;
    top:48px!important;
    width:270px!important;
    min-width:270px!important;
    max-height:68vh!important;
    overflow-y:auto!important;
    padding:8px!important;
    background:#fff!important;
    border:1px solid #e4eae6!important;
    border-radius:0 0 10px 10px!important;
    box-shadow:0 14px 35px rgba(10,54,35,.15)!important;
    z-index:1000!important;
  }

  body:not(.admin-layout) .v212-nav-root:hover>.v212-submenu,
  body:not(.admin-layout) .v212-nav-root:focus-within>.v212-submenu,
  body:not(.admin-layout) .v212-nav-root.is-open>.v212-submenu{
    display:block!important;
  }

  body:not(.admin-layout) .v212-submenu>a{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    width:100%!important;
    min-height:38px!important;
    padding:9px 11px!important;
    border-radius:7px!important;
    color:#263a3f!important;
    text-decoration:none!important;
    font-size:11.5px!important;
    font-weight:600!important;
    line-height:1.35!important;
    box-sizing:border-box!important;
  }

  body:not(.admin-layout) .v212-submenu>a:hover,
  body:not(.admin-layout) .v212-submenu>a:focus{
    background:#eef8f2!important;
    color:#08783e!important;
    outline:none!important;
  }

  body:not(.admin-layout) .v212-submenu>a i{
    flex:0 0 auto!important;
    font-style:normal!important;
    color:#7b9187!important;
  }

  /* The dedicated mobile toggle must never occupy desktop nav space. */
  body:not(.admin-layout) .v212-nav-root>.v26-mobile-toggle{
    display:none!important;
  }
}

/* Mobile: retain existing v26 click-to-expand behavior */
@media(max-width:980px){
  body:not(.admin-layout) .v212-nav-root{
    width:100%!important;
    position:relative!important;
  }

  body:not(.admin-layout) .v212-nav-root>.v117-nav-link{
    padding-right:48px!important;
  }

  body:not(.admin-layout) .v212-nav-root>.v117-nav-link .v212-caret{
    display:none!important;
  }

  body:not(.admin-layout) .v212-nav-root>.v212-submenu{
    position:static!important;
    width:100%!important;
    min-width:0!important;
    box-shadow:none!important;
    border:0!important;
    border-radius:0!important;
  }
}
