
/* ============================================================
   KCThanhHoa V14 - Menu PC dot fix + Mobile "Xem tất cả" fix
   20/08/2026
   ============================================================ */

/* PC: nút toggle submenu chỉ dành cho mobile (desktop bắt đầu từ 861px).
   Ở desktop nếu không ẩn tuyệt đối, button rỗng + chevron có thể hiện thành
   một chấm/đốm mờ ngay dưới item có submenu. */
@media (min-width: 861px){
  #mainNavigation #primaryMenu .menu-submenu-toggle{
    display:none !important;
    width:0 !important;
    height:0 !important;
    min-width:0 !important;
    min-height:0 !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:hidden !important;
    appearance:none !important;
  }
  #mainNavigation #primaryMenu .menu-submenu-toggle::before,
  #mainNavigation #primaryMenu .menu-submenu-toggle::after,
  #mainNavigation #primaryMenu .menu-chevron,
  #mainNavigation #primaryMenu .menu-chevron::before,
  #mainNavigation #primaryMenu .menu-chevron::after{
    display:none !important;
    content:none !important;
    width:0 !important;
    height:0 !important;
    border:0 !important;
    background:transparent !important;
  }

  /* Khóa luôn bullet/list marker cho menu ngang PC. */
  #mainNavigation #primaryMenu ul,
  #mainNavigation #primaryMenu li{
    list-style:none !important;
  }
  #mainNavigation #primaryMenu li::marker{
    content:"" !important;
    font-size:0 !important;
  }
}

/* Mobile: header chuyên mục phải nằm trọn phía trên ảnh.
   Không dùng position tuyệt đối, không để link tụt xuống featured image. */
@media (max-width: 768px){
  .home-zone-rich{
    overflow:visible !important;
  }

  .home-zone-rich-head{
    position:relative !important;
    z-index:3 !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:8px !important;
    min-height:0 !important;
    height:auto !important;
    margin:0 0 10px !important;
    padding:0 0 7px !important;
    overflow:visible !important;
  }

  .home-zone-rich-title-wrap,
  .home-zone-rich-copy{
    min-width:0 !important;
    width:auto !important;
    max-width:100% !important;
  }

  .home-zone-rich-copy h2{
    display:block !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    white-space:normal !important;
    overflow:hidden !important;
    text-overflow:clip !important;
    line-height:1.28 !important;
    max-height:none !important;
    -webkit-line-clamp:2 !important;
    -webkit-box-orient:vertical !important;
  }

  .home-zone-rich-link{
    position:relative !important;
    inset:auto !important;
    z-index:5 !important;
    align-self:center !important;
    justify-self:end !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:auto !important;
    min-width:max-content !important;
    height:auto !important;
    min-height:28px !important;
    margin:0 !important;
    padding:5px 8px !important;
    line-height:1.15 !important;
    white-space:nowrap !important;
    overflow:visible !important;
    transform:none !important;
  }

  /* Featured content luôn bắt đầu sau header. */
  .home-zone-rich-body,
  .home-zone-rich-featured{
    position:relative !important;
    z-index:1 !important;
    clear:both !important;
    margin-top:0 !important;
  }

  .home-zone-rich-featured-thumb{
    position:relative !important;
    z-index:1 !important;
  }
}

/* Điện thoại hẹp: nếu tiêu đề dài, nút vẫn ở hàng riêng phía dưới
   nhưng nằm trong header, tuyệt đối không chồng lên ảnh. */
@media (max-width: 480px){
  .home-zone-rich-head{
    grid-template-columns:minmax(0,1fr) !important;
    align-items:start !important;
  }
  .home-zone-rich-link{
    justify-self:start !important;
    margin-top:2px !important;
  }
}
